/* whotu storefront integration states (2026-10-27). Only data/status/error feedback — no redesign.
   Inherits the site's font, colours and spacing from style.css / typography.css. */
.store-status{color:var(--muted);margin:14px 0;font-size:14px}
.store-status[data-kind="error"]{color:#8a3b2d}
.store-status[data-kind="ok"]{color:#2f6b4a}
.bag-summary{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:18px 0 6px;border-top:1px solid var(--line);margin-top:6px}
.bag-country{display:flex;align-items:center;gap:14px;margin:18px 0 22px;color:var(--muted);font-size:14px;white-space:nowrap}
.bag-country select{flex:1;min-width:0;max-width:100%;padding:10px 8px;font-size:14px;white-space:normal;text-overflow:ellipsis}
#overlay-content .button.full+.line-link{margin-top:22px;display:inline-flex}
.pdp-stock{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.pdp-option.is-unavailable span{color:#a3a9a5;text-decoration:line-through}
.pdp-add:disabled,.pdp-buy:disabled{opacity:.45;cursor:not-allowed}
/* account / checkout */
.account-layout.is-wide{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:start}
.account-layout .store-form-switch{display:flex;gap:28px;margin-bottom:30px}
.account-layout .store-form-switch button{padding:0 0 8px;border:0;border-bottom:1px solid transparent;color:var(--muted);background:none;cursor:pointer}
.account-layout .store-form-switch button[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--ink)}
.account-layout input[type="password"]{letter-spacing:.08em}
.account-panel{max-width:620px}
.account-panel section{padding:34px 0;border-top:1px solid var(--line)}
.account-panel section:first-of-type{border-top:0;padding-top:0}
.account-panel h2{margin-bottom:22px}
.account-panel .store-list{display:grid;gap:14px}
.record{display:grid;grid-template-columns:1fr auto;gap:12px 22px;padding:16px 0;border-top:1px solid var(--line);align-items:start}
.record:first-child{border-top:0}
.record small,.record .muted{color:var(--muted);display:block;margin-top:4px;line-height:1.5}
.record .record-tools{display:flex;gap:14px;align-items:center;white-space:nowrap}
.record .record-tools button,.text-button{background:none;border:0;padding:0;text-decoration:underline;cursor:pointer;color:var(--ink);font:inherit}
.record details{grid-column:1/-1}
.record summary{cursor:pointer;color:var(--muted);font-size:14px}
.record ul{margin:12px 0 0;padding-left:18px;color:var(--muted);line-height:1.7}
.store-pick{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;padding:16px 0;border-top:1px solid var(--line);cursor:pointer}
.store-pick:first-child{border-top:0}
.account-layout .store-pick input,.store-pick input{width:auto;margin:5px 0 0}
.store-pick small{display:block;color:var(--muted);margin-top:3px;line-height:1.5}
.store-pick.is-disabled{opacity:.5;cursor:not-allowed}
.store-form{display:grid;gap:4px;margin-top:18px}
.store-form .two{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.store-form select{width:100%;margin-bottom:18px;padding:14px 12px}
.store-actions{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;margin-top:10px}
.checkout-steps{counter-reset:step;display:grid;gap:0}
.checkout-step{padding:30px 0;border-top:1px solid var(--line)}
.checkout-step:first-child{border-top:0;padding-top:0}
.checkout-step h2{display:flex;gap:14px;align-items:baseline;margin-bottom:18px}
.checkout-step h2 small{color:var(--muted);font-size:13px;font-weight:400}
.checkout-step[data-state="done"] h2 small::after{content:" · done"}
.checkout-step[data-state="todo"]{opacity:.45}
.checkout-summary{position:sticky;top:30px}
.checkout-summary .bag-row{grid-template-columns:60px 1fr}
.checkout-summary .bag-row img{width:60px;height:76px}
.checkout-totals{display:grid;gap:10px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted)}
.checkout-totals div{display:flex;justify-content:space-between;gap:20px}
.checkout-totals div.total{color:var(--ink);font-weight:600;padding-top:8px}
.promo-row{display:flex;gap:12px;margin:18px 0 0}
.promo-row input{flex:1;padding:12px 14px;border:1px solid #aeb7af;margin:0}
.promo-row button{padding:12px 16px;border:1px solid var(--ink);background:none;cursor:pointer}
.pay-mount{min-height:120px;margin:10px 0 20px}
.pay-mount .ui-wait{color:var(--muted)}
.store-note{color:var(--muted);font-size:13px;line-height:1.6}
.button:disabled,.button[aria-disabled="true"]{opacity:.45;pointer-events:none}
@media (max-width:860px){.account-layout.is-wide{grid-template-columns:1fr}.checkout-summary{position:static;order:2}.store-form .two{grid-template-columns:1fr}.record{grid-template-columns:1fr}.bag-country select{max-width:100%}}
/* unified sign-in */
.auth-phone{margin-top:34px;padding-top:30px;border-top:1px solid var(--line)}
.consent-row{display:flex;gap:12px;align-items:flex-start;margin:18px 0 24px;line-height:1.5}
.consent-row input{width:auto;margin:4px 0 0}
.consent-row small{display:block;color:var(--muted);margin-top:4px}
#social-row{margin-top:30px}
#social-buttons .button{padding:12px 20px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Website auth uses the App provider marks and shared identity flow. */
#auth-box #social-row{margin-top:0}#social-buttons{display:grid;gap:12px}#social-buttons .oauth-provider{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;background:transparent;color:var(--ink);border:1px solid var(--line)}.oauth-provider svg{width:22px;height:22px;flex:none}.oauth-provider:disabled{opacity:.45;cursor:not-allowed}#apple-pending{margin:12px 0 0}#auth-box .auth-phone{margin-top:24px;padding-top:24px}
