/*
 * Backseat — télécommande : jetons de design.
 *
 * Ce fichier est servi tel quel (dist/theme.css) : modifiez-le sans reconstruire l'app.
 * Toutes les couleurs, rayons, espacements, tailles de texte et la taille minimale des zones
 * tactiles de l'interface viennent d'ici. Voir docs/CUSTOMIZING-UI.md.
 *
 * Thème sombre par défaut (conduite de nuit) ; thème clair avec "theme": "light" (ou "auto")
 * dans config.json.
 */

:root,
[data-theme='dark'] {
  /* Couleurs — fond « habitacle de nuit », accent ambre « voyant de tableau de bord ». */
  --bs-color-bg: #0e141b;
  --bs-color-surface: #16202b;
  --bs-color-surface-raised: #1f2b38;
  --bs-color-surface-pressed: #283746;
  --bs-color-border: #2e3d4d;
  --bs-color-border-strong: #4a5d71;
  --bs-color-text: #eef3f8;
  --bs-color-text-muted: #a9b6c4;
  --bs-color-text-faint: #7d8c9c;
  --bs-color-accent: #f5b53d;
  --bs-color-accent-pressed: #d99a22;
  --bs-color-on-accent: #1b1300;
  --bs-color-accent-soft: rgba(245, 181, 61, 0.14);
  --bs-color-online: #3ed6a6;
  --bs-color-offline: #7d8c9c;
  --bs-color-warning: #ff9f43;
  --bs-color-warning-soft: rgba(255, 159, 67, 0.12);
  --bs-color-danger: #ff7a70;
  --bs-color-danger-soft: rgba(255, 122, 112, 0.12);
  --bs-color-on-danger: #2a0603;
  --bs-color-focus: #7cc4ff;
  --bs-color-track: #2e3d4d;
  --bs-color-scrim: rgba(5, 9, 13, 0.72);
  --bs-shadow-raised: 0 10px 30px rgba(0, 0, 0, 0.35);
}

[data-theme='light'] {
  --bs-color-bg: #e9eef3;
  --bs-color-surface: #ffffff;
  --bs-color-surface-raised: #f3f6f9;
  --bs-color-surface-pressed: #dde5ec;
  --bs-color-border: #cbd5df;
  --bs-color-border-strong: #8a9aab;
  --bs-color-text: #0f1923;
  --bs-color-text-muted: #45556a;
  --bs-color-text-faint: #5d6c7e;
  --bs-color-accent: #b36b00;
  --bs-color-accent-pressed: #8f5500;
  --bs-color-on-accent: #ffffff;
  --bs-color-accent-soft: rgba(179, 107, 0, 0.12);
  --bs-color-online: #0b8a63;
  --bs-color-offline: #6b7a8a;
  --bs-color-warning: #a84f00;
  --bs-color-warning-soft: rgba(168, 79, 0, 0.1);
  --bs-color-danger: #c0302a;
  --bs-color-danger-soft: rgba(192, 48, 42, 0.1);
  --bs-color-on-danger: #ffffff;
  --bs-color-focus: #0b62c4;
  --bs-color-track: #cbd5df;
  --bs-color-scrim: rgba(15, 25, 35, 0.5);
  --bs-shadow-raised: 0 10px 30px rgba(15, 25, 35, 0.15);
}

:root {
  /* Typographie : police système uniquement (aucune police web, CSP stricte). */
  --bs-font-family:
    system-ui, -apple-system, 'Segoe UI', Roboto, 'Noto Sans', Ubuntu, Cantarell, 'Helvetica Neue',
    Arial, sans-serif;
  --bs-font-size-xs: 15px;
  --bs-font-size-sm: 17px;
  --bs-font-size-md: 20px;
  --bs-font-size-lg: 24px;
  --bs-font-size-xl: 30px;
  --bs-font-size-title: 40px;
  --bs-font-size-display: 96px;
  --bs-font-weight-regular: 450;
  --bs-font-weight-medium: 600;
  --bs-font-weight-bold: 750;
  --bs-line-height: 1.4;

  /* Espacements (échelle de 4 px). */
  --bs-space-1: 4px;
  --bs-space-2: 8px;
  --bs-space-3: 12px;
  --bs-space-4: 16px;
  --bs-space-5: 24px;
  --bs-space-6: 32px;
  --bs-space-7: 48px;

  /* Rayons : petits pour les contrôles, grands pour les panneaux. */
  --bs-radius-sm: 10px;
  --bs-radius-md: 16px;
  --bs-radius-lg: 24px;
  --bs-radius-pill: 999px;

  /* Zones tactiles : utilisées à bout de bras, en voiture. Minimum 64 px. */
  --bs-touch-target: 72px;
  --bs-touch-target-sm: 64px;
  --bs-touch-target-lg: 104px;

  /* Barre de progression de lecture. */
  --bs-progress-height: 14px;
  --bs-progress-thumb: 44px;

  /* Largeur de la colonne des tablettes (écrans larges). */
  --bs-rail-width: 300px;
}