/* =========================================================
   MONETTI SHOP · app.css — componenti funzionali
   (carrello, checkout, account, auth, modali, ricerca)
   Si somma a site.css + shop.css senza toccarli.
   ========================================================= */

/* ---------- footer: riga metodi di pagamento ---------- */
.footer-bottom{ display:flex; flex-wrap:wrap; gap:.6rem 2rem; justify-content:space-between; align-items:center; }
.footer-bottom .pay-methods{ display:inline-flex; align-items:center; gap:.5rem; }
.footer-bottom .pay-methods svg{ width:14px; height:14px; color:var(--accent); flex:none; }

/* ---------- PDP: frecce galleria (discrete, si vedono al passaggio) ---------- */
.pdp-stage{ position:relative; }
.pdp-nav{ position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px;
  border:1px solid var(--border-subtle); background:rgba(255,255,255,.88); backdrop-filter:blur(3px);
  border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer;
  color:var(--text-primary); opacity:0; transition:opacity .3s, border-color .3s, color .3s; z-index:6; padding:0; }
.pdp-nav svg{ width:17px; height:17px; display:block; }
.pdp-nav.prev{ left:.9rem; }
.pdp-nav.next{ right:.9rem; }
.pdp-stage:hover .pdp-nav{ opacity:.8; }
.pdp-nav:hover{ opacity:1; border-color:var(--accent); color:var(--accent-deep); }
.pdp-nav:active{ transform:translateY(-50%) scale(.94); }
@media (hover: none){ .pdp-nav{ opacity:.6; width:38px; height:38px; } }

/* ---------- nav: nome utente sotto l'icona account ---------- */
.nav-account{ flex-direction:column; gap:1px; }
.nav-account-name{ display:block; font-size:.5rem; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-deep); max-width:74px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:1; }

/* ---------- hero compatto pagine funzionali ---------- */
.app-hero{ background: var(--dark); padding: 9.5rem 6vw 3.2rem; text-align:center; }
.app-hero .eyebrow{ color: var(--accent); }
.app-hero h1{ font-family: var(--font-display); font-weight:500; color: var(--text-on-dark); font-size: clamp(2.2rem, 4vw, 3.4rem); line-height:1.1; margin:.35em 0 0; }
.app-hero h1 em{ font-style: italic; color: var(--accent); }
.app-hero p{ color: var(--text-on-dark-soft); max-width: 520px; margin: .9rem auto 0; font-size: .95rem; }

.app-wrap{ max-width: 1240px; margin: 0 auto; padding: 3.2rem 6vw 6rem; }
.app-wrap.narrow{ max-width: 560px; }
.app-wrap.mid{ max-width: 860px; }

/* ---------- form ---------- */
.f-row{ display:flex; gap:1rem; }
.f-row.two > *{ flex:1; }
.f-row.three > *{ flex:1; }
.f-field{ margin-bottom: 1.05rem; flex:1; min-width:0; }
.f-field label{ display:block; font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:#6f6a60; margin-bottom:.4rem; }
.f-field input, .f-field select, .f-field textarea{
    width:100%; box-sizing:border-box; background:#fff; border:1px solid var(--border-soft);
    padding:.78rem .9rem; font-size:16px; font-weight:300; color:var(--text-primary);
    border-radius:0; appearance:none; -webkit-appearance:none; transition:border-color .25s, box-shadow .25s;
}
.f-field select{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23221f21' fill='none'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .9rem center; padding-right:2.2rem; }
.f-field input:focus, .f-field select:focus, .f-field textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(181,162,126,.18); }
.f-field.invalid input, .f-field.invalid select{ border-color:#c92a2a; }
.f-field .f-hint{ font-size:.72rem; color:#8f8f8f; margin-top:.3rem; display:block; }
.f-error{ color:#c92a2a; font-size:.8rem; margin:.6rem 0; }
.f-note{ font-size:.74rem; color:#8f8f8f; margin-top:.8rem; text-align:center; }
.f-check{ display:flex; gap:.6rem; align-items:flex-start; font-size:.82rem; color:#5c574e; margin:.9rem 0; cursor:pointer; }
.f-check input{ margin-top:.25rem; accent-color: var(--accent-deep); width:15px; height:15px; flex:none; }
.f-check a{ color: var(--accent-deep); }
.btn-block{ display:block; width:100%; text-align:center; box-sizing:border-box; }
button.btn{ cursor:pointer; }
.btn[disabled]{ opacity:.55; pointer-events:none; }

/* ---------- card generica ---------- */
.panel{ background:#fff; border:1px solid var(--border-subtle); padding:1.6rem 1.7rem; }
.panel + .panel{ margin-top:1.2rem; }
.panel h3{ font-family:var(--font-display); font-weight:500; font-size:1.35rem; margin:0 0 1rem; }

/* ---------- badge stato ordine ---------- */
.badge{ display:inline-flex; align-items:center; gap:.45rem; font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; padding:.38rem .8rem; border:1px solid currentColor; white-space:nowrap; }
.badge::before{ content:''; width:7px; height:7px; border-radius:50%; background:currentColor; }
.stock-badge{ font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; padding:.3rem .7rem; margin-left:.8rem; vertical-align:middle; }
.stock-badge.out{ color:#c92a2a; border:1px solid #c92a2a; }

/* ---------- drawer: quantità e riga ---------- */
.cart-row-line{ display:flex; align-items:center; justify-content:space-between; gap:.8rem; margin-top:.35rem; }
.qty-step{ display:inline-flex; align-items:center; border:1px solid var(--border-soft); }
.qty-step button{ background:none; border:none; width:30px; height:30px; font-size:1rem; cursor:pointer; color:var(--text-primary); line-height:1; }
.qty-step button:hover{ color:var(--accent-deep); }
.qty-step .q-v{ min-width:26px; text-align:center; font-size:.85rem; }
.qty-step.sm button{ width:24px; height:24px; font-size:.85rem; }
.qty-step.sm .q-v{ min-width:20px; font-size:.78rem; }
.cart-foot .btn{ display:block; width:100%; text-align:center; box-sizing:border-box; margin-top:.6rem; }

/* ---------- pagina carrello ---------- */
.cartpage{ display:grid; grid-template-columns: 1fr 360px; gap:2.2rem; align-items:start; }
.cp-list{ display:flex; flex-direction:column; }
.cp-row{ display:grid; grid-template-columns: 120px 1fr auto; gap:1.3rem; padding:1.3rem 0; border-bottom:1px solid var(--border-subtle); align-items:center; }
.cp-img{ display:block; aspect-ratio:3/4; background:#fff; border:1px solid var(--border-subtle); overflow:hidden; }
.cp-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.cp-img img.fit{ object-fit:contain; padding:4%; box-sizing:border-box; }
.cp-img .ph, .cart-row-img.ph{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; font-family:var(--font-display); font-size:2rem; color:var(--accent); background:#faf8f3; }
.cp-info{ display:flex; flex-direction:column; gap:.28rem; min-width:0; }
.cp-name{ font-family:var(--font-display); font-size:1.25rem; color:var(--text-primary); text-decoration:none; line-height:1.25; }
.cp-name:hover{ color:var(--accent-deep); }
.cp-meta, .cp-opts{ font-size:.74rem; color:#8f8f8f; letter-spacing:.04em; }
.cp-opts{ color:var(--accent-deep); }
.cp-unit{ font-size:.85rem; color:#5c574e; margin-top:.15rem; }
.cp-actions{ display:flex; align-items:center; gap:1.1rem; margin-top:.55rem; }
.cp-rm{ background:none; border:none; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:#8f8f8f; cursor:pointer; padding:0; border-bottom:1px solid transparent; }
.cp-rm:hover{ color:#c92a2a; border-bottom-color:#c92a2a; }
.cp-tot{ font-size:1.05rem; white-space:nowrap; font-weight:400; }
.cartpage-empty{ text-align:center; padding:4rem 1rem 5rem; grid-column:1/-1; }
.cartpage-empty svg{ width:52px; height:52px; color:var(--accent); margin-bottom:1rem; }
.cartpage-empty h2{ font-family:var(--font-display); font-weight:500; font-size:2rem; margin:.2em 0; }
.cartpage-empty p{ color:#8f8f8f; margin-bottom:1.6rem; }

.cp-summary{ background:#faf8f3; border:1px solid var(--border-subtle); padding:1.7rem 1.6rem; position:sticky; top:90px; }
.cp-summary h3{ font-family:var(--font-display); font-weight:500; font-size:1.4rem; margin:0 0 1.1rem; }
.sum-row{ display:flex; justify-content:space-between; font-size:.88rem; padding:.42rem 0; color:#5c574e; }
.sum-row .free{ color:var(--accent-deep); letter-spacing:.06em; }
.sum-row.disc{ color:var(--accent-deep); }
.sum-code{ font-weight:400; letter-spacing:.06em; }
.sum-row.total{ border-top:1px solid var(--border-soft); margin-top:.6rem; padding-top:.9rem; font-size:1.05rem; color:var(--text-primary); font-weight:400; }
.sum-tax{ font-size:.7rem; color:#8f8f8f; margin:.2rem 0 1rem; }
.sum-disc-form{ display:flex; gap:.5rem; margin:.6rem 0 1rem; }
.sum-disc-form input{ flex:1; min-width:0; border:1px solid var(--border-soft); padding:.55rem .7rem; font-size:.85rem; background:#fff; }
.sum-disc-form input:focus{ outline:none; border-color:var(--accent); }
.sum-disc-form .btn{ padding:.55rem 1rem; font-size:.62rem; }
.sum-removedisc{ background:none; border:none; color:#8f8f8f; font-size:.72rem; text-decoration:underline; cursor:pointer; margin:0 0 1rem; padding:0; }
.sum-removedisc:hover{ color:#c92a2a; }
.sum-cta{ display:block; width:100%; text-align:center; box-sizing:border-box; }
.sum-continue{ display:block; text-align:center; font-size:.74rem; letter-spacing:.1em; color:#8f8f8f; margin-top:1rem; text-decoration:none; }
.sum-continue:hover{ color:var(--accent-deep); }
.sum-secure{ display:flex; gap:.55rem; align-items:center; justify-content:center; font-size:.7rem; color:#8f8f8f; margin-top:1.2rem; }
.sum-secure svg{ width:15px; height:15px; color:var(--accent-deep); flex:none; }

/* ---------- checkout ---------- */
.checkout-layout{ display:grid; grid-template-columns: 1fr 380px; gap:2.4rem; align-items:start; }
.ck-steps{ min-width:0; }
.ck-step{ background:#fff; border:1px solid var(--border-subtle); margin-bottom:1rem; }
.ck-step-head{ display:flex; align-items:center; gap:1rem; padding:1.15rem 1.4rem; cursor:default; }
.ck-step-num{ width:30px; height:30px; border:1px solid var(--border-soft); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.8rem; flex:none; color:#8f8f8f; transition:all .3s; }
.ck-step.active .ck-step-num{ background:var(--dark); border-color:var(--dark); color:var(--text-on-dark); }
.ck-step.done .ck-step-num{ background:var(--accent); border-color:var(--accent); color:#fff; }
.ck-step-title{ font-family:var(--font-display); font-size:1.3rem; font-weight:500; flex:1; color:#9b968c; transition:color .3s; }
.ck-step.active .ck-step-title, .ck-step.done .ck-step-title{ color:var(--text-primary); }
.ck-step-summary{ font-size:.78rem; color:#8f8f8f; text-align:right; max-width:45%; line-height:1.4; }
.ck-step-edit{ background:none; border:none; color:var(--accent-deep); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; cursor:pointer; padding:0; border-bottom:1px solid var(--accent-soft); }
.ck-step-body{ padding:0 1.4rem 1.5rem; display:none; }
.ck-step.active .ck-step-body{ display:block; }
.ck-tabs{ display:flex; gap:0; border:1px solid var(--border-soft); margin-bottom:1.3rem; }
.ck-tab{ flex:1; background:none; border:none; padding:.8rem; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; cursor:pointer; color:#8f8f8f; transition:all .25s; }
.ck-tab.on{ background:var(--dark); color:var(--text-on-dark); }
.ck-next{ margin-top:.6rem; }
.ck-addr-pick{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:.9rem; margin-bottom:1.1rem; }
.addr-card{ border:1px solid var(--border-soft); padding:1rem 1.1rem; cursor:pointer; position:relative; font-size:.82rem; line-height:1.55; color:#5c574e; transition:all .25s; background:#fff; }
.addr-card:hover{ border-color:var(--accent); }
.addr-card.on{ border-color:var(--accent-deep); box-shadow:0 0 0 2px rgba(181,162,126,.28); }
.addr-card .alias{ display:block; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent-deep); margin-bottom:.35rem; }
.addr-card .check{ position:absolute; top:.7rem; right:.7rem; width:18px; height:18px; border-radius:50%; border:1px solid var(--border-soft); }
.addr-card.on .check{ background:var(--accent-deep); border-color:var(--accent-deep); }
.addr-new-toggle{ background:none; border:1px dashed var(--border-soft); padding:1rem; width:100%; cursor:pointer; color:#8f8f8f; font-size:.78rem; letter-spacing:.1em; }
.addr-new-toggle:hover{ border-color:var(--accent); color:var(--accent-deep); }
.ship-opt, .pay-opt{ display:flex; gap:1rem; align-items:flex-start; border:1px solid var(--border-soft); padding:1.05rem 1.15rem; margin-bottom:.8rem; cursor:pointer; transition:all .25s; background:#fff; }
.ship-opt:hover, .pay-opt:hover{ border-color:var(--accent); }
.ship-opt.on, .pay-opt.on{ border-color:var(--accent-deep); box-shadow:0 0 0 2px rgba(181,162,126,.28); }
.ship-opt input, .pay-opt input{ margin-top:.3rem; accent-color:var(--accent-deep); flex:none; }
.ship-opt .so-body, .pay-opt .so-body{ flex:1; min-width:0; }
.ship-opt .so-name, .pay-opt .so-name{ display:block; font-size:.95rem; letter-spacing:.02em; }
.ship-opt .so-desc, .pay-opt .so-desc{ display:block; font-size:.76rem; color:#8f8f8f; margin-top:.2rem; line-height:1.5; }
.ship-opt .so-price{ font-size:.85rem; color:var(--accent-deep); white-space:nowrap; letter-spacing:.06em; }
.pay-opt img.pp{ height:22px; margin-top:2px; }
.pay-logo{ display:flex; align-items:center; gap:.3rem; color:var(--accent-deep); flex:none; margin-top:2px; }
.pay-logo svg{ width:26px; height:26px; }
.pay-logo.pp3 b{ font-size:.85rem; font-weight:500; color:var(--text-primary); letter-spacing:0; }
.pickup-select{ margin:.6rem 0 0 2.2rem; }
.bonifico-box{ display:block; background:#faf8f3; border:1px solid var(--border-soft); padding:1.1rem 1.2rem; font-size:.85rem; line-height:1.8; margin:.8rem 0 0; }
.fiscal-toggle{ display:block; background:none; border:none; padding:0; margin:.2rem 0 1rem; cursor:pointer; font-size:.8rem; color:var(--accent-deep); letter-spacing:.03em; text-align:left; }
.fiscal-toggle span{ text-decoration:underline; }
.fiscal-block{ border-top:1px dashed var(--border-soft); padding-top:1rem; }
.bonifico-box b{ letter-spacing:.03em; }
#paypalButtons{ margin-top:1.1rem; }
.ck-note textarea{ min-height:74px; }
.ck-place{ margin-top:1.2rem; }
.ck-secure{ display:flex; gap:.5rem; align-items:center; justify-content:center; font-size:.7rem; color:#8f8f8f; margin-top:1rem; }
.ck-secure svg{ width:14px; height:14px; color:var(--accent-deep); }

/* riepilogo checkout */
.ck-summary{ background:#faf8f3; border:1px solid var(--border-subtle); position:sticky; top:90px; }
.ck-sum-head{ padding:1.2rem 1.5rem; border-bottom:1px solid var(--border-subtle); display:flex; justify-content:space-between; align-items:center; }
.ck-sum-head h3{ margin:0; font-family:var(--font-display); font-weight:500; font-size:1.3rem; }
.ck-sum-head .n{ font-size:.72rem; color:#8f8f8f; letter-spacing:.1em; }
.ck-sum-items{ padding:1rem 1.5rem; max-height:320px; overflow:auto; }
.ck-sum-item{ display:flex; gap:.9rem; padding:.55rem 0; align-items:center; }
.ck-sum-item img, .ck-sum-item .ph{ width:52px; height:64px; object-fit:cover; border:1px solid var(--border-subtle); background:#fff; flex:none; }
.ck-sum-item img.fit{ object-fit:contain; padding:3%; box-sizing:border-box; }
.ck-sum-item .ph{ display:flex; align-items:center; justify-content:center; font-family:var(--font-display); color:var(--accent); }
.ck-sum-item .b{ flex:1; min-width:0; }
.ck-sum-item .nm{ font-size:.82rem; line-height:1.35; display:block; }
.ck-sum-item .op{ font-size:.68rem; color:var(--accent-deep); display:block; margin-top:.1rem; }
.ck-sum-item .qp{ font-size:.72rem; color:#8f8f8f; display:block; margin-top:.1rem; }
.ck-sum-item .pr{ font-size:.82rem; white-space:nowrap; }
.ck-sum-tot{ padding:1rem 1.5rem 1.4rem; border-top:1px solid var(--border-subtle); }
/* mobile: riepilogo collassabile */
.ck-sum-toggle{ display:none; }

/* ---------- conferma ordine ---------- */
.confirm-hero{ text-align:center; padding:4.5rem 6vw 2.5rem; }
.confirm-hero .ok-ring{ width:74px; height:74px; margin:0 auto 1.4rem; border:1px solid var(--accent); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--accent-deep); }
.confirm-hero .ok-ring svg{ width:30px; height:30px; }
.confirm-hero h1{ font-family:var(--font-display); font-weight:500; font-size:clamp(2rem,4vw,3rem); margin:.2em 0; }
.confirm-hero p{ color:#6f6a60; max-width:520px; margin:0 auto; }
.confirm-ref{ letter-spacing:.2em; color:var(--accent-deep); font-size:.8rem; text-transform:uppercase; margin-top:1rem; display:block; }

/* ---------- account ---------- */
.account-layout{ display:grid; grid-template-columns: 250px 1fr; gap:2.4rem; align-items:start; }
.acc-menu{ border:1px solid var(--border-subtle); background:#fff; position:sticky; top:90px; }
.acc-menu .who{ padding:1.2rem 1.3rem; border-bottom:1px solid var(--border-subtle); }
.acc-menu .who b{ display:block; font-family:var(--font-display); font-weight:500; font-size:1.15rem; }
.acc-menu .who span{ font-size:.72rem; color:#8f8f8f; word-break:break-all; }
.acc-menu a{ display:flex; align-items:center; gap:.8rem; padding: .85rem 1.3rem; font-size:.8rem; letter-spacing:.06em; color:#5c574e; text-decoration:none; border-left:2px solid transparent; transition:all .25s; }
.acc-menu a svg{ width:17px; height:17px; color:var(--accent-deep); flex:none; }
.acc-menu a:hover{ background:#faf8f3; }
.acc-menu a.on{ border-left-color:var(--accent-deep); background:#faf8f3; color:var(--text-primary); }
.acc-menu a.exit{ color:#a33; border-top:1px solid var(--border-subtle); }
.acc-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:1.1rem; }
.acc-card{ border:1px solid var(--border-subtle); background:#fff; padding:1.5rem 1.4rem; text-decoration:none; color:var(--text-primary); transition:all .25s; display:block; }
.acc-card:hover{ border-color:var(--accent); transform:translateY(-2px); }
.acc-card svg{ width:22px; height:22px; color:var(--accent-deep); margin-bottom:.8rem; }
.acc-card b{ display:block; font-family:var(--font-display); font-weight:500; font-size:1.25rem; margin-bottom:.25rem; }
.acc-card span{ font-size:.76rem; color:#8f8f8f; line-height:1.5; display:block; }
.order-row{ display:grid; grid-template-columns: 1fr auto; gap:1rem; border:1px solid var(--border-subtle); background:#fff; padding:1.15rem 1.3rem; margin-bottom:.9rem; align-items:center; text-decoration:none; color:var(--text-primary); transition:border-color .25s; }
.order-row:hover{ border-color:var(--accent); }
.order-row .ref{ font-family:var(--font-display); font-size:1.2rem; }
.order-row .dt{ font-size:.74rem; color:#8f8f8f; margin-top:.15rem; display:block; }
.order-row .tot{ font-size:1rem; text-align:right; }
.order-row .items{ font-size:.72rem; color:#8f8f8f; text-align:right; display:block; margin-top:.15rem; }
.order-head{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; align-items:center; margin-bottom:1.4rem; }
.order-head h2{ font-family:var(--font-display); font-weight:500; margin:0; font-size:1.8rem; }
.timeline{ position:relative; padding-left:1.5rem; }
.timeline::before{ content:''; position:absolute; left:5px; top:6px; bottom:6px; width:1px; background:var(--border-soft); }
.tl-item{ position:relative; padding-bottom:1rem; font-size:.82rem; color:#5c574e; }
.tl-item::before{ content:''; position:absolute; left:-1.5rem; top:5px; width:11px; height:11px; border-radius:50%; background:#fff; border:2px solid var(--accent); box-sizing:border-box; }
.tl-item b{ display:block; color:var(--text-primary); font-weight:400; }
.tl-item time{ font-size:.7rem; color:#8f8f8f; }
.addr-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:1.1rem; }
.addr-box{ border:1px solid var(--border-subtle); background:#fff; padding:1.3rem 1.4rem; font-size:.85rem; line-height:1.7; color:#5c574e; }
.addr-box .alias{ display:block; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--accent-deep); margin-bottom:.5rem; }
.addr-box .ops{ margin-top: .9rem; display:flex; gap:1.1rem; }
.addr-box .ops a, .addr-box .ops button{ background:none; border:none; padding:0; cursor:pointer; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-deep); text-decoration:none; border-bottom:1px solid var(--accent-soft); }
.addr-box .ops .del{ color:#a33; border-bottom-color:rgba(170,51,51,.4); }
.wish-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:1.4rem; }
.empty-state{ text-align:center; padding:3rem 1rem; color:#8f8f8f; border:1px dashed var(--border-soft); }
.empty-state a{ color:var(--accent-deep); }

/* ---------- auth: split a tutta larghezza ---------- */
.auth-split{ display:grid; grid-template-columns: 1.1fr .9fr; min-height:94vh; background:#fff; }
.auth-main{ display:flex; align-items:center; justify-content:center; padding: 10.5rem 6vw 5rem; }
.auth-inner{ width:100%; max-width:440px; }
.auth-inner h1{ font-family:var(--font-display); font-weight:500; font-size:clamp(2.2rem,3.2vw,3rem); line-height:1.1; margin:.2em 0 1.4rem; }
.auth-inner h1 em{ font-style:italic; color:var(--accent-deep); }
.auth-panel{ background:var(--dark); color:var(--text-on-dark-soft); display:flex; align-items:center; justify-content:center; padding: 10.5rem 5vw 5rem; position:relative; overflow:hidden; }
.auth-panel::before{ content:'M'; position:absolute; right:-5rem; bottom:-9rem; font-family:var(--font-display); font-size:36rem; line-height:1; color:rgba(181,162,126,.08); pointer-events:none; }
.auth-panel-inner{ max-width:400px; position:relative; }
.auth-panel h2{ font-family:var(--font-display); color:var(--text-on-dark); font-weight:500; font-size:clamp(1.9rem,2.6vw,2.6rem); line-height:1.15; margin:.45em 0 1em; }
.auth-panel h2 em{ font-style:italic; color:var(--accent); }
.auth-panel ul{ list-style:none; padding:0; margin:0; font-size:.95rem; line-height:2.4; letter-spacing:.02em; }
.auth-panel li::before{ content:'—'; color:var(--accent); margin-right:.85rem; }
.auth-panel .panel-foot{ margin-top:2.2rem; font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--accent); }
.auth-alt{ font-size:.8rem; color:#8f8f8f; margin-top:1.4rem; }
.auth-alt a{ color:var(--accent-deep); }
/* pagine auth semplici (recupero / reset) */
.auth-solo{ max-width:460px; margin:0 auto; padding:3.5rem 6vw 5.5rem; }
.auth-solo h2{ font-family:var(--font-display); font-weight:500; font-size:1.9rem; margin:0 0 1.2rem; }
.pw-forgot{ font-size:.74rem; color:#8f8f8f; text-decoration:none; border-bottom:1px solid var(--border-subtle); }
.pw-forgot:hover{ color:var(--accent-deep); }
.alert{ padding: .9rem 1.1rem; font-size:.84rem; margin-bottom:1.1rem; border:1px solid; }
.alert.err{ color:#a02525; border-color:rgba(201,42,42,.35); background:rgba(201,42,42,.05); }
.alert.ok{ color:#1d6b41; border-color:rgba(47,158,68,.35); background:rgba(47,158,68,.05); }

/* ---------- modale ---------- */
.msh-modal{ position:fixed; inset:0; z-index:1200; display:flex; align-items:center; justify-content:center; padding:1.2rem; }
.msh-modal[hidden]{ display:none; }
.msh-modal-back{ position:absolute; inset:0; background:rgba(20,18,19,.6); backdrop-filter:blur(3px); }
.msh-modal-box{ position:relative; background:#fff; max-width:520px; width:100%; padding:2.4rem 2.3rem; max-height:92vh; overflow:auto; }
.msh-modal-box h3{ font-family:var(--font-display); font-weight:500; font-size:1.9rem; margin:.2rem 0 .3rem; }
.msh-modal-box h3 em{ font-style:italic; color:var(--accent-deep); }
.msh-modal-sub{ font-size:.8rem; color:#8f8f8f; margin-bottom:1.4rem; }
.msh-modal-x{ position:absolute; top:.8rem; right:1rem; background:none; border:none; font-size:1.6rem; color:#8f8f8f; cursor:pointer; line-height:1; }
.msh-modal-x:hover{ color:var(--text-primary); }
.f-success{ text-align:center; padding:1.6rem 0 .6rem; }
.f-success p{ font-family:var(--font-display); font-size:1.5rem; color:var(--accent-deep); margin:0 0 .4rem; }
.f-success span{ font-size:.85rem; color:#5c574e; }
body.modal-open{ overflow:hidden; }

/* ---------- ricerca ---------- */
.search-bar{ position:relative; max-width:640px; margin:0 auto; }
.search-bar form{ display:flex; gap:.6rem; }
.search-bar input{ flex:1; font-size:16px; padding: .95rem 1.1rem; border:1px solid var(--border-soft); background:#fff; }
.search-bar input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(181,162,126,.18); }
.search-suggest{ position:absolute; top:calc(100% + 4px); left:0; right:0; background:#fff; border:1px solid var(--border-soft); box-shadow:0 18px 40px rgba(20,18,19,.12); z-index:50; max-height:420px; overflow:auto; }
.sg-item{ display:flex; gap:.9rem; padding:.65rem .9rem; align-items:center; text-decoration:none; color:var(--text-primary); transition:background .2s; }
.sg-item:hover{ background:#faf8f3; }
.sg-item img, .sg-ph{ width:44px; height:54px; object-fit:cover; border:1px solid var(--border-subtle); flex:none; background:#fff; }
.sg-item img.fit{ object-fit:contain; padding:2px; box-sizing:border-box; }
.sg-ph{ display:flex; align-items:center; justify-content:center; font-family:var(--font-display); color:var(--accent); }
.sg-body b{ display:block; font-weight:400; font-size:.88rem; line-height:1.3; }
.sg-body i{ font-style:normal; font-size:.72rem; color:#8f8f8f; }

/* ---------- tabelle ordine (dettaglio) ---------- */
.ot-items{ width:100%; border-collapse:collapse; font-size:.86rem; }
.ot-items th{ text-align:left; font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:#8f8f8f; font-weight:400; padding:.5rem .4rem; border-bottom:1px solid var(--border-soft); }
.ot-items td{ padding:.85rem .4rem; border-bottom:1px solid var(--border-subtle); vertical-align:middle; }
.ot-items .oi-name{ display:flex; gap:.9rem; align-items:center; }
.ot-items .oi-name img, .ot-items .oi-name .ph{ width:46px; height:56px; object-fit:cover; border:1px solid var(--border-subtle); background:#fff; flex:none; }
.ot-items .oi-name .ph{ display:flex; align-items:center; justify-content:center; font-family:var(--font-display); color:var(--accent); }
.ot-items .oi-name .op{ display:block; font-size:.7rem; color:var(--accent-deep); }
.ot-items .oi-name .rf{ display:block; font-size:.68rem; color:#a5a09a; }
.ot-tot td{ border-bottom:none; padding:.35rem .4rem; }
.ot-tot .lbl{ text-align:right; color:#8f8f8f; font-size:.8rem; }
.ot-tot .val{ text-align:right; white-space:nowrap; }
.ot-tot.grand td{ padding-top:.8rem; font-size:1.02rem; }

/* ---------- responsive ---------- */
@media (max-width: 1000px){
    .cartpage{ grid-template-columns:1fr; }
    .cp-summary{ position:static; }
    .checkout-layout{ grid-template-columns:1fr; }
    .ck-summary{ position:static; order:-1; }
    .ck-sum-toggle{ display:flex; width:100%; background:#faf8f3; border:1px solid var(--border-subtle); padding:1rem 1.2rem; justify-content:space-between; align-items:center; font-size:.8rem; letter-spacing:.08em; cursor:pointer; color:var(--text-primary); }
    .ck-sum-toggle b{ font-size:.95rem; }
    .ck-sum-toggle .car{ transition:transform .3s; margin-left:.5rem; display:inline-block; }
    .ck-summary.closed .ck-sum-body{ display:none; }
    .ck-summary.closed{ border:none; background:none; }
    .ck-summary:not(.closed) .ck-sum-toggle .car{ transform:rotate(180deg); }
    .account-layout{ grid-template-columns:1fr; }
    .acc-menu{ position:static; display:flex; overflow-x:auto; }
    .acc-menu .who{ display:none; }
    .acc-menu a{ white-space:nowrap; border-left:none; border-bottom:2px solid transparent; }
    .acc-menu a.on{ border-bottom-color:var(--accent-deep); }
    .acc-menu a.exit{ border-top:none; }
    .auth-split{ grid-template-columns:1fr; min-height:0; }
    .auth-main{ padding:8.5rem 7vw 3rem; }
    .auth-panel{ padding:3.2rem 7vw 3.8rem; }
    .auth-panel::before{ font-size:20rem; right:-3rem; bottom:-6rem; }
}
@media (max-width: 620px){
    .app-wrap{ padding:2.2rem 5vw 4rem; }
    .f-row{ flex-direction:column; gap:0; }
    .cp-row{ grid-template-columns: 92px 1fr; }
    .cp-tot{ grid-column:2; text-align:right; margin-top:-.6rem; }
    .cp-img{ align-self:start; }
    .order-row{ grid-template-columns:1fr; }
    .order-row .tot{ text-align:left; }
    .order-row .items{ text-align:left; }
    .msh-modal{ padding:0; align-items:flex-end; }
    .msh-modal-box{ max-width:none; border-radius:14px 14px 0 0; padding:1.8rem 1.4rem; }
    .ck-step-head{ padding:1rem 1.05rem; }
    .ck-step-body{ padding:0 1.05rem 1.2rem; }
    .ck-step-summary{ display:none; }
    .app-hero{ padding-top:7.5rem; }
    .ot-items .oi-name{ align-items:flex-start; }
}