/* ev.mobile.css v10 — responsive + analytics bottom-sheet + filter wrapping */
:root { --status-handle-height: 16px; }

/* Sticky top nav tabs */
@media (max-width: 768px) {
  .tabs, nav.tabs, .app-tabs, .top-tabs {
    position: sticky;
    top: 0; z-index: 50;
    overflow-x: auto; white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    background: var(--bg, #0a0f1a);
    box-shadow: 0 2px 6px rgba(0,0,0,.15);
  }
  .tabs::-webkit-scrollbar { display: none; }
}

/* Analytics: filter bar must wrap on phones */
@media (max-width: 768px) {
  .date-filter-form,
  .analytics-filters,
  .analytics .filters,
  .tab-analytics .filters {
    display: flex; flex-wrap: wrap; gap: .5rem;
    align-items: stretch; width: 100%;
  }
  .date-filter-form input[type="date"],
  .date-filter-form input[type="text"],
  .date-filter-form select { flex: 1 1 160px; min-width: 0; }
  .date-filter-form .actions,
  .analytics-filters .actions { display: flex; flex-wrap: wrap; gap: .5rem; width: 100%; }
  .date-filter-form .actions .button,
  .date-filter-form .actions button,
  .date-filter-form .actions a { flex: 1 1 140px; min-width: 0; white-space: normal; }
  .date-filter-form { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* Responsive charts/tables */
.chart-card canvas, .chart-container canvas { max-width: 100% !important; height: auto !important; }
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Bottom sheet behavior (Analytics only) */
.analytics-bottom-enabled .app-status-bar,
.analytics-bottom-enabled [data-role="status-bar"],
.analytics-bottom-enabled .footer-status,
.analytics-bottom-enabled .bottom-status{
  position: fixed; left: 0; right: 0; bottom: 0;
  z-index: 60;
  transform: translateY(35%);
  opacity: .9;
  transition: transform .18s ease, opacity .18s ease;
  touch-action: none; will-change: transform;
}
.analytics-bottom-enabled .app-status-bar.is-open,
.analytics-bottom-enabled [data-role="status-bar"].is-open,
.analytics-bottom-enabled .footer-status.is-open,
.analytics-bottom-enabled .bottom-status.is-open { transform: translateY(0); opacity: 1; }
.analytics-bottom-enabled .app-status-bar.is-hidden,
.analytics-bottom-enabled [data-role="status-bar"].is-hidden,
.analytics-bottom-enabled .footer-status.is-hidden,
.analytics-bottom-enabled .bottom-status.is-hidden {
  transform: translateY(calc(100% - var(--status-handle-height)));
  opacity: .75;
}
.analytics-bottom-enabled .status-handle {
  position: absolute; top: -8px; left: 50%; transform: translateX(-50%);
  width: 42px; height: 6px; border-radius: 999px;
  background: rgba(255,255,255,.38); pointer-events: none;
}
@media (max-width: 768px) {
  .analytics-bottom-enabled .app-status-bar .drag-hit,
  .analytics-bottom-enabled [data-role="status-bar"] .drag-hit,
  .analytics-bottom-enabled .footer-status .drag-hit,
  .analytics-bottom-enabled .bottom-status .drag-hit {
    position: absolute; top: -32px; left: 0; right: 0; height: 40px; content: "";
  }
}