﻿/* ArtworkStoreApp visual bridge into the site's existing Generic.css design tokens. */
.aw-store-shell {
    --aw-bg: var(--color-bg-gray);
    --aw-ink: var(--color-text-primary);
    --aw-muted: var(--color-text-secondary);
    --aw-line: var(--color-border);
    --aw-coral: var(--color-brand);
    --aw-coral-dark: #e12828;
    --aw-mustard: #d99614;
    --aw-white: var(--color-bg-white);
    --aw-sale: var(--color-brand);
    background: var(--aw-bg);
    color: var(--aw-ink);
    font-family: var(--ff-primary);
    font-size: var(--fs-sm);
    font-weight: var(--fw-normal);
    line-height: var(--lh-base);
    min-height: 70vh;
    padding-bottom: var(--spacing-10);
}
.aw-store-shell *, .aw-store-shell *::before, .aw-store-shell *::after { box-sizing: border-box; }
.aw-store-shell h1,.aw-store-shell h2,.aw-store-shell h3,.aw-store-shell h4,.aw-store-shell h5,.aw-store-shell .aw-title { font-family: var(--ff-primary); color: var(--aw-ink); font-weight: var(--fw-semibold); line-height: var(--lh-tight); }
.aw-store-shell h1,.aw-store-shell .aw-title { font-size: var(--fs-xl); }
.aw-store-shell h2 { font-size: var(--fs-lg); }
.aw-store-shell h3 { font-size: var(--fs-md); }
.aw-store-shell h4,.aw-store-shell h5 { font-size: var(--fs-base); }
.aw-promo-bar { background: var(--aw-ink); color: var(--aw-white); text-align:center; font-size:var(--fs-xs); padding:var(--spacing-2) var(--spacing-4); }
.aw-navbar { background:var(--aw-white); border-bottom:1px solid var(--aw-line); position:sticky; top:78px; z-index:90; box-shadow:var(--shadow-sm); }
.aw-navbar-inner { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:var(--spacing-6); }
.aw-store-brand { color:var(--aw-coral); font-size:var(--fs-lg); font-weight:var(--fw-bold); text-decoration:none; white-space:nowrap; }
.aw-store-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:var(--spacing-5); }
.nav-link-aw { color:var(--aw-ink); text-decoration:none; font-size:var(--fs-sm); font-weight:var(--fw-medium); transition:.15s ease; }
.nav-link-aw:hover,.nav-link-aw:focus { color:var(--aw-coral); }
.aw-link-button { border:0; background:transparent; padding:0; cursor:pointer; }
.aw-store-main { padding-top:var(--spacing-8); padding-bottom:var(--spacing-8); }
.aw-alert { border-radius:var(--radius-card); }
.aw-card { background:var(--aw-white); border:1px solid var(--aw-line); border-radius:var(--radius-card); overflow:hidden; box-shadow:var(--shadow-sm); }
.aw-card img { object-fit:cover; }
.aw-price { color:var(--aw-ink); font-weight:var(--fw-bold); }
.btn-aw-primary { background:var(--aw-coral); border:1px solid var(--aw-coral); color:var(--aw-white); border-radius:var(--radius-btn)!important; font-weight:var(--fw-semibold); font-size:var(--fs-sm); padding:.6rem 1.4rem; transition:.15s ease; }
.btn-aw-primary:hover,.btn-aw-primary:focus { background:var(--aw-coral-dark); border-color:var(--aw-coral-dark); color:var(--aw-white); transform:translateY(-1px); }
.btn-aw-outline { background:transparent; border:1.5px solid var(--aw-ink); color:var(--aw-ink); border-radius:var(--radius-btn)!important; font-weight:var(--fw-medium); }
.btn-aw-outline:hover { border-color:var(--aw-coral); color:var(--aw-coral); }
.aw-stars { color:var(--aw-mustard); font-size:var(--fs-xs); }
.aw-rating-count { color:var(--aw-muted); font-size:var(--fs-xs); }
.badge-status-Active { background:#2e7d32; border-radius:var(--radius-pill); }
.badge-status-Draft { background:var(--aw-muted); border-radius:var(--radius-pill); }
.badge-status-Archived { background:var(--aw-sale); border-radius:var(--radius-pill); }
.badge-status-Suspended { background:var(--aw-mustard); border-radius:var(--radius-pill); }
.aw-store-shell .form-control,.aw-store-shell .form-select { background:var(--aw-white); color:var(--aw-ink); border-color:var(--aw-line); font-family:var(--ff-primary); font-size:var(--fs-sm); font-weight:var(--fw-normal); }
.aw-store-shell .form-label { color:var(--aw-ink); font-size:var(--fs-sm); font-weight:var(--fw-medium); text-transform:none; letter-spacing:normal; }
.aw-store-shell .small,.aw-store-shell small { font-size:var(--fs-xs)!important; }
.aw-store-shell .table { --bs-table-bg: transparent; color:var(--aw-ink); }
.aw-store-shell .text-muted { color:var(--aw-muted)!important; }
@media (max-width: 991.98px) {
    .aw-navbar { top:68px; }
    .aw-navbar-inner { padding-block:var(--spacing-3); align-items:flex-start; flex-direction:column; }
    .aw-store-nav { justify-content:flex-start; gap:var(--spacing-3) var(--spacing-5); }
}

/* =====================================================================
   STORE LISTING, PRODUCT CARDS, WISHLIST  (built on Generic.css tokens)
   ===================================================================== */
.aw-store-shell .aw-page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--spacing-4) var(--spacing-6); flex-wrap:wrap; margin-bottom:var(--spacing-5); }
.aw-store-shell .aw-page-title { margin:0; font-size:var(--fs-xl); font-weight:var(--fw-semibold); letter-spacing:-.01em; line-height:var(--lh-tight); }
.aw-store-shell .aw-page-sub { margin:var(--spacing-1) 0 0; color:var(--color-text-secondary); font-size:var(--fs-sm); font-weight:var(--fw-normal); }
.aw-tools { display:flex; align-items:center; gap:var(--spacing-3); flex-wrap:nowrap; }
.aw-search { position:relative; width:360px; max-width:100%; }
.aw-search > i { position:absolute; left:18px; top:50%; transform:translateY(-50%); color:var(--color-text-secondary); font-size:var(--fs-sm); pointer-events:none; transition:color .15s ease; }
.aw-search:focus-within > i { color:var(--color-text-primary); }
.aw-store-shell .aw-search input.form-control { height:46px; padding:0 var(--spacing-5) 0 46px; background-color:var(--color-bg-white); border:1px solid var(--color-border); box-shadow:var(--shadow-sm); font-size:var(--fs-sm); font-weight:var(--fw-normal); transition:border-color .15s ease, box-shadow .15s ease; }
.aw-store-shell .aw-search input.form-control::placeholder { color:var(--color-text-secondary); }
.aw-store-shell .aw-search input.form-control:hover { border-color:#b8b8b8; }
.aw-store-shell .aw-search input.form-control:focus { border-color:var(--color-text-primary); box-shadow:0 0 0 4px rgba(34,34,34,.08); outline:0; }
.aw-store-shell select.aw-select { -webkit-appearance:none; appearance:none; height:46px; min-width:196px; padding:0 44px 0 var(--spacing-5); background-color:var(--color-bg-white); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16' fill='none' stroke='%23222' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 18px center; background-size:14px; border:1px solid var(--color-border); box-shadow:var(--shadow-sm); font-size:var(--fs-sm); font-weight:var(--fw-medium); cursor:pointer; transition:border-color .15s ease, box-shadow .15s ease; }
.aw-store-shell select.aw-select:hover { border-color:#b8b8b8; }
.aw-store-shell select.aw-select:focus { border-color:var(--color-text-primary); box-shadow:0 0 0 4px rgba(34,34,34,.08); outline:0; }
.aw-icon-btn { position:relative; flex:0 0 auto; width:46px; height:46px; display:grid; place-items:center; border:1px solid var(--color-border); border-radius:50%; background:var(--color-bg-white); color:var(--color-text-primary)!important; font-size:1.15rem; text-decoration:none!important; box-shadow:var(--shadow-sm); transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.aw-icon-btn:hover { border-color:var(--color-brand); box-shadow:var(--shadow-md); transform:translateY(-1px); }
.aw-icon-btn .bi { line-height:1; color:var(--color-brand); }
.aw-icon-btn .aw-count-badge { position:absolute; top:-5px; right:-5px; border:2px solid var(--color-bg-gray); }
.aw-count-badge { min-width:20px; height:20px; padding:0 6px; border-radius:var(--radius-pill); background:var(--color-brand); color:var(--color-bg-white); font-size:var(--fs-2xs); font-weight:var(--fw-medium); display:inline-flex; align-items:center; justify-content:center; line-height:1; }
.aw-count-badge.d-none { display:none!important; }

.aw-pill-link { display:inline-flex; align-items:center; gap:var(--spacing-2); height:44px; padding:0 var(--spacing-5); border:1px solid var(--color-border); border-radius:var(--radius-pill); background:var(--color-bg-white); color:var(--color-text-primary)!important; font-size:var(--fs-sm); font-weight:var(--fw-medium); text-decoration:none!important; white-space:nowrap; box-shadow:var(--shadow-sm); transition:border-color .15s ease, box-shadow .15s ease; }
.aw-pill-link:hover { border-color:var(--color-text-primary); box-shadow:var(--shadow-md); }

/* category chips */
.aw-chips { position:relative; display:flex; align-items:center; margin-bottom:var(--spacing-6); }
.aw-chip-scroll { display:flex; gap:var(--spacing-2); flex:1; min-width:0; overflow-x:auto; scroll-behavior:smooth; scrollbar-width:none; padding:4px 2px; }
.aw-chip-scroll::-webkit-scrollbar { display:none; }
.aw-cat-chip { flex:0 0 auto; display:inline-flex; align-items:center; height:40px; padding:0 var(--spacing-5); border:1px solid var(--color-border); border-radius:var(--radius-pill); background:var(--color-bg-white); color:var(--color-text-primary)!important; font-size:var(--fs-sm); font-weight:var(--fw-medium); text-decoration:none!important; white-space:nowrap; transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease; }
.aw-cat-chip:hover { border-color:var(--color-text-primary); box-shadow:var(--shadow-sm); }
.aw-cat-chip.active { background:var(--color-brand); border-color:var(--color-brand); color:var(--color-bg-white)!important; }
.aw-chip-arrow { flex:0 0 auto; width:36px; height:36px; margin-left:var(--spacing-2); border:1px solid var(--color-border); border-radius:50%; background:var(--color-bg-white); box-shadow:var(--shadow-sm); display:grid; place-items:center; cursor:pointer; color:var(--color-text-primary); }
.aw-chip-arrow.left { margin:0 var(--spacing-2) 0 0; }
.aw-chip-arrow:hover { border-color:var(--color-text-primary); }
.aw-hidden { display:none!important; }

/* page grid + filter rail */
.aw-shop { display:grid; grid-template-columns:276px minmax(0,1fr); gap:var(--spacing-8); align-items:start; }
.aw-rail { position:sticky; top:104px; background:var(--color-bg-white); border:1px solid var(--color-border); border-radius:var(--radius-card); box-shadow:var(--shadow-sm); overflow:hidden; }
.aw-rail-head { display:flex; align-items:center; justify-content:space-between; padding:var(--spacing-4) var(--spacing-5); border-bottom:1px solid var(--color-border); background:var(--color-bg-white); }
.aw-rail-head h2 { display:flex; align-items:center; gap:var(--spacing-2); margin:0; font-size:var(--fs-sm); font-weight:var(--fw-semibold); }
.aw-rail-head h2 i { color:var(--color-brand); }
.aw-rail-reset { color:var(--color-brand)!important; font-size:var(--fs-xs); font-weight:var(--fw-medium); text-decoration:none!important; }
.aw-rail-reset:hover { text-decoration:underline!important; }
.aw-rail-group { padding:var(--spacing-5); border-bottom:1px solid var(--color-border); }
.aw-rail-group:last-child { border-bottom:0; }
.aw-rail-label { margin-bottom:var(--spacing-3); color:var(--color-text-primary); font-size:var(--fs-xs); font-weight:var(--fw-semibold); letter-spacing:.06em; text-transform:uppercase; }
.aw-opt-list { display:flex; flex-direction:column; gap:2px; margin:0 calc(var(--spacing-3) * -1); }
.aw-opt { display:flex; align-items:center; gap:var(--spacing-3); padding:9px var(--spacing-3); border-radius:12px; color:var(--color-text-primary)!important; font-size:var(--fs-sm); font-weight:var(--fw-normal); text-decoration:none!important; transition:background-color .12s ease; }
.aw-opt:hover { background:var(--color-bg-gray); }
.aw-opt::before { content:""; flex:0 0 auto; width:18px; height:18px; border:1.5px solid #b0b0b0; border-radius:50%; background:var(--color-bg-white); transition:border-color .12s ease; }
.aw-opt:hover::before { border-color:var(--color-text-primary); }
.aw-opt.active { color:var(--color-text-primary)!important; font-weight:var(--fw-medium); background:#fff4f4; }
.aw-opt.active::before { border-color:var(--color-brand); background:radial-gradient(circle, var(--color-brand) 0 5px, var(--color-bg-white) 6px); }
.aw-range-title { margin:var(--spacing-4) 0 var(--spacing-2); color:var(--color-text-secondary); font-size:var(--fs-xs); font-weight:var(--fw-medium); }
.aw-range { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:var(--spacing-2); }
.aw-range-field { position:relative; }
.aw-range-field > span { position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--color-text-secondary); font-size:var(--fs-sm); pointer-events:none; }
.aw-store-shell .aw-range-field input.form-control { height:42px; padding:0 var(--spacing-3) 0 30px; background:var(--color-bg-gray); border:1px solid transparent; box-shadow:none; font-size:var(--fs-sm); font-weight:var(--fw-normal); transition:border-color .15s ease, background-color .15s ease; }
.aw-store-shell .aw-range-field input.form-control:focus { background:var(--color-bg-white); border-color:var(--color-text-primary); box-shadow:0 0 0 3px rgba(34,34,34,.08); outline:0; }
.aw-range-sep { color:var(--color-text-secondary); }
.aw-store-shell .aw-range-apply { width:100%; height:42px; margin-top:var(--spacing-3); display:flex; align-items:center; justify-content:center; background:var(--color-text-primary); border:1px solid var(--color-text-primary); color:var(--color-bg-white); font-size:var(--fs-sm); font-weight:var(--fw-medium); cursor:pointer; transition:background-color .15s ease, border-color .15s ease; }
.aw-store-shell .aw-range-apply:hover { background:var(--color-brand); border-color:var(--color-brand); }
.aw-store-shell .aw-filter-toggle { display:none; width:100%; margin-bottom:var(--spacing-3); height:44px; align-items:center; justify-content:center; gap:var(--spacing-2); }

/* active filter tags */
.aw-active-filters { display:flex; flex-wrap:wrap; align-items:center; gap:var(--spacing-2); margin-bottom:var(--spacing-5); }
.aw-tag { display:inline-flex; align-items:center; gap:6px; height:32px; padding:0 var(--spacing-3); border:1px solid var(--color-border); border-radius:var(--radius-pill); background:var(--color-bg-white); color:var(--color-text-primary)!important; font-size:var(--fs-xs); text-decoration:none!important; }
.aw-tag:hover { border-color:var(--color-text-primary); }
.aw-clear-all { color:var(--color-brand)!important; font-size:var(--fs-xs); font-weight:var(--fw-medium); text-decoration:none!important; margin-left:var(--spacing-1); }
.aw-clear-all:hover { text-decoration:underline!important; }

/* product grid + card */
.aw-pc-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(212px,1fr)); gap:var(--spacing-8) var(--spacing-5); }
.aw-pc { position:relative; display:flex; flex-direction:column; min-width:0; transition:opacity .2s ease, transform .2s ease; }
.aw-pc.is-removing { opacity:0; transform:scale(.96); }
.aw-pc-figure { position:relative; aspect-ratio:4/5; overflow:hidden; border:1px solid rgba(0,0,0,.05); border-radius:var(--radius-card); background:#efefef; transition:box-shadow .2s ease, transform .2s ease; }
.aw-pc:hover .aw-pc-figure { box-shadow:var(--shadow-md); transform:translateY(-2px); }
.aw-pc-media { position:absolute; inset:0; display:block; }
.aw-pc-noimg { position:absolute; inset:0; display:grid; place-items:center; background:linear-gradient(135deg,#f4f4f4,#e8e8e8); color:#bcbcbc; font-size:2.5rem; }
.aw-pc-media img.aw-pc-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.aw-pc:hover .aw-pc-media img.aw-pc-img { transform:scale(1.04); }
.aw-pc-badge { position:absolute; top:12px; left:12px; z-index:2; display:inline-flex; align-items:center; height:26px; padding:0 10px; border-radius:var(--radius-pill); background:var(--color-bg-white); color:var(--color-text-primary); font-size:var(--fs-xs); font-weight:var(--fw-medium); box-shadow:var(--shadow-sm); }
.aw-pc-badge.sale { background:var(--color-brand); color:var(--color-bg-white); }
.aw-pc-badge.sold { background:var(--color-text-primary); color:var(--color-bg-white); }
.aw-pc-heart { position:absolute; top:10px; right:10px; z-index:3; width:38px; height:38px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.96); box-shadow:var(--shadow-sm); display:grid; place-items:center; cursor:pointer; transition:transform .15s ease, box-shadow .15s ease; }
.aw-pc-heart i { font-size:1.05rem; line-height:1; color:var(--color-text-primary); }
.aw-pc-heart:hover { transform:scale(1.08); box-shadow:var(--shadow-md); }
.aw-pc-heart:focus-visible { outline:2px solid var(--color-text-primary); outline-offset:2px; }
.aw-pc-heart.is-saved i { color:var(--color-brand); }
.aw-pc-heart[data-busy="1"] { opacity:.65; pointer-events:none; }
.aw-pc-heart.pop i { animation:awPop .32s ease; }
@keyframes awPop { 0% { transform:scale(1); } 50% { transform:scale(1.4); } 100% { transform:scale(1); } }
.aw-pc-body { display:block; padding:var(--spacing-3) 2px 0; color:inherit!important; text-decoration:none!important; }
.aw-pc-artist { display:flex; align-items:center; gap:var(--spacing-2); margin-bottom:6px; color:var(--color-text-secondary); font-size:var(--fs-xs); font-weight:var(--fw-normal); }
.aw-pc-artist .name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.aw-pc-avatar { flex:0 0 auto; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:#fff1f1; color:var(--color-brand); font-size:11px; font-weight:var(--fw-medium); text-transform:uppercase; }
.aw-store-shell .aw-pc-title { margin:0 0 4px; color:var(--color-text-primary); font-size:var(--fs-sm); font-weight:var(--fw-normal)!important; line-height:1.4; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
.aw-pc-rating { display:flex; align-items:center; gap:4px; margin-bottom:4px; }
.aw-pc-price { display:flex; align-items:baseline; flex-wrap:wrap; gap:2px 8px; }
.aw-pc-price .now { color:var(--color-text-primary); font-size:var(--fs-base); font-weight:var(--fw-medium); }
.aw-pc-price .was { color:var(--color-text-secondary); font-size:var(--fs-xs); text-decoration:line-through!important; }
.aw-pc-price .off { color:#1a7f4b; font-size:var(--fs-xs); font-weight:var(--fw-normal); }
.aw-pc-meta { margin-top:2px; color:var(--color-text-secondary); font-size:var(--fs-xs); }
.aw-pc-coupon { display:inline-flex; align-items:center; gap:4px; margin-top:6px; padding:2px 10px; border-radius:var(--radius-pill); background:#fff1f1; color:var(--color-brand); font-size:var(--fs-xs); }

/* empty state */
.aw-empty { padding:var(--spacing-10) var(--spacing-4); text-align:center; background:var(--color-bg-white); border:1px dashed var(--color-border); border-radius:var(--radius-card); }
.aw-empty > i { font-size:2.25rem; color:#c9c9c9; }
.aw-store-shell .aw-empty h3 { margin:var(--spacing-3) 0 var(--spacing-1); font-size:var(--fs-md); }
.aw-empty p { margin:0 0 var(--spacing-4); color:var(--color-text-secondary); }

/* toast */
.aw-toast-host { position:fixed; left:50%; bottom:28px; transform:translateX(-50%); z-index:2000; display:flex; flex-direction:column; align-items:center; gap:var(--spacing-2); pointer-events:none; }
.aw-toast { pointer-events:auto; display:flex; align-items:center; gap:var(--spacing-3); padding:12px 20px; border-radius:var(--radius-pill); background:var(--color-text-primary); color:var(--color-bg-white); font-size:var(--fs-sm); box-shadow:var(--shadow-lg); animation:awToastIn .25s ease both; }
.aw-toast.error { background:#b42318; }
.aw-toast a { color:var(--color-bg-white)!important; font-weight:var(--fw-medium); text-decoration:underline!important; }
@keyframes awToastIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }

@media (max-width: 991.98px) {
    .aw-shop { grid-template-columns:minmax(0,1fr); gap:var(--spacing-4); }
    .aw-rail { position:static; display:none; }
    .aw-rail.open { display:block; }
    .aw-store-shell .aw-filter-toggle { display:flex; }
}
@media (max-width: 767.98px) {
    .aw-tools { width:100%; flex-wrap:wrap; }
    .aw-search { flex:1 1 100%; width:100%; }
    .aw-store-shell select.aw-select { flex:1 1 0; min-width:0; }
}
@media (max-width: 575.98px) {
    .aw-pc-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--spacing-6) var(--spacing-3); }
}

/* =====================================================================
   FORM SYSTEM  -  identical look to the "Become a Creator" form
   white page, centered 2.5rem title, uppercase section label + rule,
   1.5px bordered cards (16px radius), uppercase labels, 48px inputs with
   2px #DDD border / 16px radius / semibold text, full-width red pill submit
   Uses only Generic.css tokens, so fonts/colours stay in sync with the site.
   ===================================================================== */

/* plain white page (the store shell is off-white #F7F7F7 by default) */
.aw-store-shell.aw-store-shell--white { background: var(--color-bg-white); }

.awf-wrap { width:100%; max-width:920px; margin:0 auto; padding:var(--spacing-6) var(--spacing-4) var(--spacing-10); }
.awf-wrap.awf-wide { max-width:1160px; }

.awf-back { display:inline-flex; align-items:center; gap:6px; margin-bottom:var(--spacing-4); color:var(--color-text-secondary)!important; font-size:var(--fs-sm); font-weight:var(--fw-semibold); text-decoration:none!important; }
.awf-back:hover { color:var(--color-text-primary)!important; }

.aw-store-shell .awf-header { text-align:center; margin-bottom:var(--spacing-10); }
.aw-store-shell .awf-header h1 { margin:0 0 var(--spacing-2); color:var(--color-text-primary); font-family:var(--ff-primary); font-size:var(--fs-4xl); font-weight:var(--fw-semibold); letter-spacing:-.03em; line-height:var(--lh-tight); }
.awf-header p { margin:0; color:var(--color-text-secondary); font-size:var(--fs-sm); font-weight:var(--fw-semibold); }

/* section = small grey caption + rule, then a bordered card */
.awf-section { margin-bottom:var(--spacing-10); }
.awf-section-title { display:flex; align-items:center; justify-content:space-between; gap:var(--spacing-2); margin-bottom:var(--spacing-5); padding-bottom:var(--spacing-3); border-bottom:1px solid var(--color-border); color:var(--color-text-secondary); font-size:var(--fs-xs); font-weight:var(--fw-semibold); letter-spacing:.08em; text-transform:uppercase; }
.awf-card { padding:var(--spacing-6); background:var(--color-bg-white); border:1.5px solid var(--color-border); border-radius:var(--radius-card); }

/* labels */
.awf-wrap .form-label { display:block; margin-bottom:var(--spacing-2); color:var(--color-text-primary)!important; font-family:var(--ff-primary); font-size:var(--fs-sm)!important; font-weight:var(--fw-semibold)!important; letter-spacing:.05em!important; text-transform:uppercase!important; }
.awf-wrap .required-label::after { content:" *"; color:var(--color-brand); font-weight:var(--fw-bold); }
.awf-wrap .badge-opt { margin-left:var(--spacing-1); padding:1px 7px; border-radius:var(--radius-pill); background:var(--color-bg-gray); color:var(--color-text-secondary); font-size:var(--fs-2xs); font-weight:var(--fw-semibold); letter-spacing:0; text-transform:none; }

/* text boxes + selects */
.awf-wrap .form-control, .awf-wrap .form-select { height:48px!important; padding:var(--spacing-3); border:2px solid var(--color-border); border-radius:var(--radius-card)!important; background-color:var(--color-bg-white); color:var(--color-text-primary); font-family:var(--ff-primary); font-size:var(--fs-sm); font-weight:var(--fw-semibold); line-height:1.5; box-shadow:none; transition:border-color .15s ease; }
.awf-wrap .form-control:focus, .awf-wrap .form-select:focus { border-color:var(--color-text-primary); box-shadow:none; outline:0; }
.awf-wrap .form-control::placeholder { color:var(--color-text-secondary); font-weight:var(--fw-normal); opacity:1; }
.awf-wrap .form-control.mono { letter-spacing:.06em; text-transform:uppercase; }
.awf-wrap .form-control.mono::placeholder { text-transform:uppercase; }
.awf-wrap .form-select { padding-right:40px; cursor:pointer; background-repeat:no-repeat; background-position:right 16px center; background-size:9px 5px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='5' viewBox='0 0 9 5'%3E%3Cpath d='M0 0h9L4.5 5z' fill='%23000'/%3E%3C/svg%3E"); }
.awf-wrap textarea.form-control { height:auto!important; min-height:130px; line-height:1.55; resize:vertical; }
.awf-wrap input[type="file"].form-control { height:auto!important; padding:10px var(--spacing-3); }
.awf-wrap .form-control.form-control-sm { height:40px!important; padding:var(--spacing-2) var(--spacing-3); border-radius:12px!important; font-size:var(--fs-xs); }
.awf-wrap .form-control.form-control-color { width:56px; min-width:56px; padding:4px; }
.awf-wrap .hint { margin-top:var(--spacing-2); color:var(--color-text-secondary); font-size:var(--fs-xs); font-weight:var(--fw-normal); line-height:1.45; }
.awf-wrap .text-danger { font-size:var(--fs-sm); }

/* currency prefix (₹) */
.awf-input-prefix { position:relative; }
.awf-input-prefix > span { position:absolute; left:var(--spacing-4); top:50%; transform:translateY(-50%); color:var(--color-text-secondary); font-size:var(--fs-sm); font-weight:var(--fw-semibold); pointer-events:none; }
.awf-input-prefix .form-control { padding-left:34px; }

/* dashed upload drop-area */
.awf-upload { padding:var(--spacing-3); border:2px dashed var(--color-border); border-radius:var(--radius-card); background:var(--color-bg-white); transition:border-color .15s ease; }
.awf-upload:hover { border-color:var(--color-text-secondary); }
.awf-upload .form-control { border:0; background:transparent; }
.awf-preview-row { display:flex; align-items:flex-start; flex-wrap:wrap; gap:var(--spacing-3); margin-top:var(--spacing-3); }
.awf-preview-thumb { width:112px; height:112px; object-fit:cover; border:1.5px solid var(--color-border); border-radius:var(--radius-card); background:var(--color-bg-gray); }
.awf-preview-placeholder { display:flex; align-items:center; justify-content:center; width:112px; height:112px; padding:.75rem; border:2px dashed var(--color-border); border-radius:var(--radius-card); color:var(--color-text-secondary); font-size:var(--fs-xs); text-align:center; }
.awf-gallery-thumb { width:72px; height:72px; object-fit:cover; border:1.5px solid var(--color-border); border-radius:12px; background:var(--color-bg-gray); }

/* variants table */
.awf-table { margin-bottom:0; --bs-table-bg:transparent; }
.awf-table th { padding:var(--spacing-2) var(--spacing-1) var(--spacing-3); border-bottom:1px solid var(--color-border); color:var(--color-text-secondary); font-size:var(--fs-xs); font-weight:var(--fw-semibold); letter-spacing:.05em; text-transform:uppercase; white-space:nowrap; }
.awf-table td { padding:var(--spacing-2) var(--spacing-1); border-bottom:0; vertical-align:middle; }
.awf-remove { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; padding:0; border-radius:12px!important; }

/* small outline pill used in a section caption (e.g. "Add option") */
.awf-mini-btn { display:inline-flex; align-items:center; gap:6px; padding:6px 16px; border:1.5px solid var(--color-text-primary); border-radius:var(--radius-pill); background:var(--color-bg-white); color:var(--color-text-primary); font-family:var(--ff-primary); font-size:var(--fs-xs); font-weight:var(--fw-semibold); letter-spacing:0; text-transform:none; cursor:pointer; transition:border-color .15s ease, color .15s ease; }
.awf-mini-btn:hover { border-color:var(--color-brand); color:var(--color-brand); }

/* example / summary rows */
.awf-row { display:flex; justify-content:space-between; gap:var(--spacing-3); padding:var(--spacing-1) 0; font-size:var(--fs-sm); font-weight:var(--fw-semibold); color:var(--color-text-primary); }
.awf-row .k { color:var(--color-text-secondary); font-weight:var(--fw-normal); }
.awf-row.total { margin-top:var(--spacing-2); padding-top:var(--spacing-4); border-top:1px solid var(--color-border); font-size:var(--fs-base); }
.awf-row.good { color:#2E7D5B; }
.awf-divider { margin:var(--spacing-3) 0; border:0; border-top:1px solid var(--color-border); opacity:1; }
.awf-fine { margin:var(--spacing-1) 0 var(--spacing-2); color:var(--color-text-secondary); font-size:var(--fs-xs); font-weight:var(--fw-normal); line-height:1.45; }
.awf-meta { margin-top:var(--spacing-4); text-align:center; color:var(--color-text-secondary); font-size:var(--fs-xs); }

/* saved-address tiles (checkout) */
.awf-wrap .aw-address-choice { display:block; padding:var(--spacing-4); border:2px solid var(--color-border); border-radius:var(--radius-card); background:var(--color-bg-white); color:var(--color-text-primary); font-weight:var(--fw-semibold); cursor:pointer; transition:border-color .15s ease; }
.awf-wrap .aw-address-choice:hover { border-color:var(--color-text-secondary); }
.awf-wrap .aw-address-choice.selected { border-color:var(--color-text-primary); }
.awf-wrap .aw-address-choice .form-check-input { accent-color:var(--color-text-primary); }
.awf-wrap .aw-address-choice .addr { display:block; margin:var(--spacing-2) 0 0 var(--spacing-6); color:var(--color-text-secondary); font-size:var(--fs-sm); font-weight:var(--fw-normal); line-height:1.5; }
.awf-wrap .aw-default-badge { margin-left:var(--spacing-2); padding:2px 10px; border-radius:var(--radius-pill); background:var(--color-brand); color:var(--color-bg-white); font-size:var(--fs-2xs); font-weight:var(--fw-semibold); }

/* two-column checkout */
.awf-checkout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:var(--spacing-8); align-items:start; }

/* submit - same as .btn-witzzart on the creator form */
.awf-submit { display:flex; align-items:center; justify-content:center; gap:var(--spacing-2); width:100%; padding:var(--spacing-5); border:0; border-radius:var(--radius-btn)!important; background-color:var(--color-brand); color:var(--color-bg-white)!important; font-family:var(--ff-primary); font-size:var(--fs-base); font-weight:var(--fw-semibold); box-shadow:var(--shadow-lg); cursor:pointer; text-decoration:none!important; transition:transform .2s; }
.awf-submit:hover { transform:translateY(-2px); opacity:.9; color:var(--color-bg-white)!important; }
.awf-submit:disabled { opacity:.6; cursor:not-allowed; transform:none; }

@media (max-width: 991.98px) {
    .awf-checkout { grid-template-columns:minmax(0,1fr); }
}
@media (max-width: 575.98px) {
    .awf-wrap { padding-inline:var(--spacing-3); }
    .awf-card { padding:var(--spacing-4); }
    .aw-store-shell .awf-header h1 { font-size:var(--fs-3xl, 2rem); }
}
