/* Eden Shop storefront styles - shared by index.php and product.php.
   Loaded with ?v=<file time>, so edits show up despite the 30-day cache.

   Look: clean white (or near-black in dark mode) with black type. The
   logo red (#D8141B) is an accent only - logo, cart badge, focus ring,
   small highlights - never large areas. */

/* ---------- tokens ---------- */
:root{
  --bg:#FFFFFF;
  --bg-alt:#F6F6F5;
  --surface:#FFFFFF;
  --tile:#F2F2F1;          /* skeleton / placeholder grey */
  --photo-bg:#FFFFFF;      /* behind product photos (they're shot on white) - same in dark mode */
  --text:#111111;
  --text-muted:#6B6B6B;
  --border:#E6E6E4;
  --primary:#111111;       /* main buttons: black */
  --on-primary:#FFFFFF;
  --primary-hover:#2B2B2B;
  --accent:#D8141B;        /* logo red - small doses only */
  --accent-soft:#FCEBEC;
  --danger:#B42318;
  --success:#15803D;
  --header-bg:rgba(255,255,255,0.88);
  --radius-s:8px;
  --radius-m:12px;
  --radius-l:16px;
  --shadow:0 1px 2px rgba(0,0,0,0.04), 0 10px 30px -14px rgba(0,0,0,0.20);
  --shadow-lg:0 24px 60px -24px rgba(0,0,0,0.35);
  --ease:cubic-bezier(.2,.7,.2,1);
  --font:"Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%236B6B6B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B0B0B; --bg-alt:#131313; --surface:#161616; --tile:#1B1B1B;
    --text:#F2F2F2; --text-muted:#A3A3A3; --border:#272727;
    --primary:#F2F2F2; --on-primary:#111111; --primary-hover:#D4D4D4;
    --accent:#FF4A4A; --accent-soft:#2B1314; --danger:#FF8A80; --success:#4ADE80;
    --header-bg:rgba(11,11,11,0.86);
    --shadow:0 1px 2px rgba(0,0,0,0.3), 0 12px 30px -14px rgba(0,0,0,0.6);
    --shadow-lg:0 24px 60px -24px rgba(0,0,0,0.7);
    --chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23A3A3A3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0B0B0B; --bg-alt:#131313; --surface:#161616; --tile:#1B1B1B;
  --text:#F2F2F2; --text-muted:#A3A3A3; --border:#272727;
  --primary:#F2F2F2; --on-primary:#111111; --primary-hover:#D4D4D4;
  --accent:#FF4A4A; --accent-soft:#2B1314; --danger:#FF8A80; --success:#4ADE80;
  --header-bg:rgba(11,11,11,0.86);
  --shadow:0 1px 2px rgba(0,0,0,0.3), 0 12px 30px -14px rgba(0,0,0,0.6);
  --shadow-lg:0 24px 60px -24px rgba(0,0,0,0.7);
  --chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23A3A3A3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  color-scheme:dark;
}

/* ---------- base ---------- */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;background:var(--bg);color:var(--text);font-family:var(--font);
  font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block;}
button,input,select,textarea{font-family:inherit;}
a{color:inherit;}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-0.02em;line-height:1.15;}
[hidden]{display:none !important;}
.wrap{max-width:1240px;margin:0 auto;padding:0 16px;}
@media (min-width:720px){.wrap{padding:0 28px;}}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.section-title{font-size:clamp(1.35rem,3vw,1.75rem);}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid transparent;border-radius:999px;padding:14px 24px;
  font-size:0.92rem;font-weight:700;letter-spacing:0.01em;line-height:1.2;
  cursor:pointer;text-decoration:none;transition:background .2s ease, border-color .2s ease, color .2s ease, transform .15s ease;
}
.btn:active{transform:scale(0.98);}
.btn-block{width:100%;}
.btn-sm{padding:8px 14px;font-size:0.82rem;}
.btn-primary{background:var(--primary);color:var(--on-primary);}
.btn-primary:hover{background:var(--primary-hover);}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--border);}
.btn-ghost:hover{border-color:var(--text);}
.btn:disabled{cursor:not-allowed;transform:none;}
.btn-primary:disabled{background:var(--bg-alt);color:var(--text-muted);border-color:var(--border);}
/* WhatsApp's own green with dark text (white on #25D366 is too faint to read). */
.btn-wa{background:#25D366;color:#06301A;}
.btn-wa:hover{background:#3BDC78;}

/* ---------- contact strip (above the header) ---------- */
.topbar{background:#111111;color:#FFFFFF;font-size:0.8rem;border-bottom:1px solid #272727;}
.topbar-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:34px;}
.topbar a{color:inherit;text-decoration:none;}
.topbar-phone{display:inline-flex;align-items:center;gap:7px;}
.topbar-phone svg{color:#25D366;flex:none;}
.topbar-phone strong{font-weight:800;letter-spacing:0.02em;}
.topbar-phone:hover strong{text-decoration:underline;text-underline-offset:3px;}
.topbar-social{display:flex;gap:16px;font-weight:600;}
.topbar-social a{opacity:0.8;}
.topbar-social a:hover{opacity:1;}
@media (max-width:560px){.topbar-row{justify-content:center;}.topbar-social{display:none;}}

/* ---------- header ---------- */
.site-header{
  position:sticky;top:0;z-index:40;background:var(--header-bg);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--border);
}
.header-row{display:flex;align-items:center;justify-content:space-between;gap:12px;height:60px;}
.logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--text);}
.logo-mark{width:26px;height:26px;flex:none;}
.logo-text{font-weight:800;font-size:1rem;letter-spacing:0.08em;white-space:nowrap;}
.logo-text span{color:var(--accent);}
.header-actions{display:flex;align-items:center;gap:6px;}
.lang-switch{display:flex;gap:2px;padding:3px;border-radius:999px;background:var(--bg-alt);}
.lang-btn{
  border:none;background:none;cursor:pointer;color:var(--text-muted);
  font-size:0.7rem;font-weight:800;letter-spacing:0.04em;padding:5px 9px;border-radius:999px;
  transition:color .2s ease, background .2s ease;
}
.lang-btn:hover{color:var(--text);}
.lang-btn[aria-pressed="true"]{background:var(--surface);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,0.12);}
.icon-btn{
  position:relative;display:flex;align-items:center;justify-content:center;width:38px;height:38px;
  border:none;background:none;border-radius:999px;cursor:pointer;color:var(--text);transition:background .2s ease;
}
.icon-btn:hover{background:var(--bg-alt);}
.theme-toggle .icon-moon{display:none;}
.theme-toggle.is-dark .icon-sun{display:none;}
.theme-toggle.is-dark .icon-moon{display:block;}
.cart-count{
  position:absolute;top:3px;right:1px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;
  background:var(--accent);color:#FFFFFF;font-size:0.62rem;font-weight:800;
  display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums;
}
.cart-count.bump{animation:bump .45s var(--ease);}
@keyframes bump{0%{transform:scale(1);}40%{transform:scale(1.35);}100%{transform:scale(1);}}

/* ---------- catalog (first thing on the page) ---------- */
.catalog{padding-top:22px;padding-bottom:40px;}
.catalog-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.catalog-title{font-size:clamp(1.5rem,4vw,2rem);}
.catalog-count{margin:2px 0 0;color:var(--text-muted);font-size:0.85rem;min-height:1.3em;}
.sort-select{
  appearance:none;-webkit-appearance:none;border:1px solid var(--border);background:var(--surface) var(--chevron) no-repeat right 12px center/15px;
  color:var(--text);border-radius:999px;padding:9px 36px 9px 14px;font-size:0.84rem;font-weight:600;cursor:pointer;
}
.sort-select:hover{border-color:var(--text-muted);}
.chip-row{
  display:flex;gap:8px;margin:16px -16px 18px;padding:0 16px;overflow-x:auto;scrollbar-width:none;
}
.chip-row::-webkit-scrollbar{display:none;}
@media (min-width:720px){.chip-row{flex-wrap:wrap;overflow:visible;margin:18px 0 22px;padding:0;}}
.chip{
  flex:none;border:1px solid var(--border);background:transparent;color:var(--text);
  border-radius:999px;padding:8px 15px;font-size:0.82rem;font-weight:700;cursor:pointer;white-space:nowrap;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.chip:hover{border-color:var(--text);}
.chip[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary);}

.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px;margin-top:6px;}
@media (min-width:720px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 20px;}}
@media (min-width:1060px){.grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
.grid-msg{grid-column:1/-1;padding:48px 0;text-align:center;color:var(--text-muted);display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap;}

/* ---------- product tile ---------- */
.tile{display:block;text-decoration:none;color:inherit;min-width:0;}
.tile-media{
  position:relative;aspect-ratio:1/1;border-radius:var(--radius-m);overflow:hidden;
  background:var(--photo-bg);border:1px solid var(--border);
}
/* contain, not cover: the whole shoe is always visible, whatever the photo's shape */
.tile-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .35s ease, transform .6s var(--ease);}
.tile-img-alt{opacity:0;}
@media (hover:hover){
  .tile:hover .tile-img{transform:scale(1.03);}
  .tile:hover .tile-img-alt{opacity:1;}
}
.tile-noimg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:0.72rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:#8A8A8A;}
.tile-badge{
  position:absolute;top:10px;left:10px;z-index:2;padding:4px 10px;border-radius:999px;
  background:var(--primary);color:var(--on-primary);font-size:0.68rem;font-weight:800;letter-spacing:0.04em;text-transform:uppercase;
}
.tile.is-sold .tile-img{filter:grayscale(1);opacity:0.55;}
.tile-info{display:flex;flex-direction:column;gap:2px;padding-top:10px;}
.tile-brand{font-size:0.7rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-muted);}
.tile-name{font-size:0.95rem;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.tile-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-top:2px;}
.tile-price{font-size:0.98rem;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;}
.tile-sizes{font-size:0.74rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.tile:hover .tile-name{text-decoration:underline;text-underline-offset:3px;}
.tile-skel .tile-media, .skel-line{background:var(--tile);animation:pulse 1.4s ease-in-out infinite;}
.skel-line{height:12px;border-radius:6px;margin-top:10px;width:70%;}
.skel-line.short{width:40%;margin-top:8px;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.55;}}

/* ---------- below the catalog: why / how / faq ---------- */
.why{background:var(--bg-alt);padding:52px 0;margin-top:28px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.why-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 18px;margin-top:24px;}
@media (min-width:900px){.why-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;}}
.why-item svg{color:var(--accent);}
.why-item h3{font-size:1rem;font-weight:700;margin-top:12px;letter-spacing:-0.01em;}
.why-item p{margin:6px 0 0;color:var(--text-muted);font-size:0.88rem;}

.how{padding-top:56px;padding-bottom:20px;}
.how-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:18px;}
@media (min-width:760px){.how-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}}
.how-steps li{display:flex;gap:14px;align-items:flex-start;padding:18px;border:1px solid var(--border);border-radius:var(--radius-m);background:var(--surface);}
.how-num{
  flex:none;width:30px;height:30px;border-radius:999px;background:var(--primary);color:var(--on-primary);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:0.85rem;
}
.how-steps h3{font-size:0.98rem;font-weight:700;letter-spacing:-0.01em;}
.how-steps p{margin:4px 0 0;color:var(--text-muted);font-size:0.88rem;}

.faq{padding-top:44px;padding-bottom:64px;}
.faq-list{margin-top:18px;max-width:760px;border-top:1px solid var(--border);}
.faq-item{border-bottom:1px solid var(--border);}
.faq-item summary{
  list-style:none;cursor:pointer;padding:18px 34px 18px 0;position:relative;font-weight:700;font-size:0.98rem;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:"";position:absolute;right:4px;top:50%;width:10px;height:10px;margin-top:-7px;
  border-right:2px solid var(--text-muted);border-bottom:2px solid var(--text-muted);transform:rotate(45deg);transition:transform .25s var(--ease);
}
.faq-item[open] summary::after{transform:rotate(-135deg);margin-top:-2px;}
.faq-item p{margin:0 0 18px;color:var(--text-muted);font-size:0.92rem;max-width:64ch;}
.faq-item p a{color:var(--text);font-weight:700;}

/* ---------- footer ---------- */
.site-footer{background:var(--bg-alt);border-top:1px solid var(--border);padding-top:36px;}
.footer-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;}
.footer-tag{margin:10px 0 0;color:var(--text-muted);font-size:0.88rem;max-width:36ch;}
.footer-contact{margin:8px 0 0;font-size:0.9rem;color:var(--text-muted);}
.footer-contact a{color:var(--text);font-weight:700;text-decoration:none;}
.footer-contact a:hover{text-decoration:underline;text-underline-offset:3px;}
.footer-links{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;font-size:0.9rem;font-weight:600;}
.footer-links a{text-decoration:none;}
.footer-links a:hover{text-decoration:underline;text-underline-offset:3px;}
.footer-bottom{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:28px;padding-top:16px;padding-bottom:22px;
  border-top:1px solid var(--border);font-size:0.78rem;color:var(--text-muted);
}
@media (max-width:639px){.footer-bottom{padding-bottom:90px;}} /* room for the mobile cart bar */

/* ---------- product page ---------- */
.pp{padding-top:16px;padding-bottom:64px;}
.pp-back{display:inline-block;font-size:0.85rem;font-weight:600;color:var(--text-muted);text-decoration:none;margin-bottom:14px;}
.pp-back:hover{color:var(--text);}
.pp-grid{display:grid;grid-template-columns:1fr;gap:24px;align-items:start;}
@media (min-width:880px){.pp-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,0.9fr);gap:48px;}}
.pp-gallery{min-width:0;}
.pp-main{position:relative;aspect-ratio:1/1;border-radius:var(--radius-l);overflow:hidden;background:var(--photo-bg);border:1px solid var(--border);}
.pp-track{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;outline:none;}
.pp-track::-webkit-scrollbar{display:none;}
.pp-slide{flex:0 0 100%;height:100%;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center;}
.pp-slide img{width:100%;height:100%;object-fit:contain;}
.pp-slide-empty span{font-size:0.75rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:#8A8A8A;}
.pp-main.is-sold .pp-slide img{filter:grayscale(1);opacity:0.6;}
.pp-main .tile-badge{top:14px;left:14px;}
.pp-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:40px;height:40px;border-radius:999px;border:none;
  background:rgba(255,255,255,0.92);color:#111;display:flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:0 2px 10px rgba(0,0,0,0.15);transition:opacity .2s ease;
}
.pp-arrow:disabled{opacity:0;pointer-events:none;}
.pp-prev{left:12px;}
.pp-next{right:12px;}
@media (hover:none){.pp-arrow{display:none;}} /* phones swipe */
.pp-counter{
  position:absolute;right:12px;bottom:12px;z-index:3;padding:4px 10px;border-radius:999px;
  background:rgba(0,0,0,0.55);color:#fff;font-size:0.72rem;font-weight:700;font-variant-numeric:tabular-nums;
}
.pp-thumbs{display:flex;gap:8px;margin-top:10px;overflow-x:auto;scrollbar-width:none;padding:2px;}
.pp-thumbs::-webkit-scrollbar{display:none;}
.pp-thumb{
  flex:none;width:72px;height:72px;padding:0;border-radius:var(--radius-s);overflow:hidden;cursor:pointer;
  border:2px solid var(--border);background:var(--photo-bg);opacity:0.6;transition:opacity .2s ease, border-color .2s ease;
}
.pp-thumb img{width:100%;height:100%;object-fit:contain;}
.pp-thumb:hover{opacity:1;}
.pp-thumb[aria-current="true"]{border-color:var(--text);opacity:1;}
.pp-info{display:flex;flex-direction:column;gap:10px;min-width:0;}
@media (min-width:880px){.pp-info{position:sticky;top:84px;}}
.pp-brand{font-size:0.75rem;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-muted);}
.pp-title{font-size:clamp(1.6rem,4vw,2.3rem);}
.pp-price{font-size:1.4rem;font-weight:800;font-variant-numeric:tabular-nums;}
.pp-sold{font-weight:700;color:var(--text-muted);}
.pp-label{font-size:0.8rem;font-weight:700;margin-top:8px;}
.size-row{display:flex;flex-wrap:wrap;gap:8px;}
.size-btn{
  min-width:54px;height:44px;padding:0 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface);
  color:var(--text);font-size:0.92rem;font-weight:700;cursor:pointer;font-variant-numeric:tabular-nums;
  transition:border-color .15s ease, background .15s ease, color .15s ease;
}
.size-btn:hover{border-color:var(--text);}
.size-btn[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary);}
.size-btn:disabled{opacity:0.4;cursor:not-allowed;}
.pp-actions{display:flex;flex-direction:column;gap:10px;margin-top:8px;}
.add-btn.added, .pp-add.added{animation:bump .4s var(--ease);}
.pp-points{list-style:none;margin:10px 0 0;padding:16px 0 0;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:8px;font-size:0.88rem;color:var(--text-muted);}
.pp-points li{position:relative;padding-left:24px;}
.pp-points li:empty{display:none;}
.pp-points li::before{
  content:"";position:absolute;left:3px;top:4px;width:6px;height:11px;border-right:2px solid var(--success);border-bottom:2px solid var(--success);transform:rotate(40deg);
}
.pp-points a{color:var(--text);font-weight:600;}
.pp-related{margin-top:60px;}
.pp-related .grid{margin-top:18px;}

/* ---------- cart drawer ---------- */
.scrim{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,0.45);opacity:0;pointer-events:none;transition:opacity .25s ease;}
.scrim.open{opacity:1;pointer-events:auto;}
.drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:61;width:min(420px,100%);background:var(--surface);box-shadow:var(--shadow-lg);
  display:flex;flex-direction:column;transform:translateX(102%);transition:transform .35s var(--ease);
}
.drawer.open{transform:translateX(0);}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);}
.drawer-head h2{font-size:1.1rem;}
.drawer-body{flex:1;overflow-y:auto;padding:14px 20px;}
.drawer-foot{padding:16px 20px 20px;border-top:1px solid var(--border);}
.drawer-foot:empty{display:none;}
.close-btn{border:none;background:none;cursor:pointer;color:var(--text-muted);padding:6px;border-radius:999px;}
.close-btn:hover{color:var(--text);background:var(--bg-alt);}
.empty-cart{color:var(--text-muted);font-size:0.92rem;text-align:center;padding:36px 0;}
.line-item{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--border);animation:lineIn .3s var(--ease);}
@keyframes lineIn{from{opacity:0;transform:translateX(12px);}to{opacity:1;transform:none;}}
.line-item.removing{animation:lineOut .25s ease forwards;}
@keyframes lineOut{to{opacity:0;transform:translateX(24px);}}
.line-thumb{width:68px;height:68px;flex:none;border-radius:var(--radius-s);overflow:hidden;background:var(--photo-bg);border:1px solid var(--border);}
.line-thumb img{width:100%;height:100%;object-fit:contain;}
.thumb-empty{display:block;width:100%;height:100%;}
.line-info{flex:1;min-width:0;}
.line-title{font-weight:700;font-size:0.92rem;}
.line-meta{font-size:0.8rem;color:var(--text-muted);margin-top:2px;}
.line-price{font-weight:800;font-size:0.92rem;margin-top:6px;font-variant-numeric:tabular-nums;}
.line-remove{border:none;background:none;padding:0;margin-top:4px;cursor:pointer;color:var(--text-muted);font-size:0.8rem;text-decoration:underline;}
.line-remove:hover{color:var(--danger);}
.subtotal-row{display:flex;justify-content:space-between;gap:10px;font-size:0.9rem;margin-bottom:6px;}
.subtotal-row .mono{font-variant-numeric:tabular-nums;font-weight:700;}
.subtotal-row.total{font-weight:800;font-size:1.02rem;margin-top:8px;padding-top:10px;border-top:1px solid var(--border);}
.cod-note{font-size:0.8rem;color:var(--text-muted);margin:10px 0 0;}
.wa-cart-link{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;font-size:0.86rem;font-weight:700;color:var(--text);text-decoration:none;}
.wa-cart-link svg{color:#25D366;flex:none;}
.wa-cart-link:hover span{text-decoration:underline;text-underline-offset:3px;}

/* checkout */
.back-link{border:none;background:none;padding:0;margin-bottom:14px;cursor:pointer;color:var(--text-muted);font-size:0.85rem;font-weight:600;}
.back-link:hover{color:var(--text);}
.order-recap{background:var(--bg-alt);border-radius:var(--radius-m);padding:14px;margin-bottom:18px;font-size:0.84rem;color:var(--text-muted);}
.order-recap strong{color:var(--text);}
.field{margin-bottom:14px;}
.field label{display:block;font-size:0.8rem;font-weight:700;margin-bottom:6px;}
.field input, .field select{
  width:100%;border:1px solid var(--border);background:var(--surface);color:var(--text);
  border-radius:10px;padding:12px;font-size:0.95rem;transition:border-color .2s ease, box-shadow .2s ease;
}
.field select{appearance:none;-webkit-appearance:none;background:var(--surface) var(--chevron) no-repeat right 12px center/15px;padding-right:36px;cursor:pointer;}
.field select:disabled{opacity:0.55;cursor:not-allowed;}
.field input:focus, .field select:focus{outline:none;border-color:var(--text);box-shadow:0 0 0 3px var(--bg-alt);}

/* sending / success / failed */
.success-panel{text-align:center;padding:28px 4px;}
.success-panel h3{font-size:1.1rem;}
.success-panel p{color:var(--text-muted);font-size:0.9rem;margin:8px 0 0;}
.spinner{width:36px;height:36px;margin:0 auto 16px;border-radius:50%;border:3px solid var(--border);border-top-color:var(--text);animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.success-check{margin:0 auto 14px;}
.success-check circle{stroke:var(--success);stroke-width:2;fill:none;stroke-dasharray:126;stroke-dashoffset:126;animation:draw .5s var(--ease) forwards;}
.success-check path{stroke:var(--success);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;animation:draw .35s .45s var(--ease) forwards;}
@keyframes draw{to{stroke-dashoffset:0;}}
.ref-box{margin:18px auto 4px;max-width:270px;padding:14px 16px;border-radius:var(--radius-m);background:var(--bg-alt);}
.ref-label{font-size:0.72rem;font-weight:800;letter-spacing:0.05em;text-transform:uppercase;color:var(--text-muted);}
.ref-code-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:6px;}
.ref-code{font-size:1.2rem;font-weight:800;letter-spacing:0.04em;}
.ref-copy{display:flex;align-items:center;padding:5px 8px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text-muted);cursor:pointer;}
.ref-copy:hover{color:var(--text);border-color:var(--text);}
.ref-hint{font-size:0.8rem;color:var(--text-muted);margin-top:8px;}
.ref-return-link{display:inline-block;margin-top:14px;font-size:0.86rem;font-weight:700;color:var(--text);}

/* ---------- toast, mobile cart bar, WhatsApp button ---------- */
.toast{
  position:fixed;left:50%;bottom:22px;z-index:80;max-width:90vw;padding:12px 18px;border-radius:999px;
  background:var(--primary);color:var(--on-primary);font-size:0.86rem;font-weight:600;text-align:center;box-shadow:var(--shadow-lg);
  transform:translate(-50%, 160%);opacity:0;transition:transform .3s var(--ease), opacity .3s ease;pointer-events:none;
}
.toast.show{transform:translate(-50%, 0);opacity:1;}
@media (max-width:639px){.toast{bottom:88px;}}
.mini-cart-bar{
  position:fixed;left:12px;right:12px;bottom:12px;z-index:55;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 20px;border:none;border-radius:999px;background:var(--primary);color:var(--on-primary);box-shadow:var(--shadow-lg);
  font-size:0.88rem;font-weight:700;cursor:pointer;transform:translateY(150%);transition:transform .35s var(--ease);
}
.mini-cart-bar.show{transform:translateY(0);}
@media (min-width:640px){.mini-cart-bar{display:none;}}
.whatsapp-fab{
  position:fixed;right:16px;bottom:16px;z-index:56;width:52px;height:52px;border-radius:50%;
  background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px -8px rgba(0,0,0,0.45);
  transition:transform .2s ease;
}
.whatsapp-fab:hover{transform:scale(1.06);}
@media (max-width:639px){.whatsapp-fab{bottom:80px;}}

/* fly-to-cart clone (product page "Add to cart") */
.fly-clone{position:fixed;z-index:90;border-radius:var(--radius-m);overflow:hidden;pointer-events:none;box-shadow:var(--shadow-lg);}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *, *::before, *::after{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;}
  .fly-clone{display:none;}
}