/* ============================================================================
   kw-ds-tunnel.css — panier, configuration des domaines et paiement sous le nouveau
   design (lot TUNNEL, 09/10/2026). Chargé après kw-ds.css sur ces pages seulement.
   1. Compatibilité : la règle générale « .kw-ds a » (couleur des liens) l'emportait sur
      les classes des boutons et liens du tunnel ; on rend leurs couleurs d'origine, avec
      les variables du tunnel (--kh-*), qui suivent déjà le thème sombre.
   2. Mobile (défauts antérieurs au nouveau design) : liste des articles coupée à droite,
      indicateur d'étapes dont la dernière étape sortait de l'écran.
   ============================================================================ */

/* 1. Couleurs d'origine des liens-boutons du tunnel */
.kw-ds .kw-checkout-btn, .kw-ds .kw-checkout-btn:hover, .kw-ds .kw-checkout-btn * { color: #fff; }
.kw-ds .kw-continue, .kw-ds .kw-mini-edit { color: var(--kh-muted); }
.kw-ds .kw-continue:hover, .kw-ds .kw-mini-edit:hover { color: var(--kh-primary); }

/* 2. Mobile */
.kw-ds .kw-main { min-width: 0; }
@media (max-width: 600px) {
  .kw-ds .kw-flow-list { justify-content: space-between; overflow-x: visible; }
  .kw-ds .kw-flow-step:not(.is-active) .kw-flow-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .kw-ds .kw-flow-sep { min-width: 10px; }
}

/* 3. Blocs « Catégories / Actions / Devise » du panier mobile : sur les pages au nouveau design,
      le menu de l'en-tête et « FR · F CFA » donnent déjà accès à toutes les offres et à la devise ;
      le sélecteur de devise chevauchait en outre l'indicateur d'étapes. */
.kw-ds #kw-cart .kw-cart-natcat { display: none !important; }

/* 4. Moyens de paiement : logos servis par le site (lot TUNNEL) */
.kw-ds .kw-gw-label .kw-gw-logo { height: 28px; max-width: 96px; }
.kw-gw-cartes { display: inline-flex; align-items: center; gap: 4px; height: 26px; }
.kw-gw-cartes svg { height: 100%; width: auto; }

/* 5. Tunnel sur téléphone et tablette (lot MOBILE, 12/10/2026) : rien qui détourne du paiement.
      Le fil d'Ariane double l'indicateur d'étapes ; le grand pied de page (34 % de la page de paiement, 61 % du panier)
      laisse la place à une ligne de liens rendue par kw-ds-pied.tpl sur ces seules pages. */
.kw-ds .k-pied-liens { display: none; }
@media (max-width: 991px) {
  .kw-ds .master-breadcrumb { display: none !important; }
  .kw-ds .k-pied { margin-top: 8px; padding-bottom: 92px; }   /* place de la barre fixe du bas */
  .kw-ds .k-pied .k-pied-grille { display: none; }
  .kw-ds .k-pied-liens { display: flex; flex-wrap: wrap; gap: 6px 18px; padding-top: 18px; font: 500 14px var(--c-corps, inherit); color: var(--c-pied-gris, inherit); }
  .kw-ds .k-pied-liens a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
  .kw-ds .k-pied .k-pied-bas { flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 0; padding-block: 12px 4px; border-top: 0; }
}