:root {
  --sf-dropdown-surface: linear-gradient(
    180deg,
    color-mix(in srgb, var(--surface-card, var(--bg-primary, #ffffff)) 97%, transparent),
    color-mix(in srgb, var(--surface-overlay, var(--bg-elevated, #f4f7fb)) 94%, transparent)
  );
  --sf-dropdown-surface-soft: color-mix(in srgb, var(--surface-card, var(--bg-primary, #ffffff)) 94%, transparent);
  --sf-dropdown-border: color-mix(in srgb, var(--border-soft, var(--border-light, rgba(15, 23, 42, 0.12))) 74%, transparent);
  --sf-dropdown-border-strong: color-mix(in srgb, var(--accent-primary, #3fb7b4) 32%, var(--sf-dropdown-border) 68%);
  --sf-dropdown-text: var(--text-primary, #0f172a);
  --sf-dropdown-muted: color-mix(in srgb, var(--text-secondary, var(--text-primary, #475569)) 82%, transparent);
  --sf-dropdown-shadow: 0 26px 56px color-mix(in srgb, var(--shadow-primary, rgba(15, 23, 42, 0.28)) 34%, transparent);
  --sf-dropdown-shadow-soft: 0 14px 30px color-mix(in srgb, var(--shadow-primary, rgba(15, 23, 42, 0.18)) 18%, transparent);
  --sf-dropdown-focus: 0 0 0 3px color-mix(in srgb, var(--accent-primary, #3fb7b4) 18%, transparent);
  --sf-dropdown-radius: 20px;
  --sf-dropdown-item-radius: 15px;
  --sf-dropdown-arrow: color-mix(in srgb, var(--text-secondary, #64748b) 70%, var(--accent-primary, #3fb7b4) 30%);
}

.sf-nav__profile,
[data-nav-more] {
  position: relative;
}

.sf-nav__profile-menu,
.sf-nav__more-menu {
  position: fixed;
  top: 0;
  left: 0;
  display: grid;
  gap: 0.3rem;
  width: min(18.5rem, calc(100vw - 1rem));
  min-width: min(15rem, calc(100vw - 1rem));
  max-height: min(72vh, 32rem);
  padding: 0.45rem;
  border-radius: calc(var(--sf-dropdown-radius) + 2px);
  border: 1px solid var(--sf-dropdown-border);
  background: var(--sf-dropdown-surface);
  box-shadow: var(--sf-dropdown-shadow);
  color: var(--sf-dropdown-text);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px) scale(0.985);
  transform-origin: top right;
  pointer-events: none;
  z-index: 1750;
  transition:
    opacity 0.18s ease,
    transform 0.22s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0.18s ease;
}

@supports ((backdrop-filter: blur(18px)) or (-webkit-backdrop-filter: blur(18px))) {
  .sf-nav__profile-menu,
  .sf-nav__more-menu,
  .sf-nav__drawer {
    -webkit-backdrop-filter: blur(18px) saturate(145%);
    backdrop-filter: blur(18px) saturate(145%);
  }
}

.sf-nav__profile-menu[hidden],
.sf-nav__more-menu[hidden] {
  display: none !important;
}

.sf-nav__profile-menu[data-open="true"],
.sf-nav__more-menu[data-open="true"] {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.sf-nav__profile-menu[data-side="top"],
.sf-nav__more-menu[data-side="top"] {
  transform-origin: bottom right;
}

.sf-nav__profile-menu[data-align="start"],
.sf-nav__more-menu[data-align="start"] {
  transform-origin: top left;
}

.sf-nav__profile-menu[data-align="start"][data-side="top"],
.sf-nav__more-menu[data-align="start"][data-side="top"] {
  transform-origin: bottom left;
}

.sf-nav__menu-item,
.sf-nav__more-menu a,
.sf-nav__drawer-action,
.sf-nav__drawer-links a,
.sf-nav__drawer-link {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.8rem;
  min-height: 46px;
  width: 100%;
  padding: 0.85rem 0.95rem;
  border: 1px solid transparent;
  border-radius: var(--sf-dropdown-item-radius);
  background: transparent;
  color: var(--sf-dropdown-text);
  text-decoration: none;
  box-shadow: none;
  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease,
    transform 0.18s ease,
    box-shadow 0.18s ease;
}

.sf-nav__menu-item i,
.sf-nav__more-menu a i,
.sf-nav__drawer-action i,
.sf-nav__drawer-links a i,
.sf-nav__drawer-link i {
  flex: 0 0 auto;
  color: color-mix(in srgb, var(--accent-primary, #3fb7b4) 60%, var(--sf-dropdown-text) 40%);
  opacity: 0.92;
}

.sf-nav__menu-item span,
.sf-nav__more-menu a span,
.sf-nav__drawer-action span,
.sf-nav__drawer-links a span,
.sf-nav__drawer-link span {
  min-width: 0;
}

.sf-nav__menu-item:hover,
.sf-nav__menu-item:focus-visible,
.sf-nav__more-menu a:hover,
.sf-nav__more-menu a:focus-visible,
.sf-nav__drawer-action:hover,
.sf-nav__drawer-action:focus-visible,
.sf-nav__drawer-links a:hover,
.sf-nav__drawer-links a:focus-visible,
.sf-nav__drawer-link:hover,
.sf-nav__drawer-link:focus-visible {
  border-color: color-mix(in srgb, var(--accent-primary, #3fb7b4) 24%, transparent);
  background: color-mix(in srgb, var(--accent-primary, #3fb7b4) 12%, transparent);
  box-shadow: var(--sf-dropdown-shadow-soft);
  color: var(--sf-dropdown-text);
  outline: none;
  transform: translateY(-1px);
}

.sf-nav__menu-item.is-current,
.sf-nav__menu-item[aria-current="page"],
.sf-nav__more-menu a.is-current,
.sf-nav__more-menu a[aria-current="page"],
.sf-nav__drawer-action.is-current,
.sf-nav__drawer-action[aria-current="page"],
.sf-nav__drawer-links a.is-current,
.sf-nav__drawer-links a[aria-current="page"] {
  border-color: var(--sf-dropdown-border-strong);
  background: color-mix(in srgb, var(--accent-primary, #3fb7b4) 16%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text-white, #ffffff) 18%, transparent);
}

.sf-nav__menu-item:focus-visible,
.sf-nav__more-menu a:focus-visible,
.sf-nav__drawer-action:focus-visible,
.sf-nav__drawer-links a:focus-visible,
.sf-nav__drawer-link:focus-visible {
  box-shadow: var(--sf-dropdown-focus);
}

.sf-nav__profile-form {
  margin: 0;
}

.sf-nav__menu-item--danger,
.sf-nav__profile-link--danger,
.sf-nav__drawer-action--danger {
  color: color-mix(in srgb, var(--notify-error, #ef4444) 76%, var(--sf-dropdown-text) 24%);
}

.sf-nav__menu-item--danger i,
.sf-nav__profile-link--danger i,
.sf-nav__drawer-action--danger i {
  color: color-mix(in srgb, var(--notify-error, #ef4444) 72%, var(--sf-dropdown-text) 28%);
}

.sf-nav__drawer {
  border: 1px solid var(--sf-dropdown-border);
  background: var(--sf-dropdown-surface);
  box-shadow: 0 34px 80px color-mix(in srgb, var(--shadow-primary, rgba(15, 23, 42, 0.34)) 44%, transparent);
  z-index: 1700;
}

.sf-nav__drawer::before {
  opacity: 0.66;
}

.sf-nav__drawer-content {
  scrollbar-width: thin;
}

.sf-nav__drawer-section {
  border-color: color-mix(in srgb, var(--border-light, rgba(15, 23, 42, 0.12)) 74%, transparent);
}

.sf-nav__drawer-title {
  color: var(--sf-dropdown-muted);
}

.settings__select {
  position: relative;
}

.admin-error-filters__select,
.settings__select select,
.booking-form__select,
select.flight-input,
.flight-select,
.payments-table__controls select,
.payments-form__field select,
.ap-select,
.sf-field select,
.pilot-quiz__form select,
.documents-upload__controls select,
.manage-form__grid select,
.ct-field select,
.flights-controls__actions select,
.flights-alerts__form select,
.reviews-modal__field select,
body.sf-body--admin select.sf-input,
html[data-sf-admin-page="true"] select.sf-input {
  appearance: none;
  -webkit-appearance: none;
  font: inherit;
  color: var(--sf-dropdown-text);
  border: 1px solid var(--sf-dropdown-border);
  border-radius: 16px;
  background-color: var(--sf-dropdown-surface-soft);
  background-image:
    linear-gradient(45deg, transparent 50%, var(--sf-dropdown-arrow) 50%),
    linear-gradient(135deg, var(--sf-dropdown-arrow) 50%, transparent 50%),
    linear-gradient(180deg, color-mix(in srgb, var(--surface-card, var(--bg-primary, #ffffff)) 98%, transparent), color-mix(in srgb, var(--surface-overlay, var(--bg-elevated, #f4f7fb)) 94%, transparent));
  background-position:
    calc(100% - 1.15rem) calc(50% - 3px),
    calc(100% - 0.82rem) calc(50% - 3px),
    0 0;
  background-size: 10px 10px, 10px 10px, 100% 100%;
  background-repeat: no-repeat;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--text-white, #ffffff) 16%, transparent),
    0 10px 24px color-mix(in srgb, var(--shadow-primary, rgba(15, 23, 42, 0.22)) 10%, transparent);
  transition:
    border-color 0.18s ease,
    background-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.admin-error-filters__select,
.settings__select select,
.booking-form__select,
select.flight-input,
.flight-select,
.payments-table__controls select,
.payments-form__field select,
.ap-select,
.sf-field select,
.pilot-quiz__form select,
.documents-upload__controls select,
.manage-form__grid select,
.ct-field select,
.flights-controls__actions select,
.flights-alerts__form select,
.reviews-modal__field select,
body.sf-body--admin select.sf-input,
html[data-sf-admin-page="true"] select.sf-input {
  min-height: 46px;
  padding: 0.78rem 2.9rem 0.78rem 1rem;
}

.admin-error-filters__select:hover,
.settings__select select:hover,
.booking-form__select:hover,
select.flight-input:hover,
.flight-select:hover,
.payments-table__controls select:hover,
.payments-form__field select:hover,
.ap-select:hover,
.sf-field select:hover,
.pilot-quiz__form select:hover,
.documents-upload__controls select:hover,
.manage-form__grid select:hover,
.ct-field select:hover,
.flights-controls__actions select:hover,
.flights-alerts__form select:hover,
.reviews-modal__field select:hover,
body.sf-body--admin select.sf-input:hover,
html[data-sf-admin-page="true"] select.sf-input:hover {
  border-color: color-mix(in srgb, var(--accent-primary, #3fb7b4) 28%, var(--sf-dropdown-border) 72%);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--text-white, #ffffff) 18%, transparent),
    0 16px 34px color-mix(in srgb, var(--shadow-primary, rgba(15, 23, 42, 0.24)) 14%, transparent);
}

.admin-error-filters__select:focus,
.settings__select select:focus,
.booking-form__select:focus,
select.flight-input:focus,
.flight-select:focus,
.payments-table__controls select:focus,
.payments-form__field select:focus,
.ap-select:focus,
.sf-field select:focus,
.pilot-quiz__form select:focus,
.documents-upload__controls select:focus,
.manage-form__grid select:focus,
.ct-field select:focus,
.flights-controls__actions select:focus,
.flights-alerts__form select:focus,
.reviews-modal__field select:focus,
body.sf-body--admin select.sf-input:focus,
html[data-sf-admin-page="true"] select.sf-input:focus,
.admin-error-filters__select:focus-visible,
.settings__select select:focus-visible,
.booking-form__select:focus-visible,
select.flight-input:focus-visible,
.flight-select:focus-visible,
.payments-table__controls select:focus-visible,
.payments-form__field select:focus-visible,
.ap-select:focus-visible,
.sf-field select:focus-visible,
.pilot-quiz__form select:focus-visible,
.documents-upload__controls select:focus-visible,
.manage-form__grid select:focus-visible,
.ct-field select:focus-visible,
.flights-controls__actions select:focus-visible,
.flights-alerts__form select:focus-visible,
.reviews-modal__field select:focus-visible,
body.sf-body--admin select.sf-input:focus-visible,
html[data-sf-admin-page="true"] select.sf-input:focus-visible {
  outline: none;
  border-color: var(--sf-dropdown-border-strong);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--text-white, #ffffff) 20%, transparent),
    var(--sf-dropdown-focus);
}

.admin-error-filters__select::-ms-expand,
.settings__select select::-ms-expand,
.booking-form__select::-ms-expand,
select.flight-input::-ms-expand,
.flight-select::-ms-expand,
.payments-table__controls select::-ms-expand,
.payments-form__field select::-ms-expand,
.ap-select::-ms-expand,
.sf-field select::-ms-expand,
.pilot-quiz__form select::-ms-expand,
.documents-upload__controls select::-ms-expand,
.manage-form__grid select::-ms-expand,
.ct-field select::-ms-expand,
.flights-controls__actions select::-ms-expand,
.flights-alerts__form select::-ms-expand,
.reviews-modal__field select::-ms-expand,
body.sf-body--admin select.sf-input::-ms-expand,
html[data-sf-admin-page="true"] select.sf-input::-ms-expand {
  display: none;
}

.admin-error-filters__select option,
.settings__select select option,
.booking-form__select option,
select.flight-input option,
.flight-select option,
.payments-table__controls select option,
.payments-form__field select option,
.ap-select option,
.sf-field select option,
.pilot-quiz__form select option,
.documents-upload__controls select option,
.manage-form__grid select option,
.ct-field select option,
.flights-controls__actions select option,
.flights-alerts__form select option,
.reviews-modal__field select option,
body.sf-body--admin select.sf-input option,
html[data-sf-admin-page="true"] select.sf-input option {
  color: var(--sf-dropdown-text);
  background: color-mix(in srgb, var(--surface-card, var(--bg-primary, #ffffff)) 98%, transparent);
}

.search-select {
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--sf-dropdown-border) 92%, transparent);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface-card, var(--bg-primary, #ffffff)) 97%, transparent), color-mix(in srgb, var(--surface-overlay, var(--bg-elevated, #f4f7fb)) 92%, transparent));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--text-white, #ffffff) 14%, transparent),
    0 12px 28px color-mix(in srgb, var(--shadow-primary, rgba(15, 23, 42, 0.24)) 12%, transparent);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.search-select:hover,
.search-select:focus-within {
  border-color: color-mix(in srgb, var(--accent-primary, #3fb7b4) 28%, var(--sf-dropdown-border) 72%);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--text-white, #ffffff) 18%, transparent),
    0 18px 36px color-mix(in srgb, var(--shadow-primary, rgba(15, 23, 42, 0.24)) 16%, transparent);
  transform: translateY(-1px);
}

.search-select select {
  appearance: none;
  -webkit-appearance: none;
  color: var(--sf-dropdown-text);
  background-image:
    linear-gradient(45deg, transparent 50%, var(--sf-dropdown-arrow) 50%),
    linear-gradient(135deg, var(--sf-dropdown-arrow) 50%, transparent 50%);
  background-position:
    calc(100% - 0.95rem) calc(50% - 3px),
    calc(100% - 0.62rem) calc(50% - 3px);
  background-size: 10px 10px, 10px 10px;
  background-repeat: no-repeat;
  padding-right: 2rem;
}

.search-select select:focus {
  outline: none;
}

.search-select select option {
  color: var(--sf-dropdown-text);
  background: color-mix(in srgb, var(--surface-card, var(--bg-primary, #ffffff)) 98%, transparent);
}

@media (max-width: 900px) {
  .sf-nav__profile-menu,
  .sf-nav__more-menu {
    width: min(20rem, calc(100vw - 0.9rem));
    max-height: min(66vh, 28rem);
  }

  .sf-nav__drawer {
    width: min(92vw, 360px);
    max-width: 360px;
  }

  .sf-nav__backdrop {
    z-index: 510;
  }
}

@media (max-width: 768px) {
  .sf-nav__menu-item,
  .sf-nav__more-menu a,
  .sf-nav__drawer-action,
  .sf-nav__drawer-links a,
  .sf-nav__drawer-link {
    min-height: 48px;
    padding-block: 0.9rem;
  }

  .admin-error-filters__select,
  .settings__select select,
  .booking-form__select,
  select.flight-input,
  .flight-select,
  .payments-table__controls select,
  .payments-form__field select,
  .ap-select,
  .sf-field select,
  .pilot-quiz__form select,
  .documents-upload__controls select,
  .manage-form__grid select,
  .ct-field select,
  .flights-controls__actions select,
  .flights-alerts__form select,
  .reviews-modal__field select,
  body.sf-body--admin select.sf-input,
  html[data-sf-admin-page="true"] select.sf-input {
    min-height: 48px;
    padding: 0.9rem 2.95rem 0.9rem 1rem !important;
    font-size: 16px !important;
  }

  .search-select {
    padding: 0.9rem 1rem;
  }

  .search-select select {
    padding-right: 2rem !important;
    font-size: 16px !important;
  }
}