/* StockFlows card: the sold-out waiting-list card. Replicates the live restocknoti card (15px radius, 15px margin,
   the pale gold gradient, input 500px / button 300px on desktop, full width on a phone) and wears the promo ring:
   a 2px conic-gradient wrapper (accent + gold, 5s) with a blurred twin for the glow. Without @property the ring
   holds still; the setting offers spin | static | off (off = the old 2px gold border). The ring spins for everyone;
   only a card carrying sfw-card--rm-still (the reduced-motion switch in settings) stays still for reduced-motion visitors.
   Colours: --sfw-accent is set inline from the accent setting. Classes are sfw- only; nothing global. */
@property --sfw-angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; }

.sfw-card{--sfw-accent:#FF4E00;--sfw-gold:#F7C51E;--sfw-radius:15px;--sfw-w:2px;--sfw-t:5s;--sfw-glow:.45;--sfw-ring:conic-gradient(from var(--sfw-angle),var(--sfw-accent) 0deg,var(--sfw-gold) 110deg,#FFF6D6 165deg,#FFFFFF 180deg,#FFF6D6 195deg,var(--sfw-gold) 250deg,var(--sfw-accent) 360deg);position:relative;display:block;box-sizing:border-box;margin:15px;padding:var(--sfw-w);border-radius:calc(var(--sfw-radius) + var(--sfw-w));background:var(--sfw-ring);animation:sfw-spin var(--sfw-t) linear infinite;isolation:isolate}
.sfw-card::before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--sfw-ring);filter:blur(14px);opacity:var(--sfw-glow);z-index:-1;pointer-events:none;animation:sfw-spin var(--sfw-t) linear infinite}
@keyframes sfw-spin{to{--sfw-angle:360deg}}
.sfw-card--ring-static,.sfw-card--ring-static::before{animation:none}
.sfw-card--ring-off{background:#ffcc33;animation:none}.sfw-card--ring-off::before{display:none}
@media (prefers-reduced-motion:reduce){.sfw-card--rm-still,.sfw-card--rm-still::before{animation:none}}

.sfw-card__inner{position:relative;z-index:1;box-sizing:border-box;border-radius:var(--sfw-radius);padding:18px 15px 20px;background-color:#fff;background-image:linear-gradient(145deg,#f9f9f9 0%,rgba(249,206,63,.32) 261%);color:#151414}
.sfw-card__heading{margin:0 0 10px;font-size:clamp(22px,2.4vw,28px);line-height:1.2;font-weight:700;color:inherit}
.sfw-card__sub{margin:0 0 16px;font-size:16px;line-height:1.5;font-weight:700}
.sfw-card__text{margin:0 0 14px;font-size:16px;line-height:1.5}
.sfw-form{display:block;margin:0}
.sfw-field{margin:0 0 14px}
/* .sfw-form .sfw-input (0,2,0): a theme's input[type="email"] rule (0,1,1) cannot win the border, height or padding. */
.sfw-form .sfw-input{box-sizing:border-box;display:block;width:100%;max-width:500px;min-height:48px;margin:0;padding:10px 14px;border:1px solid #cfcac4;border-radius:8px;background:#fff;color:#151414;font:inherit;font-size:16px;line-height:1.4;box-shadow:inset 0 1px 2px rgba(0,0,0,.04)}
.sfw-form .sfw-input:focus{outline:none;border-color:var(--sfw-accent);box-shadow:0 0 0 3px rgba(255,78,0,.18)}
.sfw-form.is-invalid .sfw-input{border-color:#b32d2e;box-shadow:0 0 0 3px rgba(179,45,46,.15)}
.sfw-captcha{margin:0 0 14px;min-height:78px}
.sfw-captcha>div{max-width:100%}
.sfw-captcha:empty{box-sizing:border-box;width:304px;max-width:100%;height:78px;border:1px solid #d3d3d3;border-radius:3px;background:#f9f9f9;box-shadow:0 0 4px 1px rgba(0,0,0,.08)}
.sfw-captcha:empty::after{content:attr(data-loading);display:block;padding:29px 0 0 14px;font-size:14px;color:#8a8580}
.sfw-submit,.sfw-btn{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;max-width:300px;min-height:48px;margin:0;padding:12px 24px;border:0;border-radius:8px;background:var(--sfw-accent,#FF4E00);color:#fff;font:inherit;font-size:large;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,filter .12s ease;box-shadow:0 1px 2px rgba(0,0,0,.12),0 10px 22px -12px rgba(255,78,0,.7)}
.sfw-submit:hover,.sfw-btn:hover{transform:translateY(-1px);filter:brightness(1.05);color:#fff;text-decoration:none}
.sfw-submit:active,.sfw-btn:active{transform:none;filter:brightness(.97)}
.sfw-submit:focus-visible,.sfw-btn:focus-visible,.sfw-link:focus-visible{outline:3px solid var(--sfw-accent,#FF4E00);outline-offset:3px}
.sfw-submit[disabled]{opacity:.7;cursor:progress;transform:none}
.sfw-btn--go{background:linear-gradient(180deg,#12A35A,#0B8A4B);box-shadow:0 1px 2px rgba(11,138,75,.25),0 12px 26px -12px rgba(11,138,75,.75)}
.sfw-msg{margin:12px 0 0;min-height:1.4em;font-size:15px;line-height:1.4;color:#5b5550}
.sfw-msg.is-error{color:#b32d2e;font-weight:600}
.sfw-msg:empty{margin:0;min-height:0}
.sfw-link{display:inline-block;margin-top:4px;font-weight:700;color:var(--sfw-accent,#FF4E00);text-decoration:none}
.sfw-link:hover{text-decoration:underline;color:var(--sfw-accent,#FF4E00)}
.sfw-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.sfw-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.sfw-noscript{margin:8px 0 0;font-size:14px}
.sfw-card__done,.sfw-card__back{animation:sfw-in .35s ease}
@keyframes sfw-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.sfw-card__done,.sfw-card__back{animation:none}}
@media (max-width:600px){.sfw-card{margin:15px 0}.sfw-card__inner{padding:16px 14px 18px}.sfw-form .sfw-input,.sfw-submit,.sfw-btn{max-width:none}.sfw-card__heading{font-size:22px}}

/* The stock-alerts page (confirm / unsubscribe). */
.sfw-alerts{--sfw-accent:#FF4E00;max-width:640px}
.sfw-alerts h2{margin:0 0 12px}
.sfw-alerts__list{list-style:none;margin:0 0 20px;padding:0}
.sfw-alerts__list li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;padding:10px 0;border-bottom:1px solid #e7e2dd}
.sfw-alerts__one{margin:0}
.sfw-alerts__btn-link{background:none;border:0;padding:0;color:#b32d2e;font:inherit;text-decoration:underline;cursor:pointer}
.sfw-alerts__all{margin:8px 0 12px}
.sfw-alerts__ok{padding:10px 14px;border-radius:8px;background:#e7f6ec;color:#0b5c2e;font-weight:600}
.sfw-alerts__note{color:#6b6560;font-size:14px}
