/* dashboard_bis.css — Dashboard Bis (temporaire) : mise en page une colonne,
   pensée d'abord pour un usage tactile une main sur smartphone/tablette.
   Contrairement à /dashboard (grille 2 colonnes, cf. style.css .main-grid),
   tout est empilé verticalement ici : stats -> carte -> onglets. */

.dbis-root {
  display: flex;
  flex-direction: column;
  padding-bottom: 24px;
}

.dbis-header {
  background-color: #161b22;
  border-bottom: 1px solid #30363d;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  position: sticky;
  top: 0;
  z-index: 20;
}

.dbis-session-info {
  padding: 4px 14px 0;
  font-size: 11px;
  color: #8b949e;
}

.dbis-track-feedback {
  padding: 2px 14px;
  font-size: 11px;
  min-height: 14px;
}

.dbis-cursor-badge {
  padding: 2px 14px 6px;
  font-size: 12px;
  color: #e6edf3;
  min-height: 16px;
}

/* ── Stats clés (au-dessus de la carte) ────────────────────────────────── */
.dbis-stats-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 10px 14px 4px;
}

/* ── Carte ──────────────────────────────────────────────────────────────── */
/* Fixe (sticky) sous le header : en scrollant dans un onglet (ex: Tours,
   liste des tours + graphe), la carte reste visible pour suivre le curseur
   au lieu de disparaître en haut de l'écran (cf. demande du 2026-07-07). */
.dbis-map-section {
  width: 100%;
  height: 45vh;
  max-height: 420px;
  min-height: 220px;
  flex-shrink: 0;
  border-top: 1px solid #30363d;
  border-bottom: 1px solid #30363d;
  position: sticky;
  top: 52px; /* hauteur approximative de .dbis-header */
  z-index: 15;
  background-color: #0d1117;
}

.dbis-map-iframe {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
}

/* ── Onglets (liste déroulante) ─────────────────────────────────────────── */
.dbis-tabs-dropdown {
  margin: 0 14px 4px;
  font-size: 15px;
}

.dbis-tabs-dropdown .Select-control,
.dbis-tabs-dropdown .Select-value,
.dbis-tabs-dropdown .Select-placeholder {
  min-height: 44px; /* cible tactile */
  height: 44px;
  background-color: #161b22;
  border: 1px solid #30363d;
  border-radius: 8px;
  display: flex;
  align-items: center;
}

.dbis-tabs-dropdown .Select-value-label,
.dbis-tabs-dropdown .Select-placeholder,
.dbis-tabs-dropdown .Select-input {
  color: #e6edf3;
  font-size: 15px;
  font-weight: 600;
  padding-left: 4px;
}

.dbis-tabs-dropdown .Select-menu-outer {
  background-color: #161b22;
  border: 1px solid #30363d;
  font-size: 15px;
}

.dbis-tabs-dropdown .VirtualizedSelectOption {
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  color: #e6edf3;
}

.dbis-tabs-dropdown .VirtualizedSelectFocusedOption {
  background-color: #21262d;
}

.dbis-panel {
  padding: 10px 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.dbis-curve-select label {
  display: inline-flex;
  align-items: center;
  font-size: 13px;
  padding: 6px 8px;
  min-height: 32px;
}

/* ── Tableaux (Tours / Temps) ───────────────────────────────────────────── */
.dbis-panel table,
.dbis-times-table {
  width: 100%;
  border-collapse: collapse;
  background-color: #161b22;
  border: 1px solid #30363d;
  border-radius: 6px;
  overflow: hidden;
  font-size: 12px;
}

.dbis-times-table th {
  border-bottom: 1px solid #30363d;
}

.dbis-times-table td {
  border-bottom: 1px solid #1c2128;
}

.dbis-time-row-btn {
  background: none;
  border: none;
  color: #58a6ff;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  padding: 6px 4px;
  min-height: 32px;
}

/* Cibles tactiles généreuses pour tous les boutons de ligne (tours/temps) */
.dbis-panel button {
  min-height: 32px;
}

/* Tableaux larges (ex: comparaison) : scroll horizontal plutôt que débordement */
.dbis-panel > div {
  max-width: 100%;
  overflow-x: auto;
}

/* Encart de sélection des tours (onglet Tours) : hauteur plafonnée + scroll
   interne plutôt qu'une liste qui pousse le graphe (et donc la carte, cf.
   .dbis-map-section sticky ci-dessus) loin en dessous - moins de distance à
   parcourir avant d'atteindre le graphe, et la carte reste de toute façon
   visible grâce au sticky. */
#dbis-lap-summary-table {
  max-height: 168px;
  overflow-y: auto;
}

@media (max-width: 480px) {
  .dbis-map-section {
    height: 38vh;
  }
  .dbis-stats-row > div {
    flex: 1 1 45%;
  }
}