:root {
  /* Palette du fichier : couleurs écrites en dur remplacées par ces variables (mêmes valeurs). */
  --c-amber-10: #251c0c;
  --c-amber-52: #d7a334;
  --c-amber-7: #18130a;
  --c-amber-78: #ead4a5;
  --c-amber-97: #fffaf0;
  --c-blue-47: #687686;
  --c-blue-87: #d5dde7;
  --c-gray-96: #f4f5f7;
  --c-gray-97: #f7f8fa;
  --c-gray-99-fffdf8: #fffdf8;
  --c-red-39: #a32525;
  --c-red-47: #c62828;
  --c-red-95: #fdecea;
  --c-white: #fff;
}
:root {
  /* Palette nommée (étape 7 de l’audit) : mêmes valeurs qu’avant, un nom par couleur principale. À utiliser dans tout nouveau
    code de l’application au lieu d’écrire la couleur. Ces couleurs ne suivent pas le thème de la société (voir themes.css). */
  --c-gold: #e5aa26; /* or de la marque (logo, repères) */
  --c-gold-dark: #b89039; /* or foncé (réglages des tarifs et zones) */
  --c-navy: #102b48; /* bleu marine de la marque */
  --c-muted: #6b7686; /* texte secondaire */
  --c-line: #e3e8f0; /* bordures et séparateurs */
  --c-line-2: #d9dee7; /* bordures (tarifs) */
  --c-success: #2e7d4f; /* succès, validé */
  --c-danger: #b3261e; /* erreur, alerte */
  --c-danger-2: #b42318; /* erreur (teinte voisine, gardée telle quelle) */
  --c-danger-3: #c0392b; /* erreur, annulation (teinte voisine) */
  --c-blue: #2563c9; /* bleu d’action (tarifs, calculateur) */
  --c-blue-dark: #1f4e8c; /* bleu foncé (tarifs client) */
  --c-blue-bright: #0b5fff; /* bleu vif (liens, focus) */
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  background: var(--c-gray-96);
  color: #152233;
  font:
    16px/1.5 system-ui,
    -apple-system,
    Segoe UI,
    sans-serif;
}
.app {
  min-height: 100dvh;
  max-width: 650px;
  margin: auto;
  background: var(--c-white);
  display: flex;
  flex-direction: column;
}
header {
  padding: calc(12px + env(safe-area-inset-top)) 22px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #eef0f2;
}
.brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.15;
}
.brand svg {
  width: 72px;
  height: 25px;
}
.brand strong {
  font-size: 16px;
  letter-spacing: 0.04em;
}
.brand span {
  font-size: 10px;
  color: #ba820d;
  letter-spacing: 0.2em;
}
.round {
  border: 0;
  background: var(--c-gray-96);
  border-radius: 50%;
  width: 44px;
  height: 44px;
  color: #566170;
}
main {
  padding: 24px 20px 110px;
  flex: 1;
}
.eyebrow {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: #bd8618;
}
h1 {
  font-size: 28px;
  margin: 6px 0;
}
h2 {
  font-size: 18px;
  margin: 0 0 8px;
}
p {
  margin: 5px 0 0;
}
.welcome {
  margin-bottom: 25px;
}
.welcome p,
.muted {
  color: var(--c-blue-47);
}
.notice,
.panel {
  padding: 20px;
  border-radius: 18px;
  margin-bottom: 16px;
}
.notice {
  background: #fff7e5;
  border: 1px solid #f4dfaa;
}
.panel {
  background: var(--c-gray-97);
  border: 1px solid #eef0f2;
}
.offline {
  padding: 14px;
  border-radius: 12px;
  background: #fee2e2;
  color: #831f1f;
}
nav {
  position: sticky;
  bottom: 0;
  background: var(--c-white);
  border-top: 1px solid #edf0f3;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding: 10px 5px calc(10px + env(safe-area-inset-bottom));
  gap: 3px;
}
nav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: #566170;
  font-size: 12px;
  border-radius: 12px;
  padding: 6px 1px;
  min-height: 44px;
}
nav a span {
  font-size: 24px;
  line-height: 1.3;
}
nav a[aria-current='page'] {
  color: #25211b;
  background: #f9e6b0;
  font-weight: 700;
}
@media (min-width: 650px) {
  .app {
    box-shadow: 0 0 40px #0001;
  }
}
.auth-zone {
  max-width: 460px;
  margin: 22px auto;
  padding: 20px;
  border: 1px solid #e9e1d2;
  border-radius: 22px;
  background: white;
  box-shadow: 0 10px 25px #00000009;
}
.auth-zone h2 {
  margin: 0 0 14px;
}
.auth-zone label {
  display: block;
  font-size: 14px;
  font-weight: 650;
  margin: 13px 0 6px;
}
.auth-zone input {
  display: block;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #d6d5d1;
  border-radius: 12px;
  padding: 13px;
  font: inherit;
  background: var(--c-white);
  color: #171717;
}
.auth-zone button {
  width: 100%;
  margin: 18px 0 8px;
  background: var(--c-amber-52);
  color: var(--c-amber-7);
  border: 0;
  border-radius: 13px;
  padding: 14px;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}
.auth-zone button:disabled {
  opacity: 0.55;
}
.auth-zone a {
  color: #806018;
}
.auth-zone .form-error {
  color: var(--c-red-39);
  min-height: 22px;
}
.auth-zone .form-info {
  color: #275d3b;
  min-height: 22px;
}
.auth-zone .auth-links {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.auth-zone p {
  line-height: 1.5;
}
/* Lot 3 — Tableau de bord chauffeur */
.dashboard {
  display: grid;
  gap: 16px;
  margin-bottom: 18px;
}
.driver-card {
  background: linear-gradient(145deg, var(--c-gray-99-fffdf8), var(--c-white));
  border: 1px solid #e8dcc4;
  border-radius: 22px;
  padding: 20px;
  box-shadow: 0 8px 26px #20150808;
}
.driver-card h2 {
  font-size: 22px;
  margin: 6px 0 2px;
}
.status-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 22px 0 10px;
}
.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-weight: 750;
  color: #8d4d16;
  background: #fff1df;
  padding: 8px 12px;
  border-radius: 20px;
  font-size: 13px;
}
.status-pill:before {
  content: '';
  height: 9px;
  width: 9px;
  border-radius: 50%;
  background: #d98b28;
}
.status-pill.is-online {
  color: #176b44;
  background: #e5f8ed;
}
.status-pill.is-online:before {
  background: #1caa68;
}
.availability-btn {
  border: 0;
  background: var(--c-gold);
  color: var(--c-amber-10);
  border-radius: 13px;
  padding: 12px 16px;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}
.availability-btn:disabled {
  opacity: 0.5;
  cursor: wait;
}
#dashboard-error {
  color: var(--c-danger-2);
  font-size: 14px;
}
.dashboard-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.dashboard-links a {
  display: flex;
  flex-direction: column;
  gap: 8px;
  border: 1px solid #ece9e2;
  border-radius: 17px;
  padding: 18px;
  text-decoration: none;
  color: #192536;
  font-weight: 750;
  background: var(--c-white);
}
.dashboard-links small {
  font-size: 12px;
  font-weight: 500;
  color: #718094;
}
/* Lot 4 — cartes de courses, une carte géographique par proposition */
.rides-board {
  margin: 0 0 20px;
}
.rides-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.rides-toolbar button {
  border: 1px solid var(--c-amber-78);
  background: var(--c-amber-97);
  border-radius: 10px;
  padding: 8px 12px;
  font: inherit;
  font-size: 13px;
}
.rides-list {
  display: grid;
  gap: 16px;
  margin-top: 15px;
}
.ride-card {
  border: 1px solid #e9e0ce;
  border-radius: 20px;
  padding: 17px;
  background: var(--c-white);
  box-shadow: 0 6px 18px #1b24300b;
}
.ride-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}
.ride-fare {
  font-weight: 800;
  color: #996914;
}
.ride-time {
  color: #596878;
  font-size: 14px;
  margin: 6px 0 13px;
}
.ride-route {
  border-left: 2px solid #e6c478;
  margin: 12px 0 16px 5px;
  padding-left: 15px;
  display: grid;
  gap: 13px;
}
.ride-route > div {
  display: flex;
  position: relative;
}
.ride-dot {
  position: absolute;
  left: -21px;
  top: 7px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #d49b26;
  border: 2px solid var(--c-white);
}
.ride-dot.arrival {
  background: #183b57;
}
.ride-route small {
  display: block;
  color: var(--c-blue-47);
}
.ride-route strong {
  display: block;
  font-size: 14px;
  overflow-wrap: anywhere;
}
.ride-map {
  border: 1px solid #e9e9e9;
  margin-bottom: 14px;
}
.ride-map iframe {
  border: 0;
  width: 100%;
  height: 160px;
  display: block;
}
.ride-map p {
  font-size: 11px;
  color: var(--c-blue-47);
  padding: 8px 10px;
  margin: 0;
}
.ride-map-empty {
  height: 125px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 12px;
}
.ride-map-empty span {
  font-size: 25px;
  color: #a6aeb8;
}
.ride-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.ride-actions button {
  padding: 13px 8px;
  border-radius: 12px;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
  border: 1px solid #d8dce1;
  background: var(--c-white);
  color: #344256;
}
.ride-actions button[data-action='accept'] {
  background: var(--c-gold);
  border-color: var(--c-gold);
  color: var(--c-amber-10);
}
.ride-actions button:disabled {
  opacity: 0.5;
  cursor: wait;
}
#rides-message {
  color: #5c6877;
  font-size: 14px;
}
.ride-map {
  height: 210px;
  min-height: 210px;
  border-radius: 14px;
  overflow: hidden;
  background: #f3f1ec;
  display: block;
  color: #625c50;
  padding: 0;
}
.ride-map:not(:has(.leaflet-pane)) {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  text-align: center;
  font-size: 13px;
}
.ride-map .leaflet-control-attribution {
  font-size: 9px;
}
/* Lot 5 — mes courses */
.rides-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0 0 17px;
  padding: 5px;
  border-radius: 15px;
  background: #f4f2ed;
}
.rides-tabs button {
  border: 0;
  background: transparent;
  padding: 12px 7px;
  border-radius: 11px;
  font: inherit;
  font-weight: 750;
  color: #596575;
}
.rides-tabs button[aria-selected='true'] {
  background: var(--c-gold);
  color: #241b0c;
  box-shadow: 0 2px 6px #00000012;
}
.mine-filters {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 0 10px;
  scrollbar-width: thin;
}
.mine-filters button {
  white-space: nowrap;
  padding: 9px 12px;
  border: 1px solid #e7dfcf;
  border-radius: 18px;
  background: var(--c-white);
  color: #465366;
  font: inherit;
  font-size: 13px;
}
.mine-filters button[aria-pressed='true'] {
  background: #fff1cc;
  border-color: #d6a436;
  color: #654608;
  font-weight: 750;
}
.mine-open,
.mine-directions {
  display: block;
  text-align: center;
  padding: 12px;
  border-radius: 12px;
  background: var(--c-gold);
  color: var(--c-amber-10);
  text-decoration: none;
  border: 0;
  font: inherit;
  font-weight: 750;
  width: 100%;
  cursor: pointer;
}
.mine-pages {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 17px 0;
}
.mine-pages button,
#mine-back {
  padding: 10px 12px;
  background: var(--c-white);
  border: 1px solid #e4d7bb;
  border-radius: 11px;
  color: #725219;
  font: inherit;
}
.mine-pages button:disabled {
  opacity: 0.4;
}
.mine-detail {
  border: 1px solid #e9e0ce;
  border-radius: 18px;
  padding: 16px;
}
.mine-detail h2 {
  margin: 15px 0;
}
.mine-detail p {
  margin: 9px 0;
  overflow-wrap: anywhere;
}
.mine-detail .ride-map {
  margin: 16px 0;
}
[hidden] {
  display: none !important;
}

/* Lot 6: mobile mission controls */
.mission-panel {
  border: 1px solid #e7d8b4;
  background: var(--c-gray-99-fffdf8);
  border-radius: 18px;
  padding: 16px;
  margin: 14px 0;
  box-shadow: 0 3px 14px #31250b0c;
}
.mission-panel h3 {
  margin: 0 0 8px;
}
.mission-status {
  font-weight: 750;
  color: #805a16;
  font-size: 1.12rem;
}
.mission-steps {
  flex-wrap: wrap;
}
.mission-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mission-actions button {
  min-height: 48px;
  width: 100%;
  border-radius: 12px;
}
.mission-history {
  padding-left: 22px;
  font-size: 0.87rem;
}
.mission-history li {
  margin: 5px 0;
}
#mission-error {
  color: #a22;
}

/* V006.2 — informations mises à jour sans modifier le thème */
.ride-extra {
  font-size: 13px;
  color: #596878;
  margin: 8px 0 14px;
}
.ride-extra summary {
  cursor: pointer;
  color: #806018;
}
.ride-extra p {
  margin: 4px 0;
  overflow-wrap: anywhere;
}
.auth-feedback {
  color: #275d3b;
  margin-bottom: 12px;
}
.auth-zone > a[data-go] {
  display: block;
  text-align: center;
  margin-top: 10px;
}
#driver-presence {
  font-size: 13px;
  margin-top: 10px;
}

/* Lot 10: safe-area and install/update UI */
.pwa-tools {
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid #e5c981;
  border-radius: 12px;
  background: var(--c-amber-97);
  color: #3b321e;
}
.pwa-tools button {
  min-height: 44px;
  margin: 0.4rem 0.5rem 0.2rem 0;
  padding: 0.65rem 1rem;
  border-radius: 9px;
  border: 1px solid #b58c2e;
  background: var(--c-white);
  color: #503c12;
  font-weight: 650;
}
.pwa-tools[hidden],
.pwa-tools button[hidden] {
  display: none !important;
}
nav {
  padding-bottom: max(8px, env(safe-area-inset-bottom));
}
button,
a {
  touch-action: manipulation;
}
body {
  overflow-x: hidden;
}
.ride-card,
.mine-detail {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* V011 — gestion entreprise */
#admin-board .admin-panel {
  border: 1px solid #eadbb6;
  border-radius: 14px;
  padding: 16px;
  margin: 12px 0;
  background: var(--c-white);
}
#admin-board form {
  display: grid;
  gap: 10px;
  margin: 12px 0 20px;
}
#admin-board label {
  display: grid;
  gap: 4px;
}
#admin-board input,
#admin-board select {
  min-height: 42px;
  max-width: 100%;
  padding: 8px;
  border: 1px solid #bbb;
  border-radius: 8px;
}
#admin-board button {
  min-height: 44px;
  padding: 9px 15px;
  border: 1px solid #b68b28;
  background: #f9e8b5;
  border-radius: 9px;
  cursor: pointer;
}
#admin-board .admin-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  border-top: 1px solid #eee;
  padding: 12px 0;
}
#admin-board .admin-row small {
  flex: 1;
  min-width: 150px;
}
#admin-board .admin-row strong {
  min-width: 100px;
}

.google-auth {
  margin: 20px 0;
  max-width: 100%;
  min-width: 0;
}
.google-auth #google-login {
  display: flex;
  justify-content: center;
  max-width: 100%;
  min-height: 44px;
}
.google-auth p {
  font-size: 0.85rem;
  line-height: 1.5;
  text-align: center;
  overflow-wrap: anywhere;
}
.auth-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #667085;
  font-size: 0.8rem;
  margin: 18px 0;
}
.auth-divider:before,
.auth-divider:after {
  content: '';
  flex: 1;
  height: 1px;
  background: #e3e7ee;
}
/* Pastille du nombre de réservations à venir (rien si 0) */
nav a {
  position: relative;
}
nav .nav-badge {
  position: absolute;
  top: 2px;
  left: calc(50% + 8px);
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  box-sizing: border-box;
  border-radius: 9px;
  background: var(--theme-accent, #d5a843);
  color: var(--theme-on-accent, var(--c-navy));
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  pointer-events: none;
  box-shadow: 0 0 0 2px var(--theme-surface, #fff);
}
/* V157 : étapes de mission enregistrées hors connexion */
.mission-offline {
  margin: 8px 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--theme-soft, #f1f3f5);
  color: var(--theme-text, #192536);
  font-size: 0.92rem;
  line-height: 1.4;
}
.mission-offline.is-error {
  background: var(--c-red-95);
  color: #7a1c13;
  border: 1px solid #f3b8b1;
}
.mission-offline.is-error p {
  margin: 0 0 8px;
}
.mission-offline .mission-notice-ok {
  min-height: 40px;
  padding: 0 14px;
  border-radius: 8px;
}
/* V157 : saisies (courses, devis) gardées hors connexion */
.offline-drafts {
  margin: 12px 0;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px dashed var(--theme-accent, #c1845b);
  background: var(--theme-soft, #f1f3f5);
  color: var(--theme-text, #192536);
}
.offline-drafts h3 {
  margin: 0 0 4px;
  font-size: 1rem;
}
.offline-drafts p {
  margin: 0 0 8px;
  font-size: 0.9rem;
  color: var(--theme-muted, #5e6a7a);
}
.offline-drafts ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}
.offline-drafts li {
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--theme-surface, #fff);
  font-size: 0.9rem;
  overflow-wrap: anywhere;
}
.offline-drafts li.is-error {
  border: 1px solid #f3b8b1;
  background: var(--c-red-95);
}
.offline-drafts li small {
  display: block;
  color: #7a1c13;
  margin: 4px 0;
}
.offline-drafts li button {
  min-height: 36px;
  padding: 0 12px;
  border-radius: 8px;
}
/* V157 : nombre de courses sur les onglets */
.rides-tabs .tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  margin-left: 6px;
  padding: 0 7px;
  border-radius: 12px;
  background: var(--theme-accent, #c1845b);
  color: var(--theme-on-accent, #fff);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  vertical-align: middle;
}
.rides-tabs [aria-selected='true'] .tab-count {
  background: var(--c-white);
  color: var(--theme-accent-text, #8f5a36);
}
.rides-tabs .tab-count[hidden] {
  display: none;
}
/* V157 : pastilles d'avancement deux fois plus grandes (2 × 2), étape en cours bien marquée */
.mission-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 16px 0;
}
.mission-steps span {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 1.38rem;
  font-weight: 600;
  padding: 12px 10px;
  min-height: 56px;
  border-radius: 16px;
  background: #f1f1f1;
  color: #6b6b6b;
  line-height: 1.15;
}
.mission-steps .done {
  background: #f7e7b9;
  color: #654809;
}
.mission-steps .current {
  background: var(--theme-accent, #c1845b);
  color: var(--theme-on-accent, #fff);
  box-shadow:
    0 0 0 3px var(--theme-soft, #f1e4db),
    0 0 0 5px var(--theme-accent, #c1845b);
}
@media (max-width: 360px) {
  .mission-steps span {
    font-size: 1.15rem;
  }
}
/* V157 : bouton de l'étape en premier, un espace d'un bouton, puis bon de commande et actualisation */
.mission-actions .mission-gap {
  height: 48px;
}
.mission-actions .mission-wait {
  margin: 0;
  padding: 8px 12px;
  border-radius: 10px;
  background: #fff4e0;
  color: #5a3a00;
  font-weight: 600;
  text-align: center;
}
/* V157 : bloc « Problème sur la course ? » (No show, force majeure) et feuille d'annulation */
.inc-panel {
  margin: 16px 0 4px;
  padding: 14px;
  border: 1px solid var(--theme-border, #dfe4e9);
  border-radius: 16px;
  background: var(--theme-surface, #fff);
}
.inc-panel h4 {
  margin: 0 0 10px;
  font-size: 1rem;
}
.inc-panel .incident-actions {
  display: grid;
  gap: 10px;
}
.inc-item {
  display: grid;
  gap: 6px;
}
.inc-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 60px;
  padding: 10px 14px;
  border-radius: 14px;
  border: 1.5px solid var(--theme-accent, #c1845b);
  background: var(--theme-surface, #fff);
  color: var(--theme-text, #192536);
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.inc-btn strong {
  display: block;
  font-size: 1rem;
}
.inc-btn small {
  display: block;
  color: var(--theme-muted, #5e6a7a);
  font-size: 0.82rem;
  margin-top: 2px;
}
.inc-btn .inc-ico {
  font-size: 1.4rem;
  line-height: 1;
}
.inc-btn.is-off {
  border-color: var(--theme-border, #dfe4e9);
  background: var(--c-gray-96);
  color: #7a8290;
  cursor: not-allowed;
}
.inc-btn.is-off strong {
  color: #7a8290;
}
.inc-panel .noshow-info p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--theme-muted, #5e6a7a);
}
.inc-panel .noshow-chrono {
  font-weight: 600;
  color: var(--theme-text, #192536) !important;
}
.inc-reason.is-flash {
  animation: incflash 0.9s ease;
}
@keyframes incflash {
  0%,
  100% {
    background: transparent;
  }
  30% {
    background: #fff4e0;
  }
}
.inc-sheet[open] {
  position: fixed;
  inset: auto 0 0 0;
  margin: 0 auto;
  width: 100%;
  max-width: 560px;
  max-height: 92dvh;
  box-sizing: border-box;
  border-radius: 20px 20px 0 0;
  padding: 18px 16px max(16px, env(safe-area-inset-bottom));
  overflow: auto;
  animation: incup 0.22s ease-out;
}
@keyframes incup {
  from {
    transform: translateY(40px);
    opacity: 0.4;
  }
  to {
    transform: none;
    opacity: 1;
  }
}
.inc-sheet h3 {
  margin: 0 40px 6px 0;
  font-size: 1.2rem;
}
.inc-sheet .inc-x {
  position: absolute;
  top: 10px;
  right: 10px;
  min-width: 44px;
  min-height: 44px;
  border: 0;
  background: transparent;
  font-size: 24px;
  color: var(--theme-text, #192536);
}
.inc-sheet .inc-photo-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0;
}
.inc-sheet .inc-shoot {
  min-height: 48px;
  width: auto;
}
.inc-sheet .inc-preview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 6px 0 12px;
}
.inc-sheet .inc-thumb {
  position: relative;
  display: block;
  aspect-ratio: 1;
  border-radius: 12px;
  overflow: hidden;
}
.inc-sheet .inc-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.inc-sheet .inc-thumb button {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 32px;
  height: 32px;
  min-height: 32px;
  border-radius: 50%;
  border: 0;
  background: #000a;
  color: var(--c-white);
  font-size: 18px;
  padding: 0;
}
.inc-sheet .inc-slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  aspect-ratio: 1;
  border: 2px dashed var(--theme-border, #cfd6df);
  border-radius: 12px;
  background: transparent;
  font-size: 1.4rem;
  color: var(--theme-muted, #5e6a7a);
}
.inc-sheet .inc-slot small {
  font-size: 0.75rem;
}
.inc-sheet textarea {
  width: 100%;
  box-sizing: border-box;
  min-height: 90px;
  border-radius: 12px;
}
.inc-sheet .inc-sheet-actions {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.inc-sheet .inc-sheet-actions .availability-btn {
  min-height: 52px;
  width: 100%;
}
.inc-sheet .inc-sheet-actions .availability-btn:disabled {
  opacity: 0.45;
}
.inc-sheet .inc-link {
  min-height: 44px;
  border: 0;
  background: transparent;
  color: var(--theme-accent-text, #8f5a36);
  font-weight: 600;
  text-decoration: underline;
}
/* SOS : confirmation déjà en deux temps ; message de réussite bien visible */
.dx-sos-note.is-ok {
  padding: 8px 12px;
  border-radius: 10px;
  background: #e8f6ee;
  color: #14532d;
}
/* V157 : boutons secondaires du bloc contacts (SMS, retard) aux couleurs de l'application */
.dx-block button:not(.availability-btn):not(.dx-sos) {
  min-height: 46px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1.5px solid var(--theme-accent, #c1845b);
  background: var(--theme-surface, #fff);
  color: var(--theme-accent-text, #8f5a36);
  font-weight: 600;
}
.dx-block .dx-late {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 12px 0;
}
.dx-block .dx-late select {
  min-height: 44px;
  border-radius: 10px;
}
/* V157d — Suivi de mission (maquette validée) : barre d'étapes, carte client / adresse, gros bouton d'action unique */
.mission-v2.mission-panel {
  background: var(--theme-surface, #fff);
  border-color: var(--theme-border, #dfe5ec);
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mission-v2 .mission-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.mission-v2 .mission-steps li {
  min-width: 0;
}
.mission-v2 .mission-steps span {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  min-height: 0;
  padding: 0;
  border-radius: 0;
  background: none !important;
  box-shadow: none !important;
  color: var(--theme-muted, #55657a);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.2;
  text-align: left;
}
.mission-v2 .mission-steps i {
  display: block;
  height: 6px;
  border-radius: 3px;
  background: var(--c-blue-87);
}
.mission-v2 .mission-steps .done {
  color: var(--c-success);
}
.mission-v2 .mission-steps .done i {
  background: var(--c-success);
}
.mission-v2 .mission-steps .current {
  color: var(--theme-accent, #1f5f9e);
  font-weight: 700;
}
.mission-v2 .mission-steps .current i {
  background: var(--theme-accent, #1f5f9e);
}
.mission-v2 .mission-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mission-v2 .mission-head p {
  margin: 0;
}
.mission-v2 .mission-status {
  font-size: 20px;
  color: var(--theme-text, #12263f);
}
.mission-v2 .mission-sync {
  font-size: 13px;
}
.mission-card {
  border: 1px solid var(--theme-border, #dfe5ec);
  border-radius: 16px;
  overflow: hidden;
  background: var(--theme-surface, #fff);
}
.mission-client {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--theme-border, #dfe5ec);
}
.mission-avatar {
  width: 44px;
  height: 44px;
  flex: none;
  border-radius: 22px;
  display: grid;
  place-items: center;
  background: var(--theme-soft, #e3edf8);
  color: var(--theme-accent, #1f5f9e);
  font-weight: 700;
}
.mission-who {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mission-who strong {
  font-size: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mission-who small {
  font-size: 13px;
  color: var(--theme-muted, #55657a);
}
.mission-call {
  width: 48px;
  height: 48px;
  flex: none;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--theme-soft, #e3edf8);
  color: var(--theme-accent, #1f5f9e);
}
.mission-target {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 14px;
}
.mission-target small {
  font-size: 12px;
  color: var(--theme-muted, #55657a);
}
.mission-target strong {
  font-size: 15px;
  overflow-wrap: anywhere;
}
.mission-gps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 52px;
  border: 0;
  border-top: 1px solid var(--theme-border, #dfe5ec);
  background: none;
  color: var(--theme-accent, #1f5f9e);
  font: inherit;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}
.mission-waiting {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 16px;
  background: var(--theme-soft, #e3edf8);
}
.mission-waiting span {
  font-size: 14px;
  color: var(--theme-muted, #55657a);
}
.mission-waiting strong {
  font-size: 30px;
  font-variant-numeric: tabular-nums;
}
.mission-v2 .mission-actions {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.mission-v2 .mission-main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 64px;
  border-radius: 16px;
  font-size: 19px;
  font-weight: 700;
}
.mission-v2 .mission-main.is-finish {
  background: var(--c-success);
  border-color: var(--c-success);
  color: var(--c-white);
}
.mission-v2 .mission-actions .mission-wait {
  margin-top: 8px;
}
.mission-v2 .mission-actions .mission-gap {
  height: 40px;
}
.mission-secondary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  gap: 8px;
}
.mission-secondary button {
  padding: 6px 8px;
  border: 1px solid var(--theme-border, #dfe5ec);
  border-radius: 12px;
  background: var(--theme-surface, #fff);
  color: var(--theme-text, #33465c);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.mission-history-box {
  border: 1px solid var(--theme-border, #dfe5ec);
  border-radius: 14px;
  padding: 0 14px;
}
.mission-history-box summary {
  min-height: 48px;
  display: flex;
  align-items: center;
  font-weight: 600;
  cursor: pointer;
}
.mission-history-box .mission-history {
  margin: 0 0 12px;
}
/* V157e — page course chauffeur : suivi en premier, le reste replié ; SOS en haut */
.mission-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.mission-top .mission-head {
  flex: 1;
  min-width: 0;
}
.mission-sos {
  flex: none;
  max-width: 52%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}
.mission-sos .dx-sos {
  min-height: 40px !important;
  width: auto !important;
  padding: 0 14px !important;
  border-radius: 20px !important;
  border: 1.5px solid var(--c-red-47) !important;
  background: var(--c-white) !important;
  color: var(--c-red-47) !important;
  font-size: 13px !important;
  font-weight: 700;
  white-space: normal;
  text-align: center;
}
.mission-sos .dx-sos-note {
  margin: 0;
  font-size: 12px;
  text-align: right;
}
.mission-sos .dx-sos-note:empty {
  display: none;
}
.mine-fold,
.dx-fold {
  border: 1px solid var(--theme-border, #dfe5ec);
  border-radius: 16px;
  background: var(--theme-surface, #fff);
  padding: 0 14px;
  margin: 10px 0;
}
.dx-block:has(> .dx-fold) {
  border: 0;
  padding: 0;
  background: none;
  box-shadow: none;
  margin: 0;
}
.mine-fold > summary,
.dx-fold > summary {
  min-height: 56px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  font-weight: 600;
  font-size: 15px;
  cursor: pointer;
  list-style: none;
}
.mine-fold > summary::-webkit-details-marker,
.dx-fold > summary::-webkit-details-marker {
  display: none;
}
.mine-fold > summary small,
.dx-fold > summary small {
  font-weight: 400;
  font-size: 12.5px;
  color: var(--theme-muted, #55657a);
}
.mine-fold[open] > summary,
.dx-fold[open] > summary {
  border-bottom: 1px solid var(--theme-border, #dfe5ec);
  margin-bottom: 10px;
}
.mine-fold[open],
.dx-fold[open] {
  padding-bottom: 12px;
}
#incident-fold .inc-panel {
  margin: 0;
  border: 0;
  padding: 0;
  box-shadow: none;
}
#incident-fold .inc-panel > h3,
#incident-fold .inc-panel > h4 {
  display: none;
}
.mission-secondary button {
  height: 56px;
  min-height: 56px !important;
  margin: 0 !important;
  width: 100% !important;
}