/* Mevolution v0.5.176 — Global Dropdown Theme v1
   Consistent native select styling for storefront + backend.
   No form values, validation or behaviour are changed by this layer. */

:root {
  --mv-dropdown-bg: #071126;
  --mv-dropdown-bg-hover: #0a1732;
  --mv-dropdown-bg-open: #0b1a3a;
  --mv-dropdown-text: #f7f9ff;
  --mv-dropdown-muted: #aeb9d8;
  --mv-dropdown-gold: #f6c945;
  --mv-dropdown-gold-soft: rgba(246, 201, 69, .58);
  --mv-dropdown-blue: #4ca7ff;
}

/* All native selects, public and backend. Keep existing layout widths intact. */
body select {
  max-width: 100%;
  min-height: 46px;
  box-sizing: border-box;
  border: 1px solid var(--mv-dropdown-gold-soft) !important;
  border-radius: 12px !important;
  color: var(--mv-dropdown-text) !important;
  background-color: var(--mv-dropdown-bg) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .035),
    inset 0 0 0 1px rgba(76, 167, 255, .035),
    0 7px 18px rgba(0, 5, 24, .18) !important;
  font: inherit;
  font-weight: 650;
  line-height: 1.25;
  color-scheme: dark;
  -webkit-tap-highlight-color: transparent;
  transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}

/* Single-choice selects receive a gold chevron while remaining native controls. */
body select:not([multiple]):not([size]) {
  padding-right: 44px !important;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--mv-dropdown-gold) 50%),
    linear-gradient(135deg, var(--mv-dropdown-gold) 50%, transparent 50%),
    linear-gradient(90deg, rgba(76, 167, 255, .10), rgba(246, 201, 69, .065)) !important;
  background-position:
    calc(100% - 19px) 50%,
    calc(100% - 13px) 50%,
    0 0 !important;
  background-size: 6px 6px, 6px 6px, 100% 100% !important;
  background-repeat: no-repeat !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

body select:hover:not(:disabled) {
  border-color: rgba(246, 201, 69, .84) !important;
  background-color: var(--mv-dropdown-bg-hover) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .045),
    0 0 0 1px rgba(246, 201, 69, .06),
    0 8px 20px rgba(0, 5, 24, .24) !important;
}

body select:focus,
body select:focus-visible {
  border-color: var(--mv-dropdown-gold) !important;
  outline: none !important;
  background-color: var(--mv-dropdown-bg-open) !important;
  box-shadow:
    0 0 0 3px rgba(246, 201, 69, .16),
    0 0 24px rgba(76, 167, 255, .12),
    inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

body select:disabled {
  cursor: not-allowed;
  opacity: .62;
  color: var(--mv-dropdown-muted) !important;
  border-color: rgba(174, 185, 216, .25) !important;
  background-color: #081020 !important;
}

/* Chromium/Firefox/Windows honour these colours for the opened native list.
   On platforms that keep the OS-native popup, color-scheme: dark provides the
   readable fallback while the closed control still keeps the Mevolution look. */
body select option,
body select optgroup {
  background: var(--mv-dropdown-bg) !important;
  background-color: var(--mv-dropdown-bg) !important;
  color: var(--mv-dropdown-text) !important;
  font-weight: 600;
}

body select option:checked {
  background: #172957 !important;
  background-color: #172957 !important;
  color: #ffe17b !important;
}

body select optgroup {
  color: #ffe17b !important;
  font-weight: 800;
}

/* Landing + builder relocate the shared language selector into their header.
   Keep it invisible only during that short server-marked relocation window so
   a refresh can never show the old fixed position for a frame. */
.site-language-switcher.mv-language-relocating {
  visibility: hidden !important;
  pointer-events: none !important;
}

/* The site-language selector is a custom dropdown rather than a <select>.
   Bring its closed trigger + opened menu into the same gold/navy system. */
.site-language-trigger {
  border-color: var(--mv-dropdown-gold-soft) !important;
  background: linear-gradient(145deg, rgba(7, 32, 82, .98), rgba(18, 20, 68, .99)) !important;
}
.site-language-trigger:hover,
.site-language-trigger:focus-visible,
.site-language-switcher.open .site-language-trigger {
  border-color: var(--mv-dropdown-gold) !important;
  box-shadow: 0 0 0 3px rgba(246, 201, 69, .12), 0 9px 30px rgba(0, 0, 0, .38) !important;
}
.site-language-menu {
  border-color: rgba(246, 201, 69, .66) !important;
  background: linear-gradient(180deg, rgba(7, 31, 84, .995), rgba(5, 19, 57, .998)) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .48), 0 0 0 1px rgba(76, 167, 255, .05) !important;
}
.site-language-menu button:hover {
  background: #0e337d !important;
}
.site-language-menu button.active {
  box-shadow: inset 0 0 0 1px rgba(246, 201, 69, .42) !important;
}

/* Mobile: readable 16px text prevents iOS zoom and keeps touch targets roomy. */
@media (max-width: 640px) {
  body select {
    min-height: 50px;
    font-size: 16px !important;
    border-radius: 12px !important;
  }
  body select:not([multiple]):not([size]) {
    padding-right: 42px !important;
  }
}

@media (prefers-contrast: more) {
  body select,
  .site-language-trigger,
  .site-language-menu {
    border-color: #ffd85b !important;
  }
  body select {
    background-color: #040b1d !important;
  }
}