/* ═══════════════════════════════════════════════════════════════════
   Comparateur de prix — style inspiré idealo.fr
   ═══════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;900&display=swap');
:root{
  --orange:#ff6900; --orange-d:#e85d00;
  --navy:#373373; --blue:#1565c0; --blue-d:#0d47a1; --header:#373373;
  --bg:#f2f4f7; --card:#fff; --ink:#1a2233; --muted:#6b7280;
  --line:#e6e8ee; --ok:#16a34a; --ko:#dc2626;
  --radius:12px; --shadow:0 1px 3px rgba(10,37,64,.08);
  --shadow-h:0 6px 20px rgba(10,37,64,.12);
}
*{box-sizing:border-box}
body{margin:0;font-family:'Roboto',-apple-system,system-ui,"Segoe UI",Helvetica,Arial,sans-serif;
  background:var(--bg);color:var(--ink);line-height:1.5;font-size:15px}
a{color:inherit;text-decoration:none}
.container{max-width:1180px;margin:0 auto;padding:0 18px}

/* Fond blanc + halos décoratifs continus (toutes les pages front) */
body.has-deco{
  background:
    radial-gradient(460px 460px at 92% 1%,  rgba(55,51,115,.09), transparent 70%),
    radial-gradient(420px 420px at 4% 22%,  rgba(255,105,0,.06), transparent 70%),
    radial-gradient(440px 440px at 96% 48%, rgba(55,51,115,.07), transparent 70%),
    radial-gradient(420px 420px at 2% 72%,  rgba(255,105,0,.05), transparent 70%),
    radial-gradient(440px 440px at 94% 92%, rgba(55,51,115,.06), transparent 70%),
    #ffffff;
  background-attachment:fixed;
}
/* Calque décoratif : cercles + sphères 3D + points (accueil) */
.home-deco{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.home-deco span{position:absolute;display:block}
.d-ring{border-radius:50%;border:2px solid rgba(55,51,115,.13)}
.d-ring1{width:230px;height:230px;top:110px;right:5%}
.d-ring2{width:130px;height:130px;bottom:16%;left:7%;border-color:rgba(255,105,0,.20)}
.d-ring3{width:340px;height:340px;top:46%;right:-90px;border-color:rgba(55,51,115,.07)}
.d-dots{width:130px;height:90px;top:16%;left:2%;
  background-image:radial-gradient(rgba(55,51,115,.28) 2px,transparent 2px);
  background-size:17px 17px;opacity:.5}

/* ── Topbar ─────────────────────────────────────────────── */
.topbar{background:var(--header);position:sticky;top:0;z-index:20}
.topbar-inner{display:flex;align-items:center;gap:26px;padding:13px 26px;max-width:none}

/* Menu hamburger */
.burger{background:none;border:0;color:#fff;line-height:1;cursor:pointer;padding:0 2px;display:flex;align-items:center}

/* Logo blanc + soulignement orange */
.logo{font-weight:800;font-size:28px;letter-spacing:-.5px;color:#fff;white-space:nowrap;
  border-bottom:4px solid var(--orange);padding-bottom:2px;line-height:1}
.logo b{color:#fff;font-weight:800}

/* Barre de recherche blanche à coins arrondis + loupe à l'intérieur */
.search{display:flex;flex:1;max-width:760px;background:#fff;border:0;
  border-radius:6px;overflow:hidden;align-items:stretch}
.search input{flex:1;border:0;padding:13px 18px;font-size:16px;outline:none;min-width:0;color:var(--ink)}
.search input::placeholder{color:#9aa3b0}
.search button{border:0;background:#fff;color:#9aa3b0;padding:0 18px;cursor:pointer;
  display:flex;align-items:center}
.search button:hover{color:var(--navy)}

/* Actions à droite : Ma sélection / Alerte prix / Connexion */
.topbar-actions{display:flex;gap:22px;align-items:center;color:#fff;font-size:15px;font-weight:500;margin-left:auto}
.topbar-actions a{display:flex;align-items:center;gap:8px;color:#fff;white-space:nowrap}
.topbar-actions a:hover{color:#cfe0f3}
.topbar-actions .ic{display:inline-flex;align-items:center}
.topbar-actions .sep{width:1px;height:24px;background:rgba(255,255,255,.3)}

/* Sélecteur de pays (géolocalisation) */
.geo-pick{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);
  border-radius:8px;padding:5px 9px}
.geo-flag{font-size:18px;line-height:1}
.geo-pick select{background:transparent;border:0;color:#fff;font-size:14px;font-weight:600;
  cursor:pointer;outline:none;max-width:150px}
.geo-pick select option{color:#1a2233}

/* ── Méga-menu (9.PNG) ──────────────────────────────────── */
.megamenu{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border-top:3px solid var(--orange);
  box-shadow:0 14px 30px rgba(10,37,64,.18);z-index:40}
.megamenu.is-open{display:block}
.mm-bar{display:none}
.mm-inner{display:grid;grid-template-columns:260px 1fr;gap:0;max-width:1180px;margin:0 auto;
  padding:22px 24px;max-height:78vh;overflow:auto}
.mm-cats{display:flex;flex-direction:column;border-right:1px solid var(--line);padding-right:14px}
.mm-cat{padding:8px 10px;border-radius:6px;color:var(--navy);font-size:15px;font-weight:600}
.mm-cat:hover{background:#f4f6fb}
.mm-cat.is-active{font-weight:800;color:var(--navy);background:#f0f4ff}
.mm-panels{padding-left:24px}
.mm-panel{display:none}
.mm-panel.is-active{display:block}
.mm-sublist{column-count:3;column-gap:24px}
.mm-sublist a{display:block;break-inside:avoid;padding:7px 0;color:#374151;font-size:14px}
.mm-sublist a:hover{color:var(--orange)}
.mm-sublist .mm-plus{font-weight:800;color:var(--navy)}
body.mm-open{overflow:hidden}

/* Barre de navigation catégories (navy, icônes, item promo orange) */
.catnav{background:var(--header);border-top:1px solid rgba(255,255,255,.08)}
.catnav-inner{display:flex;gap:2px;overflow-x:auto;padding:8px 18px;max-width:none;justify-content:center}
.catnav a{display:flex;flex-direction:column;align-items:center;gap:5px;color:#cfdbea;
  padding:8px 12px;font-size:12px;font-weight:600;white-space:nowrap;border-radius:8px;min-width:62px}
.catnav a:hover{color:#fff;background:rgba(255,255,255,.08)}
.catnav .cn-ic{display:inline-flex;align-items:center;color:#fff}
.catnav a.is-promo{background:var(--orange);color:#fff}
.catnav a.is-promo:hover{background:var(--orange-d);color:#fff}

/* ── Carrousel pleine largeur — fond blanc, texte + 2 produits ── */
.hero{position:relative;overflow:hidden}   /* fond transparent → halos de la page continus */
.hero-track{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.hero-slide{min-width:100%;display:flex;align-items:center}
.hero-inner{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:40px 24px;width:100%;
  display:grid;grid-template-columns:1fr 430px;gap:40px;align-items:center}
.hero-c{max-width:520px}
.hero-kicker{display:inline-block;background:var(--orange);color:#fff;font-size:12px;font-weight:800;
  padding:6px 14px;border-radius:999px;letter-spacing:.05em;text-transform:uppercase;margin-bottom:16px}
.hero-c h2{font-size:40px;font-weight:900;line-height:1.08;margin:0 0 14px;color:var(--navy)}
.hero-c p{font-size:18px;margin:0 0 24px;color:#5b5b6b;line-height:1.5}
.hero-btn{display:inline-block;background:var(--orange);color:#fff;font-weight:800;font-size:16px;
  padding:14px 30px;border-radius:10px;transition:.15s}
.hero-btn:hover{background:var(--orange-d);transform:translateY(-1px)}
.hero-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);background:#fff;border:1px solid var(--line);
  box-shadow:var(--shadow);width:44px;height:44px;border-radius:50%;font-size:26px;line-height:1;color:var(--navy);
  cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:3;transition:.15s}
.hero-arrow:hover{background:#f4f6fb}
.hero-prev{left:18px}.hero-next{right:18px}
.hero-dots{position:absolute;bottom:14px;left:0;right:0;display:flex;gap:8px;justify-content:center;z-index:3}
.hero-dots button{width:9px;height:9px;border-radius:50%;border:0;background:#d3d6e0;cursor:pointer;padding:0;transition:.25s}
.hero-dots button.is-on{background:var(--orange);width:26px;border-radius:6px}

/* ── Section « Les offres à ne pas manquer » (2.PNG) ────── */
.deals{margin:24px 0 8px}
.deals-layout{display:grid;grid-template-columns:1fr 300px;gap:18px;align-items:stretch}
.deals-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.deal{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;box-shadow:var(--shadow);transition:.15s}
.deal:hover{box-shadow:var(--shadow-h);transform:translateY(-3px)}
.deal-top{display:flex;justify-content:space-between;align-items:flex-start;padding:10px 12px 0}
.deal-badge{background:var(--orange);color:#fff;font-weight:800;font-size:13px;padding:3px 8px;border-radius:6px}
.deal-heart{color:#c4cad8;display:inline-flex}
.deal:hover .deal-heart{color:var(--orange)}
.deal-img{height:150px;margin:4px 14px;background:#fff center/contain no-repeat}
.deal-body{padding:2px 14px 16px;display:flex;flex-direction:column;gap:8px}
.deal-title{font-size:14px;margin:0;font-weight:600;color:var(--ink);line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:38px}
.deal-price{display:flex;flex-direction:column;line-height:1.2}
.deal-price span{font-size:12px;color:var(--muted)}
.deal-price strong{color:var(--orange);font-size:21px;font-weight:800}
.deal-price--empty{color:var(--muted);font-size:13px}

/* Bannière sponsorisée */
.promo-banner{background:#ff5a1f;color:#fff;border-radius:var(--radius);padding:22px 22px;
  display:flex;flex-direction:column;gap:6px;position:relative;min-height:280px;overflow:hidden}
.promo-banner::after{content:"";position:absolute;right:-40px;bottom:-40px;width:160px;height:160px;
  background:rgba(255,255,255,.12);border-radius:50%}
.promo-tag{position:absolute;top:10px;right:14px;font-size:10px;text-transform:uppercase;
  letter-spacing:.06em;color:rgba(255,255,255,.75)}
.promo-date{align-self:flex-start;background:rgba(0,0,0,.18);color:#fff;font-size:12px;font-weight:700;
  padding:4px 10px;border-radius:999px;letter-spacing:.02em}
.promo-summer{font-size:40px;font-weight:900;letter-spacing:.04em;line-height:1;margin:4px 0 2px;
  color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.12)}
.promo-banner h3{font-size:21px;margin:2px 0 0;color:#fff;line-height:1.2;font-weight:800;position:relative}
.promo-banner p{margin:0;font-size:13px;opacity:.92;position:relative}
.promo-btn{margin-top:auto;align-self:flex-start;background:#fff;color:var(--orange-d);
  padding:11px 20px;border-radius:8px;font-weight:800;font-size:14px}
.promo-btn:hover{background:#fff7f0;color:var(--orange-d)}

@media(max-width:860px){
  .deals-layout{grid-template-columns:1fr}
  .deals-grid{grid-template-columns:repeat(2,1fr)}
  .promo-banner{min-height:180px}
}

/* ── Section « Nos meilleurs bons plans » (3.PNG) ───────── */
.bestdeals{margin:34px 0}
.bd-row{display:flex;gap:16px;overflow-x:auto;padding:4px 2px 10px;scroll-snap-type:x mandatory}
.bd-row::-webkit-scrollbar{height:8px}
.bd-row::-webkit-scrollbar-thumb{background:#cfd6e0;border-radius:8px}
.bd{flex:0 0 200px;scroll-snap-align:start;background:#fff;border:1px solid var(--line);
  border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:.15s}
.bd:hover{box-shadow:var(--shadow-h);transform:translateY(-3px)}
.bd-imgwrap{position:relative;padding:14px 14px 6px}
.bd-badge{position:absolute;top:0;left:0;background:var(--orange);color:#fff;font-weight:800;
  font-size:13px;padding:4px 10px;border-radius:0 0 8px 0}
.bd-heart{position:absolute;top:8px;right:10px;color:#2f6fc0;display:inline-flex}
.bd:hover .bd-heart{color:#1e4f8f}
.bd-img{height:150px;background:#fff center/contain no-repeat}
.bd-body{padding:0 14px 16px;display:flex;flex-direction:column;gap:6px}
.bd-tag{font-size:13px;color:var(--muted)}
.bd-best{align-self:flex-start;background:#1565c0;color:#fff;font-size:12px;font-weight:700;
  padding:3px 9px;border-radius:5px}
.bd-title{font-size:14px;margin:0;font-weight:700;color:var(--navy);line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:55px}
.bd-rating{display:flex;align-items:center;gap:6px;font-size:12px;flex-wrap:wrap}
.bd-note{color:#1565c0;font-weight:700}
.bd-stars{color:#ffb400;letter-spacing:1px}
.bd-count{color:var(--muted)}
.bd-price{display:flex;flex-direction:column;line-height:1.2;margin-top:2px}
.bd-price span{font-size:12px;color:var(--muted)}
.bd-price strong{color:var(--orange);font-size:20px;font-weight:800}

/* Étiquette énergie (A..G) */
.energy{position:absolute;left:0;bottom:14px;color:#fff;font-weight:800;font-size:14px;
  padding:3px 14px 3px 9px;clip-path:polygon(0 0,82% 0,100% 50%,82% 100%,0 100%)}
.energy--A{background:#00a651}.energy--B{background:#51b848}.energy--C{background:#acca2b}
.energy--D{background:#f6c700;color:#3a3000}.energy--E{background:#f7a30a}
.energy--F{background:#f06f1e}.energy--G{background:#e2231a}

/* Bouton « Plus de bons plans » */
.bd-more{text-align:center;margin-top:18px}
.bd-morebtn{display:inline-block;background:#1565c0;color:#fff;font-weight:700;font-size:15px;
  padding:11px 26px;border-radius:8px}
.bd-morebtn:hover{background:#0d47a1}

/* ── Section « Fête des Pères » (4.PNG) ─────────────────── */
.gifts{display:grid;grid-template-columns:1fr 360px;gap:22px;margin:34px 0;align-items:stretch}
.gifts--rev{grid-template-columns:360px 1fr}
.gifts-left h2{font-size:21px;margin:0 0 16px;color:var(--navy);font-weight:800}
.gifts-sub{font-size:17px;margin:22px 0 14px;color:var(--navy);font-weight:700}
.mini-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mini-tile{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);
  border-radius:10px;padding:12px 14px;font-size:13px;font-weight:600;color:var(--navy);
  box-shadow:var(--shadow);transition:.15s}
.mini-tile:hover{box-shadow:var(--shadow-h);transform:translateY(-2px)}
.mini-img{flex:0 0 46px;width:46px;height:46px;border-radius:8px;background:#f1f3f9 center/cover no-repeat}
.mini-lbl{line-height:1.2}
.gifts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gifts-grid .bd{flex:initial}

/* Bannière image à droite */
.gifts-banner{position:relative;border-radius:14px;overflow:hidden;min-height:300px;
  background-size:cover;background-position:center;display:flex;align-items:flex-end;color:#fff}
.gb-text{padding:26px 24px}
.gb-text h3{font-size:30px;margin:0 0 6px;color:#fff;font-weight:900;line-height:1.1}
.gb-text p{margin:0 0 16px;font-size:15px;color:#fff;opacity:.95}
.gb-btn{display:inline-block;background:#fff;color:var(--navy);font-weight:800;font-size:14px;
  padding:10px 20px;border-radius:8px}
.gifts-banner:hover .gb-btn{background:#f0f4ff}

@media(max-width:860px){
  .gifts{grid-template-columns:1fr}
  .gifts--rev{grid-template-columns:1fr}
  .mini-tiles{grid-template-columns:1fr}
  .gifts-grid{grid-template-columns:repeat(2,1fr)}
  .gifts-banner{min-height:220px}
}

/* ── Section « Tendances actuelles » (6.PNG) ────────────── */
.trends{margin:34px 0}
.trends h2{font-size:21px;margin:0 0 18px;color:var(--navy);font-weight:800}
.trends-row{display:flex;gap:20px;overflow-x:auto;padding:6px 2px 12px}
.trends-row::-webkit-scrollbar{height:8px}
.trends-row::-webkit-scrollbar-thumb{background:#cfd6e0;border-radius:8px}
.trend{flex:0 0 150px;text-align:center;color:var(--navy);font-weight:600;font-size:14px}
.trend-circle{display:block;width:150px;height:150px;border-radius:50%;
  background:#f1f3f5 center/cover no-repeat;margin:0 auto 12px;transition:.15s}
.trend:hover .trend-circle{box-shadow:var(--shadow-h);transform:translateY(-4px)}
.trend-lbl{line-height:1.25;padding:0 6px}

/* ── Hero ───────────────────────────────────────────────── */
.hero{text-align:center;padding:48px 0 30px}
.hero h1{font-size:32px;margin:0 0 8px;color:var(--navy);font-weight:800}
.hero p{color:var(--muted);margin:0 0 24px;font-size:17px}
.search--big{max-width:640px;margin:0 auto;border:2px solid var(--header);border-radius:8px}
.search--big input{padding:15px 18px;font-size:17px}
.search--big button{background:var(--orange);color:#fff;font-size:18px;padding:0 22px}
.search--big button:hover{background:var(--orange-d);color:#fff}

/* ── Tuiles catégories ──────────────────────────────────── */
section h2{font-size:21px;margin:0 0 18px;color:var(--navy);font-weight:800}
.cats{margin:34px 0}
.cats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px}
.cat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 12px;text-align:center;display:flex;flex-direction:column;gap:10px;
  align-items:center;font-weight:700;font-size:14px;color:var(--navy);
  box-shadow:var(--shadow);transition:.15s}
.cat:hover{box-shadow:var(--shadow-h);transform:translateY(-3px)}
.cat-icon{font-size:34px;line-height:1}

/* ── Grille produits ────────────────────────────────────── */
.grid-section{margin:36px 0}
.count{color:var(--muted);margin:-10px 0 16px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}

/* ── Page de recherche (13.PNG) ─────────────────────────── */
.search-page{display:grid;grid-template-columns:260px 1fr;gap:24px;margin:18px 0 40px;align-items:start}
.filters{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;font-size:14px}
.filters-head{display:flex;justify-content:space-between;align-items:center;font-weight:800;color:var(--navy);font-size:16px;margin-bottom:6px}
.filters-head a{font-size:13px;color:var(--blue);font-weight:600}
.filter-grp{border-top:1px solid var(--line);padding:14px 0}
.filter-grp h3{font-size:14px;color:var(--navy);margin:0 0 10px;font-weight:800}
.price-form{display:flex;align-items:center;gap:6px;margin-bottom:10px}
.price-form input{width:100%;min-width:0;padding:7px 8px;border:1px solid var(--line);border-radius:6px;font-size:13px}
.price-form button{flex:0 0 auto;border:0;background:var(--blue);color:#fff;width:32px;height:32px;border-radius:6px;font-size:18px;font-weight:700;cursor:pointer}
.brackets{list-style:none;margin:0;padding:0}
.brackets a{display:flex;justify-content:space-between;gap:8px;padding:6px 8px;border-radius:6px;color:#374151}
.brackets a:hover{background:#f4f6fb}
.brackets a.is-on{background:#fff3e8;color:#b85c00;font-weight:700}
.brackets em{color:var(--muted);font-style:normal}
.check{display:flex;gap:8px;align-items:flex-start;cursor:pointer;color:#374151;line-height:1.4}
.results-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px;flex-wrap:wrap}
.results-head h1{font-size:20px;color:var(--navy);margin:0}
.rcount{color:var(--muted);font-weight:600}
.sort-form{font-size:14px;color:#374151;display:flex;align-items:center;gap:8px}
.sort-form select{padding:7px 10px;border:1px solid var(--line);border-radius:7px;font-size:14px;cursor:pointer}
.results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.results-grid .bd{flex:initial}
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;transition:.15s;box-shadow:var(--shadow)}
.card-heart{position:absolute;top:9px;right:10px;z-index:2;color:#c4cad8;cursor:pointer;display:inline-flex}
.card-heart:hover{color:var(--orange)}
.card-heart.is-fav{color:var(--orange)}
.card:hover{box-shadow:var(--shadow-h);transform:translateY(-3px)}
.card-img{height:180px;background:#fff center/contain no-repeat;margin:14px 14px 0;border-radius:8px}
.card-body{padding:12px 16px 16px;display:flex;flex-direction:column;gap:4px}
.card-brand{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700}
.card-title{font-size:15px;margin:0;font-weight:600;line-height:1.35;color:var(--blue);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:41px}
.card-price{margin-top:6px;color:var(--muted);font-size:13px}
.card-price strong{display:block;color:var(--navy);font-size:21px;font-weight:800}
.card-price--empty{color:var(--muted);font-size:13px;margin-top:6px}
.card-meta{font-size:12px;color:var(--orange);font-weight:700;margin-top:2px}
.empty{color:var(--muted);background:var(--card);border:1px dashed var(--line);
  padding:26px;border-radius:var(--radius);text-align:center}

/* ── Fiche produit ──────────────────────────────────────── */
.breadcrumb{margin:18px 0;color:var(--muted);font-size:14px}
.breadcrumb a:hover{color:var(--blue)}
/* Section haute (10.PNG) : galerie | infos | évolution prix */
.pdp-top{display:grid;grid-template-columns:340px 1fr 280px;gap:24px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);align-items:start}
.pdp-top>*{min-width:0}   /* évite le débordement horizontal (variantes, graphique) */

/* Galerie */
.pdp-gallery{display:flex;gap:12px}
.pdp-stock{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:700;margin:2px 0 10px}
.pdp-stock .pdp-stock-dot{width:9px;height:9px;border-radius:50%}
.pdp-stock.is-in{color:#1a9d4b}
.pdp-stock.is-in .pdp-stock-dot{background:#1a9d4b;box-shadow:0 0 0 3px rgba(26,157,75,.18)}
.pdp-stock.is-out{color:#d63333}
.pdp-stock.is-out .pdp-stock-dot{background:#d63333;box-shadow:0 0 0 3px rgba(214,51,51,.16)}
.cmp-stock{display:inline-block;margin-top:4px;font-size:12px;font-weight:700}
.cmp-stock.is-in{color:#1a9d4b}
.cmp-stock.is-out{color:#d63333}
.pdp-thumbs{display:flex;flex-direction:column;gap:10px}
.pdp-thumb{width:52px;height:52px;border:1px solid var(--line);border-radius:8px;
  background:#fff center/contain no-repeat;cursor:pointer}
.pdp-thumb.is-active{border-color:var(--orange)}
.pdp-main{position:relative;flex:1}
.pdp-badge{position:absolute;top:0;left:0;background:var(--orange);color:#fff;font-weight:800;
  font-size:14px;padding:5px 11px;border-radius:8px 0 8px 0;z-index:1}
.pdp-mainimg{display:block;height:300px;background:#fff center/contain no-repeat}

/* Infos */
.pdp-info{position:relative}
.pdp-heart{position:absolute;top:0;right:0;background:none;border:0;color:#2f6fc0;cursor:pointer;padding:4px}
.pdp-heart:hover{color:#1e4f8f}
.pdp-info h1{font-size:24px;margin:0 50px 14px 0;color:var(--navy);line-height:1.25}
.pdp-apercu,.pdp-similar{font-size:14px;color:#374151;margin:0 0 12px;line-height:1.6}
.pdp-apercu b,.pdp-similar b{color:var(--navy)}
.pdp-apercu a,.pdp-similar a{color:var(--blue)}
.pdp-apercu a:hover,.pdp-similar a:hover{text-decoration:underline}
.pdp-vlabel{display:block;font-weight:700;color:var(--navy);margin:6px 0 10px}
.pdp-vrow{display:flex;gap:12px;flex-wrap:wrap}
.pdp-vcard{position:relative;width:130px;border:1px solid var(--line);border-radius:10px;
  padding:10px;display:flex;flex-direction:column;gap:3px}
.pdp-vcard.is-best{border:2px solid var(--blue)}
.pdp-vbest{display:block;background:var(--blue);color:#fff;font-size:11px;font-weight:700;
  padding:2px 7px;border-radius:5px;align-self:flex-start;margin-bottom:2px}
.pdp-vbadge{position:absolute;top:8px;right:8px;background:var(--orange);color:#fff;font-weight:800;font-size:11px;padding:2px 6px;border-radius:5px}
.pdp-vimg{height:70px;background:#fff center/contain no-repeat;margin:2px 0}
.pdp-vname{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pdp-vsub{font-size:11px;color:var(--muted)}
.pdp-vprice{font-size:16px;font-weight:800;color:var(--orange)}

/* Évolution du prix */
.pdp-price{border:1px solid var(--line);border-radius:10px;padding:14px}
.pdp-price-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;
  font-weight:700;color:var(--navy);font-size:15px}
.pdp-tabs{display:inline-flex;gap:4px}
.pdp-tabs button{border:0;cursor:pointer;font-size:11px;font-weight:600;padding:3px 8px;border-radius:5px;
  background:#f1f3f9;color:var(--muted)}
.pdp-tabs button.is-active{background:var(--navy);color:#fff}
.pdp-nochart{color:var(--muted);font-size:13px;margin:8px 0}
.pdp-chartwrap{position:relative;width:100%;height:84px;cursor:crosshair}
.pdp-chart{width:100%;height:84px;display:block}
.pdp-cursor{position:absolute;top:0;bottom:0;width:1px;background:#c9ccd6;display:none;pointer-events:none;transform:translateX(-0.5px)}
.pdp-dot{position:absolute;width:10px;height:10px;border-radius:50%;background:#ff6900;border:2px solid #fff;
  box-shadow:0 0 0 1px #ff6900;display:none;pointer-events:none;transform:translate(-50%,-50%)}
.pdp-tip{position:absolute;display:none;pointer-events:none;transform:translateX(-50%);
  background:var(--navy);color:#fff;border-radius:6px;padding:5px 9px;font-size:12px;white-space:nowrap;
  text-align:center;z-index:3;box-shadow:0 4px 12px rgba(10,37,64,.25)}
.pdp-tip b{display:block;font-size:13px}
.pdp-tip span{opacity:.8;font-size:11px}
.pdp-alert{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:12px;
  background:#fff;border:1.5px solid var(--blue);color:var(--blue);font-weight:700;font-size:14px;
  padding:10px;border-radius:8px;cursor:pointer}
.pdp-alert:hover{background:#eef4ff}
.pdp-save{margin-top:12px;background:#fff7f0;border:1px solid #ffd9b8;border-radius:8px;
  padding:11px 12px;font-size:14px;color:#374151}
.pdp-save strong{color:var(--orange);font-weight:800}

/* Détails produit (12.PNG) */
.pdp-details{margin:30px 0}
.pdp-details h2{font-size:22px;color:var(--navy);margin:0 0 16px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.specs-wrap{display:grid;grid-template-columns:320px 1fr;gap:30px;align-items:start}
.specs-media{height:280px;background:#fff center/contain no-repeat}
.specs-tables{padding-top:6px}
.specs-h{font-size:16px;color:var(--navy);font-weight:800;margin:22px 0 8px}
.specs-table{width:100%;border-collapse:collapse}
.specs-table td{padding:9px 14px;font-size:14px;vertical-align:top}
.specs-table tr:nth-child(odd){background:#f5f6f9}
.specs-k{color:var(--muted);width:42%}
.specs-v{color:#1a2233}
.specs-desc{color:#374151;line-height:1.7;max-width:860px;margin-top:22px}

/* Tableau offres */
.offers{margin:32px 0}
.offers-table{width:100%;border-collapse:collapse;background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.offers-table th,.offers-table td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--line)}
.offers-table th{background:#f8fafc;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.offers-table tr:last-child td{border-bottom:0}
.offers-table tr.is-best{background:#fff7f0}
.store-cell{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--navy)}
.store-logo{height:26px;width:auto}
.price-cell{font-weight:800;font-size:20px;color:var(--navy)}
.ok{color:var(--ok);font-weight:600}.ko{color:var(--ko)}
.btn{display:inline-block;background:var(--orange);color:#fff;padding:10px 18px;
  border-radius:8px;font-weight:700;cursor:pointer;border:0;font-size:14px}
.btn:hover{background:var(--orange-d)}

/* ── Comparer les prix (11.PNG) ─────────────────────────── */
.cmp-head{display:flex;align-items:center;gap:22px;background:#f1f3f7;border:1px solid var(--line);
  border-radius:10px 10px 0 0;padding:14px 18px;flex-wrap:wrap}
.cmp-head h2{margin:0;font-size:20px;color:var(--navy)}
.cmp-filter{display:flex;align-items:center;gap:7px;font-size:14px;color:#374151;cursor:pointer}
.cmp-sort{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:14px;color:#374151}
.cmp-sort button{border:1px solid var(--line);background:#fff;padding:6px 14px;border-radius:7px;font-weight:600;cursor:pointer;color:var(--navy)}
.cmp-sort button.is-active{border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
.cmp-headrow,.cmp-row{display:grid;grid-template-columns:1.7fr 1.1fr 1.25fr 1.25fr 132px;gap:14px}
.cmp-headrow{padding:12px 18px;font-size:13px;color:var(--muted);background:#fff;border:1px solid var(--line);border-top:0}
.cmp-list{border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px;background:#fff}
.cmp-row{padding:18px;border-top:1px solid var(--line);align-items:start}
.cmp-row:first-child{border-top:0}
/* Ligne complète du meilleur prix : dégradé orange 100% → 0% */
.cmp-row.is-best{background:linear-gradient(90deg,#ff6900 0%,rgba(255,105,0,0) 100%)}
.cmp-row.is-best .cmp-name a,.cmp-row.is-best .cmp-big{color:#fff}
.cmp-name a{color:var(--blue);font-size:14px;line-height:1.4;font-weight:600;
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.cmp-name a:hover{text-decoration:underline}
.cmp-big{font-size:24px;font-weight:800;color:var(--navy);line-height:1}
.cmp-incl{font-size:12px;color:var(--muted);margin-top:6px}
.cmp-besttotal{margin-top:8px;background:#fff;border:1px solid var(--orange);border-radius:8px;padding:6px 10px;font-size:12px;font-weight:800;color:#1a2233}
.cmp-besttotal span{display:block;font-weight:600;color:#1a2233}
.cmp-pay{display:flex;flex-wrap:wrap;gap:5px;align-content:flex-start}
.cmp-pay .pay{font-size:10px;font-weight:700;color:#374151;background:#f1f3f7;border:1px solid var(--line);border-radius:4px;padding:3px 6px;line-height:1.1}
.cmp-ship{font-size:13px;color:#374151}
.cmp-deliv b{color:var(--navy)}
.cmp-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22a447;margin-right:6px}
.cmp-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.cmp-tags span{font-size:11px;color:var(--muted);background:#f1f3f7;border:1px solid var(--line);border-radius:4px;padding:2px 6px}
.cmp-return{margin-top:8px;font-size:12px;color:#374151}
.cmp-merchant{font-size:13px}
.cmp-logo{max-height:30px;max-width:110px;display:block;margin-bottom:6px}
.cmp-mname{font-weight:800;color:var(--navy);font-size:15px;display:block;margin-bottom:4px}
.cmp-rate{font-weight:700;font-size:13px}
.cmp-rate.good{color:#22a447}.cmp-rate.mid{color:#e0a800}
.cmp-rate em{color:var(--muted);font-style:normal;font-weight:600}
.cmp-seller{color:var(--muted);font-size:12px;margin-top:6px}
.cmp-act{display:flex;align-items:flex-start;justify-content:flex-end}
.cmp-btn{background:#22a447;color:#fff;font-weight:700;font-size:14px;padding:11px 20px;border-radius:8px;white-space:nowrap}
.cmp-btn:hover{background:#1b8b3a;color:#fff}
.cmp-note{font-size:11px;color:var(--muted);margin:10px 2px 0}

/* Pages message */
.msg-page{text-align:center;padding:80px 0}
.msg-page h1{font-size:52px;margin:0 0 8px;color:var(--navy)}
.msg-page p{color:var(--muted);margin-bottom:22px}

/* Footer complet (7.PNG) */
.site-footer{background:var(--header);color:#cfdbea;margin-top:54px;padding:46px 0 34px}
.footer-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;max-width:1180px;margin:0 auto;padding:0 24px}
.footer-col h4{color:#fff;font-size:17px;margin:0 0 16px;font-weight:800}
.footer-col a{display:block;color:#cfdbea;padding:6px 0;font-size:15px}
.footer-col a:hover{color:#fff}
.footer-app{text-align:center;margin:40px 0 0}
.footer-app h4{color:#fff;font-size:18px;font-weight:800;margin:0 0 18px}
.app-badges{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.app-badge{display:inline-flex;align-items:center;gap:10px;background:#000;color:#fff;
  border-radius:8px;padding:8px 18px;border:1px solid #3a3a3a}
.app-badge:hover{background:#111}
.app-badge span{display:flex;flex-direction:column;line-height:1.1;text-align:left}
.app-badge .ab-sub{font-size:10px;opacity:.85}
.app-badge .ab-main{font-size:18px;font-weight:700}
.footer-legal{text-align:center;margin:32px auto 0;max-width:1100px;padding:0 24px;font-size:14px;color:#cfdbea}
.footer-legal a{color:#cfdbea}
.footer-legal a:hover{color:#fff}
.footer-countries{text-align:center;color:#cfdbea;margin-top:14px;font-size:14px}
.footer-country{display:flex;align-items:center;justify-content:center;gap:9px;margin:20px auto 0;color:#cfdbea;font-size:14px;flex-wrap:wrap}
.footer-country svg{opacity:.8}
.footer-country label{font-weight:600}
.footer-country select{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.22);border-radius:9px;padding:8px 12px;font:inherit;cursor:pointer;max-width:240px}
.footer-country select:focus{outline:0;border-color:#fff}
.footer-country select option{color:#1f2430}
.footer-country-go{background:var(--orange);color:#fff;border:0;border-radius:9px;padding:8px 14px;font:inherit;font-weight:700;cursor:pointer}
.footer-country-go:hover{filter:brightness(1.05)}
.footer-fine{max-width:1120px;margin:22px auto 0;text-align:center;font-size:12px;
  color:#9fb0c6;line-height:1.65;padding:0 24px}

@media(max-width:760px){
  .footer-cols{grid-template-columns:repeat(2,1fr)}
}

/* Admin (inchangé pour l'essentiel) */
.adm-wrap{max-width:960px;margin:30px auto;padding:0 18px}
.adm-login{max-width:360px;margin:80px auto;background:var(--card);padding:28px;border-radius:var(--radius);box-shadow:var(--shadow)}
.adm-login h1{margin:0 0 18px;font-size:22px;color:var(--navy)}
.field{margin-bottom:14px}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:5px}
.field input,.field select,.field textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font-size:14px;font-family:inherit}
.alert{padding:11px 14px;border-radius:8px;margin-bottom:14px;font-size:14px}
.alert-err{background:#fef2f2;color:var(--ko);border:1px solid #fecaca}
.alert-ok{background:#f0fdf4;color:var(--ok);border:1px solid #bbf7d0}
.adm-table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.adm-table th,.adm-table td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;font-size:14px}

/* ── Connexion / Compte ─────────────────────────────────── */
.auth-alert{background:#fef2f2;color:var(--ko);border:1px solid #fecaca;padding:11px 14px;border-radius:8px;margin-bottom:16px;font-size:14px}
.auth2{display:flex;justify-content:center;padding:30px 0 50px}
.auth2-card{display:grid;grid-template-columns:300px 1fr;max-width:820px;width:100%;background:#fff;
  border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(10,37,64,.10)}
.auth2-hero{background:var(--header);color:#fff;padding:34px 28px;display:flex;flex-direction:column}
.auth2-logo{font-weight:800;font-size:24px;color:#fff;border-bottom:4px solid var(--orange);padding-bottom:2px;align-self:flex-start;line-height:1}
.auth2-hero h2{font-size:24px;font-weight:800;margin:26px 0 22px;line-height:1.2;color:#fff}
.auth2-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.auth2-points li{display:flex;align-items:center;gap:10px;font-size:14px;color:#dbe4ef}
.auth2-points svg{color:var(--orange);flex:0 0 auto}
.auth2-note{margin-top:auto;padding-top:24px;font-size:13px;color:#aebbd0}
.auth2-form{padding:30px}
.auth2-tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:22px}
.auth2-tabs button{flex:1;background:none;border:0;padding:12px 8px;font-size:15px;font-weight:700;
  color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px}
.auth2-form[data-tab=login] .t-login,.auth2-form[data-tab=register] .t-register{color:var(--navy);border-bottom-color:var(--orange)}
.auth2-pane{display:none;flex-direction:column;gap:14px}
.auth2-form[data-tab=login] .pane-login{display:flex}
.auth2-form[data-tab=register] .pane-register{display:flex}
.field2{position:relative}
.field2-ic{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#9aa3b0;display:flex}
.field2 input{width:100%;padding:13px 14px 13px 40px;border:1px solid var(--line);border-radius:9px;font-size:15px}
.field2 input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(21,101,192,.12)}
.auth2-btn{width:100%;background:var(--orange);color:#fff;font-weight:700;font-size:15px;padding:13px;border:0;border-radius:9px;cursor:pointer;margin-top:4px}
.auth2-btn:hover{background:var(--orange-d);color:#fff}
.auth2-btn--alt{background:var(--navy)}
.auth2-btn--alt:hover{background:#2a2858;color:#fff}
.auth2-switch{text-align:center;font-size:13px;color:var(--muted);margin:4px 0 0}
.auth2-switch a{color:var(--blue);font-weight:600}
.social-btns{display:flex;flex-direction:column;gap:10px;margin-bottom:4px}
.social-btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px;border-radius:9px;
  font-weight:700;font-size:15px;border:1px solid var(--line);background:#fff;color:var(--navy);transition:.15s}
.social-btn:hover{background:#f4f6fb}
.social-fb{background:#1877F2;border-color:#1877F2;color:#fff}
.social-fb:hover{background:#1568d6;color:#fff}
.auth2-or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px;margin:14px 0}
.auth2-or::before,.auth2-or::after{content:"";flex:1;height:1px;background:var(--line)}
/* Tableau de bord compte */
.acct{display:grid;grid-template-columns:250px 1fr;gap:22px;margin:24px 0 50px;align-items:start}
.acct-side{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.acct-user{display:flex;gap:12px;align-items:center;padding:20px;border-bottom:1px solid var(--line)}
.acct-avatar{flex:0 0 auto;width:46px;height:46px;border-radius:50%;background:#eef1f6;color:var(--navy);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:17px}
.acct-name{font-weight:700;line-height:1.2;color:var(--navy)}
.acct-mail{font-size:12px;color:var(--muted);word-break:break-all}
.acct-nav{display:flex;flex-direction:column;padding:8px}
.acct-nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:8px;color:var(--ink);font-size:14px;font-weight:600}
.acct-nav a:hover{background:#f4f6fb}
.acct-nav a.is-active{background:#f4f6fb;color:var(--navy)}
.acct-nav a svg{color:var(--muted);flex:0 0 auto}
.acct-nav a.is-active svg{color:var(--navy)}
.acct-nav .acct-out{margin-top:6px;color:var(--muted)}
.acct-main h1{font-size:24px;color:var(--navy);margin:0 0 4px}
.acct-sub{color:var(--muted);margin:0 0 22px}
.acct-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:22px}
.acct-stat{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px;box-shadow:var(--shadow);text-align:center}
.acct-stat .n{display:block;font-size:28px;font-weight:800;color:var(--navy)}
.acct-stat .l{font-size:13px;color:var(--muted)}
.acct-card{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.acct-card-head{padding:16px 20px;border-bottom:1px solid var(--line)}
.acct-card-head h2{margin:0;font-size:16px;color:var(--navy)}
.acct-info{width:100%;border-collapse:collapse}
.acct-info td{padding:14px 20px;font-size:14px;border-bottom:1px solid var(--line)}
.acct-info tr:last-child td{border-bottom:0}
.acct-info td:first-child{color:var(--muted);width:160px}
/* Favoris (cœur actif) */
.fav-btn{cursor:pointer}
.bd-heart.is-fav,.deal-heart.is-fav,.pdp-heart.is-fav{color:var(--orange)}
.fav-btn.is-fav svg{fill:currentColor}
/* Toast de confirmation favori */
.cmp-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);
  background:var(--navy);color:#fff;padding:12px 20px;border-radius:10px;font-size:14px;font-weight:600;
  box-shadow:0 8px 24px rgba(10,37,64,.3);opacity:0;pointer-events:none;transition:.25s;z-index:2000}
.cmp-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
/* Stat cliquable */
.acct-stat{color:inherit;text-decoration:none;transition:.15s}
.acct-stat:hover{box-shadow:var(--shadow-h);transform:translateY(-2px)}
/* États vides + tables compte */
.acct-empty{background:#fff;border:1px dashed var(--line);border-radius:12px;padding:34px;text-align:center;color:var(--muted);line-height:1.7}
.acct-empty .auth2-btn{margin-top:10px}
.alert-ok{background:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0;padding:11px 14px;border-radius:8px;margin-bottom:16px;font-size:14px}
.alerts-table{width:100%;border-collapse:collapse}
.alerts-table th,.alerts-table td{padding:13px 18px;text-align:left;font-size:14px;border-bottom:1px solid var(--line)}
.alerts-table th{background:#f8fafc;color:var(--muted);font-size:12px;text-transform:uppercase}
.alerts-table tr:last-child td{border-bottom:0}
.alerts-table a{color:var(--blue)}
.alert-hit{color:#22a447;font-weight:700;font-size:12px;margin-left:6px}
.alert-del{color:var(--ko)}
/* Formulaires paramètres */
.acct-form{padding:18px 20px;display:flex;flex-direction:column;gap:14px;max-width:440px}
.acct-form label{display:block;font-size:13px;font-weight:600;color:#374151}
.acct-form input{width:100%;margin-top:5px;padding:11px 12px;border:1px solid var(--line);border-radius:8px;font-size:15px}
.acct-form input:disabled{background:#f4f6fb;color:var(--muted)}
.acct-form .auth2-btn{align-self:flex-start;width:auto;padding:11px 22px}
/* Sections du tableau de bord */
.acct-sec{margin-bottom:26px}
.acct-sec-head{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 14px}
.acct-sec-head h2{font-size:17px;color:var(--navy);margin:0}
.acct-sec-head a{font-size:13px;color:var(--blue);font-weight:600}
.acct-mini-empty{color:var(--muted);font-size:14px;background:#fff;border:1px dashed var(--line);border-radius:10px;padding:18px}
.acct-alert-line{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.acct-alert-line:last-child{border-bottom:0}
.acct-alert-line a{color:var(--blue);font-weight:600}
.acct-alert-line strong{color:var(--navy)}

/* Formulaire alerte (fiche produit) */
.pdp-alert-form{margin-top:12px;display:flex;gap:8px}
.pdp-alert-form input{width:110px;min-width:0;padding:0 10px;border:1.5px solid var(--blue);border-radius:8px;font-size:14px}
.pdp-alert{flex:1;margin-top:0 !important;width:auto !important}

/* ── Sélecteur de langue ────────────────────────────────── */
.lang-pick{display:inline-flex;gap:2px;margin-left:4px}
.lang-pick a{color:#cfdbea;font-size:12px;font-weight:700;padding:4px 6px;border-radius:5px;line-height:1}
.lang-pick a:hover{color:#fff}
.lang-pick a.is-on{background:rgba(255,255,255,.18);color:#fff}

/* ── RTL (arabe) ────────────────────────────────────────── */
html[dir=rtl] body,html[dir=rtl] input,html[dir=rtl] button,html[dir=rtl] select,html[dir=rtl] textarea{
  font-family:'Tajawal','Roboto',-apple-system,system-ui,sans-serif}
[dir=rtl] .topbar-actions{margin-left:0;margin-right:auto}
[dir=rtl] .cmp-sort{margin-left:0;margin-right:auto}
[dir=rtl] .promo-tag{right:auto;left:14px}
[dir=rtl] .bd-badge,[dir=rtl] .deal-badge,[dir=rtl] .pdp-badge{left:auto;right:0;border-radius:0 0 0 8px}
[dir=rtl] .bd-heart,[dir=rtl] .deal-heart,[dir=rtl] .card-heart{right:auto;left:10px}
[dir=rtl] .cmp-row.is-best{background:linear-gradient(270deg,#ff6900 0%,rgba(255,105,0,0) 100%)}
[dir=rtl] .gifts-banner,[dir=rtl] .promo-banner{background-position:left center}

/* ── Page À propos ──────────────────────────────────────── */
.about{margin:24px 0 50px}
.ab-hero{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;margin-bottom:34px}
.ab-hero-c h1{font-size:38px;color:var(--navy);margin:0 0 14px;font-weight:900;line-height:1.1}
.ab-hero-c p{font-size:18px;color:#5b5b6b;line-height:1.6;margin:0 0 22px}
.ab-btn{display:inline-block;background:var(--orange);color:#fff;font-weight:800;font-size:16px;padding:13px 28px;border-radius:10px}
.ab-btn:hover{background:var(--orange-d)}
.ab-hero-img{height:300px;border-radius:16px;background:#fff center/cover no-repeat;box-shadow:var(--shadow-h)}
.ab-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0 0 40px}
.ab-stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;text-align:center;box-shadow:var(--shadow)}
.ab-stat .n{display:block;font-size:32px;font-weight:900;color:var(--orange)}
.ab-stat .l{font-size:14px;color:var(--muted)}
.ab-mission{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;margin-bottom:44px}
.ab-mission-img{height:300px;border-radius:16px;background:#fff center/cover no-repeat;box-shadow:var(--shadow-h)}
.ab-mission-c h2{font-size:28px;color:var(--navy);margin:0 0 14px}
.ab-mission-c p{font-size:17px;color:#5b5b6b;line-height:1.7}
.ab-vh{text-align:center;font-size:28px;color:var(--navy);margin:0 0 24px}
.ab-values{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ab-val{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px;text-align:center;box-shadow:var(--shadow)}
.ab-ic{display:inline-flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:50%;
  background:#f0eef8;color:var(--navy);margin-bottom:14px}
.ab-val h3{font-size:18px;color:var(--navy);margin:0 0 8px}
.ab-val p{font-size:14px;color:#5b5b6b;line-height:1.6;margin:0}

/* ── Pages de contenu (comment ça marche / FAQ / contact) ── */
.page{max-width:1000px;margin:26px auto 50px}
.page--narrow{max-width:720px}
.page-title{font-size:32px;color:var(--navy);margin:0 0 8px;font-weight:900}
.page-lead{font-size:18px;color:#5b5b6b;margin:0 0 28px}
.page-cta{text-align:center;margin-top:30px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.step{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px;box-shadow:var(--shadow)}
.step-ic{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:14px;
  background:#f0eef8;color:var(--navy);margin-bottom:14px}
.step h3{font-size:18px;color:var(--navy);margin:0 0 8px}
.step p{font-size:14px;color:#5b5b6b;line-height:1.6;margin:0}
.faq{display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.faq-item summary{cursor:pointer;padding:16px 20px;font-weight:700;color:var(--navy);font-size:16px;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:22px;color:var(--orange);font-weight:400}
.faq-item[open] summary::after{content:"–"}
.faq-a{padding:0 20px 18px;color:#5b5b6b;line-height:1.6;font-size:15px}
.contact-form{display:flex;flex-direction:column;gap:16px;background:#fff;border:1px solid var(--line);
  border-radius:14px;padding:26px;box-shadow:var(--shadow)}
.contact-form label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:#374151}
.contact-form input,.contact-form textarea{padding:12px 14px;border:1px solid var(--line);border-radius:9px;font-size:15px;font-family:inherit}
.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(21,101,192,.12)}
.contact-form .ab-btn{align-self:flex-start;border:0;cursor:pointer}
.legal-h{font-size:19px;color:var(--navy);margin:24px 0 6px}
.legal-p{font-size:15px;color:#5b5b6b;line-height:1.7;margin:0}
.legal-updated{margin-top:28px;font-size:13px;color:var(--muted);font-style:italic}

/* ── Tablette ───────────────────────────────────────────── */
@media(max-width:820px){
  .pdp-top{grid-template-columns:1fr}
  .pdp-mainimg{height:280px}
  .topbar-inner{flex-wrap:wrap;gap:14px}
  .search{order:3;flex-basis:100%;max-width:none}
  .topbar-actions{margin-left:auto}
}

/* ── Smartphone ─────────────────────────────────────────── */
@media(max-width:560px){
  body{font-size:14px}
  .container{padding:0 14px}

  /* Header : logo réduit, actions = icônes seules */
  .topbar-inner{gap:12px;padding:11px 14px}
  .logo{font-size:22px}
  .burger{order:1}
  .logo{order:2}
  .topbar-actions{order:2;gap:16px}
  .topbar-actions .lbl{display:none}          /* on n'affiche que les icônes */
  .topbar-actions .sep{display:none}
  .topbar-actions .ic{font-size:22px}
  .geo-pick{padding:4px 6px;gap:4px}
  .geo-pick select{max-width:52px;font-size:12px}
  .search{order:3}
  .search input{padding:11px 14px;font-size:15px}

  /* Barre catégories masquée sur smartphone (accessible via le menu ☰) */
  .catnav{display:none}

  /* Méga-menu plein écran + navigation 2 niveaux sur mobile */
  .megamenu.is-open{position:fixed;inset:0;height:100%;max-height:none;border-top:0;
    overflow:hidden;z-index:1000;display:flex;flex-direction:column}
  .mm-bar{flex:0 0 auto;display:flex;align-items:center;gap:10px;
    background:var(--header);color:#fff;padding:13px 14px;font-weight:800;font-size:17px}
  .mm-title{flex:1}
  .mm-close,.mm-back{background:none;border:0;color:#fff;font-size:24px;line-height:1;cursor:pointer;padding:0 4px}
  .mm-back{display:none;font-size:26px}
  .megamenu.is-drilled .mm-back{display:inline-flex}

  /* La zone interne devient la zone scrollable */
  .mm-inner{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
    grid-template-columns:1fr;padding:0;margin:0;max-width:none;max-height:none}

  /* Niveau 1 : liste des catégories (rangées avec chevron) */
  .mm-cats{border-right:0;padding:0}
  .mm-cat{display:flex;justify-content:space-between;align-items:center;padding:15px 16px;
    font-size:16px;border-bottom:1px solid var(--line);border-radius:0}
  .mm-cat.is-active{background:#fff}
  .mm-cat::after{content:"›";color:#9aa3b0;font-size:22px;font-weight:400}

  /* Niveau 2 : sous-catégories (cachées tant qu'on n'a pas tapé) */
  .mm-panels{display:none;padding:6px 16px 20px}
  .megamenu.is-drilled .mm-cats{display:none}
  .megamenu.is-drilled .mm-panels{display:block}
  .mm-sublist{column-count:1}
  .mm-sublist a{font-size:15px;padding:13px 4px;border-bottom:1px solid var(--line)}

  /* Titres de sections plus petits */
  .deals h2,.bestdeals h2,.gifts-left h2,.trends h2,.grid-section h2{font-size:18px}
  .gifts-sub{font-size:16px}

  /* Déco allégée sur mobile */
  .d-ring1,.d-ring3,.d-dots{display:none}

  /* Carrousel hero mobile : texte au-dessus, 2 produits en dessous */
  .hero-inner{grid-template-columns:1fr;gap:18px;padding:24px 16px 30px}
  .hero-kicker{font-size:11px;margin-bottom:10px}
  .hero-c h2{font-size:27px}
  .hero-c p{font-size:15px;margin-bottom:16px}
  .hero-btn{padding:11px 22px;font-size:15px}
  .hero-cards{gap:10px}
  .hero-arrow{width:34px;height:34px;font-size:22px}
  .hero-prev{left:8px}.hero-next{right:8px}

  /* Offres + bannière empilées */
  .deals-layout{grid-template-columns:1fr}
  .deals-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .promo-banner{min-height:170px}
  .promo-summer{font-size:32px}

  /* Cartes bons plans : un peu plus compactes */
  .bd{flex-basis:158px}
  .bd-img{height:128px}
  .bd-price strong{font-size:18px}

  /* Sections thématiques empilées */
  .gifts,.gifts--rev{grid-template-columns:1fr}
  .mini-tiles{grid-template-columns:1fr}
  .gifts-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .gifts-banner{min-height:200px}
  .gb-text h3{font-size:24px}

  /* Tendances : cercles plus petits */
  .trend{flex-basis:118px}
  .trend-circle{width:118px;height:118px}

  /* Produits récents */
  .grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .card-img{height:140px}

  /* Pages contenu mobile */
  .steps{grid-template-columns:1fr}
  .page-title{font-size:26px}

  /* À propos : tout empilé */
  .ab-hero,.ab-mission{grid-template-columns:1fr;gap:18px}
  .ab-hero-c h1{font-size:28px}
  .ab-stats{grid-template-columns:repeat(2,1fr)}
  .ab-values{grid-template-columns:1fr}
  .ab-hero-img,.ab-mission-img{height:220px}

  /* Connexion : panneau marque masqué, formulaire plein écran */
  .auth2-card{grid-template-columns:1fr}
  .auth2-hero{display:none}
  .auth2-form{padding:22px 18px}

  /* Compte : barre latérale au-dessus */
  .acct{grid-template-columns:1fr}
  .acct-stats{grid-template-columns:repeat(3,1fr);gap:8px}
  .acct-stat{padding:14px 8px}
  .acct-stat .n{font-size:22px}
  .acct-stat .l{font-size:11px}

  /* Recherche : filtres au-dessus, grille 2 colonnes */
  .search-page{grid-template-columns:1fr;gap:14px}
  .results-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .results-head h1{font-size:18px}

  /* Fiche produit (section haute) sur mobile */
  .pdp-top{padding:14px;gap:18px}
  .pdp-gallery{flex-direction:column-reverse;gap:10px}
  .pdp-thumbs{flex-direction:row}
  .pdp-mainimg{height:240px}
  .pdp-info h1{font-size:20px;margin-right:40px}
  .pdp-vrow{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px}
  .pdp-vcard{flex:0 0 130px}
  .specs-wrap{grid-template-columns:1fr;gap:14px}
  .specs-media{height:200px}

  /* Comparer les prix → cartes empilées sur mobile */
  .cmp-headrow{display:none}
  .cmp-row{grid-template-columns:1fr;gap:10px;padding:14px}
  .cmp-head{gap:12px}
  .cmp-head h2{width:100%}
  .cmp-sort{margin-left:0}
  .cmp-act{display:block}
  .cmp-btn{display:block;width:100%;text-align:center}
  /* Meilleur prix : fond orange clair lisible (au lieu du dégradé plein) */
  .cmp-row.is-best{background:#fff7ee;border-left:4px solid var(--orange)}
  .cmp-row.is-best .cmp-name a{color:var(--blue)}
  .cmp-row.is-best .cmp-big{color:var(--navy)}

  /* (ancien tableau d'offres — règles conservées sans effet) */
  .offers-table th,.offers-table td{padding:11px 10px}
  .offers-table th:nth-child(2),.offers-table td:nth-child(2){display:none}
  .price-cell{font-size:16px}
  .store-cell{font-size:13px}
  .btn{padding:8px 12px;font-size:13px}

  /* Footer : 2 colonnes, badges adaptés */
  .footer-cols{grid-template-columns:repeat(2,1fr);gap:20px}
  .footer-app h4{font-size:16px}
  .app-badge{padding:7px 14px}
  .footer-legal{font-size:13px}
}