/* Mini store — aligned with i-phone.ir design system */

.store-page {
    display: grid;
    gap: var(--space-md);
}

.store-page > .breadcrumbs {
    margin-bottom: .5rem;
}

.store-page__body {
    display: grid;
    gap: var(--space-xl);
}

.store-page__highlights {
    display: grid;
    gap: var(--space-lg);
}

.store-section--featured {
    padding: var(--space-lg);
    border-radius: var(--radius-xl);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .98) 0%, rgba(240, 248, 255, .92) 100%);
    border: 1px solid rgba(10, 132, 255, .12);
    box-shadow: var(--shadow-soft), 0 0 28px rgba(10, 132, 255, .06);
}

.store-category-panel {
    display: grid;
    gap: var(--space-md);
    padding: var(--space-md) var(--space-lg);
    border-radius: var(--radius-xl);
    background:
        linear-gradient(155deg, rgba(255, 255, 255, .98) 0%, rgba(248, 251, 255, .94) 48%, rgba(240, 247, 255, .9) 100%);
    border: 1px solid color-mix(in srgb, var(--primary) 14%, var(--border));
    box-shadow: var(--shadow-soft), 0 10px 36px rgba(10, 132, 255, .06);
}

.store-category-panel__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-sm);
}

.store-category-panel__titles {
    display: grid;
    gap: .2rem;
}

.store-category-panel__label {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--text-primary);
}

.store-category-panel__hint {
    font-size: .78rem;
    color: var(--text-tertiary);
}

.store-category-panel__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
    gap: .55rem;
}

.store-category-panel__grid--compact {
    grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr));
    gap: .45rem;
}

@media (max-width: 640px) {
    .store-category-panel__grid {
        grid-template-columns: repeat(auto-fill, minmax(6.25rem, 1fr));
    }
}

.store-category-card {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 3.25rem;
    padding: .7rem .85rem;
    padding-inline-start: 1.15rem;
    border-radius: 16px;
    border: 2px solid rgba(15, 23, 42, .06);
    background: linear-gradient(180deg, #fff 0%, #fafbff 100%);
    box-shadow: 0 2px 8px rgba(15, 23, 42, .05);
    text-decoration: none !important;
    color: inherit;
    cursor: pointer;
    transition: border-color .18s var(--ease-out), box-shadow .18s var(--ease-out), background .18s var(--ease-out);
}

.store-category-card--all {
    background: linear-gradient(145deg, #f0f7ff 0%, #fff 100%);
    border-color: color-mix(in srgb, var(--primary) 18%, var(--border));
}

.store-category-card[data-tone="0"]:not(.is-active) {
    background: linear-gradient(145deg, #f8fbff 0%, #fff 100%);
}

.store-category-card[data-tone="1"]:not(.is-active) {
    background: linear-gradient(145deg, #f6fdf9 0%, #fff 100%);
}

.store-category-card[data-tone="2"]:not(.is-active) {
    background: linear-gradient(145deg, #fffdf5 0%, #fff 100%);
}

.store-category-card[data-tone="3"]:not(.is-active) {
    background: linear-gradient(145deg, #faf8ff 0%, #fff 100%);
}

.store-category-card[data-tone="4"]:not(.is-active) {
    background: linear-gradient(145deg, #fff8fb 0%, #fff 100%);
}

.store-category-card[data-tone="5"]:not(.is-active) {
    background: linear-gradient(145deg, #f5fcff 0%, #fff 100%);
}

.store-category-card:hover {
    border-color: color-mix(in srgb, var(--primary) 32%, var(--border));
    box-shadow: 0 4px 14px rgba(10, 132, 255, .1);
}

.store-category-card.is-active {
    border-color: var(--primary);
    background: linear-gradient(165deg, #eff6ff 0%, #f8fbff 55%, #fff 100%);
    box-shadow: 0 0 0 3px rgba(10, 132, 255, .12), 0 10px 24px rgba(10, 132, 255, .14);
}

.store-category-card__name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 100%;
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.45;
    text-align: center;
    color: var(--text-primary);
}

.store-category-card.is-active .store-category-card__name {
    color: #1d4ed8;
}

.store-category-card__mark {
    position: absolute;
    top: .45rem;
    inset-inline-start: .45rem;
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 999px;
    border: 2px solid #cbd5e1;
    background: #fff;
    opacity: 0;
    transform: scale(.85);
    transition: opacity .15s, transform .15s, border-color .15s, background .15s;
}

.store-category-card__mark::after {
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    width: .32rem;
    height: .52rem;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg) scale(0);
    transition: transform .15s;
}

.store-category-card.is-active .store-category-card__mark {
    opacity: 1;
    transform: scale(1);
    border-color: var(--primary);
    background: linear-gradient(180deg, #3b9eff 0%, var(--primary) 100%);
    box-shadow: 0 2px 6px rgba(10, 132, 255, .35);
}

.store-category-card.is-active .store-category-card__mark::after {
    transform: rotate(45deg) scale(1);
}

.store-category-panel__grid--compact .store-category-card {
    min-height: 2.85rem;
    padding: .55rem .65rem;
    padding-inline-start: .85rem;
    border-radius: 14px;
}

.store-category-panel__grid--compact .store-category-card__name {
    font-size: .72rem;
}

.store-category-panel__grid--compact .store-category-card__mark {
    display: none;
}

.store-catalog {
    display: grid;
    gap: var(--space-md);
    padding: var(--space-md);
    border-radius: var(--radius-xl);
    background: var(--surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-soft);
}

.store-catalog__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-sm) var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--border);
}

.store-catalog__summary {
    margin: 0;
    font-size: .88rem;
    color: var(--text-secondary);
}

.store-catalog__summary strong {
    color: var(--text-primary);
    font-weight: 800;
}

.store-catalog__summary span {
    color: var(--text-tertiary);
}

.store-catalog__pagination {
    padding-top: var(--space-sm);
    border-top: 1px solid var(--border);
}

.empty-state--store {
    padding: var(--space-xl) var(--space-lg);
    border-radius: var(--radius-lg);
    background: var(--surface-secondary);
    border: 1px dashed var(--border);
    text-align: center;
}

.empty-state--store .empty-state__title {
    margin: 0 0 .35rem;
    font-size: 1rem;
    font-weight: 800;
    color: var(--text-primary);
}

.empty-state--store .empty-state__hint {
    margin: 0 0 var(--space-md);
    font-size: .88rem;
    color: var(--text-tertiary);
}

.empty-state--store .btn-store {
    margin-top: .15rem;
}

/* —— Hero banner —— */
.store-banner {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-lg);
    padding: var(--space-lg);
    border-radius: var(--radius-xl);
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(10, 132, 255, .96) 0%, rgba(0, 122, 255, .92) 42%, rgba(0, 180, 216, .88) 100%);
    color: #fff;
    box-shadow: var(--shadow-soft), 0 0 40px rgba(0, 229, 255, .12);
    border: 1px solid rgba(255, 255, 255, .2);
}

.store-banner::after {
    content: "";
    position: absolute;
    inset-inline: 6%;
    bottom: 0;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, .22) 18%,
        rgba(255, 255, 255, .55) 50%,
        rgba(255, 255, 255, .22) 82%,
        transparent 100%
    );
    pointer-events: none;
    z-index: 2;
}

@media (min-width: 768px) {
    .store-banner {
        padding: var(--space-xl) var(--space-2xl);
    }
}

@media (min-width: 900px) {
    .store-banner {
        grid-template-columns: 1.1fr .9fr;
        align-items: center;
    }

    .store-banner--with-art {
        align-items: stretch;
    }
}

.store-banner--compact {
    padding: var(--space-lg);
    grid-template-columns: 1fr;
}

@media (min-width: 768px) {
    .store-banner--compact {
        padding: var(--space-lg) var(--space-xl);
    }
}

.store-banner--compact .store-banner__title {
    margin-bottom: var(--space-sm);
    font-size: clamp(1.35rem, 3vw, 1.85rem);
}

.store-banner--compact .store-banner__desc {
    margin-bottom: var(--space-md);
    font-size: .92rem;
    line-height: 1.65;
}

.store-banner--compact .store-banner__search {
    margin-bottom: 0;
}

.store-banner--compact .store-banner__art {
    display: none;
}

.store-banner__mesh {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(to top, rgba(0, 0, 0, .22) 0%, transparent 55%),
        radial-gradient(circle at 18% 82%, rgba(255, 255, 255, .16), transparent 42%),
        radial-gradient(circle at 82% 18%, rgba(255, 255, 255, .1), transparent 38%);
    pointer-events: none;
}

.store-banner__content {
    position: relative;
    z-index: 1;
    max-width: 70ch;
}

.store-banner__eyebrow {
    margin: 0 0 var(--space-sm);
    font-size: 13px;
    font-weight: 600;
    opacity: .92;
}

.store-banner__title {
    margin: 0 0 var(--space-sm);
    font-size: clamp(1.25rem, 2.8vw, 1.55rem);
    font-weight: 700;
    line-height: 1.3;
}

.store-banner__desc {
    margin: 0 0 var(--space-md);
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    opacity: .94;
    max-width: 56ch;
}

.store-banner__search {
    margin-bottom: var(--space-md);
    max-width: 36rem;
}

.store-search__field {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    width: 100%;
    padding: .55rem .85rem;
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(255, 255, 255, .45);
    box-shadow: 0 8px 24px -8px rgba(0, 0, 0, .18);
    transition: box-shadow .2s var(--ease-out), border-color .2s var(--ease-out);
}

.store-search__field:focus-within {
    box-shadow: 0 0 0 4px rgba(255, 255, 255, .35), 0 8px 24px -8px rgba(0, 0, 0, .18);
}

.store-search__icon {
    display: flex;
    color: var(--text-tertiary);
    flex-shrink: 0;
}

.store-search__input {
    width: 100%;
    border: 0;
    background: transparent;
    color: var(--text-primary);
    font: inherit;
    outline: none;
    min-width: 0;
}

.store-search__input::placeholder {
    color: var(--text-tertiary);
}

.store-search__submit {
    flex-shrink: 0;
    border: 0;
    border-radius: var(--radius);
    padding: .45rem .85rem;
    font: inherit;
    font-size: .82rem;
    font-weight: 700;
    color: #fff;
    background: var(--primary);
    cursor: pointer;
    transition: opacity .2s var(--ease-out);
}

.store-search__submit:hover {
    opacity: .92;
}

.store-banner__stats {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .65rem 1rem;
}

.store-banner__stats li {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, .14);
    border: 1px solid rgba(255, 255, 255, .18);
    min-width: 5.5rem;
}

.store-banner__stats strong {
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.2;
}

.store-banner__stats span {
    font-size: .78rem;
    opacity: .88;
}

.store-banner__art {
    position: relative;
    z-index: 1;
    min-height: 8rem;
    display: none;
}

@media (min-width: 900px) {
    .store-banner__art {
        display: block;
        min-height: 12rem;
    }
}

.store-banner__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(1px);
}

.store-banner__orb--1 {
    width: 9rem;
    height: 9rem;
    top: 10%;
    inset-inline-end: 8%;
    background: radial-gradient(circle, rgba(255, 255, 255, .35), transparent 70%);
}

.store-banner__orb--2 {
    width: 6rem;
    height: 6rem;
    bottom: 18%;
    inset-inline-end: 28%;
    background: radial-gradient(circle, rgba(125, 249, 255, .45), transparent 70%);
}

.store-banner__orb--3 {
    width: 4.5rem;
    height: 4.5rem;
    top: 42%;
    inset-inline-end: 4%;
    background: radial-gradient(circle, rgba(157, 78, 221, .35), transparent 70%);
}

/* —— Hero highlights mini-grid —— */
.store-banner__art--grid {
    display: block;
    position: relative;
    z-index: 1;
    min-height: 0;
    align-self: center;
}

.store-banner__art-label {
    margin: 0 0 .6rem;
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--text-tertiary, #86868b);
}

.store-hl-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
}

.store-hl {
    display: flex;
    gap: .55rem;
    align-items: center;
    padding: .5rem .55rem;
    border-radius: 14px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .04), 0 14px 30px -20px rgba(0, 0, 0, .3);
    text-decoration: none !important;
    transition: transform .2s var(--ease-out), box-shadow .2s var(--ease-out);
}

.store-hl:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .06), 0 18px 36px -20px rgba(0, 0, 0, .35);
}

.store-hl__media {
    flex: 0 0 auto;
    width: 3rem;
    height: 3rem;
    border-radius: 10px;
    overflow: hidden;
    background: linear-gradient(180deg, #fbfbfd, #f1f1f4);
    display: flex;
    align-items: center;
    justify-content: center;
}

.store-hl__media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.store-hl__placeholder {
    font-size: 1.1rem;
    font-weight: 800;
    color: hsl(var(--store-hue, 200), 55%, 45%);
}

.store-hl__body {
    min-width: 0;
    display: grid;
    gap: .2rem;
}

.store-hl__name {
    font-size: .74rem;
    font-weight: 600;
    line-height: 1.35;
    color: #1d1d1f;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.store-hl__price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .2rem .35rem;
}

.store-hl__price-old {
    color: #6e6e73;
    font-size: .68rem;
    font-weight: 500;
    text-decoration: line-through;
}

.store-hl__price-old .store-price__unit {
    font-size: .62em;
}

.store-hl__price-current {
    font-size: .76rem;
    font-weight: 700;
    color: #0071e3;
}

.store-hl__price-current .store-price__unit {
    color: #6e6e73;
    font-size: .62em;
}

.store-hl__cta {
    font-size: .72rem;
    font-weight: 600;
    color: #0071e3;
}

@media (max-width: 520px) {
    .store-hl__name {
        -webkit-line-clamp: 1;
    }
}

/* Product-page picks reuse the hero mini-grid cards */
.store-detail__picks {
    margin-top: var(--space-md);
    padding-top: var(--space-md);
    border-top: 1px solid var(--border);
}

.store-detail__picks-label {
    margin: 0 0 .6rem;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--text-tertiary);
}

/* —— Category strip —— */
.store-strip {
    display: grid;
    gap: var(--space-sm);
}

.store-strip__label {
    margin: 0;
    font-size: .82rem;
    font-weight: 700;
    color: var(--text-tertiary);
    letter-spacing: .02em;
}

/* —— Spotlight —— */
.store-spotlight {
    margin: 0;
}

.store-spotlight__link {
    position: relative;
    display: block;
    color: inherit !important;
    text-decoration: none !important;
    border-radius: var(--radius-xl);
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-soft);
    transition: transform .25s var(--ease-out), box-shadow .25s var(--ease-out), border-color .25s var(--ease-out);
}

.store-spotlight__link:hover {
    transform: translateY(-2px);
    border-color: rgba(10, 132, 255, .28);
    box-shadow: var(--shadow-card-hover);
}

.store-spotlight__link:focus-visible {
    outline: 3px solid var(--primary-ring);
    outline-offset: 3px;
}

.store-spotlight__glow {
    position: absolute;
    inset: 0;
    background: var(--neon-gradient-soft, linear-gradient(135deg, rgba(10, 132, 255, .08), rgba(0, 229, 255, .06)));
    opacity: .85;
    pointer-events: none;
}

.store-spotlight__body {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: var(--space-lg);
    padding: var(--space-lg);
    align-items: center;
}

@media (max-width: 820px) {
    .store-spotlight__body {
        grid-template-columns: 1fr;
    }
}

.store-spotlight__media-col {
    display: flex;
    justify-content: center;
    align-items: center;
}

.store-spotlight__cover {
    width: 100%;
    max-width: 18rem;
    max-height: 18rem;
    object-fit: contain;
    border-radius: var(--radius-lg);
    display: block;
}

.store-spotlight__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 14rem);
    aspect-ratio: 1;
    border-radius: var(--radius-lg);
    font-size: 2.5rem;
    font-weight: 800;
    color: hsl(var(--store-hue, 200), 55%, 42%);
    background: var(--media-placeholder);
}

.store-spotlight__label {
    display: inline-flex;
    margin-bottom: var(--space-sm);
    padding: .2rem .65rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    color: #fff;
    background: var(--neon-gradient-btn, linear-gradient(135deg, var(--primary), #00b4d8));
    box-shadow: var(--primary-shadow);
}

.store-spotlight__title {
    margin: 0 0 var(--space-sm);
    font-size: clamp(1.25rem, 2.5vw, 1.65rem);
    font-weight: 800;
    line-height: 1.35;
}

.store-spotlight__tagline {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.7;
    max-width: 48ch;
}

.store-spotlight__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    margin-top: var(--space-lg);
    padding-top: var(--space-md);
    border-top: 1px solid var(--border);
}

.store-spotlight__meta-stats {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .75rem;
    align-items: center;
}

.store-spotlight__price {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text-primary);
}

.store-spotlight__category {
    font-size: .82rem;
    color: var(--text-tertiary);
    padding: .2rem .55rem;
    border-radius: 999px;
    background: var(--surface-secondary);
}

.store-spotlight__price-old {
    font-size: .82rem;
    color: var(--text-tertiary);
    text-decoration: line-through;
}

.store-spotlight__status {
    font-size: .72rem;
    font-weight: 700;
    padding: .18rem .5rem;
    border-radius: 999px;
}

.store-spotlight__status--oos {
    color: var(--danger, #ff3b30);
    background: rgba(255, 59, 48, .12);
}

.store-spotlight__status--preorder {
    color: #b45309;
    background: rgba(245, 158, 11, .14);
}

.store-spotlight__status--low {
    color: var(--primary);
    background: var(--accent-soft);
}

.store-spotlight__action {
    font-size: .88rem;
    font-weight: 700;
    color: var(--primary);
}

/* —— Sections —— */
.store-section {
    display: grid;
    gap: var(--space-lg);
    position: relative;
}

.store-section--related {
    padding: var(--space-lg);
    border-radius: var(--radius-xl);
    background: var(--surface);
    border: 1px solid rgba(0, 229, 255, .1);
    box-shadow: var(--shadow-soft), 0 0 20px rgba(0, 229, 255, .04);
}

.store-section__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-sm) var(--space-md);
}

.store-section__title-wrap {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.store-section__accent {
    width: 4px;
    height: 1.35rem;
    border-radius: 999px;
    background: var(--primary);
    flex-shrink: 0;
}

.store-section__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-primary);
}

.store-section__subtitle {
    margin: 0;
    font-size: .78rem;
    color: var(--text-tertiary);
}

/* —— Product grid & cards —— */
.store-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
}

.store-grid--catalog {
    gap: 12px 14px;
}

@media (min-width: 1100px) {
    .store-grid--catalog {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    }
}

.store-card {
    position: relative;
    display: flex;
    flex-direction: column;
    margin: 0;
    height: 100%;
    border-radius: var(--radius-lg);
    background: var(--surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-soft);
    overflow: hidden;
    transition: transform .22s var(--ease-out), box-shadow .22s var(--ease-out), border-color .22s var(--ease-out);
}

.store-card:hover {
    transform: translateY(-3px);
    border-color: rgba(0, 229, 255, .28);
    box-shadow: var(--shadow-card-hover), 0 0 22px rgba(0, 229, 255, .1);
}

.store-card--featured {
    border-color: rgba(10, 132, 255, .24);
}

.store-card--unavailable {
    opacity: .88;
}

.store-card--unavailable .store-card__img {
    filter: grayscale(.35);
}

.store-card__link {
    display: flex;
    flex-direction: column;
    flex: 1;
    color: inherit !important;
    text-decoration: none !important;
    position: relative;
}

.store-card__media-link {
    display: block;
    color: inherit !important;
    text-decoration: none !important;
}

.store-card__media-link:focus-visible,
.store-card__title-link:focus-visible {
    outline: 3px solid var(--primary-ring);
    outline-offset: -3px;
}

.store-card__title-link {
    display: block;
    color: inherit !important;
    text-decoration: none !important;
}

.store-card__title-link:hover,
.store-card__title-link:focus,
.store-card__title-link:visited {
    color: inherit !important;
    text-decoration: none !important;
}

.store-card__ribbon,
.store-card__badges {
    position: absolute;
    top: var(--space-sm);
    inset-inline-start: var(--space-sm);
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    max-width: calc(100% - 1rem);
}

.store-card__ribbon,
.store-card__badge {
    font-size: .68rem;
    font-weight: 700;
    color: #fff;
    padding: .18rem .5rem;
    border-radius: 999px;
    box-shadow: var(--primary-shadow);
}

.store-card__badge--sale {
    background: #ff3b30;
}

.store-card__badge--featured,
.store-card__ribbon {
    background: var(--primary);
}

.store-card__badge--oos {
    color: #fff;
    background: rgba(60, 60, 67, .88);
    box-shadow: none;
}

.store-card__badge--preorder {
    color: #fff;
    background: #f59e0b;
    box-shadow: none;
}

.store-card__badge--low {
    color: var(--primary);
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}

.store-card__media {
    position: relative;
    aspect-ratio: 1;
    background: #fff;
    overflow: hidden;
}

.store-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s var(--ease-out);
}

.store-card:hover .store-card__img {
    transform: scale(1.04);
}

.store-card__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 2rem;
    font-weight: 800;
    color: hsl(var(--store-hue, 200), 55%, 42%);
    background: var(--media-placeholder);
}

.store-card__body {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding: var(--space-md);
    flex: 1;
}

.store-card__category {
    margin: 0;
    font-size: .75rem;
    font-weight: 600;
    color: var(--text-tertiary);
}

.store-card__brand {
    margin: 0;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .02em;
    color: var(--primary);
}

.store-card__brand-link {
    color: inherit !important;
    text-decoration: none !important;
}

.store-card__brand-link:hover {
    text-decoration: underline !important;
}

.store-card__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.45;
    color: var(--text-primary);
}

.store-card__tagline {
    margin: 0;
    font-size: .84rem;
    line-height: 1.6;
    color: var(--text-secondary);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.store-card__specs {
    list-style: none;
    margin: .15rem 0 0;
    padding: 0;
    display: grid;
    gap: .2rem;
}

.store-card__specs li {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .76rem;
    color: var(--text-tertiary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.store-card__color-dot {
    position: absolute;
    inset-inline-end: .55rem;
    inset-block-end: .55rem;
    display: inline-flex;
    padding: .22rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 4px 14px rgba(0, 0, 0, .12);
    backdrop-filter: blur(8px);
}

.store-card__specs span {
    color: var(--text-secondary);
    font-weight: 600;
}

.store-card__price {
    margin-top: auto;
    padding-top: var(--space-sm);
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .55rem;
    align-items: baseline;
}

.store-card__price-old {
    color: var(--text-tertiary);
    text-decoration: line-through;
    font-size: .78rem;
}

.store-card__price-current {
    color: var(--text-primary);
    font-weight: 800;
}

.store-card__savings {
    display: none;
    width: 100%;
    font-size: .72rem;
    font-weight: 600;
    color: #34c759;
}

.store-card__actions {
    padding: 0 var(--space-md) var(--space-md);
    margin-top: auto;
}

.store-card__cta {
    display: block;
    text-align: center;
    padding: .6rem .75rem;
    border-radius: var(--radius);
    background: var(--surface-secondary);
    border: 1px solid var(--border);
    color: var(--text-primary) !important;
    font-weight: 700;
    font-size: .88rem;
    text-decoration: none !important;
    transition: background .2s var(--ease-out), border-color .2s var(--ease-out), color .2s var(--ease-out);
}

.store-card__cta:hover {
    background: var(--accent-soft);
    border-color: rgba(10, 132, 255, .28);
    color: var(--primary) !important;
}

.store-card__cta--cart {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    background: var(--primary) !important;
    color: #fff !important;
    border-color: var(--primary) !important;
    cursor: pointer;
    font-weight: 700;
    transition: transform .15s, opacity .15s;
}
.store-card__cta--cart:hover {
    transform: scale(1.02);
    opacity: .9;
}
.store-card__cta--cart.is-added {
    background: #059669 !important;
    border-color: #059669 !important;
}

.store-card__cta--disabled {
    display: block;
    text-align: center;
    padding: .6rem .75rem;
    border-radius: var(--radius);
    background: var(--surface-secondary);
    border: 1px dashed var(--border);
    color: var(--text-tertiary) !important;
    font-weight: 700;
    font-size: .88rem;
    cursor: default;
}

/* —— Catalog toolbar —— */
.store-catalog-toolbar {
    display: grid;
    gap: var(--space-sm);
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-lg);
    background: var(--surface);
    border: 1px solid var(--border);
}

.store-catalog-toolbar__row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-md);
}

.store-catalog-toolbar__meta {
    display: grid;
    gap: var(--space-sm);
    min-width: min(100%, 16rem);
}

.store-catalog-toolbar__count {
    margin: 0;
    font-size: .92rem;
    color: var(--text-secondary);
}

.store-catalog-toolbar__count strong {
    color: var(--text-primary);
    font-weight: 800;
}

.store-catalog-toolbar__page {
    color: var(--text-tertiary);
    font-size: .84rem;
}

.store-catalog-toolbar__filters {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.store-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .28rem .55rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    color: var(--primary);
    background: var(--accent-soft);
    text-decoration: none !important;
}

.store-filter-chip:hover {
    background: rgba(10, 132, 255, .16);
}

.store-filter-chip--clear {
    color: var(--text-secondary);
    background: var(--surface-secondary);
}

.store-catalog-toolbar__controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-sm);
    margin-inline-start: auto;
}

.store-catalog-toolbar__controls--solo {
    width: 100%;
    justify-content: space-between;
}

.store-quick-filters {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.store-quick-filter {
    display: inline-flex;
    padding: .35rem .65rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    color: var(--text-secondary);
    background: var(--surface-secondary);
    border: 1px solid var(--border);
    text-decoration: none !important;
}

.store-quick-filter.is-active,
.store-quick-filter:hover {
    color: var(--primary);
    border-color: rgba(10, 132, 255, .28);
    background: var(--accent-soft);
}

.store-sort {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.store-sort__label {
    font-size: .78rem;
    font-weight: 600;
    color: var(--text-tertiary);
}

.store-sort__select {
    min-width: 8.5rem;
    padding: .4rem .65rem;
    border-radius: var(--radius);
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text-primary);
    font: inherit;
    font-size: .82rem;
}

.store-view-toggle {
    display: inline-flex;
    padding: .2rem;
    border-radius: var(--radius);
    background: var(--surface-secondary);
    border: 1px solid var(--border);
}

.store-view-toggle__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.1rem;
    height: 2.1rem;
    border-radius: calc(var(--radius) - 2px);
    color: var(--text-tertiary);
    text-decoration: none !important;
}

.store-view-toggle__btn.is-active {
    color: var(--primary);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

/* —— List view —— */
.store-list {
    display: grid;
    gap: var(--space-sm);
}

.store-list-item {
    display: grid;
    grid-template-columns: 5.5rem minmax(0, 1fr);
    gap: var(--space-md);
    padding: var(--space-md);
    border-radius: var(--radius-lg);
    background: var(--surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-soft);
}

@media (min-width: 768px) {
    .store-list-item {
        grid-template-columns: 6.5rem minmax(0, 1fr) 11rem;
        align-items: center;
    }
}

.store-list-item--unavailable {
    opacity: .88;
}

.store-list-item__media {
    display: block;
    aspect-ratio: 1;
    border-radius: var(--radius);
    overflow: hidden;
    background: #fff;
}

.store-list-item__img,
.store-list-item__placeholder {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.store-list-item__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    font-weight: 800;
    color: hsl(var(--store-hue, 200), 55%, 42%);
    background: var(--media-placeholder);
}

.store-list-item__body {
    display: grid;
    gap: .35rem;
    min-width: 0;
}

.store-list-item__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: .35rem .75rem;
}

.store-list-item__category {
    margin: 0;
    font-size: .74rem;
    font-weight: 600;
    color: var(--text-tertiary);
}

.store-list-item__title {
    margin: .15rem 0 0;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
}

.store-list-item__title a {
    color: inherit !important;
    text-decoration: none !important;
}

.store-list-item__title a:hover,
.store-list-item__title a:focus,
.store-list-item__title a:visited {
    color: inherit !important;
    text-decoration: none !important;
}

.store-list-item__badges {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
}

.store-list-item__tagline {
    margin: 0;
    font-size: .84rem;
    line-height: 1.65;
    color: var(--text-secondary);
}

.store-list-item__specs {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .75rem;
    margin: .15rem 0 0;
}

.store-list-item__specs div {
    display: flex;
    gap: .25rem;
    font-size: .76rem;
}

.store-list-item__specs dt {
    color: var(--text-tertiary);
    font-weight: 600;
}

.store-list-item__specs dd {
    margin: 0;
    color: var(--text-secondary);
}

.store-list-item__spec-value--color {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}

.store-list-item__aside {
    display: grid;
    gap: .45rem;
    align-content: center;
    grid-column: 1 / -1;
}

@media (min-width: 768px) {
    .store-list-item__aside {
        grid-column: auto;
        justify-items: end;
        text-align: end;
    }
}

.store-list-item__price {
    display: grid;
    gap: .15rem;
}

.store-list-item__cta {
    display: inline-flex;
    justify-content: center;
    padding: .55rem .75rem;
    border-radius: var(--radius);
    background: var(--accent-soft);
    border: 1px solid rgba(10, 132, 255, .18);
    color: var(--primary) !important;
    font-weight: 700;
    font-size: .84rem;
    text-decoration: none !important;
}

.store-list-item__status {
    font-size: .82rem;
    font-weight: 700;
    color: var(--text-tertiary);
}

.store-empty-suggestions {
    margin-top: var(--space-lg);
    padding-top: var(--space-md);
    border-top: 1px solid var(--border);
}

.store-empty-suggestions__label {
    margin: 0 0 var(--space-sm);
    font-size: .84rem;
    color: var(--text-tertiary);
}

/* —— Product detail —— */
.store-detail-page {
    display: grid;
    gap: var(--space-xl);
}

.store-detail-page > .breadcrumbs {
    margin: 0;
}

.store-cms-section.site-page-section {
    gap: var(--space-md);
    margin-bottom: 0;
}

body.is-store .store-cms-section .site-page-col {
    gap: .65rem;
}

.store-detail__modules {
    display: grid;
    gap: var(--space-lg);
    padding: var(--space-lg);
    border-radius: var(--radius-xl);
    background: var(--surface);
    border: 1px solid rgba(0, 229, 255, .12);
    box-shadow: var(--shadow-soft), 0 0 28px rgba(0, 229, 255, .05);
}

.store-detail {
    display: grid;
    gap: var(--space-lg);
}

.store-detail--joyful .store-detail__hero {
    position: relative;
    overflow: hidden;
    padding: var(--space-lg);
    border-radius: var(--radius-xl);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .98) 0%, rgba(240, 248, 255, .96) 48%, rgba(255, 250, 240, .94) 100%);
    border: 1px solid rgba(10, 132, 255, .14);
    box-shadow:
        var(--shadow-soft),
        0 0 40px rgba(10, 132, 255, .08),
        0 0 80px rgba(255, 159, 10, .05);
}

.store-detail__hero-glow {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 12% 18%, rgba(10, 132, 255, .12), transparent 34%),
        radial-gradient(circle at 88% 12%, rgba(255, 159, 10, .12), transparent 30%),
        radial-gradient(circle at 70% 88%, rgba(48, 209, 88, .08), transparent 28%);
}

.store-detail__hero-grid,
.store-detail__summary,
.store-detail__gallery {
    position: relative;
    z-index: 1;
}

.store-detail__media-frame {
    position: relative;
}

.store-detail__media-badge {
    position: absolute;
    top: var(--space-sm);
    inset-inline-start: var(--space-sm);
    padding: .28rem .6rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, #ff3b30, #ff6b6b);
    box-shadow: 0 8px 20px rgba(255, 59, 48, .28);
}

.store-detail__brand {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .28rem .65rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    color: #7c3aed;
    background: linear-gradient(135deg, rgba(124, 58, 237, .12), rgba(10, 132, 255, .1));
    border: 1px solid rgba(124, 58, 237, .16);
    text-decoration: none !important;
    transition: transform .2s var(--ease-out), box-shadow .2s var(--ease-out), border-color .2s var(--ease-out);
}

a.store-detail__brand:hover {
    transform: translateY(-1px);
    border-color: rgba(124, 58, 237, .28);
    box-shadow: 0 6px 18px rgba(124, 58, 237, .12);
}

.store-detail__brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 900;
    color: #fff;
    background: linear-gradient(135deg, #7c3aed, #0a84ff);
}

.store-detail__highlights {
    list-style: none;
    margin: var(--space-md) 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: var(--space-sm);
}

.store-detail__highlights li {
    display: grid;
    gap: .2rem;
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(10, 132, 255, .1);
    box-shadow: 0 4px 14px rgba(10, 132, 255, .05);
}

.store-detail__highlight-label {
    font-size: .72rem;
    font-weight: 600;
    color: var(--text-tertiary);
}

.store-detail__highlights strong {
    font-size: .88rem;
    font-weight: 700;
    color: var(--text-primary);
}

.store-detail__purchase--card {
    padding: var(--space-md);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .78);
    border: 1px solid rgba(10, 132, 255, .14);
    box-shadow: 0 10px 30px rgba(10, 132, 255, .08);
}

.store-detail__chip--available {
    color: #15803d;
    background: rgba(48, 209, 88, .14);
}

.store-detail__chip--preorder {
    color: #b45309;
    background: rgba(245, 158, 11, .14);
}

.store-detail__hero-grid {
    display: grid;
    gap: var(--space-xl);
    align-items: start;
}

@media (min-width: 900px) {
    .store-detail__hero-grid {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    }
}

.store-detail__gallery {
    display: grid;
    gap: .8rem;
}

.store-detail__gallery--single .store-detail__media-frame {
    min-height: min(31rem, 60vh);
    padding: var(--space-xl);
}

.store-detail__gallery--single .store-detail__cover {
    max-width: min(100%, 31rem);
    max-height: min(60vh, 31rem);
}

@media (min-width: 900px) {
    .store-detail__gallery--single .store-detail__media-frame {
        min-height: 27rem;
    }

    .store-detail__gallery--single .store-detail__cover {
        max-width: min(100%, 33rem);
        max-height: 25rem;
    }
}

.store-detail__summary {
    display: grid;
    gap: var(--space-lg);
    align-content: start;
}

.store-detail__purchase {
    display: grid;
    gap: var(--space-md);
    padding-top: var(--space-md);
    border-top: 1px solid var(--border);
}

.store-detail__meta-list {
    display: grid;
    gap: var(--space-sm);
    margin: 0;
    padding: var(--space-md) 0 0;
    border-top: 1px solid var(--border);
}

.store-detail__meta-row {
    display: flex;
    gap: var(--space-sm);
    align-items: stretch;
}

.store-detail__meta-item {
    display: grid;
    gap: .15rem;
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius);
    background: var(--surface-secondary);
    border: 1px solid var(--border);
}

.store-detail__meta-item--compact {
    flex: 0 0 auto;
    min-width: 7rem;
}

.store-detail__meta-item--delivery {
    flex: 1 1 auto;
    min-width: 0;
}

.store-detail__meta-item dt {
    margin: 0;
    font-size: .72rem;
    font-weight: 700;
    color: var(--text-tertiary);
}

.store-detail__meta-item dd {
    margin: 0;
    font-size: .88rem;
    font-weight: 700;
    color: var(--text-primary);
}

.store-detail__delivery-options {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.store-detail__delivery-chip {
    display: inline-flex;
    align-items: center;
    padding: .2rem .55rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    color: var(--text-secondary);
    background: var(--surface-secondary);
    border: 1px solid var(--border);
}

a.store-detail__delivery-chip {
    text-decoration: none !important;
}

.store-detail__delivery-chip--map {
    color: #fff;
    background: var(--store-product-accent-color, var(--primary));
    border-color: transparent;
    font-weight: 700;
}

.store-detail__delivery-chip--map:hover {
    filter: brightness(1.05);
}

.store-detail__media-frame {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    isolation: isolate;
    min-height: 19.25rem;
    padding: clamp(1rem, 2.5vw, 1.35rem);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-soft);
}

.store-detail__media-frame::before {
    display: none;
}

.store-detail__media-frame::after {
    display: none;
}

.store-detail__media-glow {
    display: none;
}

.store-detail__cover {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 22rem;
    max-height: 22rem;
    object-fit: contain;
    display: block;
    filter: drop-shadow(0 10px 20px rgba(15, 23, 42, .14));
    transition: transform .22s var(--ease-out), filter .22s var(--ease-out), opacity .12s var(--ease-out);
}

.store-detail__cover.is-swapping {
    opacity: .4;
}

.store-detail__media-frame:hover .store-detail__cover:not(.is-swapping) {
    transform: translateY(-2px) scale(1.01);
    filter: drop-shadow(0 16px 30px rgba(15, 23, 42, .18));
}

.store-detail__placeholder {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 14rem);
    aspect-ratio: 1;
    border-radius: var(--radius-lg);
    font-size: 2.75rem;
    font-weight: 800;
    color: hsl(var(--store-hue, 200), 55%, 42%);
    background: var(--media-placeholder);
}

.store-detail__gallery-rail {
    display: flex;
    gap: var(--space-sm);
    overflow-x: auto;
    padding: .4rem .35rem .5rem;
    border-radius: var(--radius);
    background: rgba(255, 255, 255, .55);
    border: 1px solid rgba(10, 132, 255, .08);
    scroll-snap-type: x mandatory;
    mask-image: linear-gradient(to left, transparent 0, #000 12px, #000 calc(100% - 12px), transparent 100%);
}

.store-detail__thumb {
    flex: 0 0 82px;
    width: 82px;
    height: 82px;
    padding: 0;
    border: 1px solid rgba(148, 163, 184, .28);
    border-radius: var(--radius);
    background: #fff;
    overflow: hidden;
    cursor: pointer;
    scroll-snap-align: start;
    transition: border-color .2s var(--ease-out), box-shadow .2s var(--ease-out), transform .2s var(--ease-out);
}

.store-detail__thumb:hover {
    transform: translateY(-2px);
}

.store-detail__thumb.is-active {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring), 0 10px 18px rgba(10, 132, 255, .2);
}

.store-detail__thumb:focus-visible {
    outline: 0;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring), 0 6px 14px rgba(10, 132, 255, .16);
}

.store-detail__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #fff;
    display: block;
}

.store-detail__content-col {
    display: grid;
    gap: var(--space-lg);
    align-content: start;
}

.store-detail__intro {
    display: grid;
    gap: var(--space-sm);
}

.store-detail__meta,
.store-detail__eyebrow {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem .5rem;
}

.store-detail__label {
    display: inline-flex;
    padding: .25rem .65rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    color: var(--primary);
    background: var(--accent-soft);
    text-decoration: none !important;
}

.store-detail__label:hover {
    background: rgba(10, 132, 255, .16);
}

.store-detail__tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.store-detail__tags {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: var(--space-sm);
}

.store-detail__tag {
    display: inline-flex;
    align-items: center;
    padding: .28rem .62rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--text-secondary);
    background: rgba(120, 120, 128, .1);
    border: 1px solid rgba(120, 120, 128, .12);
    text-decoration: none !important;
    transition: color .2s var(--ease-out), background .2s var(--ease-out), border-color .2s var(--ease-out);
}

.store-detail__tag--primary {
    color: var(--primary);
    background: var(--accent-soft);
    border-color: rgba(10, 132, 255, .18);
    font-weight: 700;
}

.store-detail__tag:hover {
    color: var(--primary);
    background: var(--accent-soft);
    border-color: rgba(10, 132, 255, .22);
}

.store-detail__chip {
    display: inline-flex;
    padding: .22rem .55rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    color: var(--success);
    background: rgba(48, 209, 88, .12);
}

.store-detail__chip--featured {
    color: var(--primary);
    background: var(--accent-soft);
}

.store-detail__chip--muted {
    color: var(--text-tertiary);
    background: var(--surface-secondary);
}

.store-detail__chip--color {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, .85);
    border: 1px solid var(--border);
}

.store-detail__title {
    margin: 0;
    font-size: clamp(1.28rem, 2.4vw, 1.72rem);
    font-weight: 800;
    line-height: 1.32;
    letter-spacing: -.01em;
}

.store-detail__updated {
    position: relative;
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem .45rem;
    margin: .4rem 0 0;
    padding: .42rem .78rem;
    border-radius: 999px;
    font-size: .82rem;
    line-height: 1.4;
    border: 1px solid rgba(10, 132, 255, .22);
    background: linear-gradient(135deg, rgba(10, 132, 255, .08), rgba(0, 229, 255, .06));
    box-shadow:
        0 0 12px rgba(10, 132, 255, .16),
        0 0 28px rgba(0, 229, 255, .1);
    overflow: hidden;
}

.store-detail__updated-glow {
    position: absolute;
    inset: -30%;
    background: radial-gradient(circle, rgba(0, 229, 255, .28), transparent 62%);
    animation: store-detail-updated-glow 3.2s ease-in-out infinite;
    pointer-events: none;
}

@keyframes store-detail-updated-glow {
    0%, 100% {
        opacity: .45;
        transform: scale(1);
    }

    50% {
        opacity: .9;
        transform: scale(1.06);
    }
}

.store-detail__updated-label,
.store-detail__updated-date {
    position: relative;
    z-index: 1;
}

.store-detail__updated-label {
    color: var(--text-secondary);
    font-weight: 600;
}

.store-detail__updated-date {
    font-weight: 800;
    color: var(--primary, #0a84ff);
    text-shadow: 0 0 10px rgba(10, 132, 255, .24);
}

.store-detail__tagline {
    margin: 0;
    font-size: 1.05rem;
    line-height: 1.75;
    color: var(--text-secondary);
    max-width: 48ch;
}

.store-detail__tagline--muted {
    color: var(--text-tertiary);
}

.store-detail__price-box {
    display: grid;
    gap: .35rem;
}

.store-detail__price-label {
    font-size: .78rem;
    font-weight: 700;
    color: var(--text-tertiary);
}

.store-detail__price-row {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .65rem;
    align-items: baseline;
}

.store-detail__price-old {
    color: var(--text-tertiary);
    text-decoration: line-through;
    font-size: .92rem;
}

.store-detail__price-current {
    font-size: clamp(1.35rem, 2.8vw, 1.65rem);
    font-weight: 800;
    color: var(--text-primary);
}

.store-detail__discount {
    display: inline-flex;
    padding: .18rem .5rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    color: #fff;
    background: #ff3b30;
}

.store-detail__savings {
    display: none;
    margin: .35rem 0 0;
    font-size: .82rem;
    font-weight: 600;
    color: #34c759;
}

.store-detail__buy-note {
    margin: 0;
    font-size: .9rem;
    line-height: 1.7;
    color: var(--text-secondary);
}

/* —— Inquiry (inline in purchase block) —— */
.store-inquiry {
    display: grid;
    gap: .7rem;
}

.store-inquiry__text {
    margin: 0;
    font-size: .875rem;
    line-height: 1.7;
    color: var(--text-secondary);
}

.store-inquiry__fallback,
.store-inquiry__note {
    margin: 0;
    font-size: .8rem;
    color: var(--text-tertiary);
}

.store-inquiry__note {
    text-align: center;
    letter-spacing: .04em;
    font-weight: 600;
    opacity: .85;
}

.btn-store--whatsapp {
    background: linear-gradient(135deg, #25d366 0%, #128c7e 100%);
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, .22);
    box-shadow: 0 6px 18px -6px rgba(18, 140, 126, .45), 0 0 12px rgba(37, 211, 102, .18);
}

.btn-store--whatsapp:hover {
    filter: brightness(1.04);
    box-shadow: 0 8px 22px -6px rgba(18, 140, 126, .5), 0 0 16px rgba(37, 211, 102, .22);
}

.store-inquiry__actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
    gap: var(--space-sm);
}

.store-inquiry__actions .btn-store {
    width: 100%;
}

.btn-store--call {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, .22);
    box-shadow: 0 6px 18px -6px rgba(29, 78, 216, .45), 0 0 12px rgba(37, 99, 235, .18);
}

.btn-store--call:hover {
    filter: brightness(1.06);
    box-shadow: 0 8px 22px -6px rgba(29, 78, 216, .5), 0 0 16px rgba(37, 99, 235, .22);
}

/* Configurable action buttons: admin-chosen color wins over type defaults. */
.btn-store--action {
    background: var(--store-action-color, #0f172a);
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, .22);
    box-shadow: 0 6px 18px -6px rgba(15, 23, 42, .4);
}

.btn-store--action:hover {
    filter: brightness(1.06);
}

@media (max-width: 420px) {
    .store-inquiry__actions {
        grid-template-columns: 1fr;
    }
}

.store-detail__facts {
    margin: 0;
    padding: 0;
}

.store-detail__facts--grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: var(--space-sm);
}

.store-detail__facts--glossy {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: var(--space-md);
}

.store-detail__facts--laptop,
.store-detail__facts--cards-count-5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.store-detail__facts--cards-count-1 {
    grid-template-columns: minmax(0, 1fr);
    max-width: 22rem;
}

.store-detail__facts--cards-count-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.store-detail__facts--cards-count-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.store-detail__facts--cards-count-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 720px) {
    .store-detail__facts--laptop,
    .store-detail__facts--cards-count-3,
    .store-detail__facts--cards-count-4,
    .store-detail__facts--cards-count-5 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 980px) {
    .store-detail__facts--laptop,
    .store-detail__facts--cards-count-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .store-detail__facts--cards-count-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .store-detail__facts--cards-count-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.store-detail__facts--glossy .store-detail__fact {
    position: relative;
    overflow: hidden;
    min-height: 6.25rem;
    padding: 1.1rem 1.25rem 1.15rem;
    border-radius: calc(var(--radius-lg) + 2px);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .94) 0%, rgba(245, 249, 255, .88) 100%);
    border: 1px solid rgba(10, 132, 255, .1);
    box-shadow:
        0 8px 24px rgba(10, 132, 255, .06),
        inset 0 1px 0 rgba(255, 255, 255, .85);
    transition: transform .22s var(--ease-out), box-shadow .22s var(--ease-out), border-color .22s var(--ease-out);
    display: grid;
    align-content: start;
    gap: .55rem;
}

.store-detail__facts--glossy .store-detail__fact::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, .55) 0%, transparent 52%);
    pointer-events: none;
}

.store-detail__facts--glossy .store-detail__fact::after {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    border-radius: 999px;
    background: var(--fact-accent, rgba(10, 132, 255, .55));
}

.store-detail__facts--glossy .store-detail__fact:hover,
.store-detail__facts--glossy .store-detail__fact--link:hover {
    transform: translateY(-2px);
    border-color: rgba(10, 132, 255, .18);
    box-shadow:
        0 14px 32px rgba(10, 132, 255, .1),
        inset 0 1px 0 rgba(255, 255, 255, .9);
}

.store-detail__facts--glossy .store-detail__fact:nth-child(3n + 1) {
    --fact-accent: rgba(10, 132, 255, .55);
    background: linear-gradient(145deg, rgba(255, 255, 255, .96) 0%, rgba(236, 245, 255, .9) 100%);
}

.store-detail__facts--glossy .store-detail__fact:nth-child(3n + 2) {
    --fact-accent: rgba(124, 58, 237, .5);
    background: linear-gradient(145deg, rgba(255, 255, 255, .96) 0%, rgba(245, 240, 255, .9) 100%);
}

.store-detail__facts--glossy .store-detail__fact:nth-child(3n + 3) {
    --fact-accent: rgba(48, 209, 88, .5);
    background: linear-gradient(145deg, rgba(255, 255, 255, .96) 0%, rgba(240, 253, 246, .9) 100%);
}

.store-detail__facts--glossy .store-detail__fact dt,
.store-detail__facts--glossy .store-detail__fact dd,
.store-detail__facts--glossy .store-detail__fact-label,
.store-detail__facts--glossy .store-detail__fact-value {
    position: relative;
    z-index: 1;
}

.store-detail__facts--glossy .store-detail__fact dt,
.store-detail__facts--glossy .store-detail__fact-label {
    margin: 0;
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .04em;
    color: var(--text-tertiary);
    line-height: 1.4;
}

.store-detail__facts--glossy .store-detail__fact dd,
.store-detail__facts--glossy .store-detail__fact-value {
    margin: 0;
    font-size: clamp(.88rem, 1.35vw, .98rem);
    font-weight: 700;
    line-height: 1.65;
    color: var(--text-primary);
    letter-spacing: -.01em;
    word-break: break-word;
}

.store-detail__fact-value--color {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
}

.store-color-swatch {
    --swatch-color: #bdb6ac;
    display: inline-block;
    width: .95rem;
    height: .95rem;
    border-radius: 999px;
    background:
        radial-gradient(circle at 30% 28%, rgba(255, 255, 255, .55), transparent 52%),
        linear-gradient(145deg, color-mix(in srgb, var(--swatch-color) 88%, #fff 12%), var(--swatch-color));
    border: 1px solid color-mix(in srgb, var(--swatch-color) 70%, #000 30%);
    box-shadow:
        inset 0 1px 2px rgba(255, 255, 255, .35),
        0 0 0 2px rgba(255, 255, 255, .08),
        0 4px 12px color-mix(in srgb, var(--swatch-color) 45%, transparent);
    flex-shrink: 0;
}

.store-color-swatch--lg {
    width: 1.15rem;
    height: 1.15rem;
    box-shadow:
        inset 0 1px 3px rgba(255, 255, 255, .4),
        0 0 0 3px rgba(255, 255, 255, .1),
        0 6px 16px color-mix(in srgb, var(--swatch-color) 50%, transparent);
}

.store-card__title,
.store-card__title-link,
.store-list-item__title a {
    display: block;
}

.store-detail__facts--inline {
    display: grid;
    gap: .55rem;
    padding-top: var(--space-sm);
    border-top: 1px solid var(--border);
}

.store-detail__facts--inline .store-detail__fact {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .75rem;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
}

.store-detail__fact {
    display: grid;
    gap: .25rem;
    padding: var(--space-md);
    border-radius: var(--radius-lg);
    background: var(--surface-secondary);
    border: 1px solid var(--border);
}

.store-detail__fact dt {
    margin: 0;
    font-size: .78rem;
    font-weight: 700;
    color: var(--text-tertiary);
}

.store-detail__fact dd {
    margin: 0;
    font-size: .95rem;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.5;
}

.store-detail__section--specs {
    padding-top: var(--space-lg);
    background:
        linear-gradient(180deg, rgba(248, 250, 255, .92) 0%, rgba(255, 255, 255, .98) 100%);
    border-color: rgba(10, 132, 255, .12);
    box-shadow:
        var(--shadow-soft),
        0 0 36px rgba(10, 132, 255, .06);
}

.store-detail__specs-count {
    font-size: .82rem;
    color: var(--text-tertiary);
    font-weight: 600;
}

.store-detail__specs-head {
    align-items: center;
    margin-bottom: .25rem;
}

.store-detail__specs-extra {
    margin-top: var(--space-md);
    border: 1px solid var(--border);
    border-radius: calc(var(--radius-lg) + 2px);
    background: var(--surface-secondary);
    overflow: hidden;
}

.store-detail__specs-extra-toggle {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .85rem 1rem;
    cursor: pointer;
    font-weight: 700;
    color: var(--text-secondary);
    list-style: none;
}

.store-detail__specs-extra-toggle::-webkit-details-marker {
    display: none;
}

.store-detail__specs-extra-toggle::before {
    content: "◂";
    display: inline-block;
    transition: transform .18s var(--ease-out);
    color: var(--text-tertiary);
}

.store-detail__specs-extra[open] .store-detail__specs-extra-toggle::before {
    transform: rotate(-90deg);
}

.store-detail__specs-extra-count {
    font-size: .82rem;
    font-weight: 600;
    color: var(--text-tertiary);
}

.store-detail__specs-extra-body {
    padding: 0 1rem 1rem;
    border-top: 1px solid var(--border);
}

.store-detail__specs-summary {
    margin: .85rem 0 0;
    line-height: 1.8;
    color: var(--text-secondary);
    font-size: .92rem;
}

.store-detail__facts--compact {
    display: grid;
    gap: .45rem;
    margin-top: .85rem;
}

.store-detail__fact--compact {
    display: grid;
    grid-template-columns: minmax(6rem, 34%) minmax(0, 1fr);
    gap: .65rem;
    padding: .55rem .7rem;
    border-radius: var(--radius);
    background: rgba(255, 255, 255, .55);
    border: 1px solid var(--border);
}

.store-detail__fact--compact dt {
    margin: 0;
    font-size: .78rem;
    font-weight: 600;
    color: var(--text-tertiary);
}

.store-detail__fact--compact dd {
    margin: 0;
    font-size: .84rem;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.55;
    word-break: break-word;
}

.store-section--related {
    padding-top: var(--space-lg);
}

.store-detail__section {
    display: grid;
    gap: var(--space-md);
    padding: var(--space-lg);
    border-radius: var(--radius-xl);
    background: var(--surface);
    border: 1px solid rgba(0, 229, 255, .1);
    box-shadow: var(--shadow-soft), 0 0 20px rgba(0, 229, 255, .04);
}

.store-detail__section--about .store-section__head {
    margin-bottom: 0;
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--border);
}

.store-detail__body-shell {
    display: flex;
    justify-content: center;
}

.store-detail__body {
    width: min(100%, 46rem);
}

.store-detail__body.prose {
    text-align: justify;
    text-align-last: start;
}

.store-detail__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-md) var(--space-lg);
    border-radius: var(--radius-lg);
    background: var(--surface-secondary);
    border: 1px solid var(--border);
    box-shadow: none;
}

.store-detail__back {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-weight: 700;
    color: var(--text-secondary) !important;
    text-decoration: none !important;
}

.store-detail__back:hover {
    color: var(--primary) !important;
}

.store-detail__back-icon {
    transition: transform .2s var(--ease-out);
}

.store-detail__back:hover .store-detail__back-icon {
    transform: translateX(4px);
}

.filter-pill__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    margin-inline-start: .35rem;
    padding: 0 .35rem;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 700;
    background: rgba(16, 24, 40, .08);
}

.filter-pill.is-active .filter-pill__count {
    background: rgba(255, 255, 255, .22);
}

/* —— Buttons —— */
.btn-store {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    padding: .65rem 1.1rem;
    border-radius: var(--radius);
    font-weight: 700;
    font-size: .92rem;
    text-decoration: none !important;
    border: 1px solid transparent;
    transition: transform .18s var(--ease-out), box-shadow .18s var(--ease-out), background .18s var(--ease-out);
}

.btn-store--primary {
    background: var(--primary);
    color: #fff !important;
    box-shadow: var(--primary-shadow);
}

.btn-store--primary:hover {
    background: var(--primary-hover);
    transform: translateY(-1px);
}

.btn-store--ghost {
    background: var(--surface);
    border-color: var(--border);
    color: var(--text-primary) !important;
}

.btn-store--ghost:hover {
    border-color: rgba(10, 132, 255, .28);
    color: var(--primary) !important;
}

.btn-store--lg {
    padding: .6rem 1.1rem;
    font-size: .95rem;
}

.btn-store--block {
    width: 100%;
}

.btn-store__icon {
    flex-shrink: 0;
}

@media (max-width: 640px) {
    .store-grid {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }

    .store-detail__masthead,
    .store-detail__section,
    .store-detail__footer {
        padding: var(--space-md);
    }
}

/* Experimental theme: Apple-style store/product redesign */
body.is-store,
body.is-store-product {
    --primary: #0071e3;
    --primary-hover: #0077ed;
    --success: #34c759;
    --bg: #f5f5f7;
    --surface: #ffffff;
    --surface-secondary: #ffffff;
    --text-primary: #1d1d1f;
    --text-secondary: #424245;
    --text-tertiary: #6e6e73;
    --border: rgba(0, 0, 0, .06);
    --divider: #d2d2d7;
    --accent-soft: rgba(0, 113, 227, .08);
    --primary-ring: rgba(0, 113, 227, .2);
    --radius: 16px;
    --radius-lg: 24px;
    --radius-xl: 28px;
    --shadow-soft: 0 2px 8px rgba(0, 0, 0, .04), 0 12px 32px rgba(0, 0, 0, .06);
    --shadow-card-hover: 0 8px 26px rgba(0, 0, 0, .08);
    --ease-out: cubic-bezier(0.28, 0.11, 0.32, 1);
    background: #f5f5f7 !important;
}

.store-detail-page {
    --store-product-font-family: 'Vazirmatn', 'IRANSansX', 'Yekan Bakh', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --store-product-title-size: clamp(2rem, 4.1vw, 2.5rem);
    --store-product-section-title-size: clamp(1.7rem, 3.2vw, 2rem);
    --store-product-body-size: 17px;
    --store-product-price-size: clamp(1.5rem, 3vw, 1.75rem);
    --store-product-body-line-height: 180;
    --store-product-letter-spacing: 0;
    --store-product-title-color: #1d1d1f;
    --store-product-body-color: #424245;
    --store-product-muted-color: #6e6e73;
    --store-product-accent-color: #0071e3;
    --store-product-panel-color: #fff;
    --primary: var(--store-product-accent-color, #0071e3);
}

body.is-store .site-header,
body.is-store-product .site-header {
    background: rgba(251, 251, 253, .8);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(0, 0, 0, .06);
    box-shadow: none;
}

body.is-store,
body.is-store-product {
    background-image: linear-gradient(180deg, #fbfbfd 0%, #f5f5f7 45%, #f5f5f7 100%) !important;
}

.store-page,
.store-detail-page {
    gap: clamp(10px, 1.4vw, 16px);
}

body.is-store-product .store-detail-page {
    gap: clamp(16px, 2.2vw, 28px);
}

.store-page__highlights,
.store-detail,
.store-detail__summary,
.store-detail__content-col {
    gap: clamp(24px, 3vw, 48px);
}

.store-banner,
.store-catalog,
.store-section--featured,
.store-section--related,
.store-detail--joyful .store-detail__hero,
.store-detail__section,
.store-detail__footer,
.store-detail__modules,
.store-category-panel,
.store-catalog-toolbar,
.store-list-item,
.store-card {
    background: var(--store-product-panel-color, #fff);
    border: 1px solid rgba(0, 0, 0, .04);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .04), 0 12px 32px rgba(0, 0, 0, .06);
}

.store-banner,
.store-catalog,
.store-section--featured,
.store-section--related,
.store-detail--joyful .store-detail__hero,
.store-detail__section,
.store-detail__modules {
    border-radius: 28px;
    padding: clamp(24px, 3vw, 48px);
}

body.is-store .store-banner,
body.is-store .store-catalog,
body.is-store .store-category-panel,
body.is-store .store-catalog-toolbar {
    padding: clamp(12px, 1.6vw, 18px);
}

body.is-store .store-catalog {
    gap: 10px;
}

body.is-store .store-banner__title {
    font-size: clamp(1.15rem, 2.2vw, 1.35rem);
    font-weight: 700;
    margin-bottom: .3rem;
}

body.is-store .store-banner__eyebrow {
    font-size: .72rem;
    margin-bottom: .2rem;
}

body.is-store .store-banner__desc {
    font-size: .88rem;
    line-height: 1.55;
    margin-bottom: .55rem;
}

body.is-store .store-banner__search {
    margin-bottom: 0;
}

body.is-store .store-category-panel {
    gap: var(--space-sm);
    padding: clamp(12px, 1.6vw, 16px) clamp(14px, 2vw, 20px);
}

body.is-store .store-category-panel__label {
    font-size: .92rem;
    font-weight: 800;
}

body.is-store .store-category-panel__grid {
    grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr));
    gap: .45rem;
}

body.is-store .store-category-card {
    min-height: 2.95rem;
    padding: .6rem .7rem;
    padding-inline-start: 1rem;
    border-radius: 15px;
}

body.is-store .store-category-card__name {
    font-size: .72rem;
}

body.is-store .store-section__title {
    font-size: clamp(.98rem, 1.8vw, 1.08rem);
    font-weight: 700;
}

body.is-store .store-section__subtitle {
    font-size: .74rem;
}

body.is-store .store-section__accent {
    height: .95rem;
}

body.is-store .store-catalog__head {
    padding-bottom: .4rem;
}

body.is-store .store-cms-section.site-page-section {
    gap: 10px !important;
}

.store-banner {
    color: var(--text-primary);
    background: linear-gradient(180deg, #fbfbfd 0%, #f5f5f7 100%);
}

.store-banner::after,
.store-banner__mesh,
.store-banner__orb {
    display: none;
}

.store-banner__title {
    font-size: clamp(1.15rem, 2.2vw, 1.35rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.02em;
}

.store-banner__desc {
    color: var(--text-secondary);
    font-size: 17px;
    line-height: 1.8;
    font-weight: 400;
    margin-bottom: var(--space-md);
}

.store-search__field {
    border-radius: 999px;
    border-color: rgba(0, 0, 0, .06);
    box-shadow: none;
}

.store-search__submit {
    background: #0071e3;
    border-radius: 999px;
}

.store-section__title {
    font-size: var(--store-product-section-title-size, clamp(1.7rem, 3.2vw, 2rem));
    font-weight: 700;
    line-height: 1.2;
    color: var(--store-product-title-color, #1d1d1f);
    letter-spacing: calc(var(--store-product-letter-spacing, 0) * .001em);
}

.store-section__subtitle,
.store-catalog__summary,
.store-catalog-toolbar__count,
.store-detail__tagline,
.store-detail__buy-note,
.store-detail__specs-summary,
.store-list-item__tagline {
    color: var(--store-product-body-color, #424245);
    font-size: var(--store-product-body-size, 17px);
    line-height: calc(var(--store-product-body-line-height, 180) / 100);
    font-weight: 400;
    font-family: var(--store-product-font-family);
}

.store-detail__specs-summary {
    margin: 0;
    padding: 16px 20px;
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 0, .06);
    background: color-mix(in srgb, var(--store-product-panel-color, #fff) 88%, #f5f5f7 12%);
    font-size: calc(var(--store-product-body-size, 17px) + 1px);
    line-height: calc((var(--store-product-body-line-height, 180) + 12) / 100);
    letter-spacing: calc(var(--store-product-letter-spacing, 0) * .0005em);
    color: var(--store-product-body-color, #2f2f31);
    text-wrap: pretty;
}

.store-detail__specs-summary::first-line {
    color: var(--store-product-title-color, #1d1d1f);
    font-weight: 600;
    font-size: 1.08em;
}

.store-detail__hero-glow,
.store-spotlight__glow {
    display: none;
}

@media (min-width: 1024px) {
    .store-detail__hero-grid {
        grid-template-columns: minmax(0, 1.22fr) minmax(0, 1fr);
        gap: clamp(32px, 4vw, 64px);
    }
}

.store-detail__media-frame {
    min-height: min(640px, 72vh);
    padding: clamp(24px, 5vw, 48px);
    border-radius: 28px;
    border: 0;
    background: #fff;
    box-shadow: 0 30px 60px rgba(0, 0, 0, .08);
}

.store-detail__media-frame::after {
    display: none;
}

.store-detail__cover {
    max-width: min(100%, 34rem);
    max-height: min(68vh, 34rem);
    filter: drop-shadow(0 30px 60px rgba(0, 0, 0, .08));
}

.store-detail__title {
    font-size: var(--store-product-title-size, clamp(1.45rem, 2.6vw, 1.9rem));
    font-weight: 600;
    line-height: 1.28;
    letter-spacing: calc(var(--store-product-letter-spacing, 0) * .001em);
    color: var(--store-product-title-color, #1d1d1f);
    font-family: var(--store-product-font-family);
    text-wrap: balance;
}

.store-detail__updated-label,
.store-detail__meta-item dt,
.store-detail__price-label,
.store-detail__specs-count,
.store-detail__specs-extra-count {
    color: var(--store-product-muted-color, #6e6e73);
}

.store-detail__meta-item dd,
.store-detail__delivery-chip,
.store-detail__fact dt {
    color: var(--store-product-body-color, #424245);
    font-family: var(--store-product-font-family);
}

.store-detail__delivery-chip.store-detail__delivery-chip--map {
    color: #fff !important;
    background: var(--store-product-accent-color, #0071e3);
    border-color: transparent;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .08);
}

.store-detail__delivery-chip.store-detail__delivery-chip--map:hover {
    color: #fff !important;
    background: color-mix(in srgb, var(--store-product-accent-color, #0071e3) 86%, #0077ed 14%);
}

.store-detail__price-current {
    font-size: var(--store-product-price-size, clamp(1.25rem, 2.4vw, 1.5rem));
    font-weight: 600;
    font-family: var(--store-product-font-family);
    color: var(--store-product-title-color, #1d1d1f);
}

.store-detail__updated {
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: none;
    background: rgba(255, 255, 255, .9);
}

.store-detail__updated-glow {
    display: none;
}

.store-detail__purchase--card,
.store-detail__meta-item,
.store-detail__specs-extra,
.store-detail__specs-extra-body {
    border-color: rgba(0, 0, 0, .06);
    background: var(--store-product-panel-color, #fff);
    box-shadow: none;
}

.store-detail__facts--glossy .store-detail__fact {
    min-height: 0;
    border: 1px solid rgba(0, 0, 0, .06);
    background: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .04);
    border-radius: 24px;
    padding: 24px;
}

.store-detail__facts--glossy .store-detail__fact::after {
    display: none;
}

.store-detail__facts--glossy .store-detail__fact:hover,
.store-detail__facts--glossy .store-detail__fact--link:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .08);
}

.store-detail__fact--link {
    color: inherit !important;
    text-decoration: none !important;
    cursor: pointer;
}

.store-detail__fact--link:hover,
.store-detail__fact--link:focus,
.store-detail__fact--link:visited {
    color: inherit !important;
    text-decoration: none !important;
}

.store-detail__fact--link .store-detail__fact-label,
.store-detail__fact--link .store-detail__fact-value,
.store-detail__fact--link .store-detail__fact-value span {
    color: inherit;
}

.store-detail__fact-label {
    display: block;
}

.store-detail__fact--link:focus-visible {
    outline: 3px solid var(--primary-ring);
    outline-offset: 2px;
}

.store-grid--catalog {
    gap: 12px;
}

body.is-store .store-grid {
    gap: 12px;
}

body.is-store .store-card__body {
    padding: 12px;
}

.store-card,
.store-list-item {
    border-radius: 24px;
    transition: transform .3s var(--ease-out), box-shadow .3s var(--ease-out), border-color .3s var(--ease-out);
}

.store-card:hover,
.store-list-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .08);
    border-color: rgba(0, 0, 0, .06);
}

.store-card__media,
.store-list-item__media {
    background: #fff;
}

.store-card__img,
.store-list-item__img {
    object-fit: contain;
}

.store-card__title,
.store-list-item__title {
    color: var(--store-product-title-color, #1d1d1f);
    font-family: var(--store-product-font-family);
}

.store-card__price-current,
.store-list-item__price .store-card__price-current {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--store-product-title-color, #1d1d1f);
    font-family: var(--store-product-font-family);
}

/* Price amount + de-emphasized currency unit, shared across the storefront. */
.store-price__amount {
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
}

.store-price__unit {
    font-size: .68em;
    font-weight: 500;
    color: var(--text-secondary, #6e6e73);
    margin-inline-start: .25em;
    white-space: nowrap;
}

.btn-store,
.store-card__cta,
.store-list-item__cta {
    min-height: 46px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: -.01em;
    transition: background .3s var(--ease-out), color .3s var(--ease-out), transform .3s var(--ease-out), box-shadow .3s var(--ease-out);
}

.btn-store--primary {
    background: var(--store-product-accent-color, #0071e3);
    color: #fff !important;
    box-shadow: none;
}

.btn-store--primary:hover {
    background: color-mix(in srgb, var(--store-product-accent-color, #0071e3) 88%, #0077ed 12%);
    transform: translateY(-1px);
}

.btn-store--ghost,
.store-card__cta,
.store-list-item__cta {
    background: rgba(0, 0, 0, .04);
    color: #1d1d1f !important;
    border: 1px solid transparent;
}

.btn-store--ghost:hover,
.store-card__cta:hover,
.store-list-item__cta:hover {
    background: rgba(0, 0, 0, .08);
    color: #1d1d1f !important;
}

.store-detail__body {
    width: min(100%, 47.5rem);
}

/* ===== Commerce: Cart, Checkout, Orders ===== */
.checkout-flow {
    --checkout-flow-max: 920px;
    width: min(100%, var(--checkout-flow-max));
    margin-inline: auto;
    display: grid;
    gap: var(--space-lg);
}

.checkout-flow--wide {
    --checkout-flow-max: 980px;
}

.checkout-flow--auth {
    padding-block: var(--space-sm) var(--space-xl);
}

.checkout-flow__header {
    display: grid;
    gap: .35rem;
}

.checkout-flow__lead {
    margin: 0;
    font-size: .88rem;
    line-height: 1.65;
    color: var(--text-secondary);
}

.checkout-flow .checkout-progress {
    margin-bottom: 0;
}

.cart-page,
.checkout-page,
.order-page {
    padding: 0;
}

.cart-page__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
}

.cart-page__heading {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    flex-wrap: wrap;
}

.cart-page__title,
.checkout-page__title,
.order-page__title {
    margin: 0;
    font-size: clamp(1.35rem, 3vw, 1.75rem);
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--text-primary);
}

.cart-page__count {
    display: inline-flex;
    align-items: center;
    padding: .28rem .7rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    color: var(--text-secondary);
    background: var(--accent-soft);
    border: 1px solid rgba(0, 113, 227, .12);
}

.cart-alert {
    padding: .75rem 1rem;
    border-radius: var(--radius);
    font-size: .85rem;
    font-weight: 600;
}

.cart-alert--warn {
    background: #fffbeb;
    border: 1px solid #fde68a;
    color: #92400e;
}

.cart-page__empty {
    margin-top: var(--space-sm);
}

.cart-page__empty-icon {
    display: flex;
    justify-content: center;
    margin-bottom: var(--space-md);
    color: var(--text-tertiary);
    opacity: .55;
}

.cart-page__grid,
.checkout-page__grid,
.order-page__grid {
    display: grid;
    gap: var(--space-lg);
}

@media (min-width: 992px) {
    .cart-page__grid {
        grid-template-columns: minmax(0, 1fr) 320px;
        align-items: start;
    }

    .checkout-page__grid,
    .order-page__grid {
        grid-template-columns: minmax(0, 1fr) 340px;
        align-items: start;
    }
}

.cart-page__items {
    display: grid;
    gap: var(--space-sm);
    min-width: 0;
}

.cart-item {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-md);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
    transition: border-color .2s var(--ease-out), box-shadow .2s var(--ease-out), opacity .22s ease, transform .22s ease;
    min-width: 0;
}

.cart-item:hover {
    border-color: rgba(0, 113, 227, .14);
    box-shadow: var(--shadow-card-hover);
}

.cart-item.is-removing {
    opacity: 0;
    transform: translateX(12px);
    pointer-events: none;
}

.cart-item__media {
    width: 72px;
    height: 72px;
    border-radius: var(--radius);
    overflow: hidden;
    background: #fff;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    text-decoration: none;
    color: inherit;
}

.cart-item__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cart-item__placeholder {
    font-size: 1.5rem;
    opacity: .45;
}

.cart-item__body {
    flex: 1;
    min-width: 0;
}

.cart-item__name {
    display: block;
    font-weight: 700;
    font-size: .92rem;
    color: var(--text-primary);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cart-item__name:hover {
    color: var(--primary);
}

.cart-item__price {
    display: block;
    margin-top: .15rem;
    font-size: .78rem;
    color: var(--text-tertiary);
}

.cart-item__actions {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    flex-shrink: 0;
}

.cart-item__qty {
    display: inline-flex;
    align-items: center;
    gap: .15rem;
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: .15rem .35rem;
    background: var(--surface-secondary);
}

.cart-item__qty-btn {
    border: 0;
    background: none;
    font-size: 1rem;
    cursor: pointer;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary);
    font-weight: 700;
    border-radius: 999px;
    transition: background .15s;
}

.cart-item__qty-btn:hover {
    background: var(--accent-soft);
}

.cart-item__qty-btn:disabled {
    opacity: .5;
    cursor: wait;
}

.cart-item__qty-value {
    font-weight: 800;
    font-size: .85rem;
    min-width: 22px;
    text-align: center;
    color: var(--text-primary);
}

.cart-item__total {
    font-weight: 800;
    font-size: .86rem;
    color: var(--primary);
    white-space: nowrap;
}

.cart-item__remove {
    border: 0;
    background: none;
    color: var(--text-tertiary);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    transition: background .15s, color .15s;
}

.cart-item__remove:hover {
    background: rgba(255, 59, 48, .08);
    color: #ff3b30;
}

.cart-summary__title,
.cart-page__summary h2 {
    margin: 0 0 var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--border);
    font-size: 1rem;
    font-weight: 800;
    color: var(--text-primary);
}

.cart-page__summary {
    align-self: start;
    min-width: 0;
}

@media (min-width: 992px) {
    .cart-page__summary {
        position: sticky;
        top: calc(var(--site-header-offset, 108px) + 16px);
        z-index: 2;
    }
}

.checkout-page__summary {
    align-self: start;
    min-width: 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

@media (min-width: 992px) {
    .checkout-page__summary {
        position: sticky;
        top: calc(var(--site-header-offset, 108px) + 16px);
        z-index: 2;
    }
}

.cart-summary__rows {
    display: grid;
    gap: .15rem;
    margin-bottom: var(--space-sm);
}

.cart-summary__row {
    display: flex;
    justify-content: space-between;
    gap: var(--space-sm);
    padding: .45rem 0;
    font-size: .85rem;
    color: var(--text-secondary);
}

.cart-summary__note {
    font-size: .75rem;
    color: var(--text-tertiary);
    font-style: italic;
}

.cart-summary__row--total {
    font-weight: 800;
    font-size: 1rem;
    color: var(--text-primary);
    border-top: 1px solid var(--divider);
    padding-top: .75rem;
    margin-top: .35rem;
    margin-bottom: var(--space-md);
}

.cart-page__continue {
    display: block;
    margin-top: var(--space-sm);
    text-align: center;
    font-size: .82rem;
    font-weight: 600;
    color: var(--text-tertiary);
    text-decoration: none;
    transition: color .15s;
}

.cart-page__continue:hover {
    color: var(--primary);
}

@media (max-width: 991px) {
    .cart-item {
        flex-wrap: wrap;
    }

    .cart-item__body {
        flex: 1 1 calc(100% - 88px);
        min-width: 0;
    }

    .cart-item__actions {
        width: 100%;
        justify-content: space-between;
        padding-top: var(--space-sm);
        border-top: 1px solid var(--border);
        margin-top: .25rem;
    }
}

/* Checkout form */
.checkout-page__header {
    display: grid;
    gap: .15rem;
    margin-bottom: 0;
}

.checkout-page__heading {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    flex-wrap: wrap;
}

.checkout-page__count {
    display: inline-flex;
    align-items: center;
    padding: .28rem .7rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    color: var(--text-secondary);
    background: var(--accent-soft);
    border: 1px solid rgba(0, 113, 227, .12);
}

.checkout-form__section {
    border: 1px solid color-mix(in srgb, var(--primary) 8%, var(--border));
    border-radius: var(--radius-xl);
    padding: 0;
    margin: 0 0 var(--space-md);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
    overflow: hidden;
}

.checkout-form__legend-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.checkout-form__section-head {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: var(--space-md) var(--space-lg);
    border-bottom: 1px solid var(--border);
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
}

.checkout-form__section-titles {
    flex: 1;
    min-width: 0;
}

.checkout-form__section-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    color: var(--text-primary);
    letter-spacing: -.02em;
    line-height: 1.35;
}

.checkout-form__section-sub {
    margin: .25rem 0 0;
    font-size: .78rem;
    color: var(--text-tertiary);
    line-height: 1.5;
}

.checkout-form__section > :not(.checkout-form__section-head):not(.checkout-form__legend-sr) {
    margin-right: var(--space-lg);
    margin-left: var(--space-lg);
}

.checkout-form__section > .checkout-form__section-head {
    margin-right: 0;
    margin-left: 0;
}

.checkout-form__section-head + .checkout-form__row,
.checkout-form__section-head + .checkout-form__field,
.checkout-form__section-head + .checkout-address-picker,
.checkout-form__section-head + .checkout-address-fields,
.checkout-form__section-head + .checkout-delivery-methods,
.checkout-form__section-head + .checkout-payment-methods,
.checkout-form__section-head + .checkout-alert {
    margin-top: var(--space-md);
}

.checkout-form__section > :last-child {
    margin-bottom: var(--space-lg);
}

.checkout-form__section legend {
    display: none;
}

.checkout-form__section-num {
    flex-shrink: 0;
    width: 1.55rem;
    height: 1.55rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: .72rem;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(180deg, var(--primary) 0%, #0066cc 100%);
    box-shadow: 0 4px 12px rgba(10, 132, 255, .22);
}

.checkout-form__field--notes {
    margin-top: var(--space-sm);
    padding-top: var(--space-sm);
    border-top: 1px dashed var(--border);
}

.checkout-form__readonly {
    background: #f8fafc !important;
    color: var(--text-secondary);
    cursor: default;
}

.checkout-form__actions {
    display: grid;
    gap: .75rem;
    margin-top: var(--space-xs);
}

.checkout-form__back {
    display: block;
    text-align: center;
    font-size: .82rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-decoration: none;
}

.checkout-form__back:hover {
    color: var(--primary);
}

/* Order summary (checkout sidebar + cart) */
.order-summary {
    padding: var(--space-lg);
    border: 1px solid color-mix(in srgb, var(--primary) 10%, var(--border));
    border-radius: var(--radius-xl);
    background: linear-gradient(165deg, #fff 0%, #f8faff 55%, #f3f7ff 100%);
    box-shadow: var(--shadow-soft), 0 12px 32px rgba(15, 23, 42, .06);
    overflow: hidden;
}

.order-summary__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-sm);
    margin-bottom: var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--border);
}

.order-summary__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--text-primary);
    letter-spacing: -.02em;
}

.order-summary__badge {
    flex-shrink: 0;
    padding: .25rem .65rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    color: var(--primary);
    background: var(--accent-soft);
    border: 1px solid rgba(0, 113, 227, .14);
}

.order-summary__items {
    list-style: none;
    margin: 0 0 var(--space-md);
    padding: 0;
    display: grid;
    gap: .5rem;
    max-height: min(42vh, 280px);
    overflow-y: auto;
    scrollbar-width: thin;
}

.order-summary__line {
    display: grid;
    grid-template-columns: 52px 1fr auto;
    gap: .65rem;
    align-items: start;
    padding: .65rem;
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .85);
    border: 1px solid rgba(15, 23, 42, .06);
    box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
}

.order-summary__thumb {
    display: block;
    width: 52px;
    height: 52px;
    border-radius: var(--radius);
    overflow: hidden;
    background: #f1f5f9;
    border: 1px solid var(--border);
    flex-shrink: 0;
}

.order-summary__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.order-summary__thumb-placeholder {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    font-size: 1.35rem;
    opacity: .55;
}

.order-summary__line-body {
    min-width: 0;
    display: grid;
    gap: .2rem;
}

.order-summary__line-name {
    font-size: .84rem;
    font-weight: 700;
    color: var(--text-primary);
    text-decoration: none;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.order-summary__line-name:hover {
    color: var(--primary);
}

.order-summary__line-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem .5rem;
    font-size: .72rem;
    color: var(--text-tertiary);
}

.order-summary__qty {
    display: inline-flex;
    align-items: center;
    padding: .12rem .45rem;
    border-radius: 999px;
    font-weight: 700;
    color: var(--text-secondary);
    background: #eef2f7;
}

.order-summary__unit {
    font-weight: 500;
}

.order-summary__line-price {
    font-size: .8rem;
    font-weight: 800;
    color: var(--text-primary);
    white-space: nowrap;
    text-align: left;
    padding-top: .1rem;
}

.order-summary__totals {
    padding: var(--space-md);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(15, 23, 42, .07);
}

.order-summary__rows {
    margin: 0;
    padding: 0;
    display: grid;
    gap: .1rem;
}

.order-summary__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--space-sm);
    padding: .4rem 0;
    font-size: .84rem;
}

.order-summary__row dt {
    margin: 0;
    font-weight: 600;
    color: var(--text-secondary);
}

.order-summary__row dd {
    margin: 0;
    font-weight: 700;
    color: var(--text-primary);
    text-align: left;
}

.order-summary__value--muted {
    font-size: .78rem;
    font-weight: 600 !important;
    color: var(--text-tertiary) !important;
}

.order-summary__grand {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-sm);
    margin-top: var(--space-sm);
    padding-top: var(--space-md);
    border-top: 2px solid color-mix(in srgb, var(--primary) 18%, var(--border));
}

.order-summary__grand-label {
    font-size: .88rem;
    font-weight: 700;
    color: var(--text-secondary);
}

.order-summary__grand-value {
    font-size: 1.12rem;
    font-weight: 800;
    color: var(--primary);
    letter-spacing: -.02em;
    white-space: nowrap;
}

.order-summary__trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .65rem 1rem;
    margin: var(--space-md) 0 0;
    padding-top: var(--space-sm);
    border-top: 1px dashed var(--border);
}

.order-summary__trust-item {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    font-weight: 600;
    color: var(--text-tertiary);
}

.order-summary__trust-item svg {
    opacity: .75;
    color: var(--primary);
}

@media (max-width: 991px) {
    .order-summary__line {
        grid-template-columns: 48px 1fr;
        grid-template-rows: auto auto;
    }

    .order-summary__line-price {
        grid-column: 2;
        text-align: right;
        padding-top: 0;
    }
}

.checkout-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); }
@media (max-width: 600px) { .checkout-form__row { grid-template-columns: 1fr; } }

@media (max-width: 640px) {
    .checkout-page__grid {
        gap: var(--space-md);
    }

    .checkout-form__section-head {
        padding: var(--space-md);
    }

    .checkout-form__section > :not(.checkout-form__section-head):not(.checkout-form__legend-sr) {
        margin-right: var(--space-md);
        margin-left: var(--space-md);
    }

    .checkout-form__section-title {
        font-size: .95rem;
    }

    .checkout-address-card {
        padding: .75rem .85rem;
    }

    .checkout-delivery-method__head,
    .checkout-payment-method__box {
        flex-direction: column;
        align-items: flex-start;
    }

    .checkout-form__submit {
        min-height: 3rem;
        font-size: .95rem;
    }

    .order-summary {
        padding: var(--space-md);
    }
}
.checkout-form__field { display: grid; gap: .35rem; margin-bottom: var(--space-md); }
.checkout-form__field:last-child { margin-bottom: 0; }
.checkout-form__field span { font-size: .8rem; font-weight: 700; color: var(--text-secondary); }
.checkout-form__field input,
.checkout-form__field textarea,
.checkout-form__field select,
.checkout-form__select {
    padding: .65rem .9rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    font: inherit;
    font-size: .88rem;
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
    width: 100%;
    box-sizing: border-box;
}

.checkout-form__field input:focus,
.checkout-form__field textarea:focus,
.checkout-form__field select:focus,
.checkout-form__select:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

.checkout-form__field select:disabled,
.checkout-form__select:disabled {
    background: #f3f4f6;
    color: var(--text-tertiary);
    cursor: not-allowed;
}

.checkout-form__submit {
    margin-top: var(--space-sm);
}

/* Legacy checkout summary lines (bank-transfer page) */
.checkout-summary-items {
    display: grid;
    gap: .5rem;
    margin-bottom: var(--space-md);
    max-height: min(42vh, 280px);
    overflow-y: auto;
}

.checkout-summary-item {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .25rem .65rem;
    align-items: baseline;
    padding: .65rem;
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .85);
    border: 1px solid rgba(15, 23, 42, .06);
    font-size: .82rem;
}

.checkout-summary-item__name {
    grid-column: 1;
    font-weight: 700;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.checkout-summary-item__qty {
    grid-column: 1;
    font-size: .72rem;
    color: var(--text-tertiary);
}

.checkout-summary-item__price {
    grid-column: 2;
    grid-row: 1 / span 2;
    font-weight: 800;
    white-space: nowrap;
    align-self: center;
}

.field-error { color: #e53e3e; font-size: .72rem; }

.checkout-alert { padding: .75rem 1rem; border-radius: var(--radius); margin-bottom: var(--space-md); font-size: .85rem; font-weight: 600; }
.checkout-alert--success { background: #f0fdf4; border: 1px solid #86efac; color: #166534; }
.checkout-alert--error { background: #fef2f2; border: 1px solid #fca5a5; color: #991b1b; }

/* Checkout OTP auth */
.checkout-auth-page {
    display: grid;
    gap: var(--space-lg);
}

.checkout-auth-page .checkout-flow__header {
    text-align: center;
}

.checkout-auth-page .checkout-auth-card {
    width: min(100%, 440px);
    margin-inline: auto;
}

.checkout-auth-card {
    padding: clamp(1.65rem, 4vw, 2.35rem);
    border-radius: var(--radius-xl);
    background: linear-gradient(180deg, #fff 0%, #fafbff 100%);
    border: 1px solid color-mix(in srgb, var(--primary) 12%, var(--border));
    box-shadow: 0 18px 40px rgba(15, 23, 42, .08);
    text-align: center;
}

.checkout-auth-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.25rem;
    height: 4.25rem;
    margin: 0 auto var(--space-md);
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 10%, white);
    color: var(--primary);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 18%, transparent);
}

.checkout-auth-card__eyebrow {
    margin: 0 0 .35rem;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--primary);
}

.checkout-auth-card__title {
    margin: 0 0 .45rem;
    font-size: clamp(1.35rem, 3.2vw, 1.65rem);
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1.25;
    color: var(--text-primary);
}

.checkout-auth-card__desc {
    margin: 0 0 var(--space-lg);
    font-size: .9rem;
    line-height: 1.75;
    color: var(--text-secondary);
}

.checkout-auth-card__phone {
    display: inline-block;
    padding: .1rem .45rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 8%, white);
    color: var(--text-primary);
    font-weight: 800;
    letter-spacing: .04em;
}

.checkout-auth-card__note {
    margin: var(--space-md) 0 0;
    font-size: .78rem;
    line-height: 1.6;
    color: var(--text-tertiary);
}

.checkout-auth-card__back {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    margin-top: var(--space-md);
    font-size: .84rem;
    font-weight: 700;
    color: var(--text-tertiary);
    text-decoration: none;
    transition: color .15s;
}

.checkout-auth-card__back:hover {
    color: var(--primary);
}

.checkout-auth-form {
    text-align: start;
}

.checkout-auth-form__field {
    margin-bottom: var(--space-md);
}

.checkout-auth-form__field span {
    display: block;
    margin-bottom: .45rem;
    font-size: .82rem;
    font-weight: 700;
    color: var(--text-primary);
}

.checkout-auth-form__field input {
    width: 100%;
    min-height: 3rem;
    padding: .75rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: #fff;
    font-size: 1rem;
    transition: border-color .15s, box-shadow .15s;
}

.checkout-auth-form__field input:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 12%, transparent);
}

.checkout-auth-form__honeypot {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.checkout-auth-form__phone {
    font-size: 1.05rem !important;
    letter-spacing: .06em;
    font-weight: 700;
}

.checkout-auth-form__code {
    font-size: clamp(1.45rem, 4vw, 1.75rem) !important;
    letter-spacing: .42em;
    text-align: center;
    font-weight: 800;
    font-family: ui-monospace, 'JetBrains Mono', monospace;
    padding-inline: .75rem !important;
}

.checkout-auth-form__submit.btn-store--primary {
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    min-height: 3.125rem;
    margin-top: .35rem;
    padding: .875rem 1.35rem;
    border: none;
    border-radius: 999px;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0;
    cursor: pointer;
    background: var(--primary);
    color: #fff !important;
    box-shadow: var(--primary-shadow);
    transition: transform .18s var(--ease-out), box-shadow .18s var(--ease-out), background .18s var(--ease-out), opacity .18s;
}

.checkout-auth-form__submit.btn-store--primary:hover:not(:disabled) {
    background: var(--primary-hover);
    transform: translateY(-1px);
}

.checkout-auth-form__submit.btn-store--primary:active:not(:disabled) {
    transform: translateY(0);
}

.checkout-auth-form__submit.btn-store--primary:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 28%, transparent);
}

.checkout-auth-form__submit.btn-store--primary:disabled {
    opacity: .72;
    cursor: wait;
    transform: none;
    box-shadow: none;
}

.checkout-auth-card__resend {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    flex-wrap: wrap;
    margin-top: var(--space-md);
    padding-top: var(--space-md);
    border-top: 1px dashed var(--border);
    font-size: .84rem;
    color: var(--text-secondary);
}

.checkout-auth-card__resend-form {
    display: inline;
    margin: 0;
}

.checkout-auth-card__resend-btn {
    border: 0;
    background: none;
    padding: .2rem .45rem;
    font: inherit;
    font-weight: 800;
    color: var(--primary);
    cursor: pointer;
    border-radius: 6px;
    transition: background .15s, color .15s;
}

.checkout-auth-card__resend-btn:hover:not(:disabled) {
    background: var(--accent-soft);
}

.checkout-auth-card__resend-btn:disabled {
    color: var(--text-tertiary);
    cursor: not-allowed;
}

.checkout-form__readonly {
    background: #f3f4f6;
    color: #6b7280;
    cursor: not-allowed;
}
/* Saved address card picker */
.checkout-address-picker {
    margin-bottom: var(--space-md);
}

.checkout-address-picker__heading,
.checkout-address-fields__heading {
    margin: 0 0 .65rem;
    font-size: .82rem;
    font-weight: 800;
    color: var(--text-secondary);
}

.checkout-address-picker__list {
    display: grid;
    gap: .55rem;
}

.checkout-address-card {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .65rem;
    align-items: start;
    padding: .85rem .95rem;
    border: 2px solid var(--border);
    border-radius: var(--radius-lg);
    background: #fff;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s, background .15s;
}

.checkout-address-card:hover {
    border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
    background: #fafbff;
}

.checkout-address-card.is-selected {
    border-color: var(--primary);
    background: linear-gradient(165deg, #eff6ff 0%, #f8fbff 45%, #fff 100%);
    box-shadow: 0 0 0 3px rgba(10, 132, 255, .14), 0 4px 14px rgba(10, 132, 255, .08);
}

.checkout-address-card__input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.checkout-address-card__body {
    display: grid;
    gap: .3rem;
    min-width: 0;
}

.checkout-address-card__top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem .5rem;
}

.checkout-address-card__badge {
    display: inline-flex;
    padding: .15rem .5rem;
    border-radius: 999px;
    font-size: .7rem;
    font-weight: 800;
    color: var(--primary);
    background: var(--accent-soft);
}

.checkout-address-card__location {
    font-size: .84rem;
    font-weight: 700;
    color: var(--text-primary);
}

.checkout-address-card__street {
    font-size: .8rem;
    color: var(--text-secondary);
    line-height: 1.55;
    word-break: break-word;
}

.checkout-address-card__meta {
    font-size: .74rem;
    color: var(--text-tertiary);
}

.checkout-address-card__mark {
    position: relative;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 999px;
    border: 2px solid #cbd5e1;
    background: #fff;
    margin-top: .1rem;
    flex-shrink: 0;
    transition: border-color .15s, background .15s, box-shadow .15s, transform .15s;
}

.checkout-address-card__mark::after {
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    width: .45rem;
    height: .7rem;
    border: solid #fff;
    border-width: 0 2.5px 2.5px 0;
    transform: rotate(45deg) scale(0);
    opacity: 0;
    transition: transform .15s, opacity .15s;
}

.checkout-address-card.is-selected .checkout-address-card__mark {
    border-color: var(--primary);
    background: linear-gradient(180deg, #3b9eff 0%, var(--primary) 100%);
    box-shadow: 0 2px 8px rgba(10, 132, 255, .35);
    transform: scale(1.05);
}

.checkout-address-card.is-selected .checkout-address-card__mark::after {
    transform: rotate(45deg) scale(1);
    opacity: 1;
}

.checkout-address-card.is-selected .checkout-address-card__badge {
    color: #fff;
    background: var(--primary);
}

.checkout-address-card--new .checkout-address-card__street {
    color: var(--text-tertiary);
    font-weight: 600;
}

.checkout-address-fields {
    padding-top: var(--space-sm);
    border-top: 1px dashed var(--border);
}

.checkout-address-fields.is-from-saved .checkout-form__field input:not([readonly]),
.checkout-address-fields.is-from-saved .checkout-form__field textarea,
.checkout-address-fields.is-from-saved .checkout-form__field select {
    background: #f8fafc;
}

.checkout-address-fields.is-manual .checkout-address-fields__heading::after {
    content: ' — در حال ویرایش';
    color: var(--primary);
    font-weight: 700;
}
.checkout-form__select {
    width: 100%;
    padding: .65rem .9rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    font: inherit;
    font-size: .88rem;
    background: #fff;
    cursor: pointer;
}
.checkout-form__field--checkbox {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-top: .5rem;
}
.checkout-form__field--checkbox input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--primary);
}
.checkout-form__field--checkbox span {
    font-size: .82rem;
    color: var(--text-secondary);
}

.checkout-map-block {
    margin-top: var(--space-md);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: #fff;
}
.checkout-map-block__head {
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    gap: .2rem;
    text-align: start;
}
.checkout-map-block__head span {
    font-size: .85rem;
    font-weight: 700;
    color: var(--text-primary);
}
.checkout-map-block__head small {
    font-size: .75rem;
    color: var(--text-tertiary);
}
.checkout-map {
    width: 100%;
    height: 280px;
}
.checkout-map-block__hint {
    margin: 0;
    padding: .65rem 1rem;
    font-size: .75rem;
    color: var(--text-secondary);
    text-align: start;
    border-top: 1px solid var(--border);
    background: var(--surface-muted, #f9fafb);
}
.checkout-map-block__disabled {
    margin: var(--space-md) 0 0;
    padding: .75rem 1rem;
    border-radius: var(--radius);
    background: #f9fafb;
    border: 1px dashed var(--border);
    font-size: .78rem;
    color: var(--text-tertiary);
    text-align: start;
}

/* Order page */
.order-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
}
.order-card__header {
    display: flex; justify-content: space-between; align-items: center;
    padding: var(--space-md) var(--space-lg);
    background: var(--surface-secondary);
    border-bottom: 1px solid var(--border);
}
.order-card__id { font-weight: 700; font-size: .88rem; }
.order-card__status {
    padding: .3rem .7rem; border-radius: 999px;
    font-size: .72rem; font-weight: 700;
    background: #fff;
    color: var(--text-secondary);
    border: 1px solid var(--border);
}
.order-card__status--pending { background: #fef3c7; color: #92400e; border-color: #fcd34d; }
.order-card__status--paid, .order-card__status--processing { background: #dbeafe; color: #1e40af; border-color: #93c5fd; }
.order-card__status--shipped { background: #fef3c7; color: #92400e; border-color: #fcd34d; }
.order-card__status--delivered { background: #d1fae5; color: #065f46; border-color: #6ee7b7; }
.order-card__status--cancelled { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }

.order-status-track {
    padding: var(--space-md) var(--space-lg);
    background:
        linear-gradient(135deg, rgba(10, 132, 255, .06) 0%, rgba(255, 255, 255, .98) 45%, rgba(16, 185, 129, .05) 100%);
    border-bottom: 1px solid var(--border);
}
.order-status-track__steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .35rem;
    position: relative;
}
.order-status-track__steps::before {
    content: '';
    position: absolute;
    top: 1.05rem;
    right: 8%;
    left: 8%;
    height: 2px;
    background: linear-gradient(90deg, #dbeafe 0%, #bfdbfe 50%, #e5e7eb 100%);
    z-index: 0;
}
.order-status-track__step {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: .45rem;
    min-width: 0;
}
.order-status-track__marker {
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: .78rem;
    font-weight: 800;
    border: 2px solid #d1d5db;
    background: #fff;
    color: #6b7280;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .06);
    transition: transform .2s var(--ease-out), box-shadow .2s var(--ease-out), border-color .2s var(--ease-out);
}
.order-status-track__step--done .order-status-track__marker {
    border-color: #34d399;
    background: linear-gradient(180deg, #ecfdf5 0%, #d1fae5 100%);
    color: #047857;
}
.order-status-track__step--active .order-status-track__marker {
    border-color: var(--primary);
    background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
    color: #1d4ed8;
    box-shadow: 0 0 0 4px rgba(10, 132, 255, .14), 0 8px 18px rgba(10, 132, 255, .18);
    transform: scale(1.05);
}
.order-status-track__step--upcoming .order-status-track__marker {
    opacity: .72;
}
.order-status-track__check {
    font-size: .95rem;
    line-height: 1;
}
.order-status-track__content {
    display: grid;
    gap: .15rem;
    width: 100%;
}
.order-status-track__label {
    font-size: .72rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.35;
}
.order-status-track__step--upcoming .order-status-track__label {
    color: var(--text-tertiary);
    font-weight: 600;
}
.order-status-track__step--active .order-status-track__label {
    color: #1d4ed8;
}
.order-status-track__time {
    font-size: .62rem;
    color: var(--text-tertiary);
}
.order-status-track__detail {
    margin-top: var(--space-md);
    padding: .85rem 1rem;
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .82);
    border: 1px solid rgba(10, 132, 255, .12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}
.order-status-track__detail p {
    margin: 0;
    font-size: .82rem;
    line-height: 1.7;
    color: var(--text-secondary);
}
.order-status-track__tracking {
    margin-top: .45rem !important;
    font-weight: 700;
    color: var(--text-primary) !important;
}
.order-status-track__cancelled {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .85rem 1rem;
    border-radius: var(--radius-lg);
    background: #fef2f2;
    border: 1px solid #fecaca;
}
.order-status-track__cancelled-icon {
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: #fee2e2;
    color: #b91c1c;
    font-weight: 800;
    flex-shrink: 0;
}
.order-status-track__cancelled p {
    margin: .25rem 0 0;
    font-size: .82rem;
    color: #7f1d1d;
}

@media (max-width: 760px) {
    .order-status-track__steps {
        grid-template-columns: 1fr;
        gap: .65rem;
    }
    .order-status-track__steps::before {
        display: none;
    }
    .order-status-track__step {
        flex-direction: row;
        align-items: center;
        text-align: right;
        gap: .75rem;
    }
    .order-status-track__content {
        text-align: right;
    }
}

.order-card__section { padding: var(--space-md) var(--space-lg); border-bottom: 1px solid var(--border); }
.order-card__section:last-child { border-bottom: 0; }
.order-card__section h3 { font-size: .85rem; font-weight: 800; margin-bottom: var(--space-sm); color: var(--text-secondary); }
.order-card__map-link {
    display: inline-block;
    margin-top: .35rem;
    font-size: .78rem;
    font-weight: 600;
    color: var(--primary);
    text-decoration: none;
}
.order-card__map-link:hover { text-decoration: underline; }
.order-item { display: flex; gap: .5rem; padding: .35rem 0; font-size: .84rem; }
.order-item__name { flex: 1; }
.order-item__qty { color: var(--text-tertiary); }
.order-item__price { font-weight: 700; }
.order-amounts__row { display: flex; justify-content: space-between; padding: .35rem 0; font-size: .84rem; }
.order-amounts__row--total { font-weight: 800; border-top: 1px solid var(--border); padding-top: .5rem; margin-top: .25rem; }
.order-payment { display: flex; align-items: center; gap: .75rem; padding: .35rem 0; font-size: .82rem; }
.order-payment__provider { font-weight: 700; text-transform: capitalize; }
.order-payment__status { padding: .2rem .5rem; border-radius: 999px; font-size: .68rem; font-weight: 700; }
.order-payment__status--success { background: #d1fae5; color: #065f46; }
.order-payment__status--failed { background: #fee2e2; color: #991b1b; }
.order-payment__status--pending { background: #fef3c7; color: #92400e; }
.order-payment__date { color: var(--text-tertiary); font-size: .75rem; }
.order-card__actions { padding: var(--space-md) var(--space-lg); }

/* —— Add to cart CTA (override generic ghost styles below commerce block) —— */
.store-card__cta--cart {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    width: 100%;
    min-height: 44px;
    padding: .65rem 1rem !important;
    border: none !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #0077ed 0%, #0071e3 100%) !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: .88rem !important;
    letter-spacing: -.01em;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 113, 227, .32);
    transition: transform .2s var(--ease-out), box-shadow .2s var(--ease-out), background .2s var(--ease-out);
}

.store-card__cta--cart:hover {
    background: linear-gradient(180deg, #0084ff 0%, #0077ed 100%) !important;
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(0, 113, 227, .38);
}

.store-card__cta--cart:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(0, 113, 227, .28);
}

.store-card__cta--cart.is-loading {
    opacity: .72;
    pointer-events: none;
}

.store-card__cta--cart.is-added {
    background: linear-gradient(180deg, #059669 0%, #047857 100%) !important;
    box-shadow: 0 2px 10px rgba(5, 150, 105, .35);
}

.store-card__cta--cart.is-error {
    background: linear-gradient(180deg, #dc2626 0%, #b91c1c 100%) !important;
}

/* —— Checkout progress (cart → auth → payment) —— */
.checkout-progress {
    padding: var(--space-md) var(--space-lg);
    border-radius: var(--radius-xl);
    background:
        linear-gradient(135deg, rgba(10, 132, 255, .07) 0%, rgba(255, 255, 255, .98) 42%, rgba(16, 185, 129, .05) 100%);
    border: 1px solid rgba(10, 132, 255, .12);
    box-shadow: 0 10px 28px rgba(15, 23, 42, .04);
}
.checkout-progress__steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
    position: relative;
}
.checkout-progress__steps::before {
    content: '';
    position: absolute;
    top: 1.15rem;
    right: 12%;
    left: 12%;
    height: 2px;
    background: linear-gradient(90deg, #dbeafe 0%, #bfdbfe 45%, #e5e7eb 100%);
    z-index: 0;
}
.checkout-progress__step {
    position: relative;
    z-index: 1;
    min-width: 0;
}
.checkout-progress__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .55rem;
    text-align: center;
    text-decoration: none;
    color: inherit;
    padding: .15rem;
    border-radius: var(--radius-lg);
    transition: background .2s var(--ease-out), transform .2s var(--ease-out);
}
a.checkout-progress__link:hover {
    background: rgba(255, 255, 255, .55);
    transform: translateY(-1px);
}
a.checkout-progress__link:focus-visible {
    outline: 2px solid rgba(10, 132, 255, .45);
    outline-offset: 2px;
}
.checkout-progress__marker {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: .82rem;
    font-weight: 800;
    border: 2px solid #d1d5db;
    background: #fff;
    color: #6b7280;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .06);
    transition: transform .2s var(--ease-out), box-shadow .2s var(--ease-out), border-color .2s var(--ease-out);
}
.checkout-progress__step--done .checkout-progress__marker {
    border-color: #34d399;
    background: linear-gradient(180deg, #ecfdf5 0%, #d1fae5 100%);
    color: #047857;
}
.checkout-progress__step--active .checkout-progress__marker {
    border-color: var(--primary);
    background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
    color: #1d4ed8;
    box-shadow: 0 0 0 4px rgba(10, 132, 255, .14), 0 10px 22px rgba(10, 132, 255, .16);
    transform: scale(1.06);
}
.checkout-progress__step--upcoming .checkout-progress__marker {
    opacity: .78;
}
.checkout-progress__step--upcoming a.checkout-progress__link .checkout-progress__marker {
    border-color: #93c5fd;
    background: linear-gradient(180deg, #f8fbff 0%, #eff6ff 100%);
    color: #2563eb;
    opacity: 1;
}
.checkout-progress__check {
    font-size: 1rem;
    line-height: 1;
}
.checkout-progress__content {
    display: grid;
    gap: .12rem;
    width: 100%;
}
.checkout-progress__label {
    font-size: .78rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.35;
}
.checkout-progress__step--upcoming .checkout-progress__label {
    color: var(--text-tertiary);
    font-weight: 600;
}
.checkout-progress__step--active .checkout-progress__label {
    color: #1d4ed8;
}
.checkout-progress__hint {
    font-size: .64rem;
    color: var(--text-tertiary);
    line-height: 1.35;
}
.checkout-progress__step--active .checkout-progress__hint {
    color: #3b82f6;
}
.checkout-progress__step--done .checkout-progress__hint {
    color: #059669;
}
.checkout-progress__caption {
    margin: .85rem 0 0;
    padding-top: .75rem;
    border-top: 1px dashed rgba(10, 132, 255, .14);
    font-size: .78rem;
    color: var(--text-secondary);
    line-height: 1.6;
}
.checkout-progress__caption strong {
    color: var(--text-primary);
}
.checkout-progress__caption--muted {
    color: var(--text-tertiary);
}

@media (max-width: 720px) {
    .checkout-progress {
        padding: var(--space-sm) var(--space-md);
    }
    .checkout-progress__steps {
        grid-template-columns: 1fr;
        gap: .55rem;
    }
    .checkout-progress__steps::before {
        display: none;
    }
    .checkout-progress__link {
        flex-direction: row;
        align-items: center;
        text-align: right;
        gap: .75rem;
    }
    .checkout-progress__content {
        text-align: right;
    }
    .checkout-progress__marker {
        flex-shrink: 0;
    }
}

/* Legacy alias */
.cart-steps { display: none; }

.cart-item__price-unit {
    font-size: .68rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

.cart-summary {
    padding: var(--space-lg);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.cart-summary__checkout,
.order-summary__cta {
    margin-top: var(--space-md);
}

.cart-summary__secure {
    margin: .75rem 0 0;
    text-align: center;
    font-size: .72rem;
    color: var(--text-tertiary);
}

.cart-page__empty {
    padding: clamp(2rem, 6vw, 3.5rem) var(--space-lg);
    border-radius: var(--radius-xl);
    background: var(--surface);
    border: 1px dashed rgba(0, 113, 227, .18);
}

.cart-page__empty .empty-state__hint {
    max-width: 28rem;
    margin-inline: auto;
}

/* Account profile (tiered auth) */
.account-profile {
    max-width: min(100%, 52rem);
}

.btn-store--sm {
    min-height: 2.25rem;
    padding: .4rem .85rem;
    font-size: .8rem;
    border-radius: 999px;
}

.account-addresses {
    margin-top: var(--space-lg);
}

.account-address-list {
    list-style: none;
    margin: 0 0 var(--space-md);
    padding: 0;
    display: grid;
    gap: .65rem;
}

.account-address-card {
    display: grid;
    gap: var(--space-sm);
    padding: var(--space-md);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
    background: linear-gradient(180deg, #fff 0%, #fafbff 100%);
    box-shadow: 0 2px 8px rgba(15, 23, 42, .04);
}

.account-address-card.is-editing {
    border-color: color-mix(in srgb, var(--primary) 28%, var(--border));
    box-shadow: 0 0 0 3px rgba(10, 132, 255, .1);
}

.account-address-card__body {
    display: grid;
    gap: .25rem;
    min-width: 0;
}

.account-address-card__badge {
    display: inline-flex;
    width: fit-content;
    padding: .12rem .5rem;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 800;
    color: var(--primary);
    background: var(--accent-soft);
}

.account-address-card__location {
    margin: 0;
    font-size: .88rem;
    font-weight: 700;
    color: var(--text-primary);
}

.account-address-card__street {
    margin: 0;
    font-size: .82rem;
    line-height: 1.6;
    color: var(--text-secondary);
    word-break: break-word;
}

.account-address-card__meta {
    margin: 0;
    font-size: .75rem;
    color: var(--text-tertiary);
}

.account-address-card__map {
    font-size: .75rem;
    font-weight: 600;
    color: var(--primary);
    text-decoration: none;
}

.account-address-card__map:hover {
    text-decoration: underline;
}

.account-address-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.account-address-card__delete-form {
    margin: 0;
}

.account-address-card__delete {
    color: #b91c1c !important;
}

.account-address-card__delete:hover {
    background: #fef2f2 !important;
    border-color: #fecaca !important;
}

.account-address-form {
    margin-top: var(--space-sm);
    padding-top: var(--space-sm);
    border-top: 1px dashed var(--border);
}

.account-address-form__actions {
    margin-top: var(--space-sm);
}

.account-address-add {
    border: 1px dashed color-mix(in srgb, var(--primary) 25%, var(--border));
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, .7);
}

.account-address-add__summary {
    padding: .85rem 1rem;
    font-weight: 700;
    font-size: .88rem;
    color: var(--primary);
    cursor: pointer;
    list-style: none;
}

.account-address-add__summary::-webkit-details-marker {
    display: none;
}

.account-address-add[open] .account-address-add__summary {
    border-bottom: 1px dashed var(--border);
}

.account-address-add .account-address-form {
    padding: var(--space-md);
    margin-top: 0;
    border-top: 0;
}

.account-addresses__empty {
    margin: 0 0 var(--space-md);
    font-size: .84rem;
    line-height: 1.65;
    color: var(--text-secondary);
}

.account-profile__header {
    margin-bottom: var(--space-lg);
}

.account-profile__title {
    margin: 0 0 .35rem;
    font-size: clamp(1.35rem, 3vw, 1.65rem);
    font-weight: 700;
}

.account-profile__lead {
    margin: 0;
    color: var(--text-secondary);
    font-size: .92rem;
    line-height: 1.65;
}

.account-profile__tiers {
    display: grid;
    gap: var(--space-md);
    margin-bottom: var(--space-lg);
}

@media (min-width: 640px) {
    .account-profile__tiers {
        grid-template-columns: 1fr 1fr;
    }
}

.account-tier {
    padding: var(--space-md);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: var(--surface);
}

.account-tier.is-active {
    border-color: rgba(5, 150, 105, .35);
    background: rgba(5, 150, 105, .04);
}

.account-tier__title {
    margin: 0 0 .25rem;
    font-size: .95rem;
    font-weight: 700;
}

.account-tier__desc {
    margin: 0 0 .65rem;
    font-size: .78rem;
    color: var(--text-secondary);
    line-height: 1.5;
}

.account-tier__status {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    font-size: .82rem;
}

.account-tier__badge {
    display: inline-flex;
    padding: .15rem .55rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 600;
}

.account-tier__badge--ok {
    background: rgba(5, 150, 105, .12);
    color: #047857;
}

.account-tier__badge--pending {
    background: rgba(245, 158, 11, .12);
    color: #b45309;
}

.account-profile__hint {
    display: block;
    margin-top: .35rem;
    font-size: .75rem;
    color: var(--text-tertiary);
}

.account-profile__hint--ok {
    color: #047857;
}

.account-profile__resend {
    margin-top: .5rem;
}

.account-profile__link-btn {
    border: 0;
    background: none;
    padding: 0;
    color: var(--accent, #0071e3);
    font: inherit;
    font-size: .82rem;
    cursor: pointer;
    text-decoration: underline;
}

.account-profile__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: var(--space-md);
}

.site-header__account {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    color: inherit;
    text-decoration: none;
    border: 1px solid var(--border, rgba(0, 0, 0, .12));
}

.site-header__account:hover {
    background: rgba(0, 113, 227, .06);
    border-color: rgba(0, 113, 227, .25);
}

.site-header__account.is-active {
    background: rgba(0, 113, 227, .1);
    border-color: rgba(0, 113, 227, .35);
    color: var(--accent, #0071e3);
}

.checkout-payment-methods {
    display: grid;
    gap: .65rem;
}

.checkout-payment-method {
    display: block;
    cursor: pointer;
}

.checkout-payment-method input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.checkout-payment-method__box {
    display: block;
    padding: .85rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
}

.checkout-payment-method__box strong {
    display: block;
    font-size: .92rem;
    margin-bottom: .2rem;
}

.checkout-payment-method__box small {
    display: block;
    color: var(--text-secondary);
    font-size: .78rem;
}

.checkout-payment-method input:checked + .checkout-payment-method__box {
    border-color: rgba(10, 132, 255, .45);
    box-shadow: 0 0 0 4px rgba(10, 132, 255, .1);
}

.checkout-delivery-methods {
    display: grid;
    gap: .65rem;
}

.checkout-delivery-method {
    display: block;
    cursor: pointer;
}

.checkout-delivery-method input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.checkout-delivery-method__box {
    display: block;
    padding: .85rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
}

.checkout-delivery-method__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.checkout-delivery-method__head strong {
    display: block;
    font-size: .92rem;
    line-height: 1.45;
}

.checkout-delivery-method__price {
    flex-shrink: 0;
    font-size: .82rem;
    font-weight: 600;
    color: var(--text-secondary);
    white-space: nowrap;
}

.checkout-delivery-method__box small {
    display: block;
    margin-top: .35rem;
    color: var(--text-secondary);
    font-size: .78rem;
    line-height: 1.55;
}

.checkout-delivery-method input:checked + .checkout-delivery-method__box {
    border-color: rgba(10, 132, 255, .45);
    box-shadow: 0 0 0 4px rgba(10, 132, 255, .1);
}

.checkout-bank-transfer__lead,
.checkout-bank-transfer__pending {
    color: var(--text-secondary);
    font-size: .9rem;
    line-height: 1.7;
}

.checkout-bank-transfer__order-id,
.checkout-bank-transfer__amount {
    margin: 0 0 .5rem;
}

.checkout-bank-transfer__account {
    display: grid;
    gap: .45rem;
    margin: 0;
    font-size: .88rem;
}

.checkout-bank-transfer__account > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .35rem 0;
    border-bottom: 1px solid var(--border);
}

.checkout-bank-transfer__account dt {
    color: var(--text-secondary);
}

.checkout-bank-transfer__account dd {
    margin: 0;
    font-weight: 700;
}

.checkout-bank-transfer__instructions,
.checkout-bank-transfer__message {
    margin: 0;
    padding: 1rem 1.1rem;
    border-radius: var(--radius-lg);
    background: rgba(10, 132, 255, .06);
    border: 1px solid rgba(10, 132, 255, .14);
    font-size: .9rem;
    line-height: 1.75;
    white-space: pre-wrap;
}

.checkout-bank-transfer-preview {
    margin-top: .75rem;
}

.checkout-bank-transfer-preview__label {
    margin-bottom: .4rem;
    font-size: .82rem;
    font-weight: 700;
    color: var(--text-secondary);
}

.checkout-bank-transfer__footer {
    margin-top: 1rem;
    font-size: .85rem;
}

/* —— Checkout completion & shared option cards —— */
.checkout-success-banner {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    padding: 1rem 1.15rem;
    border-radius: var(--radius-xl);
    background: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 55%, #fff 100%);
    border: 1px solid #86efac;
    box-shadow: 0 8px 24px rgba(16, 185, 129, .08);
}

.checkout-success-banner--subtle {
    background: linear-gradient(135deg, #eff6ff 0%, #f8fbff 55%, #fff 100%);
    border-color: color-mix(in srgb, var(--primary) 28%, #bfdbfe);
    box-shadow: 0 8px 24px rgba(10, 132, 255, .08);
}

.checkout-success-banner--subtle .checkout-success-banner__icon {
    background: color-mix(in srgb, var(--primary) 12%, white);
    color: var(--primary);
}

.checkout-success-banner__icon {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    flex-shrink: 0;
    background: #d1fae5;
    color: #047857;
}

.checkout-success-banner__text {
    margin: .15rem 0 0;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.65;
    color: #166534;
}

.checkout-success-banner--subtle .checkout-success-banner__text {
    color: var(--text-primary);
}

.checkout-complete-actions {
    display: grid;
    gap: .65rem;
    margin-top: var(--space-lg);
    padding-top: var(--space-md);
    border-top: 1px dashed var(--border);
}

@media (min-width: 520px) {
    .checkout-complete-actions {
        grid-template-columns: 1fr 1fr;
    }
}

.checkout-complete-actions__btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: .45rem;
}

.checkout-bank-transfer__facts {
    display: grid;
    gap: .65rem;
}

@media (min-width: 480px) {
    .checkout-bank-transfer__facts {
        grid-template-columns: 1fr 1fr;
    }
}

.checkout-bank-transfer__fact {
    display: grid;
    gap: .25rem;
    padding: .85rem 1rem;
    border-radius: var(--radius-lg);
    background: #fff;
    border: 1px solid var(--border);
}

.checkout-bank-transfer__fact--amount {
    border-color: color-mix(in srgb, var(--primary) 22%, var(--border));
    background: linear-gradient(165deg, #eff6ff 0%, #fff 100%);
}

.checkout-bank-transfer__fact-label {
    font-size: .75rem;
    font-weight: 700;
    color: var(--text-tertiary);
}

.checkout-bank-transfer__fact-value {
    font-size: 1rem;
    font-weight: 800;
    color: var(--text-primary);
}

.checkout-bank-transfer__fact--amount .checkout-bank-transfer__fact-value {
    color: var(--primary);
}

.checkout-bank-transfer__main .checkout-complete-actions {
    margin-top: var(--space-md);
    padding-top: var(--space-lg);
}

.checkout-form__section-head--compact {
    margin-bottom: var(--space-sm);
}

.checkout-form__section-head--compact .checkout-form__section-num {
    width: 1.65rem;
    height: 1.65rem;
    font-size: .72rem;
}

.order-page__main {
    min-width: 0;
}

.order-card {
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-soft), 0 12px 32px rgba(15, 23, 42, .06);
}

.order-card__track {
    scroll-margin-top: 5rem;
}

.order-card__footer {
    padding: var(--space-md) var(--space-lg) var(--space-lg);
    border-top: 1px solid var(--border);
    background: linear-gradient(180deg, #fafbff 0%, #fff 100%);
}

.order-card__footer .checkout-complete-actions {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.order-card__details p {
    margin: 0 0 .45rem;
    font-size: .84rem;
    line-height: 1.7;
    color: var(--text-secondary);
}

.order-card__details p:last-child {
    margin-bottom: 0;
}

.order-card__section .checkout-form__section-head {
    margin-bottom: var(--space-sm);
}

/* Option pickers: delivery, payment (+ address cards) */
.checkout-option-card.checkout-delivery-method,
.checkout-option-card.checkout-payment-method {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .65rem;
    align-items: start;
    padding: .85rem .95rem;
    border: 2px solid var(--border);
    border-radius: var(--radius-lg);
    background: #fff;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s, background .15s;
}

.checkout-option-card.checkout-delivery-method:hover,
.checkout-option-card.checkout-payment-method:hover {
    border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
    background: #fafbff;
}

.checkout-option-card.is-selected {
    border-color: var(--primary);
    background: linear-gradient(165deg, #eff6ff 0%, #f8fbff 45%, #fff 100%);
    box-shadow: 0 0 0 3px rgba(10, 132, 255, .14), 0 4px 14px rgba(10, 132, 255, .08);
}

.checkout-option-card__input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.checkout-option-card__body {
    display: grid;
    gap: .3rem;
    min-width: 0;
}

.checkout-option-card__mark,
.checkout-address-card__mark {
    position: relative;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 999px;
    border: 2px solid #cbd5e1;
    background: #fff;
    margin-top: .1rem;
    flex-shrink: 0;
    transition: border-color .15s, background .15s, box-shadow .15s, transform .15s;
}

.checkout-option-card__mark::after,
.checkout-address-card__mark::after {
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    width: .45rem;
    height: .7rem;
    border: solid #fff;
    border-width: 0 2.5px 2.5px 0;
    transform: rotate(45deg) scale(0);
    opacity: 0;
    transition: transform .15s, opacity .15s;
}

.checkout-option-card.is-selected .checkout-option-card__mark,
.checkout-option-card.is-selected .checkout-address-card__mark,
.checkout-address-card.is-selected .checkout-address-card__mark {
    border-color: var(--primary);
    background: linear-gradient(180deg, #3b9eff 0%, var(--primary) 100%);
    box-shadow: 0 2px 8px rgba(10, 132, 255, .35);
    transform: scale(1.05);
}

.checkout-option-card.is-selected .checkout-option-card__mark::after,
.checkout-option-card.is-selected .checkout-address-card__mark::after,
.checkout-address-card.is-selected .checkout-address-card__mark::after {
    transform: rotate(45deg) scale(1);
    opacity: 1;
}

.checkout-delivery-method__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.checkout-delivery-method__head strong {
    display: block;
    font-size: .92rem;
    line-height: 1.45;
}

.checkout-delivery-method__price {
    flex-shrink: 0;
    font-size: .82rem;
    font-weight: 700;
    color: var(--primary);
    white-space: nowrap;
}

.checkout-delivery-method__desc,
.checkout-payment-method__desc {
    display: block;
    color: var(--text-secondary);
    font-size: .78rem;
    line-height: 1.55;
}

.checkout-payment-method__title {
    display: block;
    font-size: .92rem;
    line-height: 1.45;
}

.checkout-option-picker {
    display: grid;
    gap: .55rem;
}
