/* =====================================================================
   GNATEPE SHOP — charte commune (gnatepe-vitrine)
   Une seule source pour les couleurs, la police, les formes et les
   composants. Toutes les pages et les extensions s'appuient dessus.
   ===================================================================== */

/* ---------- Police : Poppins hébergée sur le site, 3 graisses ---------- */
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/poppins-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/poppins-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/poppins-latin-400-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/poppins-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/poppins-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---------- Jetons de la charte ---------- */
:root{
  --gs-red:#E3161B;      /* action principale, prix */
  --gs-red-d:#B30F13;    /* survol, erreurs */
  --gs-red-t:#C8131A;    /* petits textes rouges (lisibles sur les fonds gris) */
  --gs-yellow:#FFC400;   /* accent, ombre signature */
  --gs-yellow-l:#FFF4CC; /* fonds d'accent */
  --gs-ink:#111111;      /* titres, boutons secondaires */
  --gs-text:#2B2B2B;     /* texte courant */
  --gs-muted:#5C5C5C;    /* texte secondaire (contraste 6,7:1 sur blanc) */
  --gs-line:#E6E6E6;     /* séparateurs, bordures de cartes */
  --gs-line-2:#CFCFCF;   /* bordures de champs */
  --gs-bg:#F7F7F8;       /* fonds de sections */
  --gs-white:#FFFFFF;
  --gs-ok:#157A40;       /* réussite, disponible */
  --gs-ok-l:#E8F6EE;
  --gs-wa:#117A3E;       /* boutons WhatsApp (texte blanc lisible) */
  --gs-r-s:8px; --gs-r-m:16px; --gs-r-p:999px;
  --gs-sh:0 6px 20px rgba(17,17,17,.08);
  --gs-sh-y:4px 4px 0 var(--gs-yellow);
  --gs-font:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --gs-h1:clamp(1.5rem,5.2vw,2.5rem);
  --gs-h2:clamp(1.2rem,4.2vw,1.75rem);
  --gs-h3:clamp(1rem,3.6vw,1.15rem);
  --gs-tap:44px;
}

/* ---------- Base ---------- */
b,strong{font-weight:600}
.gs-ui,.gs-ui *{box-sizing:border-box}
/* Mots jamais coupés : pas de césure ni de coupure au milieu d'un mot. */
body,.gs-ui{-webkit-hyphens:none;hyphens:none;word-break:normal;overflow-wrap:normal}
.gs-url,.gs-url *{overflow-wrap:anywhere}
:where(a,button,input,select,textarea,summary,[tabindex],[role=button]):focus-visible{outline:3px solid var(--gs-ink)!important;outline-offset:2px!important}
:where(.gs-btn,.gs-btn--sec,[class*=cta]):focus-visible{box-shadow:0 0 0 6px var(--gs-yellow)}
/* aucun mot coupé en deux : les mots à trait d'union restent entiers */
.gs-nw{white-space:nowrap}
/* zone à toucher de 44 px autour des petits boutons, sans changer leur dessin */
.gs-hit{position:relative}
.gs-hit::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);transform:translate(-50%,-50%)}
.gs-ui img{max-width:100%;height:auto}
.gs-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Titres ---------- */
.gs-h1{font:700 var(--gs-h1)/1.18 var(--gs-font);color:var(--gs-ink);letter-spacing:-.02em;margin:0 0 .4em}
.gs-h2{font:700 var(--gs-h2)/1.22 var(--gs-font);color:var(--gs-ink);letter-spacing:-.015em;margin:0 0 .6em}
.gs-h3{font:600 var(--gs-h3)/1.3 var(--gs-font);color:var(--gs-ink);margin:0 0 .4em}
.gs-muted{color:var(--gs-muted)}

/* ---------- Boutons : principal, secondaire, discret, WhatsApp ---------- */
.gs-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--gs-tap);padding:0 22px;border:2px solid var(--gs-red);border-radius:var(--gs-r-p);background:var(--gs-red);color:#fff!important;font:600 .95rem/1 var(--gs-font);text-decoration:none!important;white-space:nowrap;cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.gs-btn:hover{background:var(--gs-red-d);border-color:var(--gs-red-d)}
.gs-btn:active{transform:translateY(1px)}
.gs-btn--sec{background:#fff;border-color:var(--gs-ink);color:var(--gs-ink)!important}
.gs-btn--sec:hover{background:var(--gs-yellow-l);border-color:var(--gs-ink)}
.gs-btn--ghost{background:transparent;border-color:transparent;color:var(--gs-ink)!important;padding:0 12px}
.gs-btn--ghost:hover{background:var(--gs-bg);border-color:transparent}
.gs-btn--wa{background:#fff;border-color:var(--gs-wa);color:#147A3D!important}
.gs-btn--wa:hover{background:#EAF8EF;border-color:var(--gs-wa)}
.gs-btn--sig{box-shadow:var(--gs-sh-y)}
.gs-btn--block{display:flex;width:100%}
.gs-btn--sm{min-height:36px;padding:0 14px;font-size:.84rem}
.gs-btn[disabled],.gs-btn.is-off{opacity:.5;pointer-events:none}

/* ---------- Badges et puces ---------- */
.gs-badge{display:inline-flex;align-items:center;padding:3px 9px;border-radius:var(--gs-r-p);background:var(--gs-red);color:#fff;font:600 .72rem/1.2 var(--gs-font);white-space:nowrap}
.gs-badge--y{background:var(--gs-yellow);color:var(--gs-ink)}
.gs-badge--k{background:var(--gs-ink);color:var(--gs-yellow)}
.gs-badge--ok{background:var(--gs-ok-l);color:var(--gs-ok)}
.gs-type{display:inline-block;font:400 .66rem/1.2 var(--gs-font);letter-spacing:.04em;text-transform:uppercase;color:var(--gs-muted);text-decoration:none}
.gs-chip{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border:1.5px solid var(--gs-line);border-radius:var(--gs-r-p);background:#fff;color:var(--gs-ink)!important;font:600 .84rem/1 var(--gs-font);text-decoration:none!important;white-space:nowrap;cursor:pointer}
.gs-chip.is-on,.gs-chip[aria-pressed=true],.gs-chip[aria-current]{background:var(--gs-ink);border-color:var(--gs-ink);color:#fff!important}

/* ---------- Carte produit unique ---------- */
.gs-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:1024px){.gs-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.gs-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
.gs-card{position:relative;display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid var(--gs-line);border-radius:var(--gs-r-m);overflow:hidden;font-family:var(--gs-font)}
.gs-card__img{position:relative;display:block;aspect-ratio:1/1;background:var(--gs-bg);overflow:hidden}
.gs-card__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.gs-card:hover .gs-card__img img{transform:scale(1.03)}
.gs-card__img .gs-badge{position:absolute;left:8px;top:8px}
.gs-card__body{display:flex;flex-direction:column;gap:4px;flex:1;padding:10px 12px 12px;min-width:0}
.gs-card__title{margin:0;font:600 .88rem/1.32 var(--gs-font);color:var(--gs-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gs-card__title a{color:inherit!important;text-decoration:none!important}
.gs-card__seller{font:400 .74rem/1.3 var(--gs-font);color:var(--gs-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-card__rate{font:400 .72rem/1 var(--gs-font);color:var(--gs-muted);white-space:nowrap}
.gs-card__rate b{color:var(--gs-ink)}
.gs-card__foot{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:auto;padding-top:6px}
.gs-price{display:flex;flex-direction:column;min-width:0;white-space:nowrap}
.gs-price b{font:700 clamp(.88rem,3.6vw,1rem)/1.15 var(--gs-font);color:var(--gs-red)}
.gs-price del{font:400 .72rem/1.2 var(--gs-font);color:var(--gs-muted)}
.gs-card__add{flex:none;display:inline-flex;align-items:center;justify-content:center;width:var(--gs-tap);height:var(--gs-tap);border-radius:var(--gs-r-p);background:var(--gs-red);color:#fff!important;text-decoration:none!important;font:600 1.2rem/1 var(--gs-font)}
.gs-card__add:hover{background:var(--gs-red-d)}
.gs-card__add.is-loading{opacity:.6;pointer-events:none}
.gs-card__add svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Champs de formulaire ---------- */
.gs-field{display:block;margin:0 0 14px}
.gs-field>label,.gs-label{display:block;margin:0 0 6px;font:600 .84rem/1.3 var(--gs-font);color:var(--gs-ink)}
.gs-input{width:100%;min-height:48px;padding:0 14px;border:1.5px solid var(--gs-line-2);border-radius:var(--gs-r-s);background:#fff;color:var(--gs-ink);font:400 16px/1.3 var(--gs-font)}
.gs-input:focus{outline:none;border-color:var(--gs-ink);box-shadow:0 0 0 3px var(--gs-yellow-l)}
.gs-input[aria-invalid=true]{border-color:var(--gs-red-d)}
.gs-err{display:block;margin:6px 0 0;font:600 .8rem/1.35 var(--gs-font);color:var(--gs-red-d)}
/* Bouton « Afficher » dans le champ du mot de passe (toutes les pages) */
.gs-pass{position:relative;display:block}
.gs-pass>input{padding-right:96px!important;width:100%}
/* même bouton que l'espace vendeur (.gnv-pass-eye) */
.gs-pass>.gs-eye{position:absolute;right:5px;top:50%;transform:translateY(-50%);height:40px;min-width:76px;padding:0 12px;border:0;border-radius:var(--gs-r-s);background:#F2F2F2;color:var(--gs-ink);font:600 .78rem/1 var(--gs-font);cursor:pointer;white-space:nowrap}
.gs-pass>.gs-eye:hover{background:var(--gs-yellow-l)}

/* ---------- Alertes et états vides ---------- */
.gs-alert{padding:12px 14px;border-radius:var(--gs-r-s);background:var(--gs-yellow-l);border-left:4px solid var(--gs-yellow);color:var(--gs-ink);font:400 .9rem/1.45 var(--gs-font)}
.gs-alert--err{background:#FDECEC;border-left-color:var(--gs-red-d)}
.gs-alert--ok{background:var(--gs-ok-l);border-left-color:var(--gs-ok)}
.gs-empty{padding:28px 16px;text-align:center;border:1.5px dashed var(--gs-line-2);border-radius:var(--gs-r-m);color:var(--gs-muted);font:400 .92rem/1.5 var(--gs-font)}

/* ---------- Agrandissement des photos (fiche produit) ---------- */
.gs-zoom{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;background:rgba(17,17,17,.94);touch-action:none}
.gs-zoom img{max-width:100vw;max-height:100vh;object-fit:contain;transform-origin:center center;transition:transform .2s;cursor:zoom-in;user-select:none;-webkit-user-drag:none}
.gs-zoom.is-z img{cursor:grab;transition:none}
.gs-zoom__x{position:absolute;right:12px;top:12px;width:var(--gs-tap);height:var(--gs-tap);border:0;border-radius:var(--gs-r-p);background:rgba(255,255,255,.16);color:#fff;font:400 1.6rem/1 var(--gs-font);cursor:pointer}
.gs-zoom__n{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);color:#fff;font:600 .8rem/1 var(--gs-font);opacity:.8}

@media (prefers-reduced-motion:reduce){.gs-ui *,.gs-card__img img{transition:none!important;animation:none!important}}