/* Boutique en ligne publique */
body.shop { background: var(--bg); }
.shop-top { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: calc(.6rem + env(safe-area-inset-top)) 1rem .6rem; background: var(--surface); border-bottom: 1px solid var(--border); }
.shop-brand { display: flex; align-items: center; gap: .6rem; color: var(--text); font-weight: 800; font-size: 1.05rem; min-width: 0; }
.shop-brand span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shop-brand img { width: 38px; height: 38px; border-radius: 10px; object-fit: contain; background: #fff; border: 1px solid var(--border); }
.shop-top nav { display: flex; align-items: center; gap: 1rem; }
.shop-top nav a { color: var(--text); font-weight: 600; font-size: .9rem; }
.cart-btn { position: relative; display: inline-flex; padding: .45rem; border-radius: 10px; background: var(--primary); color: #fff !important; }
.cart-count { position: absolute; top: -6px; right: -6px; background: var(--bad); color: #fff; border-radius: 999px; font-size: .7rem; min-width: 20px; height: 20px; display: grid; place-items: center; padding: 0 4px; }
.shop-main { max-width: 1120px; margin: 0 auto; padding: 1rem; }
.shop-hero { background: linear-gradient(135deg, var(--primary), #10a37a); color: #fff; border-radius: 18px; padding: 1.5rem 1.25rem; margin-bottom: 1rem; }
.shop-hero h1 { font-size: clamp(1.4rem, 4vw, 2rem); }
.shop-hero p { opacity: .92; max-width: 720px; }
.shop-search { display: flex; gap: .5rem; align-items: center; background: #fff; border-radius: 12px; padding: .35rem .35rem .35rem .75rem; color: #333; max-width: 620px; }
.shop-search input { border: 0; outline: 0; min-height: 40px; background: transparent; color: #15201d; }
.shop-search .i { color: #777; }
.shop-badges { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .9rem; }
.shop-badges span { display: inline-flex; gap: .35rem; align-items: center; background: rgba(255,255,255,.16); border-radius: 999px; padding: .3rem .7rem; font-size: .82rem; }
.product-grid { display: grid; gap: .75rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 640px) { .product-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 960px) { .product-grid { grid-template-columns: repeat(4, 1fr); } }
.pcard { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.pimg { aspect-ratio: 4/3; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); }
.pimg img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.pimg .i { width: 42px; height: 42px; opacity: .6; }
.pimg.big { aspect-ratio: 1; border-radius: 14px; }
.pimg.big .i { width: 80px; height: 80px; }
.pbody { padding: .7rem; display: flex; flex-direction: column; gap: .3rem; flex: 1; }
.pname { color: var(--text); font-weight: 700; line-height: 1.25; }
.pfoot { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: .4rem; flex-wrap: wrap; padding-top: .4rem; }
.pfoot strong { color: var(--primary); }
.product-detail { display: grid; gap: 1.25rem; }
@media (min-width: 760px) { .product-detail { grid-template-columns: 340px 1fr; } }
.price-big { font-size: 1.8rem; font-weight: 800; color: var(--primary); margin: .5rem 0; }
.checkout { display: grid; gap: 1rem; }
@media (min-width: 900px) { .checkout { grid-template-columns: 1fr 340px; align-items: start; } .checkout .summary { position: sticky; top: 80px; } }
.thanks .big-check { width: 64px; height: 64px; margin: 0 auto .5rem; border-radius: 50%; background: var(--ok-bg); color: var(--ok); display: grid; place-items: center; }
.thanks .big-check .i { width: 34px; height: 34px; }
.track-code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 1.4rem; font-weight: 800; letter-spacing: .12em; background: var(--primary-soft); color: var(--primary); padding: .2rem .6rem; border-radius: 8px; }
.shop-foot { border-top: 1px solid var(--border); background: var(--surface); margin-top: 2rem; padding: 1.5rem 1rem calc(1.5rem + env(safe-area-inset-bottom)); }
.shop-foot-grid { max-width: 1120px; margin: 0 auto 1rem; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); font-size: .9rem; }
.cart-row { display: grid; grid-template-columns: 1fr auto; gap: .3rem .75rem; padding: .7rem 0; border-bottom: 1px dashed var(--border); }
.cart-row .qty { display: flex; gap: .3rem; align-items: center; }
.cart-row .qty button { width: 34px; height: 34px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface-2); color: var(--text); cursor: pointer; }
.cart-row .qty span { min-width: 2ch; text-align: center; font-weight: 700; }
/* Annuaire / site commercial */
.dir-grid { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.dir-card { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 1rem; display: flex; gap: .8rem; color: var(--text); }
.dir-card img { width: 52px; height: 52px; border-radius: 12px; object-fit: contain; background: #fff; border: 1px solid var(--border); }