/** Shopify CDN: Minification failed

Line 147:4 Unexpected "body("
Line 149:4 Unexpected "body("

**/
.header { padding-block-start: 14px; padding-block-end: 14px; padding-inline-start: 40px; padding-inline-end: 40px; }
button.header-hamberger-menu-btn { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 8px 8px 8px 0; }
button.header-hamberger-menu-btn span { letter-spacing: 0.4px; font-size: 14px; font-weight: 400; line-height: 17.5px; }
button.header-hamberger-menu-btn svg { min-width: 24px; }

.hambermenu-searchbar-wrap {display: flex; flex-wrap: wrap; gap: 16px; }
a.search-bar-wrap { display: flex; align-items: center; gap: 16px; min-height: 48px; padding: 8px; box-sizing: border-box; }
a.search-bar-wrap span { line-height: 17.5px; letter-spacing: 0.4px; font-size: 14px; font-weight: 400; }
.localization-selectors .popover::part(content) {background-color:#fff;}

li.custom_nav_button_label {margin-right:0; letter-spacing: 0.4px;}
li.custom_nav_linklist_label_link, .header__secondary-nav li.localization-selectors { margin-right: 0;}
.header__secondary-nav .localization-selectors:not(:only-child) { margin-inline-end: 0; }
li.custom_nav_linklist_label_link a {letter-spacing: 0.4px; font-size: 14px; font-weight: 400; line-height: 17.5px;}
li.custom_nav_button_label .button { padding: 8px; font-size: 14px; font-weight: 400; line-height: 17.5px; letter-spacing: 0.4px; }
li.relative.header__cart-link { order: 2; }
/* Zone cliquable de 32px posee sur le lien interne, jamais sur le <li> : poser
   display sur le <li> ecraserait les utilitaires du theme (.sm-max:hidden, qui masque
   le compte en petit ecran). Structure identique a LV : li 32x32 [112], lien avec
   padding autour d'une icone [113]. */
a.swym-wishlist,
li.header__account-link > a,
li.relative.header__cart-link > a,
li.header__search-link > a { min-width: 32px; min-height: 32px; display: flex; align-items: center; justify-content: center; }

/* Icone de 16px dans la zone de 32px : c'est la construction LV [113][115][119][124].
   Le gap de 4px [107] ne suffit pas a lui seul a creer de l'air ; ce sont les 8px de
   padding de chaque cote qui donnent les 20px d'ecart visible de la reference. */
.header__secondary-nav a.swym-wishlist svg,
.header__secondary-nav li.header__account-link > a svg,
.header__secondary-nav li.relative.header__cart-link > a svg,
.header__secondary-nav li.header__search-link > a svg { width: 16px; height: 16px; }

/* Meme logique pour les elements texte : LV enveloppe « Contactez-nous » dans un bouton
   de 102,76px pour un libelle de 86,76px, soit 8px de chaque cote [108][111]. */
li.custom_nav_linklist_label_link a,
li.localization-selectors .localization-toggle { padding-inline: 8px; }
.swym-header-launcher { max-width: 32px; }
.swym-header-launcher svg { max-width: 16px; max-height: 14px; }
li.header__account-link { order: 2; }
li.localization-selectors .localization-toggle img { border-radius: 50%; object-fit: cover; width: 100%; height: 100%; max-width: 16px; min-height: 16px;}
li.localization-selectors .localization-toggle {gap:10px;}
.localization-toggle span { font-size: 14px; font-weight: 400; color: rgb(var(--text-color) / 1); letter-spacing: 0.4px; }
.header__secondary-nav {gap:4px;}
 
.header-sidebar :where(.modal,.drawer,.header-sidebar .popover,.header-search)::part(tap-area):before {display:none;}
.custom-simple-nav-list ul { list-style-type: none; padding: 0; margin: 0; }
ul.main-menu-wrap { display: flex; flex-direction: column; gap: 88px; }
li.flex-row { display: flex; flex-direction: row; align-items: center; gap: 44px; padding:0;}
.header-sidebar.drawer--sm { --drawer-max-width: min(92vw, 30rem); }
a.first-level { min-width: 174px; font-size: 13px; text-transform: capitalize; letter-spacing: 0.66px; }
ul.second-level li { font-size: 13px; font-family: 'Futura PT Book'; letter-spacing: 0.66px; padding: 0; line-height: 1.79; margin-bottom: 7px; }
.header-sidebar__main-panel {overflow:hidden;} 
.custom-simple-nav-list { overflow-y: auto; padding: 0 20px;} 
.header-sidebar__main-panel { z-index: 1; position: relative;}
.header__secondary-nav li.header__search-link { min-width: 32px; }
svg.header__nav-icon path, .header__secondary-nav .localization-toggle svg path {stroke:rgb(var(--text-color));}
.localization-selectors .localization-toggle { gap:3px; font-family: 'Futura Md BT'; color: rgb(var(--text-color) / 1); font-size: 14px; letter-spacing: 0;}
.custom-simple-nav-list ul.third-level { padding-left: 20px; margin: 6px 0 16px 0; }
.custom-simple-nav-list a[aria-current="page"] { text-decoration: underline; text-underline-offset: 2px; }
.localization-selectors .popover:has(.popover__value-list)::part(body) { padding-block-start: 1rem; padding-block-end: 1rem; }
.header-sidebar::part(header) { border-block-end: none; z-index: 2; align-items: center; }
.header-sidebar::part(close-button) {display: flex; gap: 12px; }

.header-sidebar__linklist-button span { background: linear-gradient(#000, #000) no-repeat 0 100% / 0 1px; transition: background-size .3s cubic-bezier(.39,.575,.565,1);}
.header-sidebar__linklist-button:hover span {background-size: 100% 1px; transition: background-size .3s cubic-bezier(.39,.575,.565,1);}
.header-sidebar__linklist-button:hover svg { transition:all .3s cubic-bezier(.39,.575,.565,1);}
.header-sidebar__linklist-button.h4 {font-size:22px; text-transform: capitalize; font-weight: 400; font-family:'Inter'; padding: 7px 0; }
.header-sidebar__sub-panel .header-sidebar__linklist-button.h6 { font-size: 16px; font-weight: 400; font-family: 'Inter'; }
.header-sidebar__linklist-button:hover svg {transition:all .3s cubic-bezier(.39,.575,.565,1);opacity:1;}
.header-sidebar__scroller li:hover .header-sidebar__linklist-button {color: rgb(var(--text-color) / 1) !important;}
.header-sidebar__promo p { font-size: 16px; font-family: Inter; font-weight: 500; }

.third-pannel[open] { background:#fff; display: block; opacity: 1; --flip-multiplier: 2; transform: translate(calc(var(--transform-logical-flip) * var(--flip-multiplier) * 100%)); top: 0; position: absolute; width: 100%; height: 100%; z-index: 5; }
.third-pannel .header-sidebar__scroller { width: 100%; height: 100%;}
.third-pannel button.header-sidebar__back-button svg, button.header-sidebar__back-button svg { position: absolute; left: 0; width: 12px; height: 12px;}
.third-pannel button.header-sidebar__back-button { display: flex; align-items: center; justify-content: center; text-transform: uppercase; font-size: 16px; font-weight: 400; font-family: Inter; position: relative; }
.header-sidebar__main-panel[style="opacity: 0; transform: translateX(-10px);"] { z-index: -2; }
.third-pannel .header-sidebar__sub-link-featured { display: none; }

.third-pannel .header-sidebar__linklist-button.h6 {display:block;}
.third-pannel span.sub-link-title { width: 100%; display: inline-block; text-align: center; padding: 16px 0 30px 0; font-size: 16px; background:none;}
.third-pannel ul.header-sidebar__linklist img { width: 100%;}
.third-pannel ul.header-sidebar__linklist.grid.grid-cols-2.gap-4 { display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; }
.third-pannel ul.header-sidebar__linklist li {width: 50%; max-width: 50%; list-style-type: none; text-align: center; padding: 0; }
.third-pannel ul.header-sidebar__linklist li:nth-child(1) {width:100%; max-width:100%;}

@media(max-width:1440px){
    .header-sidebar.drawer--sm {--drawer-max-width: min(92vw, 380px);}
}
@media(min-width:1441px){
    .header-sidebar__scroller, .header-sidebar::part(header) {padding-inline-start:60px; padding-inline-end:60px;}
} 
@media(min-width:1200px){
    header-sidebar-collapsible-panel-inner.third-pannel { border-left: solid 1px rgb(var(--border-color)); }
    .header-sidebar__linklist-button svg {transition:all .3s cubic-bezier(.39,.575,.565,1);opacity:0;}
    /* .mobile-header-sidebar, .mobile-default-dropdrown-header-menu {display:none;} */
    .header-sidebar__footer {display:none;}
    .header-sidebar__scroller, .header-sidebar::part(header) {padding-inline-start:40px; padding-inline-end:40px;}
}
@media(min-width:1440px){
    .header {padding-inline-start:3.333vw; padding-inline-end:3.333vw;}
}
@media(min-width:1024px) and (max-width:1439px){
    .header {padding-inline-start:3.125vw; padding-inline-end:3.125vw;}
}
@media(min-width:1200px){
    /* LV positionne son logo en absolu [100] : ses deux blocs lateraux prennent toute
       la largeur. Notre grille garde le logo en colonne centrale, on resserre donc la
       gouttiere de colonne pour rendre au bloc droit la place qui lui manque. */
    .header {column-gap:16px;}
    .header__secondary-nav li.header__search-link {display:none;}
}
@media(max-width:1600px){
}
@media(max-width:1450px){
    li.localization-selectors .localization-toggle { gap:7px; font-size: 14px; }
    li.custom_nav_linklist_label_link a { letter-spacing:.4px; font-size:14px;}
    li.custom_nav_button_label .button { padding:8px; font-size: 14px; }
}
@media(max-width:1380px){
    .header__secondary-nav { gap: 4px; }
    li.custom_nav_button_label .button { padding:8px; font-size:14px;}
    li.custom_nav_button_label, li.custom_nav_linklist_label_link { margin-right: 0; letter-spacing: .4px; }
}
@media(max-width:1280px){
    li.localization-selectors .localization-toggle {gap:7px; font-size:14px;}
    li.custom_nav_linklist_label_link a {letter-spacing:.4px; font-size:14px;}
    li.custom_nav_button_label .button {padding:8px; font-size:14px;}

}
@media(max-width:1199px){
    button.header-sidebar__back-button { display: flex; align-items: center; justify-content: center; text-transform: uppercase; font-size: 16px; font-weight: 400; font-family: Inter; position: relative; }
    .header-sidebar__linklist-button.h4 { font-size:18px;}
    .header-sidebar__main-panel {padding:20px 0 0px 0;}
    .custom_nav_linklist_label_link {padding-top:0;}
    a.first-level {min-width:100px;} 
    header-sidebar-collapsible-panel-inner.third-pannel {left:30px; top: 0;opacity:0; width:100%; height:100%; position:absolute; transform:matrix(1, 0, 0, 1, 0, 0) !important; transition: all 0.3s; }
    header-sidebar-collapsible-panel-inner.third-pannel:not([open]) {transform:translateX(20px) matrix(1, 0, 0, 1, 0, 0) !important;}
    header-sidebar-collapsible-panel-inner.third-pannel[open] {height:100%; left:0; top:0; transform:translateX(0px) matrix(1, 0, 0, 1, 0, 0) !important; opacity:1; z-index:5;transition:all 0.3s;}
    body(header-sidebar-collapsible-panel-inner.third-pannel[open]) .header-sidebar__collapsible-panel[level="2"] {transform: translate(-20px, 0px) !important; opacity: 0 !important;opacity:0; /**transform:translateX(-20px) matrix(1, 0, 0, 1, 0, 0) !important;**/ transition:all 0.3s;z-index:1;}
    .header-sidebar__collapsible-panel[level="2"] {z-index: 5;}
    body(header-sidebar-collapsible-panel-inner.third-pannel[open]) .header-sidebar__collapsible-panel[level="2"] {left: -30px;}
}
/* Seuil de bascule. LV masque a 64rem (1024px), mais son bloc droit ne porte que
   « Contactez-nous » et trois icones (254px). Le notre ajoute un bouton commercial et
   un selecteur de langue, soit 468px : en dessous de 1200px il passerait a la ligne (mesure : 500,2px requis, 516,5 disponibles a 1200px). */
@media(max-width:1199px){
    /* seuil de bascule */
    .search-bar-wrap.desktop-show, .header__secondary-nav li.custom_nav_button_label, .header__secondary-nav li.custom_nav_linklist_label_link {display:none;}
    li.header__search-link svg {max-width:20px;}
}
@media(max-width:699px){
    .header {padding-inline-start:20px; padding-inline-end:20px;}
    ul.main-menu-wrap {gap:40px;}
    button.header-hamberger-menu-btn svg { min-width:15px; width:14px;}
}

/* ========================================================================== */
/* BANDEAU D'ANNONCE — trois zones, sur la mecanique Fashionphile : lien a gauche,
   message au centre, bloc CTA plein colle au bord droit sur toute la hauteur.
   Le reglage de section n'est PAS modifie : c'est cette feuille qui le repeint. */
.announcement-bar {
  --background: 28 28 28;
  --text-color: 246 243 238;
  --announcement-bar-font-size: 0.875rem;
  display: grid;
  grid-template-columns: minmax(max-content, 1fr) minmax(0, 2fr) minmax(max-content, 1fr);
  align-items: stretch;
  min-height: 40px;
  padding: 0 0 0 clamp(20px, 3.125vw, 48px);
  color: #f6f3ee;
  background: #1c1c1c;
  letter-spacing: 0.4px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.announcement-bar a { color: inherit; text-underline-offset: 3px; }

.announcement-bar__left,
.announcement-bar__center,
.announcement-bar__right { display: flex; align-items: center; }

.announcement-bar__left { justify-content: flex-start; padding-block: 8px; }
.announcement-bar__left a { text-decoration: underline; }

.announcement-bar__center { justify-content: center; min-width: 0; padding: 8px 16px; }

.announcement-bar__carousel { min-width: 0; text-align: center; }

/* Au-dessus de 1200px la colonne centrale est assez large pour tenir le message sur
   une ligne, comme Fashionphile. En dessous on laisse revenir a la ligne plutot que
   de deborder. */
@media(min-width:1200px){
  .announcement-bar__center p { white-space: nowrap; }
}

/* align-items:stretch pour que le bloc CTA occupe toute la hauteur de la barre,
   comme le bloc « SELL NOW » de Fashionphile. */
.announcement-bar__right { justify-content: flex-end; align-items: stretch; min-width: max-content; }

.announcement-bar__right-link,
.announcement-bar .announcement-bar__cta {
  display: flex;
  align-items: center;
  padding-inline: clamp(14px, 1.7vw, 26px);
}

/* Le beige n'est pas invente : c'est le #F6ECD8 deja utilise par les badges de condition
   et les pastilles de la modale. Equivalent maison du rose de Fashionphile. */
/* Selecteur en (0,2,1) : `.announcement-bar a { color: inherit }` ci-dessus est en
   (0,1,1) et gagnait, ce qui donnait du beige sur beige. */
.announcement-bar a.announcement-bar__cta {
  color: #1a1a1a;
  background: #f6ecd8;
  font-weight: 500;
  text-decoration: none;
}

.announcement-bar .announcement-bar__cta:hover { text-decoration: underline; }

@media(max-width:699px){
  .announcement-bar {
    --announcement-bar-font-size: 0.75rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding-inline-start: 0;
  }

  /* Sous 700px on garde le message et le CTA ; les deux liens peripheriques sortent. */
  .announcement-bar__left,
  .announcement-bar__right-link { display: none; }

  .announcement-bar__center { padding-inline: 12px; }
  .announcement-bar__right { grid-column: 2; }
  .announcement-bar__cta { padding-inline: 12px; }
}

/* --------------------------------------------------------------------------
   CHROME COLLANT — correction d'un defaut prexistant du theme.

   Le theme rend le bandeau ET l'en-tete collants, et fait coller l'en-tete a
   `top: calc(var(--announcement-bar-is-sticky) * var(--announcement-bar-height))`.
   Or --announcement-bar-height est ecrite une seule fois, par un script en ligne
   de sections/announcement-bar.liquid, et vaut 80px alors que le bandeau n'a
   jamais cette hauteur. Resultat mesure : un trou de 25,3px sur le theme publie
   (39,2px une fois le bandeau ramene a 40px), dans lequel le contenu de la page
   defile entre les deux barres.

   Correction : le bandeau ne colle plus — il defile avec la page, comme chez LV
   et comme sur les sites de maison en general — et l'en-tete colle a 0.
   Le trou disparait, et le chrome permanent passe de 128px a 88px.

   Les !important sont necessaires et cibles : les regles adverses sont posees
   dans des <style> en ligne sur des selecteurs d'ID (#shopify-section-...),
   qu'aucun selecteur de classe ne peut battre depuis une feuille externe.
   -------------------------------------------------------------------------- */
.shopify-section--announcement-bar {
  position: static !important;
}

.shopify-section--announcement-bar ~ .shopify-section--header {
  top: 0 !important;
}

/* --------------------------------------------------------------------------
   ACCESSIBILITE CLAVIER — deux correctifs issus de l'audit.
   -------------------------------------------------------------------------- */

/* C05 — theme.css pose `.header-search__input:focus{outline:none}` sans condition :
   le champ de recherche n'a donc aucun indicateur de focus au clavier, alors que la
   regle globale du meme fichier ne retire l'outline que pour `:focus:not(:focus-visible)`.
   On le retablit pour la navigation clavier uniquement. */
.header-search__input:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

/* P02 — Le soulignement anime des entrees du tiroir n'existe qu'au survol. On donne
   au clavier le meme retour, sans toucher a l'outline natif. */
.header-sidebar__linklist-button:focus-visible span {
  background-size: 100% 1px;
}

/* C06 — Compteur du panier. LV affiche un nombre, pas un point : pastille 12x12,
   texte 8px graisse 500, blanc sur noir, en absolu sur l'icone [122][125].
   Le <cart-dot> vide est remplace par un <cart-count> dans sections/header.liquid ;
   les deux sont des elements personnalises deja definis par le theme. */
.header__cart-link > a {
  position: relative;
}

.header__cart-count {
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #000;
  color: #fff;
  font-size: 8px;
  font-weight: 500;
  line-height: 12px;
  text-align: center;
}

/* --------------------------------------------------------------------------
   MESSAGE CENTRAL — uniformisation de la graisse et du soulignement.

   Trois graisses coexistaient dans la barre : 400 pour « Nos boutiques » et
   « Contactez-nous », 500 pour le paragraphe central (classe .heading du theme),
   700 pour le <strong> autour de « Ecrivez-nous sur WhatsApp ». Le theme peignait
   en plus un trait permanent sous le lien, via un background-image de 1px — la
   technique meme du CTA de LV, mais figee a l'etat visible.

   On ramene le message a la graisse 400 du reste de la barre, et on reserve le
   trait au survol et au focus clavier. La transition `background-size .3s
   ease-in-out` est deja posee par le theme sur ce lien : la revelation animee ne
   coute donc aucune declaration supplementaire.

   Selecteurs en (0,2,x) : les regles du theme portent sur `.prose a` et
   `.prose.heading`, en (0,1,1) et (0,2,0). Passer par `.announcement-bar` garantit
   le gain quel que soit l'ordre de chargement des feuilles. */
.announcement-bar .announcement-bar__center p,
.announcement-bar .announcement-bar__center p strong {
  font-weight: 400;
}

.announcement-bar .announcement-bar__center a {
  background-size: 0 1px;
}

.announcement-bar .announcement-bar__center a:hover,
.announcement-bar .announcement-bar__center a:focus-visible {
  background-size: 100% 1px;
}
