/* BoA Crew radar mobile layout. Loaded after aviation.css on purpose. */
/* Map libraries use high layer indices. Keep them inside the page, below
   the application navigation, without reducing the available map area. */
.aviation-page,
.windy-page {
  position: relative;
  isolation: isolate;
  z-index: 0;
  min-width: 0;
}
.aviation-page:fullscreen,
.windy-page:fullscreen { z-index: auto; }
.fr24-drawer-actions-bar { display: none !important; }
.fr24-flight-drawer { overflow: hidden !important; }
.fr24-drawer-container { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; }
.fr24-aircraft-silhouette { display: block; fill: currentColor; transform: rotate(90deg); transform-origin: center; }
.fr24-plane-circle-gold { color: #9a6700 !important; }
.fr24-route-plane-marker { color: #52575e !important; }
.fr24-brand-submark { min-width: 0 !important; max-width: 52% !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.fr24-pill-model-code { white-space: nowrap !important; }
.fr24-route-progress-sub {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 1px !important;
  margin-top: 8px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background: #e5e7eb !important;
}
.fr24-route-progress-sub > span {
  min-width: 0 !important;
  padding: 6px 5px !important;
  display: grid !important;
  gap: 1px !important;
  background: #f8fafc !important;
  text-align: left !important;
}
.fr24-route-progress-sub small { color: #64748b; font-size: 8px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.fr24-route-progress-sub strong { color: #172033; font-size: 10px; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fr24-route-progress-sub em { color: #64748b; font-size: 8px; font-style: normal; white-space: nowrap; }

/* Keep the map as the primary surface: controls float over it instead of consuming height. */
.fr24-single-screen-radar > .fr24-top-control-bar {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  z-index: 1100 !important;
  background: color-mix(in srgb, #0a142a 86%, transparent) !important;
  backdrop-filter: blur(16px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.2) !important;
}
.fr24-map-canvas-container { flex: 1 1 0 !important; height: auto !important; min-height: 0 !important; }
.aviation-radar-active .tool-usage-guide { display: none !important; }
.aviation-tab-content-radar { flex: 1 1 auto !important; }

.aviation-fleet-admin-panel { margin-top: 16px; }
.aviation-fleet-admin-list { display: grid; gap: 8px; margin-top: 16px; }
.aviation-fleet-admin-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px; border: 1px solid var(--border, rgba(148,163,184,.24)); border-radius: 12px;
  background: var(--surface-2, rgba(15,23,42,.35));
}
.aviation-fleet-admin-row > div { display: grid; gap: 3px; min-width: 0; }
.aviation-fleet-admin-row small { color: var(--muted, #94a3b8); overflow-wrap: anywhere; }
.aviation-fleet-admin-row.is-disabled { opacity: .62; }
.aviation-fleet-admin-row .danger { color: var(--danger, #ef4444); }
.field-help { color: var(--muted, #94a3b8); font-size: 12px; line-height: 1.5; margin-top: 12px; }

@media (min-width: 901px) {
  .fr24-top-control-bar {
    display: grid !important;
    grid-template-columns: auto minmax(220px, 340px) minmax(260px, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 58px !important;
    padding: 8px 12px !important;
    overflow: visible !important;
  }
  .fr24-top-brand { display: none !important; }
  .fr24-lang-selector,
  .fr24-search-box,
  .fr24-quick-chips,
  .fr24-dock-actions { margin: 0 !important; min-width: 0 !important; }
  .fr24-quick-chips {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }
  .fr24-quick-chips::-webkit-scrollbar { display: none !important; }
  .fr24-chip,
  .fr24-dock-btn,
  .fr24-live-pill-btn { min-height: 38px !important; white-space: nowrap !important; }
  .fr24-flight-drawer {
    top: 0 !important;
    bottom: 0 !important;
    height: auto !important;
    max-height: none !important;
    width: min(390px, 34vw) !important;
    background: #181b1e !important;
  }
  .fr24-drawer-container,
  .fr24-drawer-route-card,
  .fr24-route-section,
  .fr24-drawer-more-details { background: #181b1e !important; color: #f8fafc !important; }
  .fr24-drawer-container { height: 100% !important; overflow-y: auto !important; }
  .fr24-drawer-bottom-bar { position: sticky !important; bottom: 0 !important; z-index: 20 !important; }
}

@media (max-width: 900px) {
  .app-shell.sidebar-collapsed #page-container:has(.aviation-radar-active),
  .app-shell.sidebar-collapsed .page-container:has(.aviation-radar-active),
  #page-container:has(.aviation-radar-active),
  .page-container:has(.aviation-radar-active) {
    width: 100% !important;
    max-width: none !important;
    padding: var(--topbar, 56px) 0 0 !important;
  }
  .aviation-page.aviation-radar-active {
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    height: calc(100dvh - var(--topbar, 56px) - 82px - env(safe-area-inset-bottom)) !important;
  }
  .aviation-tabs-radar-bar {
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    min-height: 42px !important;
    overflow-x: auto !important;
    scrollbar-width: none;
  }
  .aviation-tabs-radar-bar::-webkit-scrollbar,
  .fr24-quick-chips::-webkit-scrollbar,
  .fr24-dock-actions::-webkit-scrollbar,
  .fr24-bottom-dock::-webkit-scrollbar { display: none; }
  .fr24-top-control-bar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 7px !important;
    margin: 0 !important;
    padding: 8px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: rgba(10, 20, 42, .78) !important;
    overflow: hidden !important;
    top: auto !important;
  }
  .fr24-top-brand { display: none !important; }
  .fr24-lang-selector {
    display: flex !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
  }
  .fr24-search-box {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 40px !important;
  }
  .fr24-search-input { min-width: 0 !important; font-size: 14px !important; }
  .fr24-quick-chips {
    grid-column: 1 / -1 !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    padding: 0 0 2px !important;
    scrollbar-width: none;
  }
  .fr24-chip { min-height: 32px !important; padding: 5px 10px !important; }
  .fr24-dock-actions {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin: 0 !important;
    overflow-x: auto !important;
    scrollbar-width: none;
  }
  .fr24-dock-btn, .fr24-live-pill-btn { min-height: 34px !important; flex: 0 0 auto !important; }
  .fr24-map-canvas-container { min-height: 0 !important; }
  #aviation-radar-map.fr24-fullscreen-map { min-height: 0 !important; height: 100% !important; }
  .fr24-bottom-dock {
    left: 8px !important;
    right: 8px !important;
    bottom: calc(8px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    overflow-x: auto !important;
    justify-content: space-around !important;
    scrollbar-width: none;
  }
  .fr24-dock-pill-btn { min-width: 58px !important; padding: 5px 7px !important; }
  .fr24-dock-pill-btn span:last-child { font-size: 11px !important; }
  .fr24-dock-pill-btn { min-height: 44px !important; }
}

@media (max-width: 768px) {
  .fr24-airline-row { gap: 8px !important; }
  .fr24-airline-name { min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
  .fr24-flight-drawer {
    height: min(54dvh, 540px) !important;
    max-height: calc(100dvh - var(--topbar, 56px) - 42px) !important;
  }
  .fr24-drawer-container {
    min-height: 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    padding-bottom: env(safe-area-inset-bottom) !important;
  }
  .fr24-drawer-header { padding: 10px 14px !important; }
  .fr24-callsign-title { font-size: 22px !important; }
  .fr24-drawer-photo-wrap { height: 96px !important; min-height: 96px !important; max-height: 96px !important; }
  .fr24-photo-dots, .fr24-photo-nav { display: none !important; }
  .fr24-route-section { padding: 10px 14px !important; }
  .fr24-route-iata { font-size: 25px !important; }
  .fr24-route-city { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .fr24-drawer-actions-bar { display: none !important; }
  .fr24-drawer-bottom-bar { position: sticky !important; bottom: 0 !important; z-index: 15 !important; }
  .fr24-drawer-action-btn { min-width: 0 !important; padding: 8px 2px !important; font-size: 9px !important; }
  .fr24-flight-drawer.drawer-collapsed { transform: translateY(calc(100% - 58px)) !important; opacity: 1 !important; }
  .fr24-route-progress-sub { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .aviation-fleet-admin-row { align-items: stretch; flex-direction: column; }
}