/* 4A Loyalty v1.0.1 */
.foura-loyalty{
  --foura-bg:#f4f1ec;
  --foura-fg:#111;
  --foura-muted:#716c65;
  --foura-card:#fff;
  --foura-line:#d8d2ca;
  --foura-accent:#111;
  width:100%;
  max-width:860px;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  color:var(--foura-fg);
}
.foura-loyalty *{box-sizing:border-box}
.foura-card,.foura-points-panel,.foura-vouchers{
  background:var(--foura-card);color:var(--foura-fg);border:1px solid var(--foura-line);
  padding:34px;margin:0 0 20px;
}
.foura-kicker{font-size:10px;letter-spacing:.26em;font-weight:700;margin-bottom:16px;text-transform:uppercase}
.foura-card h2,.foura-points-panel h3,.foura-vouchers h3{color:var(--foura-fg)}
.foura-card h2{font-size:42px;line-height:.98;margin:0 0 12px;font-weight:500;letter-spacing:-.045em}
.foura-benefit{color:var(--foura-muted);margin:0 0 28px;font-size:16px}
.foura-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:26px 0}
.foura-stats>div{background:var(--foura-bg);padding:22px 20px;min-height:100px;display:flex;flex-direction:column;justify-content:center}
.foura-stats strong{display:block;font-size:30px;line-height:1;font-weight:500;letter-spacing:-.04em;color:var(--foura-fg)}
.foura-stats span{margin-top:9px;font-size:11px;color:var(--foura-muted);letter-spacing:.02em}
.foura-progress-copy{font-size:13px;margin:18px 0 10px}
.foura-progress{height:5px;background:var(--foura-bg);overflow:hidden}
.foura-progress span{display:block;height:100%;background:var(--foura-accent)}
.foura-points-panel h3,.foura-vouchers h3{margin:0 0 18px;font-size:30px;line-height:1.05;font-weight:500;letter-spacing:-.035em}
.foura-points-panel p{font-size:15px;line-height:1.65}
.foura-redeem-form{display:grid;grid-template-columns:1fr 140px auto;gap:10px;align-items:end;margin-top:20px}
.foura-redeem-form label{grid-column:1/-1;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.foura-redeem-form input{min-height:44px;border:1px solid var(--foura-line);background:transparent;color:var(--foura-fg);padding:0 12px}
.foura-redeem-form .button{min-height:44px;border-radius:0!important;background:var(--foura-accent)!important;color:#fff!important;border:1px solid var(--foura-accent)!important;padding:0 18px!important;text-transform:uppercase;font-size:10px!important;letter-spacing:.14em!important}
.foura-voucher{display:flex;align-items:center;justify-content:space-between;gap:22px;border-top:1px solid var(--foura-line);padding:16px 0}
.foura-voucher:first-of-type{border-top:0}
.foura-voucher span{display:block;font-size:9px;color:var(--foura-muted);text-transform:uppercase;letter-spacing:.18em}
.foura-voucher strong{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:15px;color:var(--foura-fg)}
.foura-voucher-value{font-size:20px;font-weight:600}

/* CLEAN — quiet, product-led */
.foura-theme-clean{--foura-bg:#f5f3ef;--foura-card:#fff;--foura-fg:#111;--foura-muted:#6f6b65;--foura-line:#d9d5ce;--foura-accent:#111}
.foura-theme-clean .foura-card h2{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}

/* EDITORIAL — fashion serif + precise UI */
.foura-theme-editorial{--foura-bg:#f1ece4;--foura-card:#fbfaf7;--foura-fg:#181613;--foura-muted:#777068;--foura-line:#cbc2b7;--foura-accent:#181613}
.foura-theme-editorial .foura-card h2,.foura-theme-editorial .foura-points-panel h3,.foura-theme-editorial .foura-vouchers h3{font-family:"Bodoni 72",Didot,"Times New Roman",serif;font-weight:400;letter-spacing:-.035em}
.foura-theme-editorial .foura-card h2{font-size:50px}
.foura-theme-editorial .foura-kicker{font-size:9px;letter-spacing:.32em}
.foura-theme-editorial .foura-stats>div{border-top:1px solid var(--foura-line);background:transparent;padding-left:0}

/* NOIR — dark / beige */
.foura-theme-noir,.foura-theme-fashion{--foura-bg:#eee7dc;--foura-card:#111;--foura-fg:#f8f4ed;--foura-muted:#bcb4a9;--foura-line:#32302d;--foura-accent:#e9dfd2}
.foura-theme-noir .foura-card,.foura-theme-noir .foura-points-panel,.foura-theme-noir .foura-vouchers,.foura-theme-fashion .foura-card,.foura-theme-fashion .foura-points-panel,.foura-theme-fashion .foura-vouchers{background:#111;border-color:#2f2d2a}
.foura-theme-noir .foura-stats>div,.foura-theme-fashion .foura-stats>div{color:#111}
.foura-theme-noir .foura-stats>div strong,.foura-theme-fashion .foura-stats>div strong{color:#111}
.foura-theme-noir .foura-stats>div span,.foura-theme-fashion .foura-stats>div span{color:#7f786f}
.foura-theme-noir .foura-card h2,.foura-theme-noir .foura-points-panel h3,.foura-theme-fashion .foura-card h2,.foura-theme-fashion .foura-points-panel h3{font-family:"Bodoni 72",Didot,"Times New Roman",serif;font-weight:400}
.foura-theme-noir .foura-progress span,.foura-theme-fashion .foura-progress span{background:#f8f4ed}

/* MODERN — soft UI */
.foura-theme-modern{--foura-bg:#f2f1ee;--foura-card:#fff;--foura-fg:#111;--foura-muted:#74716c;--foura-line:#e1ded8;--foura-accent:#111}
.foura-theme-modern .foura-card,.foura-theme-modern .foura-points-panel,.foura-theme-modern .foura-vouchers{border-radius:22px;padding:36px}
.foura-theme-modern .foura-stats>div{border-radius:15px}
.foura-theme-modern .foura-progress,.foura-theme-modern .foura-progress span{border-radius:99px}
.foura-theme-modern .foura-card h2{font-weight:650}

/* BOLD — high-contrast, graphic */
.foura-theme-bold{
  --foura-bg:#111;
  --foura-card:#fff;
  --foura-fg:#111;
  --foura-muted:#5f5f5f;
  --foura-line:#111;
  --foura-accent:#111;
}
.foura-theme-bold .foura-card,
.foura-theme-bold .foura-points-panel,
.foura-theme-bold .foura-vouchers{
  border:3px solid #111;
  box-shadow:8px 8px 0 #111;
}
.foura-theme-bold .foura-card h2{
  font-weight:800;
  letter-spacing:-.055em;
  text-transform:uppercase;
}
.foura-theme-bold .foura-stats>div{
  border:2px solid #111;
}

/* Legacy aliases retained for upgrades from pre-1.0 beta versions. */
.foura-theme-editorial{--foura-bg:#f1ece4;--foura-card:#fbfaf7;--foura-fg:#181613;--foura-muted:#777068;--foura-line:#cbc2b7;--foura-accent:#181613}
.foura-theme-noir{--foura-bg:#eee7dc;--foura-card:#111;--foura-fg:#f8f4ed;--foura-muted:#bcb4a9;--foura-line:#32302d;--foura-accent:#e9dfd2}

@media(max-width:640px){
  .foura-card,.foura-points-panel,.foura-vouchers{padding:24px}
  .foura-card h2{font-size:34px}
  .foura-theme-editorial .foura-card h2{font-size:41px}
  .foura-stats{grid-template-columns:1fr 1fr}
  .foura-stats>div{padding:18px;min-height:88px}
  .foura-redeem-form{grid-template-columns:1fr}
  .foura-redeem-form label{grid-column:auto}
}