/* Mode sombre — chargé après styles.css. Activé par la classe .is-dark sur <html>.
   Toutes les règles sont préfixées par .is-dark : le mode clair n'est jamais touché. */

/* ---------- Jetons ---------- */
.is-dark {
  color-scheme: dark;
  --bg: #07121F;      /* fond de page */
  --tint: #0A1828;    /* sections alternées */
  --card: #0F2136;    /* cartes, panneaux */
  --soft: #15293F;    /* étiquettes, petits fonds */
  --field: #0A192A;   /* champs de saisie */
  --line: #1F3651;
  --line-2: #2A4766;  /* bordures plus visibles (champs, pastilles) */
  --text: #E8EDF3;
  --muted: #9DABBB;
  --ink-2: #C5CFDA;   /* texte courant un peu atténué */
  --white: #10233A;   /* anneau des cadres arrondis (blanc en mode clair) */
  --navy: #0D2036;
  --navy-2: #13293F;
  --navy-3: #1A3450;
  --red-ink: #FF5A5A; /* rouge lisible sur fond sombre (AA) */
  --ok: #3DDC84;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 24px 48px -26px rgba(0, 0, 0, .75);
  scrollbar-color: #2A4766 #07121F;
}
.is-dark ::selection { background: rgba(238, 43, 43, .42); color: #fff; }
.is-dark :is(a, button, summary, [tabindex]):focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.is-dark .ptype:has(> input:focus-visible) { outline: 2px solid var(--gold); outline-offset: 2px; }

/* Bascule douce (uniquement vers le sombre : la règle n'existe pas en clair, donc rien ne s'anime au chargement) */
.is-dark body, .is-dark .section, .is-dark .footer, .is-dark .ticker { transition: background-color .35s ease, color .35s ease; }

/* Photos légèrement atténuées pour ne pas éblouir */
.is-dark :is(.hero__bg, .phero__bg, .cta__bg) { filter: brightness(.86) saturate(.95); }
.is-dark :is(.card__media img, .detail__media img, .trust__photo img, .parcel__photo img) { filter: brightness(.9) saturate(.95); }

/* ---------- Cadres et blocs marine ---------- */
.is-dark .frame { box-shadow: 0 30px 60px -40px rgba(0, 0, 0, .8); }
.is-dark :is(.trust__photo, .dest, .vehicle, .route) { border-color: var(--white); box-shadow: 0 30px 60px -40px rgba(0, 0, 0, .8); }

/* ---------- Boutons ---------- */
.is-dark .btn--line { background: var(--card); border-color: var(--line-2); color: var(--text); }
.is-dark .btn--line:hover { border-color: var(--text); }
.is-dark .btn--navy { background: #1D3756; color: #fff; }
.is-dark .btn--navy:hover { background: #27486D; }
.is-dark .link { color: var(--red-ink); }

/* ---------- Navigation ---------- */
.is-dark .nav.is-scrolled { background: rgba(11, 26, 43, .9); color: var(--text); box-shadow: 0 0 0 1px rgba(255, 255, 255, .06), 0 14px 40px -16px rgba(0, 0, 0, .8); }
.is-dark .nav.is-scrolled .brand__img--dark { opacity: 1; }
.is-dark .nav.is-scrolled .brand__img--light { opacity: 0; }
.is-dark .nav.is-scrolled .brand__name i, .is-dark .footer .brand__name i { color: var(--red-2); }
.is-dark .nav.is-scrolled .btn--outline { color: var(--text); border-color: var(--line-2); }
.is-dark .nav.is-scrolled .btn--outline:hover { border-color: var(--text); }
.is-dark .nav.is-scrolled .navico { border-color: var(--line-2); }
.is-dark .nav__mobile { background: var(--card); color: var(--text); box-shadow: 0 0 0 1px var(--line), 0 24px 48px -20px rgba(0, 0, 0, .8); }
.is-dark .nav__mobilebar .navico { border-color: var(--line-2); }
@media (max-width: 900px), (pointer: coarse) {
  .is-dark .nav.is-scrolled { background: #0B1A2B; }
}

/* Menu Services */
.is-dark .navdrop__panel { background: var(--card); color: var(--text); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .8), 0 0 0 1px var(--line); }
.is-dark .navdrop__panel a:hover { background: var(--soft); }

/* ---------- Bandeau, sections ---------- */
.is-dark .ticker { background: var(--bg); }

/* Petits libellés rouges / colorés : éclaircis pour rester ≥ 4.5:1 sur les cartes */
.is-dark :is(.feat span, .steps span, .step__title span) { color: var(--red-ink); }
.is-dark .service__n { color: color-mix(in srgb, var(--c, var(--red)) 70%, #fff); }

/* Services */
.is-dark .service { background: var(--card); }
.is-dark .service:hover { background: var(--navy-3); }
.is-dark .service__go { border-color: var(--line-2); }

/* Filtres et onglets */
.is-dark .filters { background: var(--card); }
.is-dark .chip.is-active { background: var(--text); color: #0B1E33; }

/* ---------- Cartes conteneurs ---------- */
.is-dark .card { background: var(--card); box-shadow: 0 0 0 1px var(--line); }
.is-dark .card:hover { box-shadow: 0 0 0 1px var(--line-2), var(--shadow); }
.is-dark .card__tags span { color: var(--ink-2); }
.is-dark .card__size, .is-dark .status { background: rgba(9, 22, 37, .88); color: var(--text); box-shadow: 0 0 0 1px rgba(255, 255, 255, .12); }
.is-dark .status--reserve::before { background: #A3AEBA; }
.is-dark .status--mer::before { background: #5A9BEA; }

/* ---------- Fiche conteneur, modales ---------- */
.is-dark .modal { background: var(--card); color: var(--text); box-shadow: 0 0 0 1px var(--line), 0 40px 120px -30px rgba(0, 0, 0, .9); }
.is-dark .modal::backdrop { background: rgba(2, 8, 15, .78); }
.is-dark .modal__close { background: var(--soft); border-color: var(--line-2); color: var(--text); }
.is-dark .modal__close:hover { border-color: var(--text); }
.is-dark .detail__facts div, .is-dark .detail__price, .is-dark .request { background: var(--soft); }
.is-dark .track span { background: var(--line-2); }
.is-dark .priceform { border-color: var(--line); background: rgba(255, 255, 255, .015); }
.is-dark .priceform input:not([type="checkbox"]) { background: var(--field); border-color: var(--line-2); color: var(--text); }
/* La case de consentement héritait de la taille des champs (366 × 44 px) */
.is-dark .priceform .consent input { width: 17px; height: 17px; padding: 0; }
.is-dark .priceform input::placeholder { color: #7F8EA0; }
.is-dark .wa-alt button { color: var(--ok); }

/* Confirmation d'envoi (#sentModal) */
.is-dark .sent__ic { background: rgba(61, 220, 132, .14); color: var(--ok); }
.is-dark .sent__ref { background: var(--soft); border-color: var(--line-2); }
.is-dark .sent__steps { color: var(--ink-2); }

/* ---------- Configurateur ---------- */
.is-dark .builder-sec { border-color: var(--white); }
.is-dark .step { background: var(--navy-2); }
.is-dark .stepper { background: #0A1A2C; }
.is-dark .summary { background: var(--soft); color: var(--text); box-shadow: 0 0 0 1px var(--line-2); }
.is-dark .summary__visual { background: #1E3754; }
.is-dark .summary__meta div { background: #1E3754; }
.is-dark .summary__list li { border-bottom-color: var(--line-2); }
.is-dark .gauge__bar { background: #1E3754; }
.is-dark .gauge__bar i { background: var(--gold); }
.is-dark .gauge.is-full .gauge__bar i { background: #22B866; }
.is-dark .gauge.is-over .gauge__bar i { background: var(--red); }
.is-dark .gauge.is-over small { color: var(--red-ink); }
.is-dark .submitbar { background: #1B3554; box-shadow: 0 0 0 1px rgba(255, 255, 255, .16), 0 20px 40px -12px rgba(0, 0, 0, .9); }

/* ---------- Formulaires ---------- */
.is-dark .field input, .is-dark .field textarea, .is-dark .field select { background: var(--field); border-color: var(--line-2); color: var(--text); }
.is-dark .field input::placeholder, .is-dark .field textarea::placeholder { color: #7F8EA0; }
.is-dark .field--dark input, .is-dark .field--dark textarea, .is-dark .field--dark select { background: var(--navy-3); border-color: rgba(255, 255, 255, .14); color: #fff; }
.is-dark .field input:focus, .is-dark .field textarea:focus, .is-dark .field select:focus { border-color: var(--red); box-shadow: 0 0 0 4px rgba(238, 43, 43, .22); }
.is-dark .field.is-invalid input, .is-dark .field.is-invalid textarea, .is-dark .field.is-invalid select { border-color: var(--red-2); }
.is-dark .field select option { background: #0F2136; color: var(--text); }
.is-dark input:-webkit-autofill { -webkit-text-fill-color: var(--text); box-shadow: 0 0 0 40px #13304E inset; caret-color: var(--text); }
.is-dark .check input { accent-color: var(--red); }
.is-dark .check.is-invalid, .is-dark .consent.is-invalid { color: var(--red-ink); }
.is-dark .consent a, .is-dark .check a { color: var(--text); }
.is-dark .consent--dark a { color: #fff; }

/* Envoi de colis */
.is-dark .parcel__photo figcaption { background: rgba(9, 22, 37, .9); color: var(--text); }
.is-dark .rule, .is-dark .parcel__form { background: var(--card); border-color: var(--line); }
.is-dark .rule li { color: var(--ink-2); }
.is-dark .rule--ok h3 span { background: rgba(61, 220, 132, .14); color: var(--ok); }
.is-dark .rule--no h3 span { background: rgba(238, 43, 43, .16); color: var(--red-ink); }
.is-dark .ptype { border-color: var(--line-2); }
.is-dark .ptype:has(> input:checked) { border-color: var(--red); box-shadow: inset 0 0 0 1px var(--red); background: rgba(238, 43, 43, .08); }
.is-dark .ptype:has(> input:checked)::after { background: var(--red); }
.is-dark .ptype__qty input { background: var(--field); border-color: var(--line-2); color: var(--text); }

/* ---------- Processus, transparence, destinations ---------- */
.is-dark .steps li { background: var(--card); }
.is-dark .aud { background: var(--card); border-color: var(--line); }
.is-dark .aud--navy, .is-dark .contact-card--wa {
  background: radial-gradient(90% 110% at 100% 0%, rgba(224, 168, 74, .15), transparent 60%), radial-gradient(70% 90% at 0% 100%, rgba(238, 43, 43, .12), transparent 60%), #10253D;
  border-color: #24415F;
}
.is-dark .feat { background: var(--card); border-color: var(--line); }
.is-dark .section--tint .feat { border-color: var(--line); }

/* Parcours d'étapes */
.is-dark .journey__rail { background: var(--line-2); }
.is-dark .journey__steps .n { background: var(--card); border-color: var(--line-2); }
.is-dark .journey__steps svg { stroke: #6F8399; }
.is-dark .journey__steps li[data-done="true"] .n { background: #1D3756; border-color: #2E5279; }
.is-dark .journey__steps li[data-active="true"] .n { box-shadow: 0 0 0 8px rgba(238, 43, 43, .2); }
.is-dark .journey__steps li[data-active="true"] .t { color: var(--red-ink); }
.is-dark .journey__steps li[data-active="true"] svg { stroke: var(--text); }

/* ---------- FAQ ---------- */
.is-dark .faq summary::after { border-color: var(--line-2); }

/* ---------- Texte courant et pages légales ---------- */
.is-dark .prose { color: var(--ink-2); }
.is-dark .prose a { color: var(--red-ink); }
.is-dark .legal__toc { background: var(--card); border-color: var(--line); }
.is-dark .legal__toc a { color: var(--ink-2); }
.is-dark .legal__toc a:hover { background: var(--soft); color: var(--text); }
.is-dark .legal__note { background: var(--card); box-shadow: 0 0 0 1px var(--line); }
.is-dark .todo { background: rgba(224, 168, 74, .14); color: #F2C879; border-color: rgba(224, 168, 74, .55); }

/* ---------- Contact ---------- */
.is-dark .contact-card { background: var(--card); border-color: var(--line); }

/* ---------- Suivi ---------- */
.is-dark .trackcard, .is-dark .trackres { background: var(--card); border-color: var(--line); }
.is-dark .trackcard input { background: var(--field); border-color: var(--line-2); color: var(--text); }
.is-dark .trackcard input::placeholder { color: #7F8EA0; }
.is-dark .trackerr { color: var(--red-ink); }
.is-dark .trackres__empty svg { stroke: var(--line-2); }
.is-dark .tl i { background: var(--card); border-color: var(--line-2); }
.is-dark .tl li.is-done::before { background: #22B866; }
.is-dark .tl li.is-done i { background: #22B866; border-color: #22B866; }
.is-dark .tl li.is-now i { box-shadow: 0 0 0 6px rgba(238, 43, 43, .22); }
.is-dark .tl li.is-alert i { color: #0B1E33; }
.is-dark .trackdetails div { background: var(--soft); }

/* ---------- Payer ---------- */
.is-dark .paysum div { background: var(--soft); }
.is-dark .paysum .is-due { background: #1D3756; box-shadow: inset 0 0 0 1px #2E5279; }
.is-dark .paytabs button { border-color: var(--line-2); }
.is-dark .paytabs button[aria-selected="true"] { background: var(--text); border-color: var(--text); color: #0B1E33; }
.is-dark .paytabs button[aria-selected="true"] small { color: #3E4D5E; }
.is-dark .paypanel { border-color: var(--line-2); }
.is-dark .paycopy { border-color: var(--line-2); }
.is-dark .paynote { background: var(--soft); }
.is-dark .paynote.is-ok { background: rgba(61, 220, 132, .12); color: var(--ok); }
.is-dark .paynote.is-warn { background: rgba(224, 168, 74, .14); color: #F2C879; }
.is-dark .paysafe li::before { background: rgba(61, 220, 132, .16); box-shadow: inset 0 0 0 3px #22B866; }

/* ---------- Sélecteur de langue ---------- */
.is-dark .nav.is-scrolled .langsw, .is-dark .nav__mobilebar .langsw { border-color: var(--line-2); }

/* ---------- Pied de page ---------- */
.is-dark .footer { background: var(--bg); }
.is-dark .brand--foot .brand__img { content: url("/assets/brand/logo-icon-blanc.png"); }

/* ---------- Éléments flottants ---------- */
.is-dark .toast { background: var(--text); color: #0B1E33; box-shadow: 0 20px 40px -12px rgba(0, 0, 0, .8); }
.is-dark .fab { box-shadow: 0 14px 30px -10px rgba(0, 0, 0, .75), 0 0 0 1px rgba(255, 255, 255, .08); }
.is-dark .skip { background: var(--text); color: #0B1E33; }

/* Espace client */
.is-dark .acct .trackcard select, .is-dark .acct__add input, .is-dark .acct__code { background: var(--field); border-color: var(--line-2); color: var(--text); }
.is-dark .acct__file { background: var(--card); border-color: var(--line); }
.is-dark .acct__badge { background: var(--soft); }
.is-dark .acct__badge.is-ok, .is-dark .trackerr.is-ok { color: #6FD39C; }
.is-dark .acct__badge.is-ok { background: rgba(23,166,90,.18); }
.is-dark .acct__track summary { color: #FF8A80; }
.is-dark .btn--dark { background: #1D3756; border-color: #2E5279; }
.is-dark .btn--dark:hover { background: #24456B; }
.is-dark .btn--danger { color: #FF8A80; border-color: #FF8A80; }
.is-dark .btn--danger:hover { background: var(--red); border-color: var(--red); color: #fff; }

/* Page Payer : choix du dossier */
.is-dark .paysafe--card, .is-dark .paypick__item { border-color: var(--line-2); }
.is-dark .paypick__item:hover { border-color: var(--text); }

/* Frise de suivi (composant, page /suivi, confirmation, espace client) */
.is-dark .frise { --fbg: var(--card); }
.is-dark .frise__seg { background: var(--line-2); }
.is-dark .frise__dot { border-color: var(--line-2); color: var(--muted); }
.is-dark .frise.is-on .is-done .frise__dot { background: #24456B; border-color: #3A6390; color: #fff; }
.is-dark .frise.is-on .is-now .frise__dot { box-shadow: 0 0 0 6px rgba(238, 43, 43, .24); }
.is-dark .frise.is-on .is-alert .frise__dot { color: #0B1E33; box-shadow: 0 0 0 6px rgba(224, 168, 74, .26); }
.is-dark .frise.is-on .is-alert .frise__lbl, .is-dark .frise .is-alert .frise__ic { color: var(--gold); stroke: var(--gold); }
.is-dark .frise .is-done .frise__ic { stroke: var(--text); }
.is-dark .frise__now { background: rgba(238, 43, 43, .09); border-color: rgba(238, 43, 43, .3); }
.is-dark .frise__now > svg { stroke: #FF6B6B; }
.is-dark .frise__now.is-alert { background: rgba(224, 168, 74, .1); border-color: rgba(224, 168, 74, .38); }
.is-dark .frise__now.is-alert > svg, .is-dark .frise__now.is-alert small { stroke: var(--gold); color: var(--gold); }
.is-dark .frise__now.is-done { background: rgba(61, 220, 132, .08); border-color: rgba(61, 220, 132, .28); }
.is-dark .frise__now.is-done > svg, .is-dark .frise__now.is-done small { stroke: var(--ok); color: var(--ok); }
.is-dark .suivi__bar input::placeholder { color: #6F8399; }
.is-dark .suivi__ghost i, .is-dark .acct__ghost i:not(:first-child) { border-color: var(--line-2); }
.is-dark .suivi__ghost b, .is-dark .acct__ghost b { background: var(--line-2); }
.is-dark .suivi__facts div, .is-dark .acct__type, .is-dark .acct__stats span { background: var(--soft); }
.is-dark :is(.suivi__copy, .acct__copy) { border-color: var(--line-2); }
.is-dark :is(.suivi__copy, .acct__copy, .sent__copy).is-done { border-color: var(--ok); color: var(--ok); }
.is-dark .suivi__login { background: linear-gradient(135deg, #13304F, #0D2036); box-shadow: inset 0 0 0 1px var(--line-2); }
.is-dark .suivi__login .btn { background: var(--text); border-color: var(--text); color: #0B1E33; }
.is-dark .suivi__login .btn:hover { background: var(--gold); border-color: var(--gold); }
.is-dark .suivi__legend i { background: var(--card); border-color: var(--line-2); }
.is-dark .suivi__legend i.is-done { background: #24456B; border-color: #3A6390; }
.is-dark .suivi__legend i.is-now { background: var(--red); border-color: var(--red); }
.is-dark .suivi__legend i.is-alert { background: var(--gold); border-color: var(--gold); color: #0B1E33; }
.is-dark .sent__no { background: var(--soft); border-color: var(--line-2); }
.is-dark .sent__copy { background: var(--field); border-color: var(--line-2); }
.is-dark .sent__acct { border-color: var(--line-2); }
.is-dark .sent__acct > svg { stroke: #FF6B6B; }
.is-dark .acct__stats .is-due { background: rgba(238, 43, 43, .14); }
.is-dark .acct__empty { border-color: var(--line-2); }

/* ---------- Galerie : notre entrepôt ---------- */
.is-dark .galerie__item figure { background: var(--card); }
.is-dark .galerie__item img { filter: brightness(.88) saturate(.95); }
.is-dark .galerie__item figcaption { background: rgba(7, 18, 31, .84); color: var(--text); box-shadow: inset 0 0 0 1px var(--line-2); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.is-dark .galerie__btn { background: var(--card); border-color: var(--line-2); color: var(--text); }
.is-dark .galerie__btn:hover { border-color: var(--muted); }
.is-dark .galerie__toggle:focus-visible ~ .galerie__bar .galerie__btn { outline-color: var(--gold); }

/* Soumission dans l'espace client */
.is-dark .quote { background: var(--card); border-color: #2E5279; }
.is-dark .quote--done, .is-dark .quote--off { border-color: var(--line-2); }
.is-dark .quote--done p { color: #6FD39C; }
.is-dark .quote__tot div:first-child { border-top-color: #2E5279; }
.is-dark .quote__msg { background: var(--soft); }
.is-dark .quote__msg.is-me { background: rgba(238,43,43,.16); }
.is-dark .quote__form textarea { background: var(--field); border-color: var(--line-2); }
.is-dark .acct__badge.is-warn { background: rgba(224,168,74,.2); color: #F1C987; }
