/* Shared storefront styles, scoped to commerce pages. */
.commerce { --shop-panel:#101f30; --shop-soft:#162b3a; --shop-line:#2b4351; --shop-accent:#b5f3c4; --shop-ink:#102c25; --shop-text:#f4f7f5; --shop-muted:#afc2c9; background:#091723; color:var(--shop-text); }
.commerce.aware-light { --shop-panel:#fff; --shop-soft:#f0f4ef; --shop-line:#d5e0d7; --shop-accent:#1d684e; --shop-ink:#fff; --shop-text:#142c27; --shop-muted:#536c62; background:#f8faf6; color:var(--shop-text); }
.commerce [hidden] { display:none!important; }
.commerce .shop-shell { max-width:1240px; width:calc(100% - 56px); margin:0 auto; padding:34px 0 72px; }
.commerce .shop-bar,.commerce .section-top,.commerce .row,.commerce .card-foot { display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap; }
.commerce .shop-bar { border-bottom:1px solid var(--shop-line);padding-bottom:23px;margin-bottom:36px; }
.commerce .shop-brand { font-weight:850;font-size:1.05rem;letter-spacing:.03em;color:var(--shop-text); }
.commerce .shop-bar a { color:var(--shop-text); }
.commerce .shop-bar nav,.commerce .actions { display:flex;gap:12px;flex-wrap:wrap;align-items:center; }
.commerce .shop-bar nav a { font-size:.87rem; }
.commerce .eyebrow { display:block;min-height:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;text-transform:uppercase;letter-spacing:.16em;font-weight:750;font-size:.71rem;color:var(--shop-accent);margin-bottom:18px; }
.commerce h1 { font-size:clamp(2.3rem,4.8vw,4.7rem);line-height:1.06;letter-spacing:-.055em;margin:0 0 23px;max-width:820px;color:var(--shop-text); }
.commerce h1 em { font-style:normal;color:var(--shop-accent); }
.commerce h2 { font-size:clamp(1.4rem,2.5vw,2rem);letter-spacing:-.025em;margin-bottom:12px;color:var(--shop-text); }
.commerce h3 { color:var(--shop-text);font-size:1.08rem;line-height:1.35;margin:10px 0; }
.commerce p { line-height:1.65;color:var(--shop-muted); }
.commerce .lead { font-size:1.08rem;max-width:610px;margin-bottom:28px; }
.commerce a { color:var(--shop-accent); }
.commerce .shop-btn { display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:46px;padding:11px 19px;border:1px solid var(--shop-line);border-radius:10px;color:var(--shop-text);background:var(--shop-panel);font:inherit;font-size:.88rem;font-weight:750;cursor:pointer;text-decoration:none;transition:transform .12s,background .12s; }
.commerce .shop-btn.primary { background:var(--shop-accent);color:var(--shop-ink);border-color:transparent; }
.commerce .shop-btn:hover { transform:translateY(-2px); }
.commerce .shop-btn:active { transform:translateY(1px) scale(.98); }
.commerce .shop-btn:disabled { opacity:.5;cursor:not-allowed;transform:none; }
.commerce :focus-visible { outline:3px solid #62b4ff;outline-offset:3px; }
.commerce .business-hero { display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:65px;padding:20px 0 58px; }
.commerce .hero-note { font-size:.78rem;margin-top:18px; }
.commerce .store-preview { padding:30px;background:#e5eddd;border-radius:20px;transform:rotate(2deg);color:#223c2d;box-shadow:0 25px 55px #0002; }
.commerce .preview-window { background:#fffef8;border:1px solid #d5dec9;border-radius:13px;overflow:hidden; }
.commerce .preview-chrome { padding:12px 18px;border-bottom:1px solid #e4e7dc;display:flex;gap:6px;align-items:center; }
.commerce .preview-chrome i { background:#c5ccb9;width:6px;height:6px;border-radius:50%; }
.commerce .preview-chrome span { margin-left:auto;font-size:.65rem;color:#65735e; }
.commerce .preview-cover { background:#244b3e;color:#eef6dc;padding:28px 22px 24px; }
.commerce .preview-cover strong { display:block;font-size:1.65rem;letter-spacing:-.035em; }
.commerce .preview-cover small { color:#c5d8bd; }
.commerce .preview-products { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:20px; }
.commerce .preview-products span { display:block;font-size:.65rem;margin-top:7px;color:#233e31; }
.commerce .product-art { aspect-ratio:1;border-radius:7px;display:grid;place-items:center;background:#f1e6d6; }
.commerce .product-art svg { width:70%;height:70%; }
.commerce .preview-caption { color:#465c43;font-size:.7rem;text-align:center;margin-top:15px; }
.commerce .benefits { display:grid;grid-template-columns:repeat(3,1fr);gap:26px;border-top:1px solid var(--shop-line);border-bottom:1px solid var(--shop-line);padding:30px 0;margin-bottom:44px; }
.commerce .benefits b { display:inline-block;font-size:.75rem;color:var(--shop-accent);margin-bottom:6px; }
.commerce .benefits p { font-size:.87rem; }
.commerce .panel { padding:26px;background:var(--shop-panel);border:1px solid var(--shop-line);border-radius:16px;margin:20px 0; }
body.commerce.aware-light .panel { background:var(--shop-panel);border-color:var(--shop-line);box-shadow:none; }
.commerce .grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px; }
.commerce .product-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px; }
.commerce .product-card,.commerce .store-card { background:var(--shop-panel);border:1px solid var(--shop-line);border-radius:14px;overflow:hidden;min-width:0; }
.commerce .product-card .card-body,.commerce .store-card { padding:18px; }
.commerce .product-image { width:100%;aspect-ratio:1.15;object-fit:contain;background:var(--shop-soft);display:grid;place-items:center;color:var(--shop-muted);font-size:.78rem; }
.commerce .product-image.placeholder::before { content:'◇';display:block;font-size:3rem;line-height:1; }
.commerce .card-description { font-size:.83rem;margin-bottom:14px; }
.commerce .price { font-size:1.15rem;font-weight:800;color:var(--shop-text);white-space:nowrap; }
.commerce .tag { display:inline-flex;align-items:center;border:1px solid var(--shop-line);border-radius:5px;padding:4px 7px;font-size:.67rem;color:var(--shop-accent);font-weight:700; }
.commerce .muted,.commerce small { color:var(--shop-muted); }
.commerce .status { padding:14px 17px;border:1px solid var(--shop-line);border-radius:10px;background:var(--shop-soft);color:var(--shop-text);margin:14px 0;line-height:1.55;overflow-wrap:anywhere; }
.commerce .status:empty { display:none; }
.commerce .status.error { border-color:#eaa383;color:var(--shop-text); }
.commerce .empty-state { text-align:center;border:1px dashed var(--shop-line);border-radius:14px;padding:42px 20px;grid-column:1/-1; }
.commerce .empty-state p { max-width:480px;margin:10px auto 20px; }
.commerce .search-row { display:flex;gap:12px;margin:28px 0; }
.commerce .search-row input { flex:1; }
.commerce input:not([type=checkbox]),.commerce select,.commerce textarea { width:100%;min-width:0;border:1px solid var(--shop-line);border-radius:9px;background:var(--shop-panel);color:var(--shop-text);padding:12px;font:inherit;font-size:.9rem;box-shadow:none; }
.commerce input::placeholder,.commerce textarea::placeholder { color:var(--shop-muted); }
.commerce input[type=checkbox] { width:18px;height:18px;flex-shrink:0;accent-color:#388361; }
.commerce label { display:grid;gap:7px;color:var(--shop-text);font-size:.86rem;font-weight:650; }
.commerce .check-label { display:flex;align-items:flex-start;gap:9px;font-weight:450;font-size:.85rem;line-height:1.5; }
.commerce .fields { display:grid;grid-template-columns:1fr 1fr;gap:18px; }
.commerce .full { grid-column:1/-1; }
.commerce textarea { min-height:92px;resize:vertical; }
.commerce .workspace-nav { display:flex;gap:8px;margin:20px 0;flex-wrap:wrap; }
.commerce .workspace-nav button[aria-pressed=true] { border-color:var(--shop-accent);color:var(--shop-accent); }
.commerce .split { display:grid;grid-template-columns:minmax(0,1.8fr) minmax(280px,1fr);gap:26px;align-items:start; }
.commerce .store-cover { background:var(--shop-soft);border:1px solid var(--shop-line);border-radius:16px;padding:38px;margin-bottom:28px; }
.commerce .store-cover h1 { font-size:clamp(2rem,4vw,3.4rem);margin:14px 0; }
.commerce .policy { white-space:pre-wrap;overflow-wrap:anywhere;font-size:.9rem; }
.commerce .basket { position:sticky;top:20px; }
.commerce .basket-line { border-bottom:1px solid var(--shop-line);padding:14px 0; }
.commerce .basket-line input { max-width:72px;padding:7px; }
.commerce .basket-line button { padding:6px;min-height:36px;font-size:.75rem; }
.commerce .totals { margin:18px 0;display:grid;gap:9px;font-size:.9rem; }
.commerce .totals .row:last-child { border-top:1px solid var(--shop-line);padding-top:12px;font-weight:800;font-size:1.1rem; }
.commerce .order-card { padding:22px;border:1px solid var(--shop-line);border-radius:13px;background:var(--shop-panel);margin:15px 0;overflow-wrap:anywhere; }
.commerce .order-card ul { padding-left:20px;margin:15px 0;line-height:1.8; }
.commerce .order-card details { margin:14px 0; }
.commerce .order-card summary { cursor:pointer;font-weight:650; }
.commerce .order-card .actions { margin-top:16px; }
.commerce dialog { margin:auto;width:min(610px,calc(100% - 24px));max-height:90vh;overflow:auto;border:1px solid var(--shop-line);border-radius:17px;padding:26px;background:var(--shop-panel);color:var(--shop-text); }
.commerce dialog::backdrop { background:#000a;backdrop-filter:blur(4px); }
.commerce dialog .product-image { max-height:260px;aspect-ratio:auto;min-height:120px;margin:18px 0; }
.commerce .preline { white-space:pre-wrap;overflow-wrap:anywhere; }
.commerce .section-top { margin:32px 0 20px; }
.commerce #seller-centre,.commerce #productsSection { scroll-margin-top:110px; }
@media(max-width:980px){.commerce .business-hero{gap:30px}.commerce .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.commerce .split{grid-template-columns:1fr}.commerce .basket{position:static}}
@media(max-width:680px){.commerce .shop-shell{width:calc(100% - 30px);padding-top:20px}.commerce .business-hero,.commerce .benefits,.commerce .grid{grid-template-columns:1fr}.commerce .business-hero{gap:36px}.commerce .store-preview{transform:none;padding:18px}.commerce .benefits{gap:20px}.commerce .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.commerce .product-card .card-body{padding:12px}.commerce .card-foot{gap:9px}.commerce .card-foot .shop-btn{width:100%;padding:8px}.commerce .fields{grid-template-columns:1fr}.commerce .panel,.commerce .store-cover{padding:20px}.commerce .shop-bar{margin-bottom:26px;gap:15px}.commerce .search-row{flex-wrap:wrap}.commerce .search-row input{flex-basis:100%}.commerce h1{font-size:2.65rem}}
@media(prefers-reduced-motion:reduce){.commerce .shop-btn{transition:none;transform:none!important}}
