/* ═══════════════════════════════════════════════════
   SHOP AZ 2026 — styles partagés (cart, checkout, product, etc.)
   ═══════════════════════════════════════════════════ */

.sh-wrap{
  background:var(--bg,#faf7f1);
  min-height:70vh;
  padding:110px 32px 80px;
}
@media(max-width:720px){ .sh-wrap{ padding:100px 20px 60px } }

.sh-inner{ max-width:1200px; margin:0 auto }
.sh-narrow{ max-width:720px; margin:0 auto }

/* ─── Breadcrumb ─── */
.sh-crumb{
  display:flex; align-items:center; gap:10px;
  font-family:'JetBrains Mono',monospace;
  font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted,#8a8d95);
  margin-bottom:32px;
}
.sh-crumb a{ color:var(--ink-soft,#4a4d57); text-decoration:none; transition:.2s }
.sh-crumb a:hover{ color:var(--red,#C8000A) }
.sh-crumb .cur{ color:var(--ink,#141519) }
.sh-crumb .sep{ opacity:.3 }

/* ─── Page title ─── */
.sh-title{
  font-family:'Space Grotesk',sans-serif;
  font-weight:500;
  font-size:clamp(32px,5vw,52px);
  line-height:1; letter-spacing:-.03em;
  color:var(--ink,#141519);
  margin:0;
}
.sh-title em{
  font-family:'Instrument Serif',serif;
  font-style:italic; font-weight:400;
  color:var(--red,#C8000A);
}
.sh-sub{
  font-size:15px; line-height:1.5;
  color:var(--ink-soft,#4a4d57);
  margin:12px 0 0;
}

/* ─── Cards ─── */
.sh-card{
  background:#fff;
  border:1px solid rgba(20,21,25,.1);
  border-radius:16px;
  overflow:hidden;
}
.sh-card-head{
  padding:20px 28px;
  border-bottom:1px solid rgba(20,21,25,.08);
  font-family:'JetBrains Mono',monospace;
  font-size:11px; letter-spacing:.15em; text-transform:uppercase;
  color:var(--ink-soft,#4a4d57);
}

/* ─── Buttons (shop-specific) ─── */
.sh-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 22px;
  background:var(--ink,#141519);
  color:#faf7f1;
  border:1px solid var(--ink,#141519);
  border-radius:100px;
  font-family:'Space Grotesk',sans-serif;
  font-size:14px; font-weight:500;
  text-decoration:none; cursor:pointer;
  transition:.2s;
  letter-spacing:-.01em;
}
.sh-btn:hover{ background:var(--red,#C8000A); border-color:var(--red,#C8000A) }
.sh-btn-red{ background:var(--red,#C8000A); border-color:var(--red,#C8000A) }
.sh-btn-red:hover{ background:#a0000a; border-color:#a0000a }
.sh-btn-ghost{
  background:transparent;
  border:1px solid rgba(20,21,25,.15);
  color:var(--ink,#141519);
}
.sh-btn-ghost:hover{ background:rgba(20,21,25,.04); border-color:var(--ink,#141519); color:var(--ink,#141519) }
.sh-btn-full{ width:100%; justify-content:center }
.sh-btn-lg{ padding:16px 28px; font-size:15px }
.sh-btn-sm{ padding:10px 16px; font-size:12px }

/* ─── Form fields ─── */
.sh-field{ margin-bottom:16px }
.sh-field label{
  display:block;
  font-family:'JetBrains Mono',monospace;
  font-size:10px; letter-spacing:.15em; text-transform:uppercase;
  color:var(--ink-soft,#4a4d57);
  margin-bottom:8px;
  font-weight:500;
}
.sh-field input,
.sh-field select,
.sh-field textarea{
  width:100%;
  padding:14px 16px;
  background:#fff;
  border:1px solid rgba(20,21,25,.15);
  border-radius:10px;
  color:var(--ink,#141519);
  font-family:'Space Grotesk',sans-serif;
  font-size:15px;
  outline:none;
  transition:.2s;
  box-sizing:border-box;
}
.sh-field input:focus,
.sh-field select:focus,
.sh-field textarea:focus{
  border-color:var(--red,#C8000A);
  box-shadow:0 0 0 3px rgba(200,0,10,.08);
}
.sh-field-row{
  display:grid; grid-template-columns:1fr 1fr; gap:16px;
}
@media(max-width:560px){ .sh-field-row{ grid-template-columns:1fr } }

/* ─── Alerts ─── */
.sh-alert{
  padding:14px 18px;
  border-radius:10px;
  font-size:14px; line-height:1.5;
  margin-bottom:20px;
}
.sh-alert-err{ background:rgba(200,0,10,.08); border:1px solid rgba(200,0,10,.25); color:#8b0007 }
.sh-alert-ok{ background:rgba(31,157,85,.08); border:1px solid rgba(31,157,85,.25); color:#0f7a3e }
.sh-alert-info{ background:rgba(20,21,25,.04); border:1px solid rgba(20,21,25,.1); color:var(--ink-soft,#4a4d57) }

/* ─── Price display ─── */
.sh-price{
  font-family:'Instrument Serif',serif;
  font-style:italic;
  font-size:clamp(40px,5vw,64px);
  line-height:1;
  color:var(--ink,#141519);
  letter-spacing:-.02em;
}
.sh-price .d{
  font-family:'Space Grotesk',sans-serif;
  font-style:normal;
  color:var(--red,#C8000A);
  font-size:.55em; vertical-align:super;
  margin-right:4px; font-weight:500;
}
.sh-price-sm{ font-size:clamp(24px,3vw,32px) }
.sh-price-compare{
  display:inline-block;
  font-family:'JetBrains Mono',monospace;
  font-size:12px;
  color:var(--muted,#8a8d95);
  text-decoration:line-through;
  margin-left:8px;
}
.sh-discount{
  display:inline-block;
  background:rgba(31,157,85,.12);
  color:#0f7a3e;
  font-family:'JetBrains Mono',monospace;
  font-size:11px; font-weight:600; letter-spacing:.08em;
  padding:4px 10px;
  border-radius:100px;
  margin-left:8px;
}

/* ─── Status pill ─── */
.sh-status-pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 14px;
  border-radius:100px;
  font-family:'JetBrains Mono',monospace;
  font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  font-weight:600;
}

/* ─── Toast ─── */
.sh-toast{
  position:fixed; bottom:24px; right:24px;
  z-index:100;
  background:var(--ink,#141519);
  color:#faf7f1;
  padding:14px 20px;
  border-radius:100px;
  font-family:'Space Grotesk',sans-serif;
  font-size:14px; font-weight:500;
  display:flex; align-items:center; gap:16px;
  box-shadow:0 20px 40px -10px rgba(0,0,0,.3);
  opacity:0; transform:translateY(20px);
  pointer-events:none;
  transition:.3s cubic-bezier(.2,.7,.2,1);
}
.sh-toast.show{ opacity:1; transform:translateY(0); pointer-events:auto }
.sh-toast a{ color:var(--red,#C8000A); text-decoration:none; font-weight:600 }

/* ─── Auth layout (login/register) ─── */
.sh-auth-wrap{
  min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  background:var(--bg,#faf7f1);
  padding:40px 20px;
  font-family:'Space Grotesk',sans-serif;
  color:var(--ink,#141519);
  position:relative;
  overflow:hidden;
}
.sh-auth-wrap::before{
  content:""; position:absolute; inset:-20% auto auto -20%;
  width:60vw; height:60vw;
  background:radial-gradient(circle at center, rgba(200,0,10,.08), transparent 60%);
  filter:blur(20px); pointer-events:none;
}
.sh-auth-card{
  background:#fff;
  border:1px solid rgba(20,21,25,.08);
  border-radius:24px;
  padding:48px;
  width:100%; max-width:460px;
  position:relative;
  z-index:1;
  box-shadow:0 20px 60px -20px rgba(0,0,0,.15);
}
@media(max-width:560px){ .sh-auth-card{ padding:32px 24px; border-radius:20px } }
.sh-auth-logo{
  display:inline-flex;
  font-family:'Space Grotesk',sans-serif;
  font-weight:600;
  font-size:22px;
  letter-spacing:-.02em;
  color:var(--ink,#141519);
  text-decoration:none;
  margin-bottom:32px;
}
.sh-auth-logo em{
  font-family:'Instrument Serif',serif;
  font-style:italic;
  color:var(--red,#C8000A);
  font-weight:400;
}
.sh-auth-title{
  font-family:'Space Grotesk',sans-serif;
  font-weight:500;
  font-size:34px;
  line-height:1;
  letter-spacing:-.03em;
  margin:0 0 8px;
  color:var(--ink,#141519);
}
.sh-auth-title em{
  font-family:'Instrument Serif',serif;
  font-style:italic; color:var(--red,#C8000A); font-weight:400;
}
.sh-auth-sub{
  font-size:14px; line-height:1.5;
  color:var(--ink-soft,#4a4d57);
  margin:0 0 28px;
}
.sh-auth-divider{
  text-align:center;
  font-family:'JetBrains Mono',monospace;
  font-size:11px; letter-spacing:.15em; text-transform:uppercase;
  color:var(--muted,#8a8d95);
  margin:24px 0;
  position:relative;
}
.sh-auth-divider::before,
.sh-auth-divider::after{
  content:""; position:absolute; top:50%;
  width:40%; height:1px;
  background:rgba(20,21,25,.1);
}
.sh-auth-divider::before{ left:0 }
.sh-auth-divider::after{ right:0 }
.sh-auth-link{
  color:var(--red,#C8000A);
  font-weight:600;
  text-decoration:none;
}
.sh-auth-link:hover{ text-decoration:underline }
.sh-auth-foot{
  text-align:center;
  font-size:14px;
  color:var(--ink-soft,#4a4d57);
  margin-top:24px;
}
