/* |-------------------------------------------------------------------------- | ISOLATION V61 |-------------------------------------------------------------------------- | Aucune variable visuelle de la page Carte ne doit être déclarée sur . | Le header et le footer utilisent encore certains alias --gp-* historiques. | Déclarer --gp-brand / --gp-text / --gp-muted sur body modifierait donc | leur apparence lors du passage Accueil -> Carte en navigation AJAX. |-------------------------------------------------------------------------- */ /* ======================================================================== GREEN PIZZ — CARTE.CSS V59 Scope contenu carte : #page-content.carte-page + classes carte/pizza (existent uniquement sur la page Carte, donc inoffensifs ailleurs). Composants GLOBAUX (panier « cart- », modale « pm- ») : scopes body[data-gp-page] (= toutes les pages qui posent data-gp-page) afin que le panier garde EXACTEMENT le meme style sur tout le site, pas seulement sur la page Carte. Les tokens --gp- sont declares sur les conteneurs panier/modale (jamais sur le body) pour ne pas toucher header/footer. ======================================================================== */ /* ═══════════════════════════════════════════════ TOKENS LOCAUX À LA PAGE CARTE IMPORTANT : jamais sur , afin de ne pas modifier header/footer. ═══════════════════════════════════════════════ */ #page-content.carte-page, body[data-gp-page] .cart-fab, body[data-gp-page] .cart-overlay, body[data-gp-page] .pm-overlay{ --gp-bg:var(--gpds-canvas,#f7f3ee); --gp-surface:var(--gpds-surface,#fffdf9); --gp-text:var(--gpds-ink,#20231f); --gp-text-soft:#34382f; --gp-muted:var(--gpds-muted,#625d56); --gp-line:var(--gpds-line,rgba(16,59,43,.13)); --gp-brand:var(--gpds-primary,#103b2b); --gp-brand-light:var(--gpds-interface,#214d3b); --gp-accent:var(--gpds-accent,#df8f0a); --gp-accent-pale:var(--gpds-light-accent,#fff1d4); --gp-accent-text:var(--gpds-accent-dark,#b86d00); --gp-red:#c0392b; --gp-shadow-card:0 10px 28px rgba(16,59,43,.055); --gp-shadow-hover:0 18px 42px rgba(16,59,43,.11); --gp-radius-xl:26px; --gp-radius-lg:18px; --gp-radius-md:14px; --gp-sticky-top:96px; --gp-img:128px; } #page-content.carte-page{ background:var(--gpds-canvas,#f7f3ee); color:var(--gpds-ink,#20231f); } /* ═══════════════════════════════════════════════ TOOLBAR FILTRE (sticky) ═══════════════════════════════════════════════ */ /* Mode « carte seule » (bouton « Commander », ?commander) : on garde le TITRE (.carte-intro-head) + la zone menu (barre de filtres + pizzas). Le reste (intro, cartes info, statut, CTA) est masqué. « La carte » (sans param) = page complète. */ #page-content.carte-page.carte-commander-mode > .section:not(.carte-menu-zone):not(.carte-intro){ display:none !important; } #page-content.carte-page.carte-commander-mode .carte-intro{ padding-bottom:0 !important; } #page-content.carte-page.carte-commander-mode .carte-intro > .container > :not(.carte-intro-head){ display:none !important; } /* Arrivée en douceur (fondu + léger glissé) */ #page-content.carte-page.carte-commander-mode .carte-intro-head{ animation:gpCarteIn .45s ease both; } #page-content.carte-page.carte-commander-mode .carte-menu-zone{ animation:gpCarteFade .5s ease .06s both; } @keyframes gpCarteIn{ from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} } @keyframes gpCarteFade{ from{opacity:0} to{opacity:1} } @media(prefers-reduced-motion:reduce){ #page-content.carte-page.carte-commander-mode .carte-intro-head, #page-content.carte-page.carte-commander-mode .carte-menu-zone{ animation:none; } } /* Smartphone : footer masqué en mode carte-seule (arrivée épurée) */ @media(max-width:767px){ #page-content.carte-page.carte-commander-mode ~ .site-footer{ display:none !important; } } body[data-gp-page] .carte-toolbar-sticky{ position:sticky; top:var(--gp-sticky-top); z-index:30; scroll-margin-top:calc(var(--gp-sticky-top) + 4px); /* arrivée d'ancre pile sous le header */ padding:10px 0 20px; background:linear-gradient(to bottom, rgba(246,243,238,1) 0%, rgba(246,243,238,.97) 65%, rgba(246,243,238,0) 100%); backdrop-filter:blur(10px); } body[data-gp-page] .carte-toolbar{ background:rgba(255,255,255,.88); border:1px solid rgba(23,59,45,.08); border-radius:26px; padding:8px; box-shadow:0 2px 12px rgba(16,24,20,.06); } body[data-gp-page] .carte-toolbar__shell{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:8px; } body[data-gp-page] .carte-toolbar__nav-btn{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%; border:1px solid rgba(23,59,45,.10); background:#fff; color:var(--gp-brand); cursor:pointer; transition:.18s ease; flex:0 0 auto; font-size:1.1rem; } body[data-gp-page] .carte-toolbar__nav-btn:hover{ border-color:rgba(23,59,45,.2); box-shadow:0 4px 14px rgba(16,24,20,.08); } body[data-gp-page] .carte-toolbar__nav-btn:disabled{ opacity:.32; cursor:default; box-shadow:none; } body[data-gp-page] .carte-toolbar__viewport{ position:relative; min-width:0; overflow:hidden; } body[data-gp-page] .carte-toolbar__viewport::before, body[data-gp-page] .carte-toolbar__viewport::after{ content:""; position:absolute; top:0; bottom:0; width:32px; z-index:2; pointer-events:none; opacity:0; transition:opacity .18s; } body[data-gp-page] .carte-toolbar__viewport::before{ left:0; background:linear-gradient(to right,rgba(255,255,255,.95),rgba(255,255,255,0)); } body[data-gp-page] .carte-toolbar__viewport::after{ right:0; background:linear-gradient(to left, rgba(255,255,255,.95),rgba(255,255,255,0)); } body[data-gp-page] .carte-toolbar__viewport.has-left-shadow::before{ opacity:1; } body[data-gp-page] .carte-toolbar__viewport.has-right-shadow::after{ opacity:1; } body[data-gp-page] .carte-toolbar__row{ display:flex; align-items:center; gap:8px; overflow-x:auto; scroll-behavior:smooth; scrollbar-width:none; padding:2px 0; } body[data-gp-page] .carte-toolbar__row::-webkit-scrollbar{ display:none; } body[data-gp-page] .carte-filter{ display:inline-flex; align-items:center; gap:8px; white-space:nowrap; min-height:44px; padding:0 18px; border-radius:999px; background:#fff; border:1px solid rgba(23,59,45,.09); color:var(--gp-brand); font-weight:700; font-size:.9rem; transition:.2s ease; cursor:pointer; flex:0 0 auto; user-select:none; } body[data-gp-page] .carte-filter:hover{ border-color:rgba(23,59,45,.2); box-shadow:0 4px 14px rgba(16,24,20,.07); } body[data-gp-page] .carte-filter.is-active{ background:var(--gp-brand); color:#fff; border-color:var(--gp-brand); box-shadow:0 6px 20px rgba(23,59,45,.25); } body[data-gp-page] .carte-filter__count{ display:inline-flex; align-items:center; justify-content:center; min-width:24px; height:24px; padding:0 6px; border-radius:999px; background:rgba(23,59,45,.09); font-size:.74rem; font-weight:900; line-height:1; } body[data-gp-page] .carte-filter.is-active .carte-filter__count{ background:rgba(255,255,255,.16); } /* ═══════════════════════════════════════════════ SECTIONS ═══════════════════════════════════════════════ */ body[data-gp-page] .carte-sections{ display:flex; flex-direction:column; } body[data-gp-page] .carte-section{ padding:28px 0 6px; scroll-margin-top:188px; } body[data-gp-page] .carte-section.is-hidden{ display:none; } body[data-gp-page] .carte-section + .carte-section{ border-top:1px solid var(--gp-line); } body[data-gp-page] .carte-section__head{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; } body[data-gp-page] .carte-section__eyebrow{ display:block; color:var(--gp-brand); font-size:.74rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; margin-bottom:5px; opacity:.7; } body[data-gp-page] .carte-section__title{ margin:0; font-size:clamp(1.25rem,1.8vw,1.6rem); font-weight:800; line-height:1.1; color:var(--gp-text); } body[data-gp-page] .carte-section__count{ display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; border-radius:50%; background:#fff; border:1px solid var(--gp-line); color:var(--gp-brand); font-weight:900; font-size:.88rem; flex:0 0 auto; } /* ═══════════════════════════════════════════════ GRILLE LISTE — 2 colonnes sur desktop ═══════════════════════════════════════════════ */ body[data-gp-page] .pizza-list-grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; } /* ═══════════════════════════════════════════════ CARTE HORIZONTALE (pizza-row) ═══════════════════════════════════════════════ */ body[data-gp-page] .pizza-row{ position:relative; display:flex; align-items:center; gap:16px; background:var(--gp-surface); border:1px solid var(--gp-line); border-radius:var(--gp-radius-lg); padding:16px; transition:box-shadow .2s ease, border-color .2s ease, transform .2s ease; box-shadow:var(--gp-shadow-card); opacity:0; transform:translateY(10px); animation:gpFadeUp .38s ease forwards; cursor:pointer; } body[data-gp-page] .pizza-row:hover{ box-shadow:var(--gp-shadow-hover); border-color:rgba(23,59,45,.16); transform:translateY(-2px); } /* ── Texte ── */ body[data-gp-page] .pizza-row__body{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:5px; } body[data-gp-page] .pizza-row__name{ margin:0; font-size:1rem; font-weight:700; line-height:1.22; color:var(--gp-text); } body[data-gp-page] .pizza-row__desc{ margin:0; font-size:.84rem; color:var(--gp-muted); line-height:1.55; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; } body[data-gp-page] .pizza-row__footer{ display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-top:6px; } body[data-gp-page] .pizza-row__price{ font-size:.95rem; font-weight:800; color:var(--gp-brand); } body[data-gp-page] .pizza-row__badge-pill{ display:inline-flex; align-items:center; padding:2px 9px; border-radius:999px; background:var(--gp-accent-pale); color:var(--gp-accent-text); font-size:.7rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; } body[data-gp-page] .pizza-row__badge-pill--hot{ background:#fff0ee; color:var(--gp-red); } body[data-gp-page] .pizza-row__badge-pill--new{ background:#e8f4ee; color:#14542e; } /* ── Bouton + style Wolt : onglet collé au coin haut-droit de l'image ── */ body[data-gp-page] .pizza-row__media{ flex:0 0 var(--gp-img); width:var(--gp-img); height:var(--gp-img); border-radius:var(--gp-radius-md); background:linear-gradient(135deg,#ede4d4,#f6efe3); overflow:hidden; position:relative; } body[data-gp-page] .pizza-row__media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease; } body[data-gp-page] .pizza-row:hover .pizza-row__media img{ transform:scale(1.05); } /* Bouton positionné directement dans l'image : stable dès le premier chargement */ body[data-gp-page] .pizza-row__add{ position:absolute; top:0; right:0; width:36px; height:36px; border-radius:0 var(--gp-radius-md) 0 12px; background:rgba(214,234,222,.95); color:var(--gp-brand); border:none; cursor:pointer; z-index:5; display:inline-flex; align-items:center; justify-content:center; transition:background .15s, transform .12s; box-shadow:0 1px 6px rgba(16,24,20,.10); pointer-events:all; } body[data-gp-page] .pizza-row__add:hover{ background:rgba(190,220,205,.99); transform:scale(1.08); } body[data-gp-page] .pizza-row__add:active{ transform:scale(.92); } body[data-gp-page] .pizza-row__add.is-added{ background:rgba(23,59,45,.2); color:var(--gp-brand); } body[data-gp-page] .pizza-row__add svg{ display:block; pointer-events:none; } /* Placeholder SVG pizza */ body[data-gp-page] .pizza-row__placeholder{ width:100%; height:100%; border-radius:var(--gp-radius-md); overflow:hidden; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#ede4d4,#f6efe3); } body[data-gp-page] .pizza-row__placeholder svg{ width:52px; height:52px; opacity:.28; } /* ── Badge image (Populaire etc.) ── */ body[data-gp-page] .pizza-row__img-badge{ position:absolute; bottom:7px; left:7px; display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; background:rgba(23,59,45,.82); color:#fff; font-size:.65rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; backdrop-filter:blur(4px); } /* ── Panier flottant — desktop : pastille « 🛍 Panier · 2 » ── */ body[data-gp-page] .cart-fab{ position:fixed; bottom:24px; right:24px; z-index:800; display:none; align-items:center; gap:9px; background:var(--gp-brand); color:#fff; border:none; border-radius:999px; padding:9px 18px; cursor:pointer; box-shadow:0 8px 32px rgba(23,59,45,.35); font-size:1rem; font-weight:800; transition:transform .2s, box-shadow .2s; } body[data-gp-page] .cart-fab:hover{ transform:translateY(-2px); box-shadow:0 12px 36px rgba(23,59,45,.4); } body[data-gp-page] .cart-fab__ico{ display:inline-flex; width:22px; height:22px; flex:0 0 auto; } body[data-gp-page] .cart-fab__ico svg{ width:100%; height:100%; display:block; } body[data-gp-page] .cart-fab__label{ white-space:nowrap; } /* Badge COMPTEUR (nombre de produits) — pastille orange, comme la maquette. */ body[data-gp-page] .cart-fab__badge{ display:inline-flex; align-items:center; justify-content:center; min-width:23px; height:23px; padding:0 6px; border-radius:999px; background:#e5811a; color:#fff; font-size:.8rem; font-weight:900; line-height:1; } body[data-gp-page] .cart-fab__total{ font-weight:800; opacity:.92; white-space:nowrap; } body[data-gp-page] .cart-fab__total::before{ content:"·"; margin-right:8px; opacity:.55; } /* État VIDE → texte simple, pas d'icône/badge/total. */ body[data-gp-page] .cart-fab.is-empty .cart-fab__ico, body[data-gp-page] .cart-fab.is-empty .cart-fab__badge, body[data-gp-page] .cart-fab.is-empty .cart-fab__total{ display:none; } /* ── Mobile/tablette : barre fixe pleine largeur en bas (style Wolt) ── */ @media(max-width:980px){ body[data-gp-page] .cart-fab{ bottom:0; right:0; left:0; border-radius:0; padding:16px 24px; padding-bottom:calc(16px + env(safe-area-inset-bottom, 0px)); justify-content:center; box-shadow:0 -4px 24px rgba(16,24,20,.14); } body[data-gp-page] .cart-fab:hover{ transform:none; } } /* ── Pas la place (écran très étroit) : le bouton se réduit à l'icône + le compteur ── */ @media(max-width:430px){ body[data-gp-page] .cart-fab:not(.is-empty) .cart-fab__label, body[data-gp-page] .cart-fab:not(.is-empty) .cart-fab__total{ display:none; } } /* ── Drawer panier ── */ body[data-gp-page] .cart-overlay{ position:fixed; inset:0; z-index:850; display:flex; justify-content:flex-end; } body[data-gp-page] .cart-overlay[hidden]{ display:none; } body[data-gp-page] .cart-backdrop{ position:absolute; inset:0; background:rgba(10,18,14,.45); backdrop-filter:blur(3px); animation:cartBdIn .2s ease; } @keyframes cartBdIn{ from{opacity:0} to{opacity:1} } body[data-gp-page] .cart-drawer{ position:relative; z-index:1; width:100%; max-width:420px; height:100%; background:#fff; display:flex; flex-direction:column; animation:cartIn .26s cubic-bezier(.34,1.2,.64,1); box-shadow:-8px 0 40px rgba(16,24,20,.12); } @keyframes cartIn{ from{transform:translateX(100%)} to{transform:translateX(0)} } body[data-gp-page] .cart-drawer__head{ display:flex; align-items:center; justify-content:space-between; padding:20px 22px 16px; border-bottom:1px solid var(--gp-line); } body[data-gp-page] .cart-drawer__title{ margin:0; font-size:1.15rem; font-weight:800; color:var(--gp-text); } body[data-gp-page] .cart-drawer__close{ width:36px; height:36px; border-radius:50%; border:1px solid var(--gp-line); background:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--gp-text); transition:background .15s; } body[data-gp-page] .cart-drawer__close:hover{ background:var(--gp-bg); } body[data-gp-page] .cart-drawer__body{ flex:1 1 auto; overflow-y:auto; padding:16px 22px; display:flex; flex-direction:column; gap:12px; } body[data-gp-page] .cart-empty-msg{ text-align:center; padding:40px 0; color:var(--gp-muted); font-size:.95rem; } /* Ligne article panier */ body[data-gp-page] .cart-item{ display:flex; align-items:center; gap:8px; padding:5px; border-radius:var(--gp-radius-md); border:1px solid var(--gp-line); background:var(--gp-bg); } body[data-gp-page] .cart-item__img{ width:56px; height:56px; border-radius:10px; object-fit:cover; flex:0 0 auto; background:linear-gradient(135deg,#ede4d4,#f6efe3); } body[data-gp-page] .cart-item__img--placeholder{ display:flex; align-items:center; justify-content:center; } body[data-gp-page] .cart-item__img--placeholder svg{ width:28px; height:28px; opacity:.3; } body[data-gp-page] .cart-item__info{ flex:1 1 auto; min-width:0; } body[data-gp-page] .cart-item__name{ font-size:.9rem; font-weight:700; color:var(--gp-text); margin:0 0 2px; } body[data-gp-page] .cart-item__price{ font-size:.82rem; color:var(--gp-muted); } body[data-gp-page] .cart-item__qty{ display:flex; align-items:center; gap:8px; flex:0 0 auto; } body[data-gp-page] .cart-item__btn{ width:28px; height:28px; border-radius:50%; border:1px solid var(--gp-line); background:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--gp-brand); font-size:1.1rem; font-weight:700; line-height:1; transition:background .15s, border-color .15s; } body[data-gp-page] .cart-item__btn:hover{ background:var(--gp-brand); color:#fff; border-color:var(--gp-brand); } body[data-gp-page] .cart-item__count{ font-size:.9rem; font-weight:800; min-width:20px; text-align:center; color:var(--gp-text); } /* Pied du panier */ body[data-gp-page] .cart-drawer__foot{ padding:16px 22px 24px; border-top:1px solid var(--gp-line); display:flex; flex-direction:column; gap:12px; } body[data-gp-page] .cart-total{ display:flex; justify-content:space-between; align-items:center; } body[data-gp-page] .cart-total__label{ font-size:.95rem; color:var(--gp-muted); } body[data-gp-page] .cart-total__amount{ font-size:1.3rem; font-weight:900; color:var(--gp-brand); } body[data-gp-page] .cart-note{ font-size:.78rem; color:var(--gp-muted); line-height:1.5; background:var(--gp-bg); border-radius:10px; padding:10px 12px; border:1px solid var(--gp-line); } body[data-gp-page] .cart-call-btn{ display:flex; align-items:center; justify-content:center; gap:10px; background:var(--gp-brand); color:#fff; text-decoration:none; border-radius:14px; padding:16px 20px; font-size:1rem; font-weight:700; transition:background .18s, transform .18s; border:none; cursor:pointer; width:100%; } body[data-gp-page] .cart-call-btn:hover{ background:var(--gp-brand-light); transform:translateY(-1px); } /* Validation commande / paiement test. Stripe remplacera cette étape plus tard. */ body[data-gp-page] .cart-stripe-btn{ display:flex; align-items:center; justify-content:center; gap:10px; background:#173b2d; color:#fff; text-decoration:none; border-radius:14px; padding:16px 20px; font-size:1rem; font-weight:800; transition:background .18s, transform .18s, opacity .18s; border:none; cursor:pointer; width:100%; } body[data-gp-page] .cart-stripe-btn:hover:not(:disabled){ background:#24533f; transform:translateY(-1px); } body[data-gp-page] .cart-stripe-btn:disabled{ display:flex; opacity:.48; cursor:not-allowed; transform:none; } @media(max-width:480px){ body[data-gp-page] .cart-drawer{ max-width:100%; } body[data-gp-page] .cart-fab{ bottom:0; right:0; padding:12px 18px; font-size:.92rem; } } body[data-gp-page] .carte-empty{ background:#fff; border:1px solid var(--gp-line); border-radius:var(--gp-radius-xl); padding:32px; text-align:center; } @keyframes gpFadeUp{ to{ opacity:1; transform:translateY(0); } } /* ═══════════════════════════════════════════════ RESPONSIVE GRILLE ═══════════════════════════════════════════════ */ /* Mobile : 1 colonne */ body[data-gp-page] .pizza-list-grid{ grid-template-columns:1fr; } @media (min-width:767px){ body[data-gp-page] .pizza-list-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } } @media (min-width:980px){ body[data-gp-page] .pizza-list-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); } } @media (max-width:767px){ #page-content.carte-page{ --gp-sticky-top:75px; --gp-img:110px; } body[data-gp-page] .carte-toolbar-sticky{ padding:8px 0 16px; } body[data-gp-page] .carte-toolbar{ border-radius:20px; padding:6px; } body[data-gp-page] .carte-toolbar__shell{ grid-template-columns:36px minmax(0,1fr) 36px; gap:6px; } body[data-gp-page] .carte-toolbar__nav-btn{ width:36px; height:36px; font-size:1rem; } body[data-gp-page] .carte-filter{ min-height:40px; padding:0 14px; font-size:.86rem; } body[data-gp-page] .carte-section__head{ gap:12px; } body[data-gp-page] .carte-section__count{ min-width:38px; min-height:38px; font-size:.82rem; } /* ── Mobile : liste style Wolt — séparateurs simples ── */ body[data-gp-page] .pizza-list-grid{ gap:0; background:transparent; } body[data-gp-page] .pizza-row{ border:none; border-bottom:1px solid var(--gp-line); border-radius:0; box-shadow:none; background:transparent; padding:16px 0; gap:14px; transform:none !important; animation:none; opacity:1; } body[data-gp-page] .pizza-row:last-child{ border-bottom:none; padding-bottom:0; } body[data-gp-page] .pizza-row:hover{ background:transparent; box-shadow:none; transform:none !important; } body[data-gp-page] .pizza-row:hover .pizza-row__media img{ transform:none; } body[data-gp-page] .pizza-row__name{ font-size:.97rem; } body[data-gp-page] .pizza-row__media{ border-radius:var(--gp-radius-md); } /* Chaque section = carte blanche sur mobile */ body[data-gp-page] .carte-section{ background:#fff; border-radius:var(--gp-radius-xl); padding:16px 16px 8px; border:1px solid var(--gp-line); box-shadow:0 1px 6px rgba(16,24,20,.05); margin-bottom:12px; } body[data-gp-page] .carte-section + .carte-section{ border-top:1px solid var(--gp-line); margin-top:0; } body[data-gp-page] .carte-section__head{ margin-bottom:0; padding-bottom:14px; border-bottom:1px solid var(--gp-line); } body[data-gp-page] .carte-section__eyebrow{ display:none; } } @media (max-width:400px){ #page-content.carte-page{ --gp-img:96px; } } /* ═══ MODAL ═══ */ body[data-gp-page] .pm-overlay{ position:fixed; inset:0; z-index:900; display:flex; align-items:flex-end; justify-content:center; } body[data-gp-page] .pm-overlay[hidden]{ display:none; } body[data-gp-page] .pm-backdrop{ position:absolute; inset:0; background:rgba(10,18,14,.52); backdrop-filter:blur(4px); animation:pmBdIn .22s ease; } @keyframes pmBdIn{ from{opacity:0} to{opacity:1} } body[data-gp-page] .pm-sheet{ position:relative; z-index:1; width:100%; max-width:520px; background:#fff; border-radius:26px 26px 0 0; overflow:hidden; animation:pmUp .28s cubic-bezier(.34,1.28,.64,1); max-height:92dvh; display:flex; flex-direction:column; } @media(min-width:600px){ body[data-gp-page] .pm-overlay{ align-items:center; padding:20px; } body[data-gp-page] .pm-sheet{ border-radius:26px; max-height:88dvh; } @keyframes pmUp{ from{opacity:0;transform:scale(.93) translateY(16px)} to{opacity:1;transform:none} } } @media(max-width:599px){ @keyframes pmUp{ from{transform:translateY(100%)} to{transform:translateY(0)} } } /* Hero : carré pleine largeur de la modal */ body[data-gp-page] .pm-hero{ position:relative; flex:0 0 auto; width:100%; aspect-ratio:1/1; background:linear-gradient(135deg,#ede4d4,#f6efe3); overflow:hidden; } body[data-gp-page] .pm-hero__img-wrap{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; } body[data-gp-page] .pm-hero__img-wrap img{ width:100%; height:100%; object-fit:cover; display:block; } body[data-gp-page] .pm-hero__img-wrap.is-placeholder{ display:flex; align-items:center; justify-content:center; } body[data-gp-page] .pm-hero__img-wrap.is-placeholder svg{ width:90px; height:90px; opacity:.25; } /* Bouton fermer */ body[data-gp-page] .pm-close{ position:absolute; top:14px; right:14px; z-index:10; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.95); backdrop-filter:blur(6px); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; color:#1a1c18; box-shadow:0 2px 12px rgba(0,0,0,.14); transition:background .15s, transform .15s; } body[data-gp-page] .pm-close:hover{ background:#fff; transform:scale(1.08); } /* Corps */ body[data-gp-page] .pm-body{ padding:20px 22px 28px; overflow-y:auto; flex:1 1 auto; display:flex; flex-direction:column; gap:14px; } body[data-gp-page] .pm-meta{ display:flex; flex-direction:column; gap:10px; } body[data-gp-page] .pm-title{ margin:0; font-size:1.35rem; font-weight:800; color:#1a1c18; line-height:1.15; } body[data-gp-page] .pm-price-row{ display:flex; align-items:center; gap:10px; } body[data-gp-page] .pm-price{ font-size:1.15rem; font-weight:800; color:#173b2d; } body[data-gp-page] .pm-badge{ display:inline-flex; align-items:center; padding:3px 11px; border-radius:999px; background:#f4ead1; color:#7a5c1e; font-size:.74rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; } body[data-gp-page] .pm-badge.is-hot{ background:#fff0ee; color:#c0392b; } body[data-gp-page] .pm-badge.is-new{ background:#e8f4ee; color:#14542e; } body[data-gp-page] .pm-desc{ margin:0; font-size:.95rem; color:#6b6f67; line-height:1.65; } body[data-gp-page] .pm-divider{ height:1px; background:rgba(23,59,45,.08); flex:0 0 auto; } /* CTA téléphone */ body[data-gp-page] .pm-cta{ display:flex; align-items:center; justify-content:center; gap:10px; background:#173b2d; color:#fff; text-decoration:none; border-radius:14px; padding:15px 20px; font-size:1rem; font-weight:700; letter-spacing:.01em; transition:background .18s, transform .18s; flex:0 0 auto; } body[data-gp-page] .pm-cta:hover{ background:#214d3b; transform:translateY(-1px); } /* ═══════════════════════════════════════════════ CORRECTIFS RESPONSIVE + BOUTON AJOUT PANIER ═══════════════════════════════════════════════ */ body[data-gp-page] .pizza-list-grid{ transition:gap .22s ease; } body[data-gp-page] .pizza-row{ position:relative !important; overflow:visible !important; transition:box-shadow .22s ease, border-color .22s ease, transform .22s ease, background-color .22s ease !important; will-change:transform; } body[data-gp-page] .pizza-row:hover{ box-shadow:var(--gp-shadow-hover) !important; border-color:rgba(23,59,45,.16) !important; transform:translateY(-2px) !important; } body[data-gp-page] .pizza-row__add{ z-index:50 !important; pointer-events:auto !important; } @media (max-width:767px){ body[data-gp-page] .pizza-list-grid{ gap:10px !important; } body[data-gp-page] .pizza-row{ background:#fff !important; border:1px solid var(--gp-line) !important; border-radius:var(--gp-radius-lg) !important; padding:16px !important; box-shadow:var(--gp-shadow-card) !important; } body[data-gp-page] .pizza-row__add{ top:0 !important; right:0 !important; } body[data-gp-page] .pizza-row:hover{ background:#fff !important; box-shadow:var(--gp-shadow-hover) !important; transform:translateY(-2px) !important; } } /* ========================================================================== CARTE GREEN PIZZ — CHARTE V61 ========================================================================== */ body[data-gp-page] #page-content.carte-page{ background:var(--gpds-canvas,#f7f3ee); color:var(--gpds-ink,#20231f); } body[data-gp-page] #page-content.carte-page > .section{ position:relative; padding:clamp(52px,7vw,88px) 0; } body[data-gp-page] #page-content.carte-page > .section + .section::before{ content:""; position:absolute; top:0; left:50%; width:min(calc(100% - 30px),920px); height:1px; transform:translateX(-50%); background:linear-gradient(90deg,transparent,var(--gpds-line,rgba(16,59,43,.13)),transparent); } body[data-gp-page] #page-content.carte-page .container{ width:min(1180px,calc(100% - 32px)); margin-inline:auto; } body[data-gp-page] #page-content.carte-page h1, body[data-gp-page] #page-content.carte-page h2, body[data-gp-page] #page-content.carte-page h3, body[data-gp-page] .pm-title, body[data-gp-page] .cart-drawer__title{ font-family:"Unbounded",Arial,Helvetica,sans-serif; } body[data-gp-page] #page-content.carte-page p, body[data-gp-page] #page-content.carte-page a, body[data-gp-page] #page-content.carte-page button, body[data-gp-page] #page-content.carte-page span, body[data-gp-page] #page-content.carte-page small, body[data-gp-page] .cart-overlay, body[data-gp-page] .pm-overlay, body[data-gp-page] .cart-fab{ font-family:"Google Sans",Arial,Helvetica,sans-serif; } /* --- INTRO --- */ body[data-gp-page] #page-content.carte-page .carte-intro{ padding-top:clamp(34px,5vw,62px); } body[data-gp-page] #page-content.carte-page .carte-breadcrumb{ display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 28px; color:var(--gpds-muted,#625d56); font-size:.84rem; font-weight:700; } body[data-gp-page] #page-content.carte-page .carte-breadcrumb a{ color:var(--gpds-primary,#103b2b); text-decoration:none; } body[data-gp-page] #page-content.carte-page .carte-breadcrumb a:hover{ text-decoration:underline; } body[data-gp-page] #page-content.carte-page .carte-intro-head{ max-width:980px; margin:0 auto; text-align:center; } body[data-gp-page] #page-content.carte-page .carte-kicker{ width:max-content; min-height:30px; display:inline-flex; align-items:center; gap:8px; margin:0 auto 14px; padding:6px 12px; border-radius:999px; color:var(--gpds-primary,#103b2b); background:rgba(16,59,43,.065); font-size:.72rem; font-weight:900; letter-spacing:.075em; text-transform:uppercase; } body[data-gp-page] #page-content.carte-page .carte-kicker::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--gpds-accent,#df8f0a); } body[data-gp-page] #page-content.carte-page .carte-kicker.is-light{ margin:0 0 12px; color:#fff1d4; background:rgba(255,255,255,.09); } body[data-gp-page] #page-content.carte-page .carte-intro h1{ max-width:1000px; margin:0 auto; color:var(--gpds-primary,#103b2b); text-align:center; font-size:clamp(2.15rem,4.6vw,3.45rem); line-height:1.02; letter-spacing:-.055em; font-weight:900; text-wrap:balance; } body[data-gp-page] #page-content.carte-page .carte-intro-lead{ max-width:770px; margin:22px auto 0; color:var(--gpds-muted,#625d56); text-align:center; font-size:clamp(1rem,1.25vw,1.12rem); line-height:1.72; text-wrap:pretty; } body[data-gp-page] #page-content.carte-page .carte-intro-lead strong{ color:var(--gpds-primary,#103b2b); } body[data-gp-page] #page-content.carte-page .carte-proof{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; width:min(100%,900px); margin:34px auto 0; } body[data-gp-page] #page-content.carte-page .carte-proof-item{ min-width:0; display:flex; align-items:center; gap:12px; padding:15px; border:1px solid var(--gpds-line,rgba(16,59,43,.13)); border-radius:18px; background:var(--gpds-surface,#fffdf9); box-shadow:0 10px 28px rgba(16,59,43,.05); } body[data-gp-page] #page-content.carte-page .carte-proof-icon{ flex:0 0 40px; width:40px; height:40px; display:grid; place-items:center; border-radius:14px; color:var(--gpds-primary,#103b2b); background:var(--gpds-light-accent,#fff1d4); } body[data-gp-page] #page-content.carte-page .carte-proof-icon svg{ width:21px; height:21px; } body[data-gp-page] #page-content.carte-page .carte-proof-item > span:last-child{ display:flex; min-width:0; flex-direction:column; gap:3px; } body[data-gp-page] #page-content.carte-page .carte-proof-item strong{ color:var(--gpds-primary,#103b2b); font-size:.92rem; line-height:1.25; } body[data-gp-page] #page-content.carte-page .carte-proof-item small{ color:var(--gpds-muted,#625d56); font-size:.77rem; line-height:1.35; } body[data-gp-page] #page-content.carte-page .carte-intro-local{ max-width:880px; margin:24px auto 0; color:var(--gpds-muted,#625d56); text-align:center; font-size:.88rem; line-height:1.65; } body[data-gp-page] #page-content.carte-page .carte-intro-local strong{ color:var(--gpds-primary,#103b2b); font-weight:800; } /* --- ZONE CARTE --- */ body[data-gp-page] #page-content.carte-page .carte-menu-zone{ position:relative; border-radius:25px; background:var(--gpds-section,#fbf7f0); } /* |-------------------------------------------------------------------------- | TOOLBAR STICKY — V57 |-------------------------------------------------------------------------- | Elle reste immédiatement sous le .site-header. | Comme elle est contenue dans .carte-menu-zone, elle s'arrête à la fin | de cette section et ne suit plus le CTA situé dans la section suivante. |-------------------------------------------------------------------------- */ body[data-gp-page] #page-content.carte-page{ --gp-carte-header-h:84px; } /* Catégories masquées (réglage ERP) : le div ne sert que d'ancrage #commander, on neutralise son style */ body[data-gp-page] #page-content.carte-page .carte-toolbar-sticky.is-anchor-only{ position:static; padding:0; margin:0; min-height:0; background:none; scroll-margin-top:var(--gp-carte-header-h); } body[data-gp-page] #page-content.carte-page .carte-toolbar-sticky{ position:sticky; top:var(--gp-carte-header-h); z-index:30; padding:0 0 24px; background:linear-gradient( to bottom, rgba(251,247,240,1) 0%, rgba(251,247,240,.97) 70%, rgba(251,247,240,0) 100% ); backdrop-filter:none; } body[data-gp-page].gp-notice-active #page-content.carte-page .carte-toolbar-sticky{ top:calc(var(--gp-carte-header-h) + var(--gp-notice-h,48px)); } @media (max-width:860px){ body[data-gp-page] #page-content.carte-page{ --gp-carte-header-h:var(--gp-mobile-header-h,76px); } } @media (max-width:640px){ body[data-gp-page].gp-notice-active #page-content.carte-page .carte-toolbar-sticky{ top:calc(var(--gp-carte-header-h) + var(--gp-notice-h,42px)); } } body[data-gp-page] #page-content.carte-page .carte-toolbar{ padding:8px; border:1px solid var(--gpds-line,rgba(16,59,43,.13)); border-radius:999px; background:rgba(255,253,249,.94); box-shadow:0 10px 28px rgba(16,59,43,.06); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); } body[data-gp-page] #page-content.carte-page .carte-toolbar__nav-btn{ border-color:var(--gpds-line,rgba(16,59,43,.13)); color:var(--gpds-primary,#103b2b); background:var(--gpds-surface,#fffdf9); } body[data-gp-page] #page-content.carte-page .carte-filter{ min-height:44px; border-color:transparent; color:var(--gpds-primary,#103b2b); background:transparent; font-weight:800; } body[data-gp-page] #page-content.carte-page .carte-filter:hover{ border-color:var(--gpds-line,rgba(16,59,43,.14)); background:var(--gpds-surface,#fffdf9); } body[data-gp-page] #page-content.carte-page .carte-filter.is-active{ color:#fff; border-color:var(--gpds-primary,#103b2b); background:var(--gpds-primary,#103b2b); box-shadow:0 8px 22px rgba(16,59,43,.18); } body[data-gp-page] #page-content.carte-page .carte-filter__count{ background:rgba(16,59,43,.08); } body[data-gp-page] #page-content.carte-page .carte-filter.is-active .carte-filter__count{ background:rgba(255,255,255,.18); } /* --- CATÉGORIES --- */ body[data-gp-page] #page-content.carte-page .carte-section{ padding:34px 0 18px; border-top:0; } body[data-gp-page] #page-content.carte-page .carte-section + .carte-section{ position:relative; margin-top:14px; border-top:0; } body[data-gp-page] #page-content.carte-page .carte-section + .carte-section::before{ content:""; position:absolute; top:0; left:50%; width:min(calc(100% - 20px),760px); height:1px; transform:translateX(-50%); background:linear-gradient(90deg,transparent,var(--gpds-line,rgba(16,59,43,.13)),transparent); } body[data-gp-page] #page-content.carte-page .carte-section__head{ margin-bottom:18px; } body[data-gp-page] #page-content.carte-page .carte-section__eyebrow{ color:var(--gpds-accent-dark,#b86d00); opacity:1; font-size:.7rem; font-weight:900; } body[data-gp-page] #page-content.carte-page .carte-section__title{ color:var(--gpds-primary,#103b2b); font-family:"Unbounded",Arial,Helvetica,sans-serif; font-size:clamp(1.35rem,2vw,1.75rem); letter-spacing:-.035em; font-weight:850; } body[data-gp-page] #page-content.carte-page .carte-section__count{ min-width:44px; min-height:44px; border-color:var(--gpds-line,rgba(16,59,43,.13)); color:var(--gpds-primary,#103b2b); background:var(--gpds-light-accent,#fff1d4); box-shadow:none; } /* --- PIZZAS --- */ body[data-gp-page] #page-content.carte-page .pizza-list-grid{ gap:14px; } body[data-gp-page] #page-content.carte-page .pizza-row{ min-height:160px; gap:17px; padding:16px; border:1px solid var(--gpds-line,rgba(16,59,43,.13)); border-radius:20px; background:var(--gpds-surface,#fffdf9); box-shadow:0 9px 24px rgba(16,59,43,.045); } body[data-gp-page] #page-content.carte-page .pizza-row:hover{ border-color:rgba(16,59,43,.20) !important; box-shadow:0 16px 38px rgba(16,59,43,.09) !important; } body[data-gp-page] #page-content.carte-page .pizza-row__body{ gap:7px; } body[data-gp-page] #page-content.carte-page .pizza-row__name{ color:var(--gpds-primary,#103b2b); font-family:"Unbounded",Arial,Helvetica,sans-serif; font-size:.96rem; line-height:1.3; font-weight:800; letter-spacing:-.02em; } body[data-gp-page] #page-content.carte-page .pizza-row__desc{ color:var(--gpds-muted,#625d56); font-size:.84rem; line-height:1.5; } body[data-gp-page] #page-content.carte-page .pizza-row__footer{ margin-top:auto; padding-top:5px; } body[data-gp-page] #page-content.carte-page .pizza-row__price{ color:var(--gpds-primary,#103b2b); font-size:1rem; font-weight:900; } body[data-gp-page] #page-content.carte-page .pizza-row__badge-pill{ color:var(--gpds-accent-dark,#b86d00); background:var(--gpds-light-accent,#fff1d4); } body[data-gp-page] #page-content.carte-page .pizza-row__media{ border-radius:16px; background:#eee8df; } body[data-gp-page] #page-content.carte-page .pizza-row__img-badge{ color:#fff; background:rgba(16,59,43,.84); } body[data-gp-page] #page-content.carte-page .pizza-row__add{ color:var(--gpds-primary,#103b2b); background:rgba(255,241,212,.96); box-shadow:0 2px 8px rgba(16,59,43,.10); } body[data-gp-page] #page-content.carte-page .pizza-row__add:hover{ color:#fff; background:var(--gpds-primary,#103b2b); } body[data-gp-page] #page-content.carte-page .pizza-row__add.is-added{ color:#fff; background:var(--gpds-basil,#5f9b43); } /* --- CTA FINAL --- */ body[data-gp-page] #page-content.carte-page .carte-cta-zone{ background:transparent; } body[data-gp-page] #page-content.carte-page .carte-cta{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:30px; align-items:center; margin:0; padding:clamp(26px,4vw,46px); border-radius:38px; color:#fff; background: radial-gradient(circle at 88% 0%,rgba(223,143,10,.25),transparent 34%), linear-gradient(135deg,#103b2b,#173b2d 72%); box-shadow:0 22px 52px rgba(16,59,43,.15); } body[data-gp-page] #page-content.carte-page .carte-cta h2{ max-width:700px; margin:0; color:#fff; font-family:"Unbounded",Arial,Helvetica,sans-serif; font-size:clamp(1.65rem,3vw,2.7rem); line-height:1.08; letter-spacing:-.04em; } body[data-gp-page] #page-content.carte-page .carte-cta p{ max-width:720px; margin:14px 0 0; color:rgba(255,255,255,.76); font-size:.96rem; line-height:1.65; } body[data-gp-page] #page-content.carte-page .carte-cta__actions{ display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; } body[data-gp-page] #page-content.carte-page .carte-cta-btn{ min-height:48px; display:inline-flex; align-items:center; justify-content:center; padding:12px 18px; border:1px solid transparent; border-radius:999px; text-decoration:none; font-size:.88rem; line-height:1.1; font-weight:850; transition:transform .2s ease,box-shadow .2s ease,background .2s ease; } body[data-gp-page] #page-content.carte-page .carte-cta-btn.is-accent{ color:#24180a; background:var(--gpds-accent,#df8f0a); } body[data-gp-page] #page-content.carte-page .carte-cta-btn.is-light{ color:#fff; border-color:rgba(255,255,255,.30); background:rgba(255,255,255,.08); } @media (hover:hover){ body[data-gp-page] #page-content.carte-page .carte-cta-btn:hover{ transform:translateY(-2px); } } /* --- PANIER / MODAL ALIGNÉS AVEC LA CHARTE --- */ body[data-gp-page] .cart-fab{ background:var(--gpds-primary,#103b2b); box-shadow:0 10px 32px rgba(16,59,43,.28); } /* Le badge compteur garde sa pastille orange + texte blanc (défini plus haut). */ body[data-gp-page] .cart-drawer, body[data-gp-page] .pm-sheet{ background:var(--gpds-surface,#fffdf9); } body[data-gp-page] .cart-drawer__head, body[data-gp-page] .cart-drawer__foot, body[data-gp-page] .pm-divider{ border-color:var(--gpds-line,rgba(16,59,43,.13)); } body[data-gp-page] .cart-drawer__title, body[data-gp-page] .pm-title{ color:var(--gpds-primary,#103b2b); } body[data-gp-page] .cart-total__amount, body[data-gp-page] .pm-price{ color:var(--gpds-primary,#103b2b); } body[data-gp-page] .cart-call-btn, body[data-gp-page] .pm-cta{ background:var(--gpds-primary,#103b2b); } body[data-gp-page] .cart-call-btn:hover, body[data-gp-page] .pm-cta:hover{ background:var(--gpds-interface,#214d3b); } /* --- TABLETTE --- */ @media (max-width:980px){ body[data-gp-page] #page-content.carte-page .carte-cta{ grid-template-columns:1fr; } body[data-gp-page] #page-content.carte-page .carte-cta__actions{ justify-content:flex-start; } } /* --- SMARTPHONE --- */ @media (max-width:767px){ body[data-gp-page] #page-content.carte-page > .section{ padding:44px 0; } body[data-gp-page] #page-content.carte-page .container{ width:min(100% - 22px,1180px); } body[data-gp-page] #page-content.carte-page .carte-breadcrumb{ margin-bottom:22px; font-size:.79rem; } body[data-gp-page] #page-content.carte-page .carte-intro h1{ font-size:clamp(1.9rem,3.6vw,3.6rem); line-height:1.04; } body[data-gp-page] #page-content.carte-page .carte-intro-lead{ margin-top:17px; font-size:.96rem; line-height:1.64; } body[data-gp-page] #page-content.carte-page .carte-proof{ grid-template-columns:1fr; gap:8px; max-width:560px; margin-top:22px; } body[data-gp-page] #page-content.carte-page .carte-proof-item{ min-height:64px; padding:11px 13px; } body[data-gp-page] #page-content.carte-page .carte-intro-local{ margin-top:18px; font-size:.82rem; } body[data-gp-page] #page-content.carte-page .carte-menu-zone{ border-radius:25px; } body[data-gp-page] #page-content.carte-page .carte-toolbar{ border-radius:20px; } body[data-gp-page] #page-content.carte-page .carte-section{ margin-bottom:12px; padding:17px 14px 10px; border:1px solid var(--gpds-line,rgba(16,59,43,.13)); border-radius:22px; background:var(--gpds-surface,#fffdf9); box-shadow:0 8px 24px rgba(16,59,43,.045); } body[data-gp-page] #page-content.carte-page .carte-section + .carte-section{ margin-top:0; border-top:1px solid var(--gpds-line,rgba(16,59,43,.13)); } body[data-gp-page] #page-content.carte-page .carte-section + .carte-section::before{ display:none; } body[data-gp-page] #page-content.carte-page .carte-section__head{ margin-bottom:0; padding-bottom:13px; border-bottom:1px solid var(--gpds-line,rgba(16,59,43,.10)); } body[data-gp-page] #page-content.carte-page .pizza-list-grid{ gap:0 !important; } body[data-gp-page] #page-content.carte-page .pizza-row{ min-height:0; gap:13px; padding:15px 0 !important; border:0 !important; border-bottom:1px solid var(--gpds-line,rgba(16,59,43,.10)) !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; transform:none !important; } body[data-gp-page] #page-content.carte-page .pizza-row:last-child{ border-bottom:0 !important; } body[data-gp-page] #page-content.carte-page .pizza-row:hover{ background:transparent !important; box-shadow:none !important; transform:none !important; } body[data-gp-page] #page-content.carte-page .pizza-row__media{ flex-basis:106px; width:106px; height:106px; border-radius:16px; } body[data-gp-page] #page-content.carte-page .pizza-row__add{ top:0 !important; right:0 !important; border-radius:0 16px 0 12px; } body[data-gp-page] #page-content.carte-page .pizza-row__name{ font-size:.92rem; } body[data-gp-page] #page-content.carte-page .pizza-row__desc{ -webkit-line-clamp:2; font-size:.8rem; } body[data-gp-page] #page-content.carte-page .carte-cta{ gap:22px; margin:0; padding:24px 18px; border-radius:26px; } body[data-gp-page] #page-content.carte-page .carte-cta__actions{ display:grid; grid-template-columns:1fr; } } @media (max-width:400px){ body[data-gp-page] #page-content.carte-page .pizza-row__media{ flex-basis:94px; width:94px; height:94px; } } @media (prefers-reduced-motion:reduce){ body[data-gp-page] #page-content.carte-page *, body[data-gp-page] #page-content.carte-page *::before, body[data-gp-page] #page-content.carte-page *::after, body[data-gp-page] .cart-overlay *, body[data-gp-page] .pm-overlay *{ scroll-behavior:auto !important; animation:none !important; transition:none !important; } } body[data-gp-page] .cart-note__link{ color:var(--gpds-primary,#103b2b); font-weight:800; }