/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

 @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;700&family=Inter:wght@300;400&family=Kodchasan:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');

  h1, h2 { font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: 0.1em; }

/* EQ Slider Styles */
.eq-slider {
  -webkit-appearance: slider-vertical;
  appearance: slider-vertical;
  writing-mode: bt-lr; /* Old IE / Firefox */
  writing-mode: vertical-lr; /* Modern browsers */
  height: 120px;
  width: 8px;
  background: linear-gradient(to top, #14b8a6 0%, #14b8a6 50%, #4b5563 50%, #4b5563 100%);
  outline: none;
  border-radius: 4px;
  cursor: pointer;
}

.eq-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 12px;
  background: #14b8a6;
  cursor: pointer;
  border-radius: 3px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.eq-slider::-moz-range-thumb {
  width: 20px;
  height: 12px;
  background: #14b8a6;
  cursor: pointer;
  border-radius: 3px;
  border: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

body {
  -webkit-tap-highlight-color: transparent;
  scrollbar-width: none;
  min-height: max(884px, 100dvh);
}

body::-webkit-scrollbar {
  display: none;
}