/* ================= BOUTIQUE ================= */
.shop{ max-width:1100px; margin:0 auto; color:var(--cream); }
.shop-barre{ display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:22px; }
.shop-cats{ display:flex; gap:8px; flex-wrap:wrap; }
.shop-outils{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.shop-prix{ display:flex; align-items:center; gap:8px; font-size:.9rem; } .shop-prix input{ accent-color:var(--yellow); width:130px; }
#tri{ padding:8px 12px; border-radius:999px; border:none; font:inherit; font-weight:700; color:var(--chalk); }
.shop-panier-btn{ position:relative; display:inline-flex; align-items:center; gap:6px; background:var(--yellow); color:var(--chalk); font-weight:800; padding:9px 18px; border-radius:999px; text-decoration:none; box-shadow:0 3px 8px rgba(0,0,0,.35); }
.shop-panier-btn .badge{ background:var(--red); color:#fff; border-radius:999px; min-width:22px; height:22px; display:inline-flex; align-items:center; justify-content:center; font-size:.78rem; padding:0 6px; }
.shop-grille{ display:grid; grid-template-columns:repeat(auto-fill, minmax(230px,1fr)); gap:24px; }
.p-carte{ background:rgba(0,0,0,.28); border:1px solid rgba(255,255,255,.12); border-radius:16px; padding:14px; display:flex; flex-direction:column; gap:8px; transition:transform .15s; }
.p-carte:hover{ transform:translateY(-3px); } .p-carte.flash{ outline:3px solid var(--yellow); }
.p-carte h3{ font-family:'Baloo 2', cursive; font-size:1.08rem; line-height:1.2; color:#fff; flex:1; margin:4px 0 0; }
.p-prix{ font-weight:800; font-size:1.1rem; color:var(--yellow); }
.p-ajout{ width:100%; justify-content:center; }
.p-apercu{ position:relative; border:none; padding:0; background:none; cursor:pointer; border-radius:10px; overflow:hidden; }
.p-apercu-txt{ position:absolute; left:0; right:0; bottom:0; background:rgba(0,0,0,.65); color:#fff; font-weight:700; padding:8px; opacity:0; transition:opacity .2s; }
.p-apercu:hover .p-apercu-txt, .p-apercu:focus-visible .p-apercu-txt{ opacity:1; }
.p-visuel{ position:relative; aspect-ratio:3/4; background:var(--c); border:5px solid #fff; border-radius:6px; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; box-shadow:0 4px 12px rgba(0,0,0,.4); }
.p-visuel img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1; }
.p-emoji{ font-size:4rem; line-height:1; } .p-titre{ font-family:'Baloo 2', cursive; font-weight:800; color:#fff; text-align:center; padding:6px 10px; font-size:1.1rem; text-shadow:0 2px 4px rgba(0,0,0,.35); }
.p-dl{ position:absolute; top:8px; right:8px; z-index:2; width:38px; height:38px; border-radius:50%; background:#FFF6C2; color:#3a3a3a; display:flex; align-items:center; justify-content:center; font-weight:800; }
.p-new{ position:absolute; top:10px; left:-30px; z-index:2; transform:rotate(-35deg); background:var(--red); color:#fff; font-weight:800; font-size:.75rem; padding:3px 34px; }
/* aperçu rapide */
.shop-ov{ position:fixed; inset:0; z-index:200; background:rgba(0,0,0,.65); display:flex; align-items:center; justify-content:center; padding:16px; }
.shop-modal{ background:#2f2f2f; border-radius:18px; max-width:760px; width:100%; display:grid; grid-template-columns:240px 1fr; gap:24px; padding:24px; color:var(--cream); max-height:92vh; overflow:auto; }
.shop-modal h2{ font-family:'Baloo 2', cursive; color:#fff; margin:4px 0; } .p-cat{ font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; opacity:.7; }
@media (max-width:640px){ .shop-modal{ grid-template-columns:1fr; } }
.qte-row{ display:flex; gap:14px; align-items:center; margin:14px 0; flex-wrap:wrap; }
.qte{ display:inline-flex; align-items:center; border:1.5px solid var(--orange); border-radius:6px; overflow:hidden; }
.qte button{ background:none; border:none; color:#fff; width:32px; height:32px; font-size:1.1rem; cursor:pointer; } .qte button:hover{ background:rgba(255,255,255,.12); }
.qte span{ min-width:28px; text-align:center; font-weight:700; }
.shop-toast{ position:fixed; bottom:80px; left:50%; transform:translateX(-50%); background:var(--green); color:#fff; font-weight:800; padding:10px 22px; border-radius:999px; z-index:220; box-shadow:0 4px 12px rgba(0,0,0,.4); }
/* panier */
.panier{ display:grid; grid-template-columns:1fr 330px; gap:40px; }
@media (max-width:860px){ .panier{ grid-template-columns:1fr; } }
.panier h2{ font-family:'Baloo 2', cursive; color:#fff; font-size:1.5rem; padding-bottom:14px; border-bottom:1px solid rgba(120,160,220,.5); margin-bottom:6px; }
.pl-ligne{ display:grid; grid-template-columns:110px 1fr auto 100px 36px; gap:18px; align-items:start; padding:20px 0; border-bottom:1px solid rgba(120,160,220,.5); }
.pl-ligne .p-visuel{ border-width:4px; } .pl-ligne .p-emoji{ font-size:2.2rem; } .pl-ligne .p-titre{ font-size:.7rem; } .pl-ligne .p-dl{ width:26px; height:26px; font-size:.75rem; } .pl-ligne .p-new{ display:none; }
.pl-nom{ color:#fff; font-size:1.05rem; } .pl-nom small{ display:block; opacity:.65; font-size:.8rem; margin-top:4px; }
.pl-prix{ color:#fff; font-weight:700; text-align:right; font-size:1.05rem; }
.pl-suppr{ background:none; border:none; font-size:1.1rem; cursor:pointer; opacity:.7; } .pl-suppr:hover{ opacity:1; }
@media (max-width:560px){ .pl-ligne{ grid-template-columns:70px 1fr auto; } .pl-prix{ grid-column:2; text-align:left; } }
.pl-vide{ padding:30px 0; opacity:.85; }
.panier-extras{ margin:18px 0; display:flex; flex-direction:column; gap:12px; }
.panier-extras summary{ cursor:pointer; color:#fff; font-size:1.05rem; }
.promo-row{ display:flex; gap:8px; margin-top:8px; } .promo-row input, .panier-extras textarea, .panier-resume input{ flex:1; width:100%; padding:10px 12px; border-radius:8px; border:none; font:inherit; color:var(--chalk); margin-top:8px; }
.panier-resume .resume-ligne{ display:flex; justify-content:space-between; font-size:1.25rem; color:#fff; margin:12px 0; }
.panier-resume .resume-ligne.total{ border-top:1px solid rgba(255,255,255,.2); padding-top:12px; font-size:1.4rem; }
.panier-resume .form-field label{ font-size:.85rem; }
.pay-stripe, .pay-paypal{ display:block; width:100%; border:none; padding:13px; margin-top:12px; font:inherit; font-size:1rem; cursor:pointer; border-radius:4px; }
.pay-stripe{ background:#69A5BF; color:#fff; } .pay-stripe:hover{ filter:brightness(1.08); }
.pay-paypal{ background:#F3BB3A; color:#253B80; } .pay-paypal b{ color:#253B80; font-style:italic; } .pay-paypal i{ color:#179BD7; font-weight:800; margin-right:6px; }
.pay-paypal.pl{ background:#FFC439; }
.pay-stripe:disabled, .pay-paypal:disabled, #paypal-boutons.off{ opacity:.5; pointer-events:none; }
#paypal-boutons{ margin-top:12px; }
.secure{ text-align:center; font-size:.9rem; margin-top:14px; opacity:.9; }
.shop, .shop h2, .shop h3{ text-align:left; }
.shop .p-carte h3, .shop .p-titre{ text-align:center; }
/* vraies couvertures : affichées entières (les visuels paysage sont centrés sur fond blanc) */
.p-visuel.a-img{ background:#fff; }
.p-visuel.a-img img{ object-fit:contain; }
.p-visuel.a-img .p-emoji, .p-visuel.a-img .p-titre{ display:none; }
.p-attention{ background:rgba(209,7,31,.18); border-left:4px solid var(--red); padding:8px 12px; border-radius:6px; font-size:.9rem; }
.p-desc p{ margin:0 0 10px; line-height:1.5; }
