/**
 * SBDistribution B2B — thème enfant de lnwks (base Hummingbird).
 * DA SBDistribution : noir #000, blanc #fff, accent jaune #FFC42D (texte noir dessus) ; les gris sont des transparences de noir et de blanc ;
 * Roboto (chargée par Google Fonts, comme la landing du module lnwksb2b).
 *
 * theme.css de lnwks est écrit en cascade layers (@layer) : toute règle de ce fichier, non « layered », l'emporte
 * quelle que soit sa spécificité.
 */

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

/* ---------- Jetons de marque ---------- */
:root {
  --sb-brand: #FFC42D;
  --sb-brand-rgb: 255, 196, 45;
  --sb-on-brand: #000;
  --sb-black: #000;
  --sb-border: rgba(0, 0, 0, .15);
  --sb-bg-light: rgba(0, 0, 0, .03);
  --sb-font: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --sb-radius: 0;
}

:root,
[data-bs-theme=light],
[data-bs-theme=dark] {
  --bs-primary: var(--sb-black);
  --bs-primary-rgb: 0, 0, 0;
  --bs-body-font-family: var(--sb-font);
  --bs-font-sans-serif: var(--sb-font);
  --bs-border-radius: var(--sb-radius);
  --bs-border-radius-sm: var(--sb-radius);
  --bs-border-radius-lg: var(--sb-radius);
  --bs-border-color: var(--sb-border);
  --bs-link-color: #000;
  --bs-link-color-rgb: 0, 0, 0;
  --bs-link-hover-color: #000;
  --bs-link-hover-color-rgb: 0, 0, 0;
  --bs-focus-ring-color: rgba(var(--sb-brand-rgb), .5);
}

[data-bs-theme=light] {
  --bs-body-bg: #fff;
  --bs-body-color: #000;
  --bs-secondary-bg: var(--sb-bg-light);
  --bs-tertiary-bg: var(--sb-bg-light);
}

[data-bs-theme=dark] {
  --bs-body-bg: #000;
  --bs-body-color: #fff;
}

body {
  font-family: var(--sb-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection { background: var(--sb-brand); color: var(--sb-on-brand); }

/* ---------- Jetons --rg-* (utilisés par le CSS du header et des templates repris de matbuilder) ---------- */
:root {
  --rg-brand: var(--sb-brand);
  --rg-brand-rgb: var(--sb-brand-rgb);
  --rg-on-brand: #000;
  --rg-font: var(--sb-font);
  --rg-text-font: var(--sb-font);
  --rg-caps: var(--sb-font);
  --rg-font-ui: var(--sb-font);
  --rg-radius: 0;
  --rg-brand-hover: var(--sb-brand);
}
:root,
[data-bs-theme=dark] {
  --rg-bg: #000;
  --rg-bg-rgb: 0, 0, 0;
  --rg-surface: #000;
  --rg-surface-2: rgba(255, 255, 255, .1);
  --rg-text: #fff;
  --rg-text-rgb: 255, 255, 255;
  --rg-text-2: rgba(255, 255, 255, .7);
  --rg-text-3: rgba(255, 255, 255, .5);
  --rg-border: rgba(255, 255, 255, .12);
  --rg-border-strong: rgba(255, 255, 255, .3);
  --rg-brand-2: var(--sb-brand);
  --rg-surface-3: rgba(255, 255, 255, .16);
  --rg-overlay: rgba(255, 255, 255, .06);
  --rg-stripe: rgba(255, 255, 255, .03);
}
[data-bs-theme=light] {
  --rg-bg: #fff;
  --rg-bg-rgb: 255, 255, 255;
  --rg-surface: #fff;
  --rg-surface-2: rgba(0, 0, 0, .06);
  --rg-text: #000;
  --rg-text-rgb: 0, 0, 0;
  --rg-text-2: rgba(0, 0, 0, .7);
  --rg-text-3: rgba(0, 0, 0, .55);
  --rg-border: rgba(0, 0, 0, .12);
  --rg-border-strong: rgba(0, 0, 0, .3);
  --rg-brand-2: #000;
  --rg-surface-3: rgba(0, 0, 0, .1);
  --rg-overlay: rgba(0, 0, 0, .05);
  --rg-stripe: rgba(0, 0, 0, .03);
}

/* ---------- Titres ---------- */
h1, h2, h3, .h1, .h2, .h3 { font-weight: 700; letter-spacing: -.005em; }
h6, .h6 { text-transform: uppercase; font-size: .875rem; letter-spacing: .125rem; font-weight: 500; }

/* ---------- Boutons : noir, jaune au survol ---------- */
.btn { font-weight: 700; letter-spacing: .0625rem; border-radius: var(--sb-radius); }

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #000;
  --bs-btn-border-color: #000;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: var(--sb-brand);
  --bs-btn-hover-border-color: var(--sb-brand);
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: var(--sb-brand);
  --bs-btn-active-border-color: var(--sb-brand);
  --bs-btn-focus-shadow-rgb: var(--sb-brand-rgb);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #000;
  --bs-btn-disabled-border-color: #000;
}

.btn-outline-dark, .btn-outline-primary, .btn-outline-secondary {
  --bs-btn-color: #000;
  --bs-btn-border-color: #000;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: var(--sb-brand);
  --bs-btn-hover-border-color: var(--sb-brand);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #000;
  --bs-btn-active-border-color: #000;
  --bs-btn-disabled-color: rgba(0, 0, 0, .4);
  --bs-btn-disabled-border-color: rgba(0, 0, 0, .2);
}
.btn-secondary {
  --bs-btn-color: #000;
  --bs-btn-bg: rgba(0, 0, 0, .06);
  --bs-btn-border-color: rgba(0, 0, 0, .06);
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: var(--sb-brand);
  --bs-btn-hover-border-color: var(--sb-brand);
}
.btn-check:checked + .btn, .btn-check:checked + .btn:hover { color: #fff; background-color: #000; border-color: #000; }

/* ---------- Formulaires ---------- */
.form-control, .form-select { border-radius: var(--sb-radius); border-color: var(--sb-border); }
.form-control:focus, .form-select:focus { border-color: #000; box-shadow: 0 0 0 .2rem rgba(var(--sb-brand-rgb), .5); }
.form-check-input:checked { background-color: #000; border-color: #000; }
.form-switch .form-check-input:checked { background-color: #000; }

/* Indicateur de force du mot de passe : l'exigence minimale n'est pas affichée */
.password-requirements-score { display: none !important; }

/* ---------- Footer : noir (le header a sa propre section plus bas) ---------- */
.footer { background: #000; color: #fff; }
.footer a { color: #fff; text-decoration: none; }
.footer a:hover { color: var(--sb-brand); }

.footer .copyright { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; padding-block: 1.5rem; border-top: 1px solid rgba(255, 255, 255, .15); font-size: .8125rem; }
.footer .copyright p { margin: 0; }
.rg-footer-legal { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; margin: 0; padding: 0; list-style: none; }
.rg-footer-legal a { opacity: .75; }
.rg-footer-legal a:hover { opacity: 1; }

/* ---------- Pages à une colonne centrée (connexion de secours, mot de passe, contact, suivi invité) ---------- */
.rg-narrow { max-width: 640px; margin-inline: auto; }
.rg-page-intro { max-width: 640px; margin: 0 auto 1.5rem; color: rgba(0, 0, 0, .7); }

/* ---------- Compte client ---------- */
.rg-account-empty { padding: 2rem; border: 1px solid var(--sb-border); background: #fff; text-align: center; }
.rg-account-empty__text { margin-bottom: 1rem; }


/* ---------- Tunnel de commande : étape en cours en jaune ---------- */
.checkout-step.-current .step-title, .checkout__step--current .step-title { background: var(--sb-brand); color: #000; }

/* ---------- Pages d'erreur autonomes (maintenance, pays restreint) ---------- */
body.rg-error { display: block; min-height: 100dvh; background: #000; color: #fff; font-family: var(--sb-font); }
.rg-error .layout-error { width: auto; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: none; text-align: left; }
.rg-maintenance { position: relative; }
.rg-maintenance__logo { position: absolute; top: max(1.5rem, 4svh); left: max(1rem, 5vw); max-height: 2.25rem; width: auto; height: auto; margin: 0; }
.rg-maintenance__fallback { min-height: 100dvh; display: grid; align-content: center; justify-items: center; gap: 1rem; padding: 6rem max(1rem, 5vw); text-align: center; }
.rg-maintenance__fallback .error__title { margin: 0; font-size: clamp(2rem, 5vw, 3.5rem); line-height: 1; }
.rg-maintenance__fallback .error__text { max-width: 36rem; color: rgba(255, 255, 255, .7); }

/* ---------- Composants Bootstrap (les valeurs bleues sont compilées dans theme.css) ---------- */
.nav-pills{--bs-nav-pills-link-active-bg:var(--rg-brand)}
.nav-tabs{--bs-nav-tabs-link-active-color:var(--rg-text);--bs-nav-tabs-link-active-bg:transparent;--bs-nav-tabs-link-active-border-color:var(--rg-border) var(--rg-border) var(--rg-bg)}
.nav-tabs .nav-link{font-size:.75rem;color:var(--rg-text-2)}
.dropdown-menu{
  --bs-dropdown-bg:var(--rg-surface);--bs-dropdown-border-color:var(--rg-border);
  --bs-dropdown-link-color:var(--rg-text);--bs-dropdown-link-hover-color:var(--rg-text);--bs-dropdown-link-hover-bg:var(--rg-surface-2);
  --bs-dropdown-link-active-color:var(--rg-on-brand);--bs-dropdown-link-active-bg:var(--rg-brand)
}
.list-group{--bs-list-group-bg:transparent;--bs-list-group-active-bg:var(--rg-brand);--bs-list-group-active-border-color:var(--rg-brand)}
.pagination{
  --bs-pagination-color:var(--rg-text-2);--bs-pagination-hover-color:var(--rg-text);--bs-pagination-hover-bg:var(--rg-surface-2);
  --bs-pagination-focus-color:var(--rg-text);--bs-pagination-focus-box-shadow:0 0 0 .2rem rgba(var(--rg-brand-rgb),.35);
  --bs-pagination-active-bg:var(--rg-brand);--bs-pagination-active-border-color:var(--rg-brand);
  font-family:var(--rg-caps);font-size:.8125rem
}
.accordion{
  --bs-accordion-bg:transparent;--bs-accordion-border-color:var(--rg-border);
  --bs-accordion-active-color:var(--rg-text);--bs-accordion-active-bg:var(--rg-surface);
  --bs-accordion-btn-focus-box-shadow:0 0 0 .2rem rgba(var(--rg-brand-rgb),.3)
}
.progress,.progress-stacked{--bs-progress-bg:var(--rg-surface-2);--bs-progress-bar-bg:var(--rg-brand-2)}
.card{--bs-card-bg:var(--rg-surface);--bs-card-border-color:var(--rg-border);--bs-card-cap-bg:transparent}
.modal{--bs-modal-bg:var(--rg-surface);--bs-modal-border-color:var(--rg-border);--bs-modal-header-border-color:var(--rg-border);--bs-modal-footer-border-color:var(--rg-border)}
.offcanvas,.offcanvas-lg,.offcanvas-md,.offcanvas-sm{--bs-offcanvas-bg:var(--rg-bg);--bs-offcanvas-border-color:var(--rg-border)}
.toast{--bs-toast-bg:var(--rg-surface);--bs-toast-border-color:var(--rg-border)}
.alert{--bs-alert-border-radius:var(--rg-radius)}
.table{--bs-table-bg:transparent;--bs-table-border-color:var(--rg-border);--bs-table-striped-bg:var(--rg-stripe)}
.carousel-indicators [data-bs-target]{background-color:var(--rg-text)}
.carousel-control-next-icon,.carousel-control-prev-icon{background-color:rgba(11,11,11,.7);color:var(--rg-text)}
.noui-tooltip{background:var(--rg-surface);border-color:var(--rg-border);color:var(--rg-text)}
.noUi-connect{background:var(--rg-brand-2)}
.material-icons{color:inherit}

/* ---------- Page produit : images à gauche (colonne unique, fixe au défilement), toutes les informations à droite ---------- */
.product__container { grid-template-columns: minmax(0, 1fr); gap: 2rem; align-items: start; }
@media (min-width: 992px) {
  .product__container { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; }

  /* Desktop : pas de carrousel, les images sont les unes sous les autres, en une seule colonne ; les informations
     restent en vue (colonne de droite fixe) pendant qu'on fait défiler les images. Le carrousel reste sur mobile. */
  .product__carousel .carousel-inner { display: grid; gap: 1rem; }
  .product__carousel .carousel-item { display: block; position: static; float: none; width: 100%; margin: 0; transform: none; transition: none; }
  .product__carousel .carousel-control-prev,
  .product__carousel .carousel-control-next,
  .product__thumbnails,
  .product__zoom { display: none; }
  .product__right { position: sticky; top: calc(80px + 1.5rem); align-self: start; max-height: calc(100vh - 80px - 3rem); overflow-y: auto; }
}
.rg-product-eyebrow { margin: 0 0 .5rem; font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(0, 0, 0, .55); }

/* Blocs repliables (+ / −) : description, détails, téléchargements, onglets des modules */
.product__accordion {
  --bs-accordion-bg: transparent;
  --bs-accordion-border-color: var(--rg-border);
  --bs-accordion-border-radius: 0;
  --bs-accordion-inner-border-radius: 0;
  --bs-accordion-btn-padding-x: 0;
  --bs-accordion-btn-padding-y: 1.125rem;
  --bs-accordion-body-padding-x: 0;
  --bs-accordion-body-padding-y: .25rem;
  --bs-accordion-btn-bg: transparent;
  --bs-accordion-btn-color: #000;
  --bs-accordion-active-bg: transparent;
  --bs-accordion-active-color: #000;
  --bs-accordion-btn-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.5'%3E%3Cpath d='M8 2v12M2 8h12'/%3E%3C/svg%3E");
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.5'%3E%3Cpath d='M2 8h12'/%3E%3C/svg%3E");
  --bs-accordion-btn-icon-width: 1rem;
  --bs-accordion-btn-icon-transform: none;
  --bs-accordion-btn-focus-box-shadow: none;
  margin-top: 2rem;
  border-top: 1px solid var(--rg-border);
}
.product__accordion .accordion-item { border-width: 0 0 1px; }
.product__accordion .accordion-button { font-size: .875rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; box-shadow: none; }
.product__accordion .accordion-button:not(.collapsed) { background: transparent; box-shadow: none; }
.product__accordion .accordion-button:hover { color: #000; }

/* ---------- Header : colonne fixe à gauche dès 1200 px (logo, burger, compte, panier), barre horizontale en dessous.
   Structure reprise de Mediamart/sixtenb2b ; logo, couleurs (jaune #FFC42D) et police (Roboto) de SBDistribution ---------- */
/* The translucent background is on ::before: a backdrop-filter on .header itself would make it the containing
   block of the fixed mobile menu (offcanvas), which then shows only inside the header height */
.header{background:transparent}
/* Only the header-bottom row sticks: the header stays sticky but its top is offset by the top bar height (30px,
   shown from md), so the top bar scrolls away with the page */
@media (max-width:767.98px){.header-top{display:none}}
@media (min-width:768px){.header{top:-34px}}
.header::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(var(--rg-bg-rgb),.96);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:opacity .3s}
/* Every header text follows the header scheme (dark: white on black) */
.header,.header a,.header .header-block__action-btn,.header .header-block__title,.header .menu-toggle,.header .btn-close{color:var(--rg-text)}
/* Top bar: opaque, darker than the header row */
.header-top{position:relative;background:var(--rg-bg);border-bottom:1px solid var(--rg-border);font-size:.75rem;padding:0;max-height:34px}
.header-top>.container-md,.header-top .row,.header-top__left,.header-top__right{height:33px}
.header-top .row>*{display:flex;align-items:center}
.header-top .header-block__action-btn,.header-top .dropdown-toggle,.header-top .form-select{padding-block:0;line-height:1}
.header-top .header-block__icon{font-size:1rem}
.header-top .header-block__badge{height:1.125rem;min-width:1.125rem;font-size:.6875rem}
.header-top a,.header-top .dropdown-toggle{color:var(--rg-text);font-size:.75rem;letter-spacing:.1em}
.header-top a:hover{color:var(--rg-brand-2)}
/* Top bar links (EN, EUR, Sign in): muted, light on hover */
.header-top a.header-block__action-btn,.header-top .dropdown-toggle{color:var(--rg-text-2);transition:color .2s}
.header-top .header-block__action-btn:hover,.header-top .header-block__action-btn:focus-visible,.header-top .header-block__action-btn[aria-expanded=true]{color:var(--rg-text)}
/* Sign in: the block and its link are flex items centered in the 29px bar */
.header-top__right>*,.header-top .header-block,.header-top .header-block__action-btn{display:flex;align-items:center}
.header-top .header-block__action-btn{gap:.375rem;height:100%}
.header-top .header-block__title{line-height:1;color:inherit}
/* No person icon once the label shows ("Sign in", or the customer's initials then name), from 768px */
@media (min-width:768px){.header-top .header-block__action-btn .header-block__icon{display:none}}
/* Header-bottom row: 64px on mobile; from 768px 80px (logo 44px high), 60px once stuck at the top (logo 36px).
   The header shrinks inside the page flow: its margin-bottom grows by the same 20px at the same pace, so the content
   below never jumps. --rg-header-h = full header height (top bar 30px + row), used to overlap the hero */
:root{--rg-header-h:64px;--rg-header-shrink:0px}
@media (min-width:768px){:root{--rg-header-h:114px}.rg-header-stuck{--rg-header-shrink:20px}}
.header{margin-bottom:var(--rg-header-shrink);transition:margin-bottom .3s ease}
.header-bottom{height:64px;padding:0;border-bottom:1px solid var(--rg-border);transition:height .3s ease}
@media (min-width:768px){.header-bottom{height:calc(80px - var(--rg-header-shrink))}}
.header-bottom__container,.header-bottom__row{height:100%}
.header-bottom__logo picture{display:block}
.header-bottom .logo{display:block;width:auto;height:2.75rem;max-height:2.75rem;max-width:none;transition:height .3s ease,max-height .3s ease}
@media (min-width:768px){.rg-header-stuck .header-bottom .logo{height:2.25rem;max-height:2.25rem}}
.header-block__action-btn{color:var(--rg-text)}
.header-block__action-btn:hover{color:var(--rg-brand-2)}
.header-block__icon{color:inherit}
.header-block__badge{background:var(--rg-brand);color:#000;font-family:var(--rg-caps);font-weight:600}
/* Main menu (desktop and mobile): Roboto caps */
.ps-mainmenu__tree-link,.ps-mainmenu--mobile .menu__link{font-family:var(--rg-caps);font-size:.9375rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;text-decoration:none}
.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link,.ps-mainmenu--mobile .menu__link{color:var(--rg-text)}
/* Hover: same color, underlined */
.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link:hover,.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link:active,.ps-mainmenu--mobile .menu__link:hover{color:var(--rg-text);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.5em}
.ps-mainmenu--mobile .menu__link{font-size:1rem;padding:.875rem 1.5rem}
/* No focus frame on click (Hummingbird outlines :focus in the link color); keyboard focus keeps a discreet
   underline-style ring for accessibility */
.header a:focus,.header button:focus,.ps-mainmenu--mobile a:focus,.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link:focus,.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-dropdown-toggle:focus{outline:none;box-shadow:none}
.header a:focus-visible,.header button:focus-visible,.ps-mainmenu--mobile a:focus-visible,.ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__tree>li .ps-mainmenu__tree-link:focus-visible{outline:1px solid rgba(var(--rg-text-rgb),.5);outline-offset:4px;border-radius:2px}
/* Language and currency switchers (top bar, in place of "Contact us"): compact dropdowns, current ISO code + chevron */
.header-top__left{gap:1.5rem}
.header-top,.header-top .row,.header-top__left{overflow:visible}
.rg-switch__toggle{display:inline-flex;align-items:center;gap:.125rem;padding:0;border:0;background:none;color:var(--rg-text-2);font-family:var(--rg-caps);font-size:.75rem;font-weight:600;letter-spacing:.1em;line-height:1;cursor:pointer;transition:color .2s}
.rg-switch__toggle:hover,.rg-switch__toggle[aria-expanded=true]{color:var(--rg-text)}
.rg-switch__toggle:hover .rg-switch__current,.rg-switch__toggle[aria-expanded=true] .rg-switch__current{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.4em}
.rg-switch__chevron{font-size:1rem;transition:transform .2s}
.rg-switch__toggle[aria-expanded=true] .rg-switch__chevron{transform:rotate(180deg)}
.rg-switch__toggle:focus{outline:none}
.rg-switch__toggle:focus-visible{outline:1px solid rgba(var(--rg-text-rgb),.5);outline-offset:4px;border-radius:2px}
.rg-switch__menu{--bs-dropdown-min-width:11rem;--bs-dropdown-padding-y:.375rem;--bs-dropdown-item-padding-y:.5rem;--bs-dropdown-item-padding-x:1rem;--bs-dropdown-font-size:.875rem;--bs-dropdown-border-radius:var(--rg-radius);margin-top:.5rem!important;box-shadow:0 12px 32px rgba(0,0,0,.12)}
/* ".header-top a" (caps, letter-spaced) must not reach the menu items */
.rg-switch__item,.header-top a.rg-switch__item{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;font-family:var(--rg-text-font);font-size:.875rem;letter-spacing:0;text-transform:none;color:var(--rg-text);text-decoration:none}
.header-top a.rg-switch__item:hover{color:var(--rg-text)}
.rg-switch__code{font-family:var(--rg-caps);font-size:.75rem;letter-spacing:.06em;color:var(--rg-text-3)}
.rg-switch__item.is-current{color:var(--rg-text);background:transparent;cursor:default}
.rg-switch__item.is-current .rg-switch__name{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.35em}
.rg-switch__item.is-current .rg-switch__code{color:var(--rg-brand-2)}
/* Every top bar dropdown (language, currency, account): compact, caps like the bar, one type size */
.header-top .dropdown-menu{--bs-dropdown-min-width:9rem;--bs-dropdown-padding-y:.25rem;--bs-dropdown-item-padding-y:.375rem;--bs-dropdown-item-padding-x:.875rem;--bs-dropdown-font-size:.75rem}
.header-top .dropdown-menu .dropdown-item{gap:1rem;font-family:var(--rg-caps);font-size:.75rem;font-weight:600;letter-spacing:.06em;line-height:1.3;text-transform:uppercase}
.header-top .dropdown-menu .rg-switch__code{font-size:inherit;letter-spacing:inherit}
.header-top .dropdown-menu .dropdown-item .material-icons{font-size:1rem;vertical-align:-.25em}
.header-top .dropdown-menu .dropdown-divider{margin-block:.25rem}
/* In the mobile menu (blocks moved into #_mobile_ps_languageselector / #_mobile_ps_currencyselector): plain lists */
.ps-mainmenu__selects{flex-direction:column;gap:1.5rem!important;width:100%;padding:1rem 1.5rem}
.ps-mainmenu__selects .rg-switch__toggle{display:none}
.ps-mainmenu__selects .rg-switch__menu{position:static!important;display:block;transform:none!important;margin:0!important;padding:0;min-width:0;border:0;background:transparent;box-shadow:none}
.ps-mainmenu__selects .rg-switch__item{padding-inline:0}

/* Logo on the left | account, cart and burger on the right (below 1200px; from 1200px see the left column below) */
.header-bottom__row{position:relative;flex-wrap:nowrap}
.header-bottom__logo{order:-1;margin:0 auto 0 0!important;padding:0;width:auto}
.header-bottom__row>.ps-mainmenu--desktop{order:10}
.header-bottom__cart{margin-left:0}
.header-bottom__cart .header-block__title{font-family:var(--rg-caps);font-size:.875rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}


/* ---------- Header as a narrow left column (from 1200px) ---------- */
/* After the Ohio demo 29: the header is a fixed 100px column on the left, full height: logo turned a quarter
   anticlockwise at the top, burger in the middle, account and cart at the bottom. The burger opens the offcanvas beside the
   column: accordion menu, then account and contact (modules/ps_mainmenu/ps_mainmenu.tpl).
   The header markup is the mobile/tablet one (templates/_partials/header.tpl): its header-bottom wrappers become
   display:contents so that every block is a flex item of the column; the top bar is hidden (its links are in the
   burger). The page beside it (wrapper, footer) is pushed right by the column width. The top bar and shrinking row
   mechanics above (top:-34px, --rg-header-shrink, header over the hero) do not apply */
:root{--rg-side-w:100px}
/* Blocks reached by a scroll (hero scroll cue) stop under the stuck header bar: 64px on mobile, 60px from 768px, none
   beside the left column */
.lnwks-block{scroll-margin-top:64px}
@media (min-width:768px){.lnwks-block{scroll-margin-top:60px}}
@media (min-width:1200px){.lnwks-block{scroll-margin-top:0}}
@media (min-width:1200px){
  :root,.rg-header-stuck{--rg-header-h:0px;--rg-header-shrink:0px}
  /* Above the offcanvas backdrop (1040): the column stays visible and its burger closes the menu; the offcanvases are
     inside the header, so they share its stacking level */
  .header{position:fixed;top:0;bottom:0;left:0;z-index:1050;width:var(--rg-side-w);max-width:none;margin:0!important;display:flex;flex-direction:column;align-items:center;padding:2.5rem 0;overflow-y:auto;overscroll-behavior:contain;background:var(--rg-bg);border-right:1px solid var(--rg-border)}
  .header::before{display:none}
  .header~.wrapper,.header~.footer{margin-left:var(--rg-side-w)}
  /* Top bar: only its sign-in block is kept, as an icon above the cart (Contact us is in the burger) */
  .header .header-top,.header .header-top>.container-md,.header .header-top .row,.header .header-top .row>.header-top__right{display:contents}
  .header .header-top .row>.header-top__left{display:none}
  .header-bottom,.header-bottom__container,.header-bottom__row{display:contents!important}
  /* Logo: the shop logo (templates/_partials/header.tpl), 4rem wide */
  .header-bottom__logo{order:1;position:static;transform:none;justify-content:center;width:auto;padding:0;margin:0!important}
  /* Ratio set here: some browsers (Safari) ignore the width / height of the <source> and keep the horizontal ratio of
     the <img> (1000 x 519), which squeezed the vertical logo */
  /* "S" logo (sixten-wh.svg, 1169 x 1210): ratio set here, Safari keeps the <img> ratio (the horizontal logo) otherwise */
  .header-bottom .logo,.rg-header-stuck .header-bottom .logo{width:3.5rem;height:auto;max-height:none;object-fit:contain}
  /* Burger, in the middle of the column height */
  /* Burger in the middle of the column height, its top rounded down to a whole pixel (an odd window height would put
     it, and its lines, on half a pixel: blurred on standard screens); no translateY(-50%) for the same reason */
  .header-bottom__row>.ps-mainmenu--desktop{position:absolute;top:calc(50% - 1.75rem);top:round(down,50% - 1.75rem,1px);left:0;right:0;height:3.5rem;display:flex;justify-content:center;width:auto;max-width:none;padding:0}
  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__mobile-toggle{display:flex}
  /* On a disc of the text colour at 15% (#262626 on the black header), lighter on hover (28%), sinks on press, sends a ripple on click; the two lines cross while the menu is
     open (classes set by assets/js/custom.js). No scale at rest or on hover: the 2px lines stay on whole pixels */
  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__mobile-toggle .menu-toggle{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;padding:0;border:0;border-radius:50%;background:rgba(var(--rg-text-rgb),.15);color:var(--rg-text);transition:transform .35s cubic-bezier(.34,1.56,.64,1),background-color .2s}
  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__mobile-toggle .menu-toggle:hover{background:rgba(var(--rg-text-rgb),.22)}
  .ps-mainmenu:is(.ps-mainmenu--desktop) .ps-mainmenu__mobile-toggle .menu-toggle:active{transform:scale(.92);transition-duration:.1s}
  .menu-toggle::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:50%;background:rgba(var(--rg-text-rgb),.15);opacity:0}
  .menu-toggle.rg-ripple::before{animation:rg-burger-ripple .6s cubic-bezier(.2,.7,.3,1)}
  .ps-mainmenu__mobile-toggle .menu-toggle .material-icons{display:none}
  /* Two 2px lines 6px apart, in px so that both land on whole pixels; they meet at 4px and turn into a cross */
  .rg-burger{position:relative;display:block;width:22px;height:10px}
  .rg-burger>span{position:absolute;top:0;left:0;width:100%;height:2px;background:currentColor;transition:top .3s ease,transform .3s ease}
  .rg-burger>span:last-child{top:8px}
  .menu-toggle.is-open .rg-burger>span{top:4px}
  .menu-toggle.is-open .rg-burger>span:first-child{transform:rotate(45deg)}
  .menu-toggle.is-open .rg-burger>span:last-child{transform:rotate(-45deg)}
  /* Cart, at the bottom: the counterpart of the burger. Same 56px disc, in black (the main action) where the burger's
     is light grey; a line bag drawn with the weight of the burger lines; same press. The count sits in the pink badge
     on the disc edge, hidden when the cart is empty, with a short pop when it changes (assets/js/custom.js). The
     column has the same 2.5rem above the logo and below the cart */
  /* Account, just above the cart (modules/ps_customersignin/ps_customersignin.tpl): a line person icon, no background,
     in a 56px box lined up with the discs */
  #_desktop_ps_customersignin{order:3;margin-top:auto}
  #_desktop_ps_customersignin .header-block__action-btn{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;padding:0;border-radius:50%;background:none;color:var(--rg-text)}
  #_desktop_ps_customersignin .header-block__action-btn:hover{background:none;color:var(--rg-text)}
  #_desktop_ps_customersignin .material-icons{display:none}
  .header-bottom__cart{order:4;width:auto;margin:.5rem 0 0;padding:0}
  .header .header-bottom__cart .header-block__action-btn{position:relative;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;padding:0!important;border-radius:50%;background:var(--rg-brand);color:#000;transition:transform .35s cubic-bezier(.34,1.56,.64,1),background-color .2s}
  .header .header-bottom__cart .header-block__action-btn:hover{background:#fff;color:#000}
  /* The count on the red disc: white badge */
  .header-bottom__cart .header-block__badge{background:#fff;color:#000}
  .header .header-bottom__cart .header-block__action-btn:active{transform:scale(.92);transition-duration:.1s}
  .header-bottom__cart .material-icons{display:none}
  #_desktop_ps_currencyselector{order:5;margin-top:1rem;display:flex;justify-content:center}
  .rg-sidenav__langs{margin:1.5rem 3rem 0}
  .rg-cart-icon{display:block;stroke-linejoin:miter}
  .header-bottom__cart .header-block__badge{position:absolute;top:-.125rem;right:-.125rem;height:1.375rem;min-width:1.375rem;padding:0 .3125rem;border:2px solid var(--rg-bg);font-size:.6875rem;line-height:1}
  .header-bottom__cart .inactive .header-block__badge{display:none}
  .header-bottom__cart .header-block__badge.rg-pop{animation:rg-badge-pop .45s cubic-bezier(.34,1.56,.64,1)}
  /* Burger offcanvas: opens beside the column (fades in and slides a little, so that it never passes over it) */
  .ps-mainmenu--mobile.offcanvas-start{left:var(--rg-side-w);width:26rem;border-right:1px solid var(--rg-border);opacity:0;transform:translateX(-1.5rem);transition:transform .3s ease,opacity .3s ease,visibility .3s}
  .ps-mainmenu--mobile.offcanvas-start.showing,.ps-mainmenu--mobile.offcanvas-start.show:not(.hiding){opacity:1;transform:none}
  /* Bootstrap puts the backdrop next to the offcanvas, inside the header: it starts after the column */
  .header .offcanvas-backdrop{left:var(--rg-side-w)}
  .ps-mainmenu--mobile .offcanvas-header{justify-content:flex-end;padding:1.25rem 1.25rem 0}
  .ps-mainmenu--mobile .rg-sidenav{margin-top:auto;padding:0 3rem}
  .ps-mainmenu--mobile .rg-sidenav__list .rg-sidenav__list{padding-left:1rem}
  .rg-sidenav__list--depth-1>.rg-sidenav__item>.rg-sidenav__row .rg-sidenav__link{padding:.5rem 0;font-size:1.75rem;letter-spacing:.04em}
  .rg-sidenav__links{margin:2.5rem 3rem auto;padding:1.5rem 0 0;border-top:1px solid var(--rg-border);list-style:none;display:grid;gap:.625rem}
  .rg-sidenav__links a{font-family:var(--rg-caps);font-size:.8125rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--rg-text-2)}
  .rg-sidenav__links a:hover{color:var(--rg-text)}
  .ps-mainmenu--mobile .ps-mainmenu__additionnals{flex-grow:0;padding:0}
  /* Sticky blocks (product details, cart summary): no header bar above them any more */
  :root{--rg-sticky-top:2rem}
}
/* Accordion menu: Roboto caps at the first level, Roboto below; + turns into × when open */
.rg-sidenav__list{margin:0;padding:0;list-style:none}
.rg-sidenav__row{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.rg-sidenav__link{display:block;padding:.375rem 0;font-family:var(--rg-caps);font-size:1.125rem;font-weight:600;letter-spacing:.06em;line-height:1.3;text-transform:uppercase;text-decoration:none;color:var(--rg-text)}
.rg-sidenav__link:hover,.rg-sidenav__link[aria-current=page]{color:var(--rg-text);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em}
.rg-sidenav__toggle{display:flex;flex:none;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0;border:0;background:none;color:var(--rg-text);cursor:pointer}
.rg-sidenav__toggle .material-icons{font-size:1.25rem;transition:transform .25s ease}
.rg-sidenav__toggle:not(.collapsed) .material-icons{transform:rotate(45deg)}
.rg-sidenav__list .rg-sidenav__list{padding:.125rem 0 .75rem .875rem}
.rg-sidenav__list .rg-sidenav__list .rg-sidenav__link{padding:.25rem 0;font-family:var(--rg-text-font);font-size:.9375rem;letter-spacing:0;text-transform:none;color:var(--rg-text-2)}
.rg-sidenav__list .rg-sidenav__list .rg-sidenav__link:hover,.rg-sidenav__list .rg-sidenav__list .rg-sidenav__link[aria-current=page]{color:var(--rg-text)}
@media (max-width:1199.98px){.rg-burger,.rg-cart-icon,.rg-account-icon{display:none}}
/* (shown again below 768px in the mobile header: see "mobile header") */
@keyframes rg-badge-pop{0%{transform:scale(.4)}100%{transform:scale(1)}}
@keyframes rg-burger-ripple{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.6)}}
@media (prefers-reduced-motion:reduce){.rg-sidenav__toggle .material-icons,.ps-mainmenu--mobile.offcanvas-start,.menu-toggle,.rg-burger>span{transition:none!important}.menu-toggle.rg-ripple::before,.header-bottom__cart .header-block__badge.rg-pop{animation:none}}

/* ---------- Header : sticky offset beside the left header column ---------- */
/* Hummingbird's theme.js sets --scroll-padding-top (inline, on <html>) to the header height + 16px; from 1200px the
   header is the full-height left column, so it became ~100vh: the account menu (max-height:calc(100vh - var(...)))
   collapsed to 0 and anchors scrolled too far. Nothing sits above the content there: a small offset is enough */
@media (min-width:1200px){html{--scroll-padding-top:1.5rem!important}}

/* ---------- Header : mobile header (below 768px), the icons of the left column ---------- */
/* Logo on the left, then burger, account, cart. Same drawings as the left column, on 40px discs: line person icon
   and burger lines on the same grey disc (crossed while the menu is open, custom.js), line bag on the red
   disc with the white count badge (hidden when the cart is empty) */
@media (max-width:767.98px){
  .header-bottom__row{align-items:center!important;column-gap:.25rem}
  .header-bottom__row>.header-bottom__logo{order:0}
  .header-bottom__row>.ps-mainmenu--desktop{order:1;padding:0}
  .header-bottom__row>#_mobile_ps_customersignin{order:2}
  .header-bottom__row>#_mobile_ps_shoppingcart{order:3}
  #_mobile_ps_customersignin .material-icons,#_mobile_ps_shoppingcart .material-icons,.ps-mainmenu__mobile-toggle .menu-toggle .material-icons{display:none}
  #_mobile_ps_customersignin .rg-account-icon,#_mobile_ps_shoppingcart .rg-cart-icon,.ps-mainmenu__mobile-toggle .rg-burger{display:block}
  #_mobile_ps_customersignin .header-block__action-btn,.ps-mainmenu__mobile-toggle .menu-toggle,#_mobile_ps_shoppingcart .header-block__action-btn{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;padding:0!important;border:0;border-radius:50%;color:var(--rg-text);transition:transform .35s cubic-bezier(.34,1.56,.64,1),background-color .2s}
  /* Account and burger discs: the text colour at 15% (#262626 on the black header), so that they show on the header.
     The account colour is a background-image: the signed-in button carries .bg-transparent, a layered !important
     background-color that beats any unlayered !important */
  #_mobile_ps_customersignin .header-block__action-btn{background-image:linear-gradient(rgba(var(--rg-text-rgb),.15),rgba(var(--rg-text-rgb),.15))!important}
  #_mobile_ps_customersignin .dropdown-toggle::after,#_mobile_ps_customersignin .header-block__title{display:none!important}
  .ps-mainmenu__mobile-toggle .menu-toggle,.ps-mainmenu__mobile-toggle .menu-toggle:hover{background:rgba(var(--rg-text-rgb),.15)}
  #_mobile_ps_shoppingcart .header-block__action-btn{background:var(--rg-brand);color:#000}
  #_mobile_ps_customersignin .header-block__action-btn:active,.ps-mainmenu__mobile-toggle .menu-toggle:active,#_mobile_ps_shoppingcart .header-block__action-btn:active{transform:scale(.92);transition-duration:.1s}
  .ps-mainmenu__mobile-toggle .menu-toggle::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:50%;background:rgba(var(--rg-text-rgb),.15);opacity:0}
  .ps-mainmenu__mobile-toggle .menu-toggle.rg-ripple::before{animation:rg-burger-ripple .6s cubic-bezier(.2,.7,.3,1)}
  .ps-mainmenu__mobile-toggle .rg-burger{position:relative;width:20px;height:10px}
  .ps-mainmenu__mobile-toggle .rg-burger>span{position:absolute;top:0;left:0;width:100%;height:2px;background:currentColor;transition:top .3s ease,transform .3s ease}
  .ps-mainmenu__mobile-toggle .rg-burger>span:last-child{top:8px}
  .ps-mainmenu__mobile-toggle .menu-toggle.is-open .rg-burger>span{top:4px}
  .ps-mainmenu__mobile-toggle .menu-toggle.is-open .rg-burger>span:first-child{transform:rotate(45deg)}
  .ps-mainmenu__mobile-toggle .menu-toggle.is-open .rg-burger>span:last-child{transform:rotate(-45deg)}
  #_mobile_ps_shoppingcart .rg-cart-icon{width:20px;height:20px}
  #_mobile_ps_shoppingcart .header-block__badge{position:absolute;top:-.25rem;right:-.25rem;height:1.25rem;min-width:1.25rem;padding:0 .25rem;border:2px solid var(--rg-bg);background:#fff;color:#000;font-size:.625rem;line-height:1}
  #_mobile_ps_shoppingcart .inactive .header-block__badge{display:none}
}

/* ---------- Header : horizontal logo below 1200px ---------- */
/* sixten_full-wh.svg (2946 x 827): 2rem high on mobile, 2.5rem from 768px, 2rem once the bar is stuck */
@media (max-width:1199.98px){
  .header-bottom .logo{height:2.25rem;max-height:2.25rem;width:auto}
}
@media (min-width:768px) and (max-width:1199.98px){
  .header-bottom .logo{height:2.75rem;max-height:2.75rem}
  .rg-header-stuck .header-bottom .logo{height:2.25rem;max-height:2.25rem}
}


/* Recherche dans le menu burger */
.rg-sidenav__search{margin:0 1.5rem 1rem}
@media (min-width:1200px){.rg-sidenav__search{margin:0 3rem 1.5rem}}
.rg-sidenav__search .form-control{height:3rem;border-color:var(--rg-border-strong);background:transparent;color:var(--rg-text)}
.rg-sidenav__search .form-control::placeholder{color:var(--rg-text-3)}
.rg-sidenav__search .form-control:focus{border-color:var(--rg-brand);box-shadow:0 0 0 .2rem rgba(var(--rg-brand-rgb),.25)}

/* Tablette (768 à 1199 px) : logo à gauche, burger à l'extrémité droite de la ligne */
@media (min-width: 768px) and (max-width: 1199.98px) {
  .header-bottom__row > .ps-mainmenu--desktop { margin-left: auto; }
}

/* Pages lnwkspages (accueil) : pas de marge basse sous le dernier bloc, il touche le footer */
.center-column:has(.lnwks-page) { padding-bottom: 0; }

/* Logo du header plus grand : 72 px de large dans la colonne (dès 1200 px), 52 px de haut sur tablette, 44 px sur mobile */
@media (min-width: 1200px) {
  .header-bottom .logo,
  .rg-header-stuck .header-bottom .logo { width: 4.5rem; }
}
@media (min-width: 768px) and (max-width: 1199.98px) {
  .header-bottom .logo { height: 3.25rem; max-height: 3.25rem; }
  .rg-header-stuck .header-bottom .logo { height: 2.75rem; max-height: 2.75rem; }
}
@media (max-width: 767.98px) {
  .header-bottom .logo { height: 2.75rem; max-height: 2.75rem; }
}

/* Fil d'Ariane : fond blanc, filet en bas */
.breadcrumb__wrapper { background: #fff; border-bottom: 1px solid var(--rg-border); }

/* ---------- Pages en pleine largeur : tous les conteneurs occupent l'écran, marge latérale de 30 px (15 px en mobile) ---------- */
.container,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
  max-width: none;
  padding-inline: 30px;
}

@media (max-width: 767.98px) {
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl,
  .container-xxl {
    padding-inline: 15px;
  }
}


/* ---------- Mon compte : cartes avec icône au trait, filet jaune au survol ---------- */
.account-menu--main { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); margin-top: 1.5rem; }
@media (min-width: 576px) { .account-menu--main { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .account-menu--main { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.account-menu--main .account-menu__link {
  position: relative;
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  grid-template-areas: "icon label" "icon desc";
  column-gap: 1rem;
  row-gap: .125rem;
  align-content: start;
  padding: 1.5rem 3rem 1.5rem 1.5rem;
  border: 1px solid var(--rg-border);
  background: #fff;
  color: #000;
  text-decoration: none;
  transition: border-color .2s;
}
.account-menu--main .account-menu__link::before {
  content: "";
  grid-area: icon;
  width: 2.5rem;
  height: 2.5rem;
  background: #000;
  -webkit-mask: var(--rg-account-icon) center / 1.75rem no-repeat;
  mask: var(--rg-account-icon) center / 1.75rem no-repeat;
}
.account-menu--main .account-menu__link::after {
  content: "→";
  position: absolute;
  right: 1.25rem;
  top: 1.5rem;
  font-size: 1.25rem;
  line-height: 1;
  transition: transform .2s;
}
.account-menu--main .account-menu__link:hover { border-color: #000; }
.account-menu--main .account-menu__link:hover::after { transform: translateX(.25rem); }
.account-menu--main .account-menu__link .account-menu__label { grid-area: label; font-weight: 700; font-size: 1.0625rem; }
.account-menu--main .account-menu__link .account-menu__desc { grid-area: desc; color: rgba(0, 0, 0, .7); font-size: .9375rem; }
#identity_main_link { --rg-account-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.75'/%3E%3Cpath d='M4.75 20.5c0-4 3.25-7 7.25-7s7.25 3 7.25 7'/%3E%3C/svg%3E"); }
#addresses_main_link, #address_main_link { --rg-account-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6.5-5.5-6.5-11a6.5 6.5 0 0 1 13 0c0 5.5-6.5 11-6.5 11z'/%3E%3Ccircle cx='12' cy='10' r='2.25'/%3E%3C/svg%3E"); }
#history_main_link { --rg-account-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 7.5 12 3l8.5 4.5v9L12 21l-8.5-4.5z'/%3E%3Cpath d='M3.5 7.5 12 12l8.5-4.5M12 12v9'/%3E%3C/svg%3E"); }
#order_slips_main_link { --rg-account-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l3 3v15H6z'/%3E%3Cpath d='M14.5 3v4H18M9 12h6M9 16h6'/%3E%3C/svg%3E"); }
#discounts_main_link { --rg-account-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 12.5V4.5h8l9 9-8 8z'/%3E%3Ccircle cx='8' cy='9' r='1.25'/%3E%3C/svg%3E"); }
#returns_main_link { --rg-account-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h13l-3-3M20 16H7l3 3'/%3E%3C/svg%3E"); }
.account-menu__link--emailalerts { --rg-account-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 16V11a6 6 0 0 1 12 0v5l1.5 2h-15z'/%3E%3Cpath d='M10 20.5a2 2 0 0 0 4 0'/%3E%3C/svg%3E"); }
.account-menu__link--psgdpr { --rg-account-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.75'/%3E%3Cpath d='M4.75 20.5c0-4 3.25-7 7.25-7s7.25 3 7.25 7'/%3E%3C/svg%3E"); }
.rg-account-eyebrow { margin: 0 0 .25rem; font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(0, 0, 0, .55); }
.account-menu__back { display: inline-flex; align-items: center; gap: .25rem; margin-bottom: 1rem; font-size: .875rem; color: #000; text-decoration: none; }
.account-menu__back:hover { text-decoration: underline; }
.rg-account-signout { margin: 1.5rem 0 0; }
.rg-account-signout a { display: inline-block; padding: .75rem 1.5rem; border: 1px solid #000; font-size: .875rem; font-weight: 700; letter-spacing: .0625rem; text-transform: uppercase; color: #000; text-decoration: none; transition: background-color .2s; }
.rg-account-signout a:hover { background: var(--sb-brand); }

/* ---------- Panier et commande : DA (noir, jaune), récapitulatif en carte ---------- */
.checkout-steps { background: #fff; border-block-end: 1px solid var(--rg-border); margin-block-end: 2rem; }
.checkout-steps__step::before, .checkout-steps__step::after { background: rgba(0, 0, 0, .15); }
.checkout-steps__number { background: rgba(0, 0, 0, .2); color: #fff; }
.checkout-steps__step--current .checkout-steps__number { background: var(--sb-brand); color: #000; }
.checkout-steps__step--success .checkout-steps__number { background: #000; color: #fff; }
.checkout-steps__step--current::before, .checkout-steps__step--success::before, .checkout-steps__step--success::after { background: #000; }
.checkout-steps__btn, .checkout-steps__step--success .checkout-steps__btn, .checkout-steps__step--current .checkout-steps__btn { color: #000; font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; }
.checkout-steps__step:not(.checkout-steps__step--current):not(.checkout-steps__step--success) .checkout-steps__btn { color: rgba(0, 0, 0, .5); }
.cart-grid__aside-wrapper { position: sticky; top: 1.5rem; }
.cart-summary { padding: 1.5rem; border: 1px solid var(--rg-border); background: rgba(0, 0, 0, .03); }
.cart__item { padding-block: 1.25rem; border-bottom: 1px solid var(--rg-border); }
.cart__list > .cart__item:first-child { padding-top: 0; }
.cart__continue-shopping { margin-top: 1.5rem; }

/* Couleurs de statut : le « succès » suit la DA (jaune / noir), l'erreur reste rouge */
:root, [data-bs-theme=light], [data-bs-theme=dark] {
  --bs-success: #000;
  --bs-success-rgb: 0, 0, 0;
  --bs-success-text-emphasis: #000;
  --bs-success-bg-subtle: rgba(255, 196, 45, .2);
  --bs-success-border-subtle: var(--sb-brand);
}

/* ---------- Miniatures produit : pas de zoom ; la photo repose sur une tuile claire qui s'assombrit au survol,
   un soulignement jaune se déploie sous le titre ---------- */
.product-miniature__image,
.product-miniature__inner:hover .product-miniature__image { transform: none; mix-blend-mode: multiply; }
.product-miniature__inner,
.product-miniature__top { border-radius: 0; }
.product-miniature__inner:hover { box-shadow: none; }
.product-miniature__top { background-color: rgba(0, 0, 0, .035); transition: background-color .3s ease; }
.product-miniature__inner:hover .product-miniature__top,
.product-miniature__inner:has(:focus-visible) .product-miniature__top { background-color: rgba(0, 0, 0, .075); }
.product-miniature__title,
.product-miniature__title a {
  text-decoration: none;
  background: linear-gradient(var(--sb-brand), var(--sb-brand)) 0 100% / 0 3px no-repeat;
  transition: background-size .35s ease;
}
.product-miniature__inner:hover .product-miniature__title,
.product-miniature__inner:has(:focus-visible) .product-miniature__title { background-size: 100% 3px; }

/* ---------- Page produit : photos sur tuiles claires, bloc d'achat ---------- */
.product__carousel .carousel-item { background-color: rgba(0, 0, 0, .035); }
.product__carousel .carousel-item img { mix-blend-mode: multiply; }
.product__right { padding-block: .25rem 2rem; }
.rg-product-eyebrow { margin-bottom: .75rem; }
.product__name { margin: 0 0 .5rem; font-size: clamp(1.75rem, 2.4vw, 2.5rem); font-weight: 700; line-height: 1.1; letter-spacing: -.01em; }
.product__manufacturer { margin: 0; font-size: .8125rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.product__manufacturer a { color: rgba(0, 0, 0, .65); text-decoration: none; }
.product__manufacturer a:hover { color: #000; }
.rg-product-meta { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; margin: .75rem 0 0; padding: 0; list-style: none; font-size: .875rem; color: rgba(0, 0, 0, .65); }
.rg-product-meta strong { color: #000; font-weight: 600; }
.rg-product-meta__label { text-transform: uppercase; letter-spacing: .08em; font-size: .75rem; }
.product__prices { margin-block: 1.5rem; padding-block: 1.25rem; border-block: 1px solid var(--rg-border); }
.product__price { font-size: 2.25rem; font-weight: 700; line-height: 1; letter-spacing: -.01em; }
.product__tax-label, .product__tax-infos { margin-left: .5rem; font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(0, 0, 0, .6); }
.product__description-short { margin-bottom: 1.5rem; color: rgba(0, 0, 0, .75); }
.product-variant { margin-bottom: 1.5rem; }
.product-variant__legend { margin-bottom: .625rem; font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(0, 0, 0, .6); }
.product-variant__selected { color: #000; letter-spacing: 0; text-transform: none; font-weight: 600; }
.product-variant__radios .btn { min-width: 3.25rem; padding: .75rem 1.125rem; font-weight: 600; letter-spacing: .02em; }
.product-variant .form-select { height: 3.25rem; font-weight: 600; }
.product__add-to-cart-container { margin-top: .5rem; }
.product__add-to-cart-button { height: 3.5rem; font-size: .9375rem; letter-spacing: .1em; text-transform: uppercase; }
.product__quantity .form-control, .product__quantity input { height: 3.5rem; }
.product__quantity .btn { height: 3.5rem; width: 3rem; }
.product__availability { display: flex; align-items: center; gap: .625rem; margin-top: 1rem; font-size: .875rem; font-weight: 600; }
.product__availability-icon { display: none; }
.product__availability-status { display: inline-flex; align-items: center; gap: .625rem; margin: 0; }
.product__availability-status::before { content: ""; width: .625rem; height: .625rem; border-radius: 50%; background: var(--sb-brand); box-shadow: 0 0 0 2px #fff, 0 0 0 3px #000; }
.product__availability-status.unavailable::before { background: transparent; box-shadow: inset 0 0 0 1.5px rgba(0, 0, 0, .45); }
.rg-product-help { display: grid; gap: .875rem; margin: 2rem 0 0; padding: 1.5rem 0 0; border-top: 1px solid var(--rg-border); list-style: none; }
@media (min-width: 576px) { .rg-product-help { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rg-product-help__link { display: flex; align-items: center; gap: .625rem; font-size: .875rem; font-weight: 600; color: #000; text-decoration: none; }
.rg-product-help__link::before { content: ""; flex: none; width: 1.5rem; height: 1.5rem; background: #000; -webkit-mask: var(--rg-help-icon) center / contain no-repeat; mask: var(--rg-help-icon) center / contain no-repeat; }
.rg-product-help__link:hover { text-decoration: underline; text-underline-offset: .25em; }
.rg-product-help__link--shipping { --rg-help-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h11v10H3z'/%3E%3Cpath d='M14 10h4l3 3v3h-7z'/%3E%3Ccircle cx='7' cy='17.5' r='1.75'/%3E%3Ccircle cx='17' cy='17.5' r='1.75'/%3E%3C/svg%3E"); }
.rg-product-help__link--payment { --rg-help-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='10.5' width='14' height='10' rx='1.5'/%3E%3Cpath d='M8 10.5V8a4 4 0 0 1 8 0v2.5'/%3E%3C/svg%3E"); }
.rg-product-help__link--contact { --rg-help-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H9l-5 4z'/%3E%3C/svg%3E"); }
.product__prices-block, .product__prices-block > div, .product__prices-inline { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; }
.product__tax-label, .product__tax-infos { margin-left: 0; }

/* Détails du produit : pas de fond gris, lignes séparées par un filet */
.details__list { background: transparent; margin: 0; padding: 0; }
.details__item { padding: .875rem 0; }
.details__title { font-weight: 600; }

/* ---------- Panier : plus d'air entre la liste et le récapitulatif, et entre les éléments d'une ligne ---------- */
.cart-grid { --bs-gutter-x: 3rem; --bs-gutter-y: 2.5rem; }
@media (min-width: 992px) { .cart-grid { --bs-gutter-x: 5rem; } }
.cart-grid__aside-wrapper { padding-top: .5rem; }
.cart-summary { padding: 2rem; }
.cart-summary__line { padding-block: .625rem; }
.cart__item { padding-block: 2rem; }
.cart__list > .cart__item:first-child { padding-top: .5rem; }
.product-line { gap: 1.5rem 2rem; }
.product-line__title { display: inline-block; margin-bottom: .625rem; font-weight: 700; color: #000; text-decoration: none; }
.product-line__title:hover { text-decoration: underline; text-underline-offset: .2em; }
.product-line__item { margin-bottom: .375rem; }
.product-line__item-price { display: inline-block; margin-top: .75rem; font-weight: 600; }
.product-line__price { font-weight: 700; }
.product-line .js-remove-from-cart { display: inline-block; margin-top: .75rem; font-size: .875rem; }
.cart__continue-shopping { margin-top: 2rem; }
.cart-summary .btn { margin-top: 1.25rem; }
@media (min-width: 1200px) { .cart-grid { --bs-gutter-x: 7rem; } }
.cart-grid__products-details hr { display: none; }
.cart__list > .cart__item:last-child { border-bottom: 1px solid var(--rg-border); }

/* ---------- Stickers de stock : « En stock » (jaune) comme « Rupture de stock » (noir), sur la photo ---------- */
.product-flags .badge.in-stock { background-color: var(--sb-brand); border-color: var(--sb-brand); color: #000; font-weight: 700; }