/* Kustom3D – barre de navigation mobile */
.k3mb { --k3mb-h: 64px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; background: var(--k3mb-bg, #1C1C1E); color: #fff; padding-bottom: env(safe-area-inset-bottom, 0px); font-family: Barlow, system-ui, -apple-system, "Segoe UI", sans-serif; box-shadow: 0 -8px 24px rgba(0,0,0,.18); }
.k3mb::before { content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px; }
.k3mb { background-image: radial-gradient(rgba(255,255,255,.07) 1px, transparent 1.2px); background-size: 6px 6px; }
/* Vague du site : le haut de la barre ondule comme le bas des bannières, avec le trait rouge du soulignement */
.k3mb-s-vague::before { top: -15px; height: 16px; background: var(--k3mb-bg, #1C1C1E);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 40' preserveAspectRatio='none'%3E%3Cpath d='M0,22 C260,0 520,40 760,18 C1000,-2 1220,4 1440,26 L1440,40 L0,40 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 40' preserveAspectRatio='none'%3E%3Cpath d='M0,22 C260,0 520,40 760,18 C1000,-2 1220,4 1440,26 L1440,40 L0,40 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.k3mb-s-vague::after { content: ""; position: absolute; left: 0; right: 0; top: -15px; height: 16px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 40' preserveAspectRatio='none'%3E%3Cpath d='M0,22 C260,0 520,40 760,18 C1000,-2 1220,4 1440,26' fill='none' stroke='%23C62828' stroke-width='5' vector-effect='non-scaling-stroke' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.k3mb-s-damier::before { background-color: #fff; background-image: conic-gradient(#141416 25%, transparent 0 50%, #141416 0 75%, transparent 0); background-size: 8px 8px; }
.k3mb-s-ligne::before { top: -3px; height: 3px; background: var(--k3mb-acc, #C62828); }
.k3mb-s-aucune::before { display: none; }
.k3mb-in { display: flex; align-items: stretch; justify-content: space-around; height: var(--k3mb-h); max-width: 640px; margin: 0 auto; padding: 0 max(6px, env(safe-area-inset-right, 0px)) 0 max(6px, env(safe-area-inset-left, 0px)); }
.k3mb a { color: inherit !important; text-decoration: none !important; -webkit-tap-highlight-color: transparent; }
.k3mb-i, .k3mb-c { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.k3mb-ic { position: relative; display: block; width: 26px; height: 26px; }
.k3mb-ic svg { width: 26px; height: 26px; display: block; }
.k3mb-l { font-size: 11.5px; font-weight: 700; line-height: 1; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; color: #E6E3DE; }
.k3mb-i.on, .k3mb-i.on .k3mb-l { color: var(--k3mb-acc, #C62828) !important; }
.k3mb-i:active .k3mb-ic { transform: scale(.9); }
.k3mb-count { position: absolute; top: -8px; right: -12px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; background: var(--k3mb-acc, #C62828); color: #fff; border: 2px solid var(--k3mb-bg, #1C1C1E); font: 800 11px/16px Barlow, system-ui, sans-serif; text-align: center; box-sizing: border-box; }
.k3mb-count[hidden] { display: none; }
.k3mb-count.bump { animation: k3mb-bump .5s ease; }
@keyframes k3mb-bump { 30% { transform: scale(1.35); } }
/* Bouton central surélevé */
.k3mb-c { justify-content: flex-end; padding-bottom: 9px; position: relative; z-index: 2; }
.k3mb-cb { margin-top: -30px; width: 62px; height: 62px; border-radius: 50%; background: var(--k3mb-acc, #C62828); color: #fff; display: flex; align-items: center; justify-content: center; border: 5px solid var(--k3mb-bg, #1C1C1E); box-shadow: 0 6px 16px rgba(0,0,0,.3); transition: transform .15s ease; box-sizing: border-box; }
.k3mb-cb svg { width: 26px; height: 26px; }
.k3mb-c:active .k3mb-cb { transform: scale(.94); }
.k3mb-c .k3mb-l { color: #fff; }

/* Bulle « Une question ? » */
.k3mb-q { position: fixed; right: max(14px, env(safe-area-inset-right, 0px)); bottom: calc(64px + 22px + env(safe-area-inset-bottom, 0px)); z-index: 9991; display: inline-flex; align-items: center; gap: 10px; height: 54px; padding: 0 22px 0 18px !important; margin: 0 !important; border: 0 !important; border-radius: 999px !important; background: var(--k3mb-q, #C62828) !important; color: #fff !important; font: 700 16px/1 Barlow, system-ui, sans-serif !important; text-transform: none !important; letter-spacing: 0 !important; box-shadow: 0 10px 26px rgba(0,0,0,.25) !important; cursor: pointer; min-height: 0 !important; transition: padding .25s ease, width .25s ease; overflow: hidden; white-space: nowrap; }
.k3mb-q svg { width: 22px; height: 22px; flex: none; }
.k3mb-q.mini { padding: 0 16px !important; gap: 0; }
.k3mb-q.mini span { max-width: 0; opacity: 0; }
.k3mb-q span { max-width: 200px; transition: max-width .25s ease, opacity .2s ease; }
.k3mb-q:focus-visible, .k3mb a:focus-visible, .k3mb-opt:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.k3mb-sheet { position: fixed; inset: 0; z-index: 9995; background: rgba(10,10,12,.45); display: flex; align-items: flex-end; }
.k3mb-sheet[hidden] { display: none; }
.k3mb-sheet-in { width: 100%; background: #fff; color: #1C1C1E; border-radius: 22px 22px 0 0; padding: 18px max(16px, env(safe-area-inset-right, 0px)) calc(18px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); font-family: Barlow, system-ui, sans-serif; animation: k3mb-up .25s ease; box-sizing: border-box; }
@keyframes k3mb-up { from { transform: translateY(40px); opacity: 0; } }
.k3mb-sheet-h { display: flex; align-items: center; justify-content: space-between; }
.k3mb-sheet-h b { font: 800 22px/1 "Barlow Condensed", Barlow, sans-serif; text-transform: uppercase; }
.k3mb-x { width: 36px; height: 36px; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: #F1EDE8 !important; color: #1C1C1E !important; font-size: 15px !important; cursor: pointer; }
.k3mb-sheet-in p { margin: 6px 0 12px; color: #6B6863; font-size: 14px; }
.k3mb-opt { display: flex; align-items: center; gap: 14px; padding: 13px 14px; margin-bottom: 8px; border-radius: 16px; background: #F6F4F1; color: #1C1C1E !important; text-decoration: none !important; }
.k3mb-opt svg { width: 26px; height: 26px; flex: none; color: var(--k3mb-q, #C62828); }
.k3mb-opt span { display: flex; flex-direction: column; gap: 2px; }
.k3mb-opt b { font-size: 16px; }
.k3mb-opt small { font-size: 13px; color: #6B6863; }

/* Éléments du thème qui flottent en bas : on les remonte au-dessus de la barre */
body.k3mb-on .back-to-top { bottom: calc(150px + env(safe-area-inset-bottom, 0px)) !important; }
body.k3mb-on .sticky-add-to-cart--active, body.k3mb-on .sticky-add-to-cart-wrapper .sticky-add-to-cart.sticky-add-to-cart--active { bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important; }
body.k3mb-lock { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .k3mb-sheet-in, .k3mb-count.bump { animation: none; } .k3mb-q, .k3mb-q span { transition: none; } }
