:root {
    --bg: #ffffff;
    --surface: #ffffff;
    --surface-soft: #fffdf6;
    --text: #22201c;
    --text-muted: #6d665c;
    --line: rgba(34, 32, 28, 0.1);
    --shadow: 0 16px 40px rgba(34, 32, 28, 0.06);
    --yellow: #e3ecf6;
    --yellow-soft: #f2f7fc;
    --radius-lg: 32px;
    --radius-md: 22px;
    --radius-sm: 16px;
    --container: 1240px;
    --space-1: 8px;
    --space-2: 16px;
    --space-3: 24px;
    --space-4: 32px;
    --space-5: 40px;
    --desktop-header-height: 60px;
}

/* Payment method card styles */
.payment-method-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.payment-method-card {
    display: block;
    width: 100%;
    padding: 14px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: var(--surface);
    cursor: pointer;
    transition: box-shadow 0.18s ease, transform 0.08s ease, border-color 0.12s ease;
    text-align: right; /* RTL */
}

    .payment-method-card:hover {
        box-shadow: 0 8px 18px rgba(34,34,28,0.06);
        transform: translateY(-2px);
    }

    .payment-method-card.is-disabled {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .payment-method-card.is-selected {
        border-color: #2F7FE5;
        box-shadow: 0 12px 30px rgba(47,127,229,0.08);
    }

.payment-method-card__row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: center;
}

.payment-method-card__icon img {
    width: 48px;
    height: 48px;
    object-fit: contain;
    border-radius: 8px;
}

.payment-method-card__icon .icon--placeholder {
    display: inline-block;
    width: 48px;
    height: 48px;
    font-size: 24px;
    line-height: 48px;
    text-align: center;
    background: #f6f7fb;
    border-radius: 8px;
}

.payment-method-card__title-row {
    display: flex;
    gap: 8px;
    align-items: center;
}

.payment-method-card__title {
    font-weight: 600;
    color: var(--text);
}

.store-chip {
    background: #eef6ff;
    color: #0b66d1;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 0.85rem;
}

.payment-method-card__description {
    color: var(--text-muted);
    margin-top: 6px;
}

.payment-method-card__availability {
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-top: 4px;
}

.radio-indicator {
    font-size: 20px;
    color: #2F7FE5;
}

/* Responsive: show grid two columns on larger screens */
@media (min-width: 860px) {
    .payment-method-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 1200px) {
    .payment-method-grid {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

/* RTL support: ensure center column text aligns right */
:dir(rtl) .payment-method-card__center {
    text-align: right;
}

/* Confirmation modal base styles (simple) */
.confirm-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.confirm-dialog {
    background: var(--surface);
    padding: 18px;
    border-radius: 12px;
    width: 100%;
    max-width: 520px;
    box-shadow: var(--shadow);
}

    .confirm-dialog h3 {
        margin: 0 0 8px;
    }

    .confirm-dialog .confirm-actions {
        display: flex;
        gap: 10px;
        justify-content: flex-end;
        margin-top: 12px;
    }


.auth-experience {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    padding-block: 32px 56px;
}

.auth-showcase {
    display: grid;
    gap: 18px;
    align-content: start;
    padding: 28px;
    border-radius: 32px;
    background: radial-gradient(circle at top right, rgba(245, 203, 196, 0.9), transparent 34%), linear-gradient(180deg, #fff7f3 0%, #fffdfb 100%);
    border: 1px solid rgba(214, 180, 165, 0.35);
}

.auth-showcase__copy h1 {
    margin: 10px 0 12px;
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1.1;
}

.auth-showcase__copy p {
    margin: 0;
    color: var(--color-text-muted, #6c5a4e);
    line-height: 2;
}

.auth-showcase__meta {
    display: grid;
    gap: 12px;
}

.auth-benefit-card {
    display: grid;
    gap: 4px;
    padding: 16px 18px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(220, 190, 177, 0.4);
}

.auth-panel {
    width: 100%;
    max-width: 500px !important;
}

.auth-panel__switches {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}

.auth-mode-chip {
    color: #0077db;
    padding: 10px 18px;
    font: inherit;
    cursor: pointer;
}

.padding-20 {
    padding: 20px !important;
}

.margin-top16 {
    margin-top: 16px;
}

.margin-bottom16 {
    margin-bottom: 16px;
}

.auth-mode-chip.is-active {
    background: #d78f77;
    color: #fff;
    border-color: #d78f77;
}

.auth-step-header {
    margin-bottom: 18px;
}

    .auth-step-header h2,
    .auth-password-prompt__header h2 {
        margin: 0 0 8px;
    }

    .auth-step-header p,
    .auth-password-prompt__header p {
        margin: 0;
        color: var(--color-text-muted, #6c5a4e);
        line-height: 1.9;
    }

.auth-panel__submit {
    width: 100%;
}

.auth-secondary-link {
    margin-top: 10px;
    color: #2f7fe5;
    background: none;
    border: 0;
    font: inherit;
    cursor: pointer;
}

.auth-password-prompt {
    display: grid;
    gap: 18px;
}

.search-input {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0px !important;
}

.otp-input {
    position: relative;
    display: grid;
    gap: 12px;
}

.otp-input__autofill {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    border: 0;
    padding: 0;
    margin: 0;
    pointer-events: none;
}

.otp-input__cells {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.otp-input__cell {
    width: 52px;
    height: 58px;
    border-radius: 16px;
    border: 1px solid rgba(214, 180, 165, 0.55);
    background: #fffdfb;
    text-align: center;
    font: inherit;
    font-size: 1.35rem;
    font-weight: 700;
    color: #2f241f;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

    .otp-input__cell:focus {
        outline: none;
        border-color: #d78f77;
        box-shadow: 0 0 0 3px rgba(215, 143, 119, 0.18);
        transform: translateY(-1px);
    }

@media (max-width: 480px) {
    .otp-input__cells {
        gap: 8px;
    }

    .otp-input__cell {
        width: 46px;
        height: 52px;
        border-radius: 14px;
        font-size: 1.2rem;
    }
}

@media (max-width: 900px) {
    .auth-experience {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .auth-showcase,
    .auth-panel {
        padding: 22px;
        border-radius: 24px;
    }
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    max-width: 100%;
    margin: 0;
    overflow-x: hidden;
    scroll-behavior: smooth;
}

@font-face {
    font-family: "Vazirmatn";
    src: url("/fonts/Vazirmatn[wght].woff2") format("woff2-variations");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

body {
    color: var(--text);
    font-family: "Vazirmatn", "IRANSansX", "IRANSans", Tahoma, "Segoe UI", sans-serif;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: #ffffff;
}

a {
    color: inherit;
    text-decoration: none;
    overflow-wrap: anywhere;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

button, .button,
input,
textarea,
select {
    font: inherit;
}

    input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]),
    textarea,
    select,
    .input,
    .input-like {
        width: 100%;
        max-width: 100%;
        border: 1px solid rgba(162, 183, 207, 0.22);
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 249, 253, 0.98));
        color: var(--text);
        border-radius: 22px;
        padding: 0.95rem 1.1rem;
        box-shadow: 0 10px 24px rgba(80, 104, 129, 0.06);
        transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
    }

        input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):focus,
        textarea:focus,
        select:focus,
        .input:focus,
        .input-like:focus {
            outline: none;
            border-color: rgba(133, 169, 208, 0.52);
            box-shadow: 0 0 0 4px rgba(227, 236, 246, 0.95), 0 16px 32px rgba(91, 120, 149, 0.1);
        }

        input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"])::placeholder,
        textarea::placeholder,
        .input-like::placeholder,
        .input::placeholder {
            color: rgba(109, 102, 92, 0.72);
        }

button {
    border: 0;
    background: none;
    cursor: pointer;
}

main {
    width: 100%;
    max-width: 100%;
    /*padding: 2rem 0 4rem;*/
    background: #ffffff;
}

.layout-shell {
    min-height: 100vh;
    width: 100%;
    max-width: 100%;
    background: #ffffff;
}

.page-shell {
    width: 100%;
    max-width: var(--container);
    margin: 0 auto;
    padding-inline: var(--space-2);
}

    .page-shell.narrow {
        max-width: 520px;
    }

.breadcrumb-nav {
    width: 100%;
    max-width: var(--container);
    min-width: 0;
    overflow: hidden;
}

.breadcrumb-scroll {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.breadcrumb-list {
    margin: 0;
    padding: 0.65rem 0.9rem;
    list-style: none;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.5rem;
    white-space: nowrap;
    width: max-content;
    min-width: 100%;
    max-width: none;
    border-radius: 999px;
    background: #ffffff;
}

.breadcrumb-item {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    color: #c4c4c4;
}

    .breadcrumb-item::before {
        content: "/";
        margin-inline: 0.5rem;
        color: #c4c4c4;
    }

    .breadcrumb-item:first-child::before {
        content: none;
    }

    .breadcrumb-item a {
        color: #c4c4c4;
    }

    .breadcrumb-item a,
    .breadcrumb-item span {
        display: block;
        max-width: 100%;
    }

    .breadcrumb-item.is-active {
        color: var(--text-muted);
        font-weight: 600;
    }

.site-header {
    z-index: 30;
    width: 100%;
    max-width: 100%;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(34, 32, 28, 0.06);
}

@media (min-width: 781px) {
    .layout-shell {
        padding-top: var(--desktop-header-height);
    }

    .site-header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1200;
    }
}

@media (max-width: 780px) {
    .layout-shell {
        padding-top: 0;
    }

    .site-header {
        position: static;
    }
}

.site-header__top,
.site-header__nav,
.section-heading,
.store-card__footer,
.product-actions,
.product-price,
.variant-group__header,
.header-actions,
.site-auth,
.store-card__meta {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.site-header__top,
.site-header__nav {
    width: 100%;
    max-width: 100%;
    justify-content: space-between;
    padding: 1rem 0;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
    flex-shrink: 1;
}

.brand__mark {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--yellow) 0%, var(--yellow-soft) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    font-weight: 800;
}

.brand__logo {
    width: 60px;
    height: 60px;
    object-fit: cover;
    flex: 0 0 auto;
    position: absolute;
    top: 0;
}

.brand__logo_mobile {
    width: 60px;
    height: 60px;
    border-radius: 16px;
    object-fit: cover;
    flex: 0 0 auto;
}

.brand__text {
    display: grid;
    gap: 0.15rem;
    min-width: 70px;
}

    .brand__text small,
    .section-kicker,
    .store-card__description,
    .field-label,
    .catalog-filters__heading p,
    .hero-campaign span,
    .empty-state p,
    .catalog-hero p,
    .review-card p,
    .site-footer span,
    .site-footer p,
    .selection-summary span {
        color: var(--text-muted);
    }

.search-form {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    max-width: 540px;
    height: 36px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
    padding: 0 0.7rem;
    background: #ffffff;
    border-radius: 999px;
}

    .search-form input {
        min-width: 0;
        height: 100%;
        border: 0;
        padding: 0;
        background: transparent;
    }

    .search-form button,
    .nav-button,
    .button-primary,
    .button-muted,
    .button-ghost,
    .button-secondary {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.55rem;
        max-width: 100%;
        border-radius: 999px;
        padding: 0.82rem 1.2rem;
        transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    }

    .search-form button,
    .button-primary {
        background: #e4eeff;
        color: #292828;
    }

.button-primary--small {
    padding: 0.65rem 1rem;
}

.nav-button,
.button-muted,
.button-secondary {
    background: #ffffff;
    color: var(--text);
    border: 1px solid var(--line);
}

.button-ghost {
    padding-inline: 0;
    color: var(--text);
}

.header-actions a,
.nav-link--subtle,
.site-nav a {
    color: var(--text-muted);
}

.header-actions {
    flex-wrap: wrap;
}

    .header-actions a {
        width: 44px;
        height: 44px;
        flex: 0 0 auto;
        border-radius: 14px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: #ffffff;
        border: 1px solid rgba(34, 32, 28, 0.06);
    }

.site-nav {
    display: flex;
    align-items: center;
    gap: 1.4rem;
    flex-wrap: wrap;
    min-width: 0;
}

.site-auth {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.surface,
.surface-panel,
.store-card,
.catalog-toolbar,
.catalog-hero,
.hero-banner__aside,
.review-card,
.empty-state {
    background: #ffffff;
    border: 1px solid rgba(34, 32, 28, 0.08);
    box-shadow: var(--shadow);
    border-radius: var(--radius-lg);
    max-width: 100%;
    padding: 0px 25px 0px;
}

.hero-banner,
.catalog-layout {
    display: flex;
    align-items: stretch;
    gap: var(--space-3);
    width: 100%;
    max-width: 100%;
}

.hero-banner {
    justify-content: space-between;
    margin-top: var(--space-2);
    padding: var(--space-3);
}

.hero-banner__content {
    flex: 1 1 0;
    min-width: 0;
    padding: 1.4rem;
    border-radius: calc(var(--radius-lg) - 8px);
    background: linear-gradient(135deg, rgba(227, 236, 246, 0.92), rgba(243, 248, 254, 0.96)), linear-gradient(180deg, rgba(255, 255, 255, 0.7), transparent);
    background-color: var(--surface-soft);
}

    .hero-banner__content h1,
    .catalog-hero h1,
    .product-summary h1,
    .section-heading h2,
    .empty-state h1,
    .empty-state h2 {
        margin: 0.4rem 0 0.8rem;
        line-height: 1.08;
    }

    .hero-banner__content h1 {
        font-size: clamp(2.2rem, 5vw, 4.4rem);
        max-width: 12ch;
    }

    .hero-banner__content p,
    .catalog-hero p,
    .product-summary p,
    .section-heading p,
    .store-card__description {
        max-width: 100%;
        line-height: 1.75;
        overflow-wrap: anywhere;
    }

.hero-banner__actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.hero-banner__aside {
    width: 100%;
    max-width: 360px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.4rem;
}

.hero-banner__aside-label {
    margin: 0;
    font-size: 0.92rem;
    letter-spacing: 0.04em;
}

.hero-campaigns,
.stack,
.form-stack,
.variant-list,
.review-list,
.field-stack,
.catalog-filters__form,
.store-section,
.stack-lg,
.catalog-results {
    display: grid;
}

.hero-campaign {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid rgba(34, 32, 28, 0.06);
    max-width: 100%;
}

.catalog-layout {
    align-items: flex-start;
}

.catalog-filters {
    position: sticky;
    top: 120px;
    flex: 0 1 320px;
    width: 100%;
    max-width: 320px;
    padding: var(--space-3);
}

.catalog-filters__trigger,
.catalog-filters__close,
.catalog-filters__mobile-backdrop {
    display: none;
}

.catalog-filters__desktop,
.catalog-filters__mobile-shell,
.catalog-filters__content {
    display: grid;
    gap: var(--space-2);
    min-width: 0;
    width: 100%;
    max-width: 100%;
}

.catalog-filters__header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: var(--space-2);
}

.catalog-filters__close {
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #ffffff;
}

.catalog-results {
    flex: 1 1 0;
    min-width: 0;
}

.catalog-toolbar,
.catalog-hero,
.catalog-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    width: 100%;
    max-width: 100%;
    padding: var(--space-1);
    margin-bottom: 15px;
}

.catalog-hero__meta {
    display: grid;
    gap: 0.45rem;
    justify-items: end;
    min-width: 0;
}

.catalog-page-header {
    margin-top: 0.75rem;
    padding: 1rem 1.25rem;
    align-items: flex-start;
}

    .catalog-page-header h1 {
        margin: 0;
    }

    .catalog-page-header p {
        margin: 0.45rem 0 0;
        max-width: 70ch;
    }

.field-inline {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    min-width: 0;
    max-width: 100%;
}

    .field-inline select {
        min-width: 0;
    }

.filter-group {
    margin: 0;
    padding: 0;
    border: 0;
    display: grid;
    gap: 0.6rem;
}

    .filter-group legend {
        margin-bottom: 0.55rem;
        font-weight: 700;
    }

.choice-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    cursor: pointer;
}

.catalog-filters .choice-row input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    margin: 0;
    flex: 0 0 auto;
    border: 1.5px solid rgba(34, 32, 28, 0.18);
    border-radius: 6px;
    background: #ffffff;
    display: inline-grid;
    place-content: center;
    transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

    .catalog-filters .choice-row input[type="checkbox"]::after {
        content: "";
        width: 0.45rem;
        height: 0.7rem;
        border: solid #ffffff;
        border-width: 0 2px 2px 0;
        transform: rotate(45deg) scale(0);
        margin-top: -0.12rem;
        transition: transform 0.15s ease;
    }

    .catalog-filters .choice-row input[type="checkbox"]:checked {
        background: #111111;
        border-color: #111111;
    }

        .catalog-filters .choice-row input[type="checkbox"]:checked::after {
            transform: rotate(45deg) scale(1);
        }

    .catalog-filters .choice-row input[type="checkbox"]:focus-visible {
        outline: 2px solid rgba(17, 17, 17, 0.18);
        outline-offset: 2px;
    }

.price-range-filter__values {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    color: var(--text-muted);
    font-size: 0.9rem;
}

.price-range-filter__sliders {
    display: grid;
    gap: 0.65rem;
}

.price-range-filter__range {
    width: 100%;
    margin: 0;
    accent-color: #111111;
    cursor: pointer;
}

.catalog-filters__actions {
    display: flex;
    gap: var(--space-1);
    flex-wrap: wrap;
}

.store-grid,
.card-grid,
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr));
    gap: var(--space-2);
    width: 100%;
    max-width: 100%;
}

.store-grid {
    grid-template-columns: repeat(auto-fill, 300px);
    justify-content: center;
    align-items: start;
    gap: 1.5rem;
}

.store-card,
.product-card,
.category-card {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.store-card {
    grid-column: auto;
    min-width: 0;
    overflow: visible;
    width: 300px;
    height: auto;
    gap: 0.85rem;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.store-card__media {
    position: relative;
    width: 300px;
    aspect-ratio: 9 / 16;
    max-height: 450px;
    height: min(450px, calc(300px * 16 / 9));
    border-radius: 32px;
    background: #f3f6fa;
    overflow: hidden;
    margin-inline: 0;
}

.store-card__badge {
    position: absolute;
    top: 0.75rem;
    inset-inline-start: 0.75rem;
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.65rem;
    border-radius: 999px;
    background: #c32652;
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 700;
}

.store-card__media img,
.product-gallery__slide img,
.product-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.store-card__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 0.75rem;
    padding: 0.2rem 0.15rem 0;
    min-width: 0;
    height: auto;
}

.store-chip {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    background: rgba(34, 32, 28, 0.06);
    font-size: 0.86rem;
}

.store-chip--accent {
    background: rgba(227, 236, 246, 0.72);
}

.store-card__meta {
    min-width: 0;
    flex-wrap: wrap;
}

.store-card__title {
    font-size: 1.06rem;
    font-weight: 600;
    overflow-wrap: anywhere;
    line-height: 1.75;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    /*min-height: calc(1.75em * 2);*/
}

.store-card__description {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.75em * 2);
}

.store-card__footer,
.section-heading,
.product-price,
.variant-group__header {
    justify-content: space-between;
}

.store-card__footer,
.section-heading,
.product-actions,
.product-price,
.variant-group__header {
    flex-wrap: wrap;
}

    .store-card__footer strong,
    .product-price strong {
        font-size: 1.2rem;
        font-weight: 700;
    }

.store-price {
    display: grid;
    gap: 0.25rem;
}

.store-price__original {
    color: var(--text-muted);
    font-size: 0.9rem;
    text-decoration: line-through;
}

.store-card__footer {
    margin-top: auto;
}

.store-stock-status,
.product-stock-status {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    font-size: 0.9rem;
    font-weight: 700;
}

.store-stock-status--out,
.product-stock-status--out {
    background: #fff1f1;
    color: #b42323;
    border: 1px solid rgba(180, 35, 35, 0.2);
}

.product-stock-status--in {
    background: #eef9f1;
    color: #1f6b43;
    border: 1px solid rgba(31, 107, 67, 0.16);
}

.product-stock-status--neutral {
    color: #6d665c;
    border: 1px solid rgba(34, 32, 28, 0.08);
}

.store-card__actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.store-section {
    margin-top: var(--space-4);
}

.section-kicker {
    font-size: 0.84rem;
    letter-spacing: 0.08em;
}

.product-detail {
    width: 100%;
    max-width: 100%;
}

.product-detail__top {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: start;
    gap: var(--space-3);
    width: 100%;
    max-width: 100%;
}

.product-gallery,
.product-summary {
    width: 100%;
    max-width: 100%;
    padding: var(--space-3);
}

.product-gallery {
    display: grid;
    gap: var(--space-2);
    min-width: 0;
    overflow: hidden;
}

.product-summary {
    display: grid;
    gap: var(--space-3);
    min-width: 0;
    align-content: start;
}

.product-gallery__viewport {
    width: 100%;
    aspect-ratio: 1 / 1;
    /* make viewport the sole native scroll container */
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    border-radius: 24px;
    /* simple native scroll snapping */
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

    .product-gallery__viewport::-webkit-scrollbar {
        display: none;
    }

.product-gallery__rail {
    /* rail is a simple flex container inside the viewport */
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
}

.product-gallery__slide {
    min-width: 0;
    flex: 0 0 100%;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    scroll-snap-align: start;
}

.product-gallery__zoom-trigger {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    appearance: none;
    box-shadow: none;
    cursor: zoom-in;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-drag: none;
    user-select: none;
}

.product-gallery__slide img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    -webkit-user-drag: none;
    user-select: none;
}

.product-gallery.surface-panel {
    width: 100%;
    max-width: 700px;
    margin-inline: auto;
    padding: 0;
    border: 0;
    box-shadow: none;
}

    .product-gallery.surface-panel .product-gallery__viewport,
    .product-gallery.surface-panel .product-gallery__slide {
        aspect-ratio: 9 / 16;
        contain: paint;
    }

        .product-gallery.surface-panel .product-gallery__slide img {
            object-fit: contain;
        }

@media (min-width: 781px) {
    .product-detail__top {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
        align-items: stretch;
    }

    .product-gallery.surface-panel {
        max-width: none;
        margin-inline: 0;
        max-height: 700px;
        height: 700px;
    }

    .product-summary.surface-panel {
        height: 700px;
        overflow: auto;
    }

    .product-gallery.surface-panel .product-gallery__viewport,
    .product-gallery.surface-panel .product-gallery__slide {
        height: 100%;
        max-height: 100%;
        aspect-ratio: 9 / 16;
    }
}

.product-gallery__thumbs,
.review-gallery-modal__thumbs {
    display: flex;
    gap: 0.75rem;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 0.35rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(34, 32, 28, 0.18) transparent;
    scroll-behavior: smooth;
}

    .product-gallery__thumbs::-webkit-scrollbar,
    .review-gallery-modal__thumbs::-webkit-scrollbar,
    .product-gallery-modal::-webkit-scrollbar {
        height: 8px;
        width: 8px;
    }

    .product-gallery__thumbs::-webkit-scrollbar-track,
    .review-gallery-modal__thumbs::-webkit-scrollbar-track,
    .product-gallery-modal::-webkit-scrollbar-track {
        background: transparent;
    }

    .product-gallery__thumbs::-webkit-scrollbar-thumb,
    .review-gallery-modal__thumbs::-webkit-scrollbar-thumb,
    .product-gallery-modal::-webkit-scrollbar-thumb {
        background: rgba(34, 32, 28, 0.16);
        border-radius: 999px;
    }

.product-thumb {
    flex: 0 0 84px;
    width: 84px;
    aspect-ratio: 1;
    padding: 0;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(34, 32, 28, 0.08);
    background: rgba(255, 255, 255, 0.96);
}

    .product-thumb.is-active {
        border-color: rgba(152, 186, 224, 0.95);
        box-shadow: 0 0 0 3px rgba(227, 236, 246, 0.95);
    }

.product-detail-section,
.review-list,
.review-card,
.review-form,
.product-spec-list,
.product-description-html {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.product-detail-section {
    display: grid;
    gap: var(--space-2);
    padding: var(--space-3);
    min-width: 0;
}

.product-attributes {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    width: 100%;
    min-width: 0;
}

.variant-group.is-required {
    padding: 1rem;
    border: 1px solid rgba(200, 40, 82, 0.24);
    border-radius: 24px;
    background: rgba(200, 40, 82, 0.05);
}

.variant-group__message {
    margin: 0;
    color: #c82852;
}

.product-section-nav {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    max-width: 100%;
    padding: 0.9rem 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}

.product-section-nav__link {
    min-height: 42px;
    padding: 0.65rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: #ffffff;
    color: var(--text);
    white-space: nowrap;
}

.product-mobile-cartbar,
.product-floating-cart {
    width: min(360px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
}

.product-mobile-cartbar {
    display: none;
}

.product-mobile-cartbar__meta,
.product-floating-cart__meta {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

    .product-mobile-cartbar__meta span,
    .product-floating-cart__meta span {
        color: var(--text-muted);
    }

.product-floating-cart {
    position: fixed;
    inset-inline-end: 1.25rem;
    bottom: 1.25rem;
    z-index: 35;
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
}

.variant-group {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 0.8rem 1rem;
    min-width: 0;
}

    .variant-group.is-disabled {
        opacity: 0.72;
    }

.variant-group__header {
    flex: 0 0 auto;
    min-width: min(100%, 11rem);
    padding-top: 0.2rem;
}

.variant-options {
    display: flex;
    flex-wrap: wrap;
    flex: 1 1 18rem;
    gap: 0.7rem;
    min-width: 0;
    max-width: 100%;
}

.variant-group__message {
    flex: 1 0 100%;
}

.variant-option {
    max-width: 100%;
    padding: 0.8rem 1rem;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid var(--line);
    overflow-wrap: anywhere;
}

    .variant-option.is-active {
        background: rgba(227, 236, 246, 0.62);
        border-color: rgba(138, 174, 214, 0.72);
        box-shadow: 0 0 0 3px rgba(138, 174, 214, 0.2);
    }

    .variant-option.is-disabled,
    .variant-option:disabled {
        opacity: 0.45;
        cursor: not-allowed;
        background: rgba(34, 32, 28, 0.04);
        color: var(--text-muted);
    }

.selection-summary {
    display: grid;
    gap: 0.2rem;
    padding: var(--space-2);
    border-radius: 20px;
    background: #ffffff;
}

.product-loading-state {
    display: grid;
    gap: 1rem;
    justify-items: center;
    text-align: center;
    padding: 2rem 1.5rem;
    margin-top: 1rem;
}

.product-loading-state__logo {
    width: 88px;
    height: 88px;
    object-fit: cover;
    border-radius: 24px;
    box-shadow: 0 18px 36px rgba(34, 32, 28, 0.12);
}

.selection-summary.is-selected {
    border: 1px solid rgba(138, 174, 214, 0.72);
    box-shadow: 0 0 0 3px rgba(138, 174, 214, 0.18);
}

.selection-summary.is-unavailable {
    border: 1px solid rgba(180, 35, 35, 0.16);
    background: #fff6f6;
}

.product-actions {
    flex-wrap: wrap;
    align-items: stretch;
}

.product-share-button {
    width: 48px;
    height: 48px;
    padding: 0;
    border-radius: 16px;
}

.product-share-toast {
    position: fixed;
    inset-inline-start: 50%;
    bottom: 1.5rem;
    transform: translateX(-50%);
    width: min(24rem, calc(100vw - 2rem));
    padding: 0.9rem 1rem;
    border-radius: 999px;
    background: rgba(34, 32, 28, 0.92);
    color: #fff;
    text-align: center;
    z-index: 1200;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22);
}

.toast-host {
    position: fixed;
    inset-inline-start: 50%;
    bottom: 1.5rem;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    width: min(28rem, calc(100vw - 2rem));
    z-index: 1300;
    pointer-events: none;
}

.toast {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
    border-radius: 1rem;
    color: #fff;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22);
    pointer-events: auto;
}

    .toast span {
        flex: 1;
        text-align: start;
        line-height: 1.5;
    }

.toast--success {
    background: rgba(22, 101, 52, 0.95);
}

.toast--warning {
    background: rgba(146, 64, 14, 0.95);
}

.toast--error {
    background: rgba(153, 27, 27, 0.95);
}

.toast__dismiss {
    width: 2rem;
    height: 2rem;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    color: inherit;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
}

.store-grid--compact .store-card {
    grid-column: span 3;
}

.store-grid--compact .store-card__body {
    gap: var(--space-1);
}

.store-grid--compact .store-card__title {
    font-size: 1rem;
}

.review-form textarea {
    min-height: 120px;
}

.surface-panel.review-form input[type="file"],
.review-form input[type="file"] {
    width: 100%;
    min-height: 3.25rem;
    border: 1px dashed rgba(133, 169, 208, 0.58);
    border-radius: 22px;
    padding: 0.7rem 0.85rem;
    background: linear-gradient(180deg, rgba(242, 247, 252, 0.95), rgba(255, 255, 255, 0.96));
    box-shadow: 0 10px 24px rgba(80, 104, 129, 0.06);
    color: #4d6782;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

    .surface-panel.review-form input[type="file"]:hover,
    .surface-panel.review-form input[type="file"]:focus,
    .review-form input[type="file"]:hover,
    .review-form input[type="file"]:focus {
        outline: none;
        border-color: rgba(117, 159, 202, 0.92);
        box-shadow: 0 0 0 4px rgba(227, 236, 246, 0.95), 0 14px 28px rgba(80, 104, 129, 0.1);
    }

    .surface-panel.review-form input[type="file"]::file-selector-button,
    .review-form input[type="file"]::file-selector-button {
        border: 0;
        border-radius: 999px;
        padding: 0.45rem 0.9rem;
        margin-inline-end: 0.75rem;
        background: rgba(227, 236, 246, 0.95);
        color: #3f5f82;
        font-weight: 700;
        cursor: pointer;
        transition: background-color 0.2s ease;
    }

        .surface-panel.review-form input[type="file"]::file-selector-button:hover,
        .review-form input[type="file"]::file-selector-button:hover {
            background: rgba(210, 226, 243, 1);
        }

.catalog-pagination {
    display: grid;
    gap: 0.85rem;
    width: 100%;
    max-width: 100%;
    margin-top: 1.25rem;
}

.catalog-pagination__summary {
    margin: 0;
    text-align: center;
    color: var(--text-muted);
    font-size: 0.92rem;
}

.catalog-pagination__count {
    margin-inline-start: 0.35rem;
}

.catalog-pagination__controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    flex-wrap: wrap;
}

.catalog-pagination__pages {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.4rem;
    max-width: 100%;
}

.catalog-pagination__nav,
.catalog-pagination__link {
    min-width: 44px;
    height: 44px;
    padding: 0 0.95rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border: 1px solid var(--line);
    color: inherit;
}

    .catalog-pagination__nav.is-disabled {
        opacity: 0.35;
        pointer-events: none;
    }

    .catalog-pagination__link.is-active {
        background: var(--text);
        color: #fff;
        border-color: var(--text);
    }

.catalog-pagination__ellipsis {
    min-width: 1.5rem;
    text-align: center;
    color: var(--text-muted);
}

.empty-state,
.loading-panel {
    padding: 2rem;
    text-align: center;
}

.site-footer {
    width: 100%;
    max-width: 100%;
    margin-top: 3rem;
    padding: 2rem 0 0;
    background: #ffffff;
    border-top: 1px solid rgba(34, 32, 28, 0.06);
}

.site-footer__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    width: 100%;
    max-width: 100%;
}

    .site-footer__grid > div {
        display: grid;
        gap: 0.5rem;
        min-width: 0;
    }

.site-footer__copyright {
    margin: 1.75rem 0 0;
    text-align: center;
    color: var(--text-muted);
    line-height: 1.9;
}

    .site-footer__copyright a {
        color: var(--text);
        font-weight: 700;
        text-decoration: underline;
        text-underline-offset: 0.2rem;
    }

.select-card,
.inline-actions,
.row-between,
.summary-bar {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.summary-bar,
.row-between {
    justify-content: space-between;
}

.stack-block {
    min-width: 0;
    padding: 1rem 0;
    border-bottom: 1px solid var(--line);
}

.status-text {
    color: #9a6700;
    font-weight: 700;
}

#blazor-error-ui {
    background: #eaf2fb;
    bottom: 0;
    display: none;
    left: 0;
    padding: 0.75rem 1rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

@media (hover: hover) {
    .button-primary:hover,
    .button-muted:hover,
    .button-ghost:hover,
    .search-form button:hover,
    .nav-button:hover {
        transform: translateY(-2px);
    }

    .store-card:hover {
        transform: translateY(-1px);
    }

    .store-card__media img,
    .product-gallery__slide img {
        transition: transform 0.35s ease;
    }

    .store-card:hover .store-card__media img,
    .product-gallery__viewport:hover img {
        transform: scale(1.02);
    }
}

@media (max-width: 1100px) {
    .store-grid {
        grid-template-columns: repeat(auto-fill, minmax(260px, 300px));
    }

    .store-grid--compact .store-card {
        grid-column: span 4;
    }

    .catalog-layout,
    .hero-banner {
        flex-direction: column;
    }

    .product-detail__top {
        grid-template-columns: 1fr;
    }

    .catalog-filters {
        position: static;
        max-width: 100%;
    }

    .hero-banner__aside {
        max-width: 100%;
    }
}

@media (max-width: 780px) {
    main {
        padding-top: 1rem;
    }

    .product-detail {
        padding-bottom: 8.75rem;
    }

    .site-header__top,
    .site-header__nav,
    .catalog-toolbar,
    .catalog-hero,
    .section-heading,
    .site-footer__grid {
        display: grid;
        gap: 1rem;
    }

    .search-form {
        max-width: none;
    }

    .store-card,
    .product-card,
    .category-card {
        grid-column: span 6;
    }

    .store-grid--compact .store-card {
        grid-column: span 6;
    }

    .product-gallery__thumbs {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .product-mobile-cartbar {
        position: fixed;
        right: 0.75rem;
        bottom: 6.15rem;
        left: 0.75rem;
        z-index: 41;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 0.75rem;
        width: auto;
        max-width: none;
        padding: 0.75rem 0.9rem;
        border: 1px solid rgba(34, 32, 28, 0.08);
        border-radius: 24px;
        background: rgba(255, 255, 255, 0.98);
        box-shadow: 0 18px 36px rgba(34, 32, 28, 0.14);
        backdrop-filter: blur(18px);
    }

        .product-mobile-cartbar .button-primary {
            white-space: nowrap;
        }

    .site-footer__grid {
        grid-template-columns: 1fr;
    }

    .hero-banner__content h1 {
        font-size: 2.6rem;
    }
}

@media (max-width: 520px) {
    .breadcrumb-nav {
        padding-inline: 12px;
    }

    .breadcrumb-list {
        gap: 0.4rem;
        padding: 0.55rem 0.8rem;
        font-size: 0.88rem;
    }

    .breadcrumb-item::before {
        margin-inline: 0.4rem;
    }

    .page-shell {
        padding-inline: 12px;
    }

    .hero-banner,
    .catalog-toolbar,
    .catalog-hero,
    .product-gallery,
    .product-summary,
    .empty-state,
    .loading-panel {
        padding: var(--space-2);
    }


    .search-form {
        grid-template-columns: 1fr;
        border-radius: 24px;
        padding: 0.75rem;
    }

        .search-form i {
            display: none;
        }

        .search-form button {
            width: 100%;
        }

    .product-detail__top,
    .product-gallery,
    .product-summary,
    .product-actions,
    .variant-group,
    .variant-options,
    .product-price-card,
    .product-detail-section,
    .review-form {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .product-summary {
        padding: var(--space-2);
        gap: var(--space-2);
    }

    .product-detail {
        padding-bottom: 8.75rem;
    }

    .product-detail__top {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .product-gallery__viewport {
        border-radius: 20px;
    }

    .product-actions {
        flex-direction: column;
        align-items: stretch;
    }

        .product-actions > :not(.product-share-button) {
            width: 100%;
        }

    .product-share-button {
        align-self: flex-start;
    }

    .product-gallery-modal {
        width: calc(100vw - 0.75rem);
        max-height: calc(100vh - 0.75rem);
        gap: 0.75rem;
        padding: 0.75rem;
        border-radius: 22px;
    }

    .product-gallery {
        padding: 0.85rem;
        gap: 0.85rem;
    }

    .product-gallery__viewport {
        border-radius: 18px;
    }

    .product-gallery__thumbs {
        gap: 0.55rem;
        padding-bottom: 0.2rem;
    }

    .product-thumb {
        flex-basis: 64px;
        width: 64px;
        border-radius: 14px;
    }

    .product-gallery-modal__tabs {
        gap: 0.45rem;
    }

    .product-gallery-modal__tab {
        min-width: auto;
        padding: 0.55rem 0.85rem;
        font-size: 0.92rem;
    }

    .product-gallery-modal__frame {
        min-height: min(56vh, 22rem);
        padding: 0.65rem;
        border-radius: 18px;
    }

        .product-gallery-modal__frame img {
            max-height: min(51vh, 20rem);
        }

    .product-gallery-modal__nav {
        width: 2.5rem;
        height: 2.5rem;
        top: auto;
        bottom: 0.75rem;
        transform: none;
    }

    .product-gallery-modal__nav--next {
        right: 0.75rem;
    }

    .product-gallery-modal__nav--prev {
        left: 0.75rem;
    }

    .product-gallery-modal__close {
        width: 2.5rem;
        height: 2.5rem;
    }

    .product-price-card__row,
    .variant-group__header {
        align-items: flex-start;
    }

    .product-section-nav {
        gap: 0.6rem;
        padding: 0.75rem;
    }

    .product-mobile-cartbar {
        position: fixed;
        right: 0.75rem;
        bottom: 6.15rem;
        left: 0.75rem;
        z-index: 41;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 0.75rem;
        width: auto;
        max-width: none;
        padding: 0.75rem 0.9rem;
        border: 1px solid rgba(34, 32, 28, 0.08);
        border-radius: 24px;
        background: rgba(255, 255, 255, 0.98);
        box-shadow: 0 18px 36px rgba(34, 32, 28, 0.14);
        backdrop-filter: blur(18px);
    }

        .product-mobile-cartbar .button-primary {
            white-space: nowrap;
        }

    .store-grid,
    .card-grid,
    .stats-grid {
        gap: 12px;
    }

    .store-card {
        width: min(300px, 100%);
        justify-self: center;
    }

    .store-card__media,
    .store-section--showcase .store-card__media {
        width: 100%;
        height: auto;
    }

    .store-grid {
        grid-template-columns: minmax(0, 300px);
        justify-content: center;
    }

    .store-card__body {
        padding: 0.2rem 0.2rem 0;
        gap: 0.65rem;
    }

    .store-card__footer .button-ghost {
        min-height: 44px;
    }

    .product-spec-row {
        grid-template-columns: 1fr;
        gap: var(--space-1);
    }

        .product-spec-row span {
            text-align: right;
        }

    .product-tabs__nav {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .product-tabs__button {
        padding-inline: 12px;
    }
}

.desktop-navbar,
.desktop-navbar__actions,
.mobile-topbar,
.auth-card,
.auth-card__intro,
.user-menu__dropdown,
.mobile-bottom-nav,
.mobile-bottom-nav__link,
.mobile-search-shortcut {
    display: flex;
    align-items: center;
}

.nav-shell {
    height: 50px;
    padding-block: 0;
    display: flex;
    align-items: center;
}

.desktop-navbar {
    height: var(--desktop-header-height);
    width: 100%;
    gap: 0.75rem;
    align-items: center;
}

.desktop-navbar__search {
    flex: 1 1 auto;
    max-width: none;
}

.desktop-navbar__actions {
    gap: 0.45rem;
    margin-inline-start: auto;
    height: 100%;
}

.icon-button {
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(34, 32, 28, 0.08);
    background: #ffffff;
    color: var(--text);
    box-shadow: 0 10px 24px rgba(34, 32, 28, 0.05);
}

    .icon-button i,
    .mobile-bottom-nav__link i,
    .mobile-search-shortcut i {
        font-size: 1.05rem;
    }

.auth-link {
    white-space: nowrap;
}

.user-menu {
    position: relative;
}

.user-menu__trigger {
    cursor: pointer;
}

.user-menu__dropdown {
    position: absolute;
    top: calc(100% + 0.55rem);
    left: auto;
    right: 0;
    min-width: 180px;
    max-width: min(280px, calc(100vw - 1rem));
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.25rem;
    padding: 0.5rem;
    border-radius: 18px;
    border: 1px solid rgba(34, 32, 28, 0.08);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 18px 40px rgba(34, 32, 28, 0.1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    pointer-events: none;
    transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
}

    .user-menu__dropdown::before {
        content: "";
        position: absolute;
        inset-inline: 0;
        top: -0.7rem;
        height: 0.8rem;
    }

.user-menu.is-open .user-menu__dropdown,
.user-menu:hover .user-menu__dropdown,
.user-menu:focus-within .user-menu__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.user-menu__dropdown a,
.user-menu__dropdown button {
    width: 100%;
    padding: 0.68rem 0.85rem;
    border-radius: 14px;
    text-align: right;
    color: var(--text);
}

    .user-menu__dropdown a:hover,
    .user-menu__dropdown button:hover {
        background: rgba(227, 236, 246, 0.75);
    }


@media (max-width: 960px) {
    .user-menu--desktop {
        display: none;
    }
}

.mobile-topbar,
.mobile-bottom-nav {
    display: none;
}

.brand--compact .brand__text {
    display: block;
}

.mobile-search-shortcut {
    gap: 0.65rem;
    padding: 0.95rem 1rem;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(227, 236, 246, 0.9), rgba(255, 255, 255, 0.98));
    border: 1px solid rgba(34, 32, 28, 0.06);
    color: var(--text-muted);
    width: 100%;
    justify-content: center;
}

.auth-page {
    margin-top: 1rem;
}

.auth-card {
    display: grid;
    gap: 1.25rem;
    padding: 1.5rem;
}

.auth-card__intro {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
}

    .auth-card__intro h1,
    .auth-card__intro p {
        margin: 0;
    }

.auth-card__submit {
    width: 100%;
}

.user-panel-shell {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.user-panel-main {
    min-width: 0;
}

.user-sidebar,
.user-summary-card,
.user-form-card,
.user-order-card,
.user-address-card,
.user-review-card {
    border-radius: 28px;
}

.user-sidebar {
    position: sticky;
    top: 110px;
    display: grid;
    gap: 1.25rem;
    padding: 1.35rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgb(221 238 255 / 92%));
}

.user-sidebar__intro {
    display: grid;
    gap: 0.45rem;
}

    .user-sidebar__intro p {
        margin: 0;
        color: var(--text-muted);
        line-height: 1.8;
    }

.user-sidebar__nav {
    display: grid;
    gap: 0.45rem;
}

    .user-sidebar__nav a {
        padding: 0.95rem 1rem;
        border-radius: 18px;
        color: var(--text-muted);
        transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
    }

        .user-sidebar__nav a.active,
        .user-sidebar__nav a:hover {
            background: rgb(228 238 255);
            color: var(--text-muted);
        }

.user-sidebar-mobile {
    display: none;
}

.user-sidebar-mobile__details {
    border: 1px solid rgba(34, 32, 28, 0.08);
    border-radius: 24px;
    background: #ffffff;
    box-shadow: var(--shadow);
}

    .user-sidebar-mobile__details summary {
        padding: 1rem 1.1rem;
        cursor: pointer;
        font-weight: 700;
    }

    .user-sidebar-mobile__details .user-sidebar__nav {
        padding: 0 1rem 1rem;
    }

.user-form-card {
    display: grid;
    gap: 1.1rem;
    padding: 1.5rem;
}

    .user-form-card h2,
    .user-review-card p,
    .user-address-card p {
        margin: 0;
    }

.user-form-grid,
.user-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

    .user-form-grid__wide,
    .user-summary-grid > div:last-child {
        grid-column: 1 / -1;
    }

    .user-form-grid input[type="file"] {
        width: 100%;
        min-height: 3.25rem;
        border: 1px dashed rgba(133, 169, 208, 0.58);
        border-radius: 22px;
        padding: 0.7rem 0.85rem;
        background: linear-gradient(180deg, rgba(242, 247, 252, 0.95), rgba(255, 255, 255, 0.96));
        box-shadow: 0 10px 24px rgba(80, 104, 129, 0.06);
        color: #4d6782;
        cursor: pointer;
        transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
        margin-bottom: 15px;
        margin-top: 15px;
    }

        .user-form-grid input[type="file"]:hover,
        .user-form-grid input[type="file"]:focus {
            outline: none;
            border-color: rgba(117, 159, 202, 0.92);
            box-shadow: 0 0 0 4px rgba(227, 236, 246, 0.95), 0 14px 28px rgba(80, 104, 129, 0.1);
        }

        .user-form-grid input[type="file"]::file-selector-button {
            border: 0;
            border-radius: 999px;
            padding: 0.45rem 0.9rem;
            margin-inline-end: 0.75rem;
            background: rgba(227, 236, 246, 0.95);
            color: #3f5f82;
            font-weight: 700;
            cursor: pointer;
            transition: background-color 0.2s ease;
        }

            .user-form-grid input[type="file"]::file-selector-button:hover {
                background: rgba(210, 226, 243, 1);
            }

.user-card-list {
    display: grid;
    gap: 1rem;
}

.user-order-card,
.user-address-card,
.user-review-card {
    display: grid;
    gap: 0.9rem;
    padding: 1.25rem;
}

.user-order-card {
    color: var(--text);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.user-order-card__meta,
.user-address-card__header,
.user-order-card__details {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.user-order-card__details {
    color: var(--text-muted);
}

.user-order-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.user-summary-card {
    padding: 1.35rem;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    background: rgba(34, 32, 28, 0.08);
    color: var(--text);
    font-size: 0.9rem;
}

.status-pill--success {
    background: rgba(30, 164, 103, 0.12);
    color: #158252;
}

.status-pill--danger {
    background: rgba(216, 67, 51, 0.12);
    color: #d84333;
}

.status-pill--info {
    background: rgba(34, 114, 255, 0.12);
    color: #2272ff;
}

.mobile-bottom-nav {
    position: fixed;
    right: 0.75rem;
    bottom: 0.75rem;
    left: 0.75rem;
    z-index: 40;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem;
    padding: 0.55rem;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(34, 32, 28, 0.08);
    border-radius: 28px;
    box-shadow: 0 18px 36px rgba(34, 32, 28, 0.14);
    backdrop-filter: blur(18px);
}

.mobile-bottom-nav__link {
    min-height: 56px;
    flex: 1 1 0;
    justify-content: center;
    border-radius: 22px;
    color: var(--text);
}

.mobile-bottom-nav__link--brand {
    flex: 1.15 1 0;
}

    .mobile-bottom-nav__link--brand .brand__mark {
        width: 48px;
        height: 48px;
    }

    .mobile-bottom-nav__link--brand .brand__logo {
        width: 44px;
        height: 44px;
        border-radius: 14px;
    }

.mobile-bottom-nav__link--wide {
    flex: 2 1 0;
}

@media (hover: hover) {
    .icon-button:hover,
    .mobile-bottom-nav__link:hover,
    .mobile-search-shortcut:hover,
    .user-order-card:hover,
    .user-sidebar__nav a:hover {
        transform: translateY(-2px);
    }
}

@media (max-width: 780px) {
    main {
        padding-bottom: 6.75rem;
    }

    .user-panel-shell {
        grid-template-columns: 1fr;
    }

    .user-sidebar {
        display: none;
    }

    .user-sidebar-mobile {
        display: block;
    }

    .user-form-grid,
    .user-summary-grid {
        grid-template-columns: 1fr;
    }

    .user-order-card__details,
    .user-address-card__header {
        flex-direction: column;
        align-items: flex-start;
    }

    .desktop-navbar {
        display: none;
    }

    .mobile-topbar,
    .mobile-bottom-nav {
        display: flex;
    }

    .mobile-topbar {
        flex-direction: column;
        gap: 0.85rem;
        align-items: stretch;
    }

    .site-footer {
        padding-bottom: 7rem;
    }
}

@media (max-width: 520px) {
    .user-form-card,
    .user-order-card,
    .user-address-card,
    .user-review-card,
    .user-summary-card {
        padding: 1rem;
    }
}

.product-price-card,
.purchase-summary,
.checkout-section,
.payment-card {
    padding: var(--space-3);
}

.product-price-card {
    display: grid;
    gap: 0.85rem;
    border-radius: 24px;
}

.product-price-card__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.product-price-card__row--final {
    padding-top: 0.85rem;
    border-top: 1px solid var(--line);
}

.purchase-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 1.5rem;
    align-items: start;
}

.purchase-main {
    min-width: 0;
}

.purchase-summary {
    position: sticky;
    top: 110px;
    display: grid;
    gap: 1.2rem;
}

    .purchase-summary h2,
    .checkout-section h2,
    .payment-card h2 {
        margin: 0;
    }

    .purchase-summary p,
    .checkout-section p,
    .payment-card p {
        margin: 0;
        color: var(--text-muted);
        line-height: 1.8;
    }

.purchase-summary__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-block: 0.15rem;
}

.purchase-summary__row--grand {
    padding-top: 0.9rem;
    border-top: 1px solid var(--line);
}

.order-discount-row,
.order-discount-amount {
    color: #158252;
}

.checkout-coupon {
    display: grid;
    gap: 0.85rem;
}

.purchase-summary__cta {
    width: 100%;
}

.cart-item-card {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem;
}

.cart-item-card__image {
    display: block;
    width: 100%;
    aspect-ratio: 1;
    border-radius: 20px;
    overflow: hidden;
    background: linear-gradient(135deg, #ecf4fc, #ffffff);
}

    .cart-item-card__image img,
    .order-item-card img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.cart-item-card__content {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.cart-item-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.cart-item-card__remove {
    color: #d84333;
}

.quantity-control {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #f7fbff;
}

    .quantity-control button {
        width: 34px;
        height: 34px;
        border-radius: 999px;
        border: 1px solid rgba(34, 32, 28, 0.08);
        background: #ffffff;
    }

    .quantity-control span {
        min-width: 24px;
        text-align: center;
        font-weight: 700;
    }

.address-selection-list,
.checkout-summary-items {
    display: grid;
    gap: 1rem;
}

.checkout-choice-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    padding: 1.15rem;
    border: 1px solid rgba(34, 32, 28, 0.08);
    border-radius: 22px;
    background: #f7fbff;
}

    .checkout-choice-card.is-selected {
        border-color: rgba(138, 174, 214, 0.74);
        background: rgba(227, 236, 246, 0.48);
    }

    .checkout-choice-card p {
        margin-top: 0.35rem;
    }

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1600;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(28, 27, 25, 0.52);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.modal-card {
    width: min(720px, 100%);
    max-height: min(88vh, 900px);
    overflow-y: auto;
    padding: 1.35rem;
    display: grid;
    gap: 1rem;
    position: relative;
    z-index: 1601;
}

.modal-card--compact {
    width: min(460px, 100%);
}

.payment-highlight {
    display: grid;
    gap: 0.3rem;
    padding: 1.1rem;
    border-radius: 20px;
    background: #f7fbff;
    border: 1px solid rgba(34, 32, 28, 0.08);
}

.checkout-section,
.payment-card {
    display: grid;
    gap: 1.2rem;
}

.order-item-card {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1rem 0;
    border-bottom: 1px solid var(--line);
}

    .order-item-card:last-child {
        border-bottom: 0;
    }

    .order-item-card img {
        aspect-ratio: 1;
        border-radius: 18px;
        overflow: hidden;
        background: linear-gradient(135deg, #ecf4fc, #ffffff);
    }

.order-item-card__content {
    display: grid;
    gap: 0.4rem;
    min-width: 0;
}

.payment-method-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.payment-method-card {
    display: grid;
    gap: 0.75rem;
    text-align: right;
    padding: 1.15rem;
    border: 1px solid rgba(34, 32, 28, 0.08);
    border-radius: 22px;
    background: radial-gradient(circle at top left, rgba(184, 207, 231, 0.32), transparent 48%), #f7fbff;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

    .payment-method-card input {
        display: none;
    }

    .payment-method-card.is-selected {
        border-color: rgba(138, 174, 214, 0.8);
        box-shadow: 0 18px 34px rgba(34, 32, 28, 0.08);
        transform: translateY(-2px);
    }

    .payment-method-card.is-disabled {
        opacity: 0.55;
        cursor: not-allowed;
    }

.payment-method-card__badge-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}

.payment-method-card__title {
    font-size: 1rem;
}

.payment-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.9rem;
}

.payment-summary-grid__item {
    display: grid;
    gap: 0.35rem;
    padding: 0.9rem;
    border-radius: 18px;
    background: #f7fbff;
    border: 1px solid rgba(34, 32, 28, 0.08);
}

    .payment-summary-grid__item span {
        color: var(--text-muted);
        font-size: 0.9rem;
    }

.payment-expiry-badge {
    display: grid;
    gap: 0.2rem;
    padding: 0.8rem 1rem;
    border-radius: 18px;
    background: rgba(138, 174, 214, 0.8);
    color: var(--text-muted);
}

.payment-flow-page .section-heading {
    margin-bottom: 0;
}

.payment-loading-state {
    justify-items: center;
    gap: 1rem;
}

.payment-loading-state__logo {
    width: 74px;
    height: 74px;
    border-radius: 22px;
    object-fit: cover;
    animation: medusePulse 1.8s ease-in-out infinite;
}

@keyframes medusePulse {
    0%, 100% {
        transform: scale(1);
        opacity: 0.8;
    }

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

.manual-transfer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}

.receipt-preview-card {
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(34, 32, 28, 0.08);
    background: #f7fbff;
}

    .receipt-preview-card img {
        display: block;
        width: 100%;
        max-height: 360px;
        object-fit: cover;
    }

.payment-result-card {
    display: grid;
    gap: 1.25rem;
}

.payment-result-card__header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.payment-result-card__status {
    padding: 0.8rem 1rem;
    border-radius: 999px;
    background: #e8eff7;
}

    .payment-result-card__status.is-success {
        background: #dff4e5;
        color: #13623a;
    }

    .payment-result-card__status.is-danger {
        background: #fde8e5;
        color: #9e2d1d;
    }

    .payment-result-card__status.is-info {
        background: #e6f1fb;
        color: #1d568e;
    }

    .payment-result-card__status.is-muted {
        background: #ece8df;
        color: #5b5549;
    }

.payment-log-list {
    display: grid;
    gap: 0.9rem;
}

.payment-log-item {
    padding: 1rem;
    border-radius: 18px;
    background: #f7fbff;
    border: 1px solid rgba(34, 32, 28, 0.08);
}

    .payment-log-item pre {
        margin: 0.75rem 0 0;
        white-space: pre-wrap;
        word-break: break-word;
        font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
        font-size: 0.85rem;
    }

@media (max-width: 900px) {
    .payment-summary-grid,
    .manual-transfer-grid,
    .payment-method-grid {
        grid-template-columns: 1fr;
    }
}

.invoice-page {
    display: grid;
    gap: 1.5rem;
    padding-block: 1.5rem 2rem;
}

.invoice-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.4rem;
}

.invoice-toolbar__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.invoice-preview {
    display: grid;
    gap: 1.5rem;
    padding: clamp(1rem, 3vw, 2rem);
}

.invoice-preview__header,
.invoice-preview__details {
    display: grid;
    gap: 1rem;
}

.invoice-preview__header {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--line);
}

.invoice-preview__brand {
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .invoice-preview__brand img {
        width: 72px;
        height: 72px;
        object-fit: cover;
        border-radius: 18px;
    }

    .invoice-preview__brand div,
    .invoice-preview__meta,
    .invoice-preview__panel,
    .pos-scan-summary {
        display: grid;
        gap: 0.45rem;
    }

.invoice-preview__details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.invoice-preview__panel {
    padding: 1rem;
    border-radius: 22px;
    background: rgba(15, 23, 42, 0.03);
}

.invoice-preview__table {
    overflow-x: auto;
}

    .invoice-preview__table table {
        width: 100%;
        border-collapse: collapse;
    }

    .invoice-preview__table th,
    .invoice-preview__table td {
        padding: 0.9rem 0.75rem;
        border-bottom: 1px solid var(--line);
        text-align: right;
    }

    .invoice-preview__table th {
        color: var(--text-muted);
        font-size: 0.92rem;
    }

.invoice-preview__summary {
    display: grid;
    gap: 0.75rem;
    justify-items: end;
}

    .invoice-preview__summary > div {
        width: min(100%, 320px);
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.85rem 1rem;
        border-radius: 18px;
        background: rgba(15, 23, 42, 0.03);
    }

.invoice-preview__summary-total {
    background: linear-gradient(135deg, #dde9f6, #f3f8fe) !important;
}

.invoice-preview__footer {
    display: grid;
    gap: 0.35rem;
    padding-top: 1rem;
    border-top: 1px solid var(--line);
    color: var(--text-muted);
}

.pos-scanner-video {
    width: 100%;
    min-height: 280px;
    border-radius: 1rem;
    background: #111;
    object-fit: cover;
}

.pos-cart-actions {
    align-items: end;
}

@media (max-width: 720px) {
    .invoice-toolbar,
    .invoice-preview__header,
    .invoice-preview__details {
        grid-template-columns: 1fr;
    }

    .invoice-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .invoice-preview__table thead {
        display: none;
    }

    .invoice-preview__table tr {
        display: grid;
        gap: 0.5rem;
        padding: 0.8rem 0;
        border-bottom: 1px solid var(--line);
    }

    .invoice-preview__table td {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        padding: 0;
        border-bottom: 0;
    }

        .invoice-preview__table td::before {
            content: attr(data-label);
            color: var(--text-muted);
            font-size: 0.9rem;
        }
}

@media print {
    .site-header,
    .site-footer,
    .accounting-hub,
    .invoice-toolbar,
    .user-sidebar {
        display: none !important;
    }

    .page-shell,
    .invoice-page,
    .invoice-preview {
        padding: 0 !important;
        margin: 0 !important;
    }

    .surface,
    .surface-panel {
        box-shadow: none !important;
        border: 0 !important;
    }
}

.shipping-summary-row,
.shipping-meta-block,
.shipping-history-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    flex-wrap: wrap;
}

.shipping-meta-block,
.shipping-history-list,
.shipping-timeline,
.recipient-picker {
    display: grid;
    gap: 0.85rem;
}

.shipping-timeline {
    position: relative;
    padding-inline-start: 1rem;
}

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

.desktop-header-shell {
    display: block;
}

.mobile-header-shell {
    display: none;
}

.mobile-header-shell--hero-search {
    display: none;
}

.mobile-hero-search {
    display: grid;
    justify-items: center;
}

.mobile-hero-search__form {
    width: min(100%, 320px);
}

.desktop-header-shell .desktop-navbar:not(.desktop-navbar--hero) {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    direction: rtl;
}

    .desktop-header-shell .desktop-navbar:not(.desktop-navbar--hero) .desktop-navbar__search {
        flex: 1 1 auto;
        max-width: none;
    }

    .desktop-header-shell .desktop-navbar:not(.desktop-navbar--hero) .desktop-navbar__actions {
        margin-inline-start: auto;
    }

.desktop-navbar--hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    direction: ltr;
}

    .desktop-navbar--hero .desktop-navbar__section {
        min-width: 0;
    }

    .desktop-navbar--hero .desktop-navbar__section--search,
    .desktop-navbar--hero .desktop-navbar__section--actions {
        display: flex;
        align-items: center;
        min-width: 0;
    }

    .desktop-navbar--hero .desktop-navbar__section--search {
        justify-self: start;
    }

    .desktop-navbar--hero .desktop-navbar__section--actions {
        justify-content: flex-end;
        justify-self: end;
    }

    .desktop-navbar--hero .desktop-navbar__section--center {
        justify-self: center;
        height: 100%;
        display: grid;
        gap: 0;
        align-items: center;
        justify-items: center;
    }

    .desktop-navbar--hero .desktop-navbar__search {
        width: min(100%, 248px);
        max-width: 248px;
    }

    .desktop-navbar--hero .desktop-navbar__actions {
        margin-inline-start: 0;
    }

.desktop-navbar__nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.4rem;
    flex-wrap: wrap;
    direction: ltr;
}

    .desktop-navbar__nav a {
        font-size: 0.95rem;
        letter-spacing: 0.02em;
    }

.brand--stacked {
    flex-direction: column;
    align-items: center;
    gap: 0.45rem;
}

    .brand--stacked .brand__text {
        min-width: 0;
        text-align: center;
    }

.layout-shell--hero {
    padding-top: 0 !important;
}

.site-header--hero {
    position: absolute;
    inset: 0 0 auto;
    z-index: 1400;
    background: transparent;
    border: 0;
    backdrop-filter: none;
    box-shadow: none;
    pointer-events: none;
}

.site-header--solid {
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid rgba(34, 32, 28, 0.08);
    box-shadow: 0 10px 24px rgba(34, 32, 28, 0.05);
}

@media (min-width: 781px) {
    .site-header--hero {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
    }
}

.site-header--hero .page-shell,
.site-header--hero .desktop-navbar,
.site-header--hero .desktop-navbar__section,
.site-header--hero .desktop-navbar__nav,
.site-header--hero a,
.site-header--hero form,
.site-header--hero button,
.site-header--hero input {
    pointer-events: auto;
}

.site-header--hero .nav-shell {
    height: 50px;
    padding-block: 0;
}

.site-header--hero .brand,
.site-header--hero .desktop-navbar__nav a,
.site-header--hero .search-form,
.site-header--hero .icon-button {
    color: #fffaf2;
}

.site-header--hero .brand__logo {
    position: absolute;
    top: 0;
    width: 75px;
    height: 75px;
    border-radius: 14px;
    box-shadow: none;
}

.site-header--hero .brand__text strong {
    font-size: 1.1rem;
    font-weight: 700;
}

.site-header--hero .search-form {
    background: transparent;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, #bfbfbf 35%, #cfcfcf00);
    border-radius: 0;
    box-shadow: none;
    height: 36px;
    min-height: 36px;
}

    .site-header--hero .search-form input {
        padding: 0;
        color: #111111;
        direction: rtl;
    }

        .site-header--hero .search-form input::placeholder {
            color: rgba(255, 250, 242, 0.78);
        }

    .site-header--hero .search-form button {
        display: none;
    }

.site-header--solid .nav-shell {
    height: var(--desktop-header-height);
    padding-block: 0;
}

.desktop-navbar--solid {
    direction: ltr;
}

.site-header--solid .desktop-navbar__section {
    min-width: 0;
}

.site-header--solid .desktop-navbar__section--search,
.site-header--solid .desktop-navbar__section--actions {
    display: flex;
    align-items: center;
}

.site-header--solid .desktop-navbar__section--actions {
    justify-content: flex-end;
}

.site-header--solid .desktop-navbar__section--center {
    height: 100%;
    display: grid;
    gap: 0;
    align-items: center;
    justify-items: center;
}

.site-header--solid .desktop-navbar__search {
    width: min(100%, 248px);
    max-width: 248px;
}


.site-header--solid .desktop-navbar__actions {
    margin-inline-start: 0;
}

.site-header--solid .search-form {
    border-radius: 999px;
    height: 36px;
    min-height: 36px;
}

    .site-header--solid .search-form button {
        display: none;
    }

    .site-header--solid .search-form input {
        direction: rtl;
    }

.site-header--hero .icon-button {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    box-shadow: none;
}

    .site-header--hero .icon-button:focus-visible,
    .site-header--hero .desktop-navbar__nav a:focus-visible,
    .site-header--hero .search-form input:focus-visible {
        outline: 0px solid rgba(255, 250, 242, 0.95);
        outline-offset: 4px;
    }

.main-content--hero {
    position: relative;
    z-index: 0;
}

.hero-banner__aside {
    display: none !important;
}

.hero-banner--immersive {
    position: relative;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #ffffff;
}

    .hero-banner--immersive .hero-banner__slider {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .hero-banner--immersive .hero-banner__slide {
        display: none;
        width: 100%;
        height: auto;
        min-height: 0;
        text-align: center;
        margin: 0;
        padding: 0;
        position: relative;
        z-index: 1;
        overflow: hidden;
        background: radial-gradient(circle at center, rgba(255, 255, 255, 0.18), transparent 58%), linear-gradient(180deg, rgba(248, 246, 242, 0.92), rgba(255, 255, 255, 0.96));
    }

        .hero-banner--immersive .hero-banner__slide.is-active {
            display: block;
            pointer-events: auto;
            animation: hero-slide-fade 420ms ease;
        }

    .hero-banner--immersive .hero-banner__image {
        display: block;
        width: 100%;
        height: auto;
        min-height: 0;
        max-width: 100%;
        max-height: 100%;
        margin: 0;
        padding: 0;
        object-fit: contain;
        object-position: center;
    }

    .hero-banner--immersive .hero-banner__dots {
        position: absolute;
        left: 50%;
        bottom: 1.5rem;
        z-index: 3;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.55rem;
        transform: translateX(-50%);
        width: max-content;
        pointer-events: auto;
    }

    .hero-banner--immersive .hero-banner__dot {
        width: 11px;
        height: 11px;
        padding: 0;
        border: 0;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.45);
        cursor: pointer;
        transition: transform 0.2s ease, background-color 0.2s ease;
    }

        .hero-banner--immersive .hero-banner__dot.is-active {
            background: #ffffff;
            transform: scale(1.15);
        }

        .hero-banner--immersive .hero-banner__dot:focus-visible {
            outline: 2px solid #ffffff;
            outline-offset: 4px;
        }

    .hero-banner--immersive,
    .hero-banner--immersive .hero-banner__content,
    .hero-banner--immersive .hero-banner__actions {
        border-radius: 0;
    }

@keyframes hero-slide-fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@media (min-width: 781px) {
    .main-content--hero .hero-banner--immersive {
        height: clamp(460px, 48vw, 780px);
        max-height: 780px;
    }

        .main-content--hero .hero-banner--immersive .hero-banner__slide,
        .main-content--hero .hero-banner--immersive .hero-banner__slider {
            height: 100%;
            max-height: 780px;
        }

        .main-content--hero .hero-banner--immersive .hero-banner__image {
            width: 100%;
            height: 100%;
            max-height: 780px;
            object-fit: cover;
            object-position: center;
        }
}

@media (min-width: 781px) and (max-width: 1440px) {
    .main-content--hero .hero-banner--immersive {
        height: auto;
        max-height: none;
    }

        .main-content--hero .hero-banner--immersive .hero-banner__slider,
        .main-content--hero .hero-banner--immersive .hero-banner__slide {
            height: auto;
            max-height: none;
        }

            .main-content--hero .hero-banner--immersive .hero-banner__slide.is-active {
                display: block;
            }

        .main-content--hero .hero-banner--immersive .hero-banner__image {
            width: 100%;
            height: auto;
            max-height: none;
            object-fit: contain;
            object-position: top center;
        }
}

@media (min-width: 1441px) {
    .main-content--hero .hero-banner--immersive .hero-banner__image {
        object-fit: cover;
        object-position: center;
    }
}

@media (max-width: 960px) {
    .desktop-navbar--hero {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 1.5rem;
    }

        .desktop-navbar--hero .desktop-navbar__section--center {
            order: -1;
            grid-column: 1 / -1;
        }
}

@media (min-width: 781px) and (max-width: 960px) {
    .desktop-navbar--hero {
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        align-items: center;
        gap: 1rem;
    }

        .desktop-navbar--hero .desktop-navbar__section {
            min-width: 0;
        }

        .desktop-navbar--hero .desktop-navbar__section--search {
            justify-self: start;
        }

        .desktop-navbar--hero .desktop-navbar__section--center {
            order: 0;
            grid-column: auto;
            justify-self: center;
            align-self: center;
        }

        .desktop-navbar--hero .desktop-navbar__section--search,
        .desktop-navbar--hero .desktop-navbar__section--actions {
            align-items: center;
            flex-wrap: nowrap;
        }

        .desktop-navbar--hero .desktop-navbar__section--actions {
            justify-self: end;
        }

        .desktop-navbar--hero .desktop-navbar__search {
            width: min(100%, 210px);
            max-width: 210px;
        }

        .desktop-navbar--hero .desktop-navbar__actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            flex-wrap: nowrap;
            gap: 0.45rem;
        }
}

@media (max-width: 780px) {
    .desktop-header-shell {
        display: none;
    }

    .mobile-header-shell {
        display: block;
    }

    .mobile-header-shell--hero-search {
        position: absolute;
        inset: 0 0 auto;
        z-index: 1450;
        display: block;
        pointer-events: none;
    }

        .mobile-header-shell--hero-search .nav-shell {
            padding-block: 1rem 0;
        }

        .mobile-header-shell--hero-search .page-shell,
        .mobile-header-shell--hero-search .mobile-hero-search,
        .mobile-header-shell--hero-search .mobile-hero-search__form,
        .mobile-header-shell--hero-search .mobile-hero-search__form input {
            pointer-events: auto;
        }

        .mobile-header-shell--hero-search .mobile-hero-search__form {
            padding: 0.65rem 0.85rem;
            background: rgba(255, 255, 255, 0.88);
            border: 1px solid rgba(34, 32, 28, 0.08);
            border-radius: 999px;
            box-shadow: 0 10px 30px rgba(34, 32, 28, 0.08);
            backdrop-filter: blur(12px);
        }

            .mobile-header-shell--hero-search .mobile-hero-search__form input {
                background: transparent;
                border: 0;
                padding: 0;
            }

            .mobile-header-shell--hero-search .mobile-hero-search__form button {
                display: none;
            }

    .layout-shell--hero main {
        padding-top: 0;
    }

    .main-content--hero .hero-banner--immersive,
    .main-content--hero .hero-banner__slider {
        height: auto;
        max-height: none;
        min-height: 0;
    }

        .main-content--hero .hero-banner--immersive .hero-banner__slide,
        .main-content--hero .hero-banner--immersive .hero-banner__image {
            width: 100%;
            height: auto;
            max-height: none;
            min-height: 0;
            margin: 0;
            padding: 0;
            object-fit: contain !important;
            object-position: center !important;
        }

        .main-content--hero .hero-banner--immersive .hero-banner__slide {
            display: none;
            position: relative;
        }

            .main-content--hero .hero-banner--immersive .hero-banner__slide.is-active {
                display: block;
            }
}

@media (max-width: 520px) {
    .main-content--hero .hero-banner--immersive,
    .main-content--hero .hero-banner__slider {
        height: auto;
        max-height: none;
        min-height: 0;
    }

    .hero-banner--immersive .hero-banner__dots {
        bottom: 1rem;
    }
}

.shipping-timeline__step {
    position: relative;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 0.9rem;
    opacity: 0.55;
}

    .shipping-timeline__step::after {
        content: "";
        position: absolute;
        top: 1.4rem;
        inset-inline-start: 0.45rem;
        width: 2px;
        height: calc(100% + 0.5rem);
        background: rgba(15, 23, 42, 0.12);
    }

    .shipping-timeline__step:last-child::after {
        display: none;
    }

    .shipping-timeline__step.is-active {
        opacity: 1;
    }

.shipping-timeline__bullet {
    width: 1rem;
    height: 1rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.18);
    margin-top: 0.2rem;
}

.shipping-timeline__step.is-active .shipping-timeline__bullet {
    background: #3f3020;
}

.shipping-timeline__content {
    display: grid;
    gap: 0.25rem;
}

.shipping-history-list {
    border-top: 1px solid var(--line);
    padding-top: 1rem;
}

.shipping-history-item {
    padding: 0.9rem 1rem;
    border-radius: 18px;
    background: rgba(15, 23, 42, 0.03);
}

.recipient-picker {
    max-height: 240px;
    overflow: auto;
    padding: 0.75rem;
    border: 1px solid var(--line);
    border-radius: 18px;
}

.admin-category-preview {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

    .admin-category-preview img,
    .admin-category-thumb {
        width: 88px;
        height: 88px;
        border-radius: 22px;
        object-fit: cover;
        border: 1px solid rgba(34, 32, 28, 0.08);
        background: linear-gradient(135deg, #ecf4fc, #ffffff);
    }

.admin-category-thumb--empty {
    display: grid;
    place-items: center;
    padding: 0.5rem;
    color: var(--text-muted);
    font-size: 0.85rem;
    text-align: center;
}

.admin-category-list,
.admin-category-selector__grid {
    display: grid;
    gap: 1rem;
}

.admin-category-row__info {
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .admin-category-row__info p {
        margin: 0.35rem 0 0;
        color: var(--text-muted);
    }

.admin-category-selector {
    padding: 1rem;
    border-radius: 22px;
}

.category-list-section .section-heading {
    margin-bottom: 1.5rem;
}

.category-strip {
    display: flex;
    overflow-x: auto;
    padding-bottom: 0.35rem;
    scroll-snap-type: x proximity;
    align-items: stretch;
    gap: 0.75rem;
    justify-content: center;
}

.category-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0.7rem;
    height: 100%;
    text-align: center;
    padding: 0.5rem 0.35rem 0.8rem;
    border-radius: 999px;
    background: transparent;
    border: 0;
    box-shadow: none;
    transition: transform 0.2s ease, border-color 0.2s ease;
}

    .category-card:hover {
        transform: translateY(-3px);
    }

.category-card__image-wrap {
    width: 80px;
    height: 80px;
    flex: 0 0 80px;
    padding: 0.4rem;
    display: grid;
    place-items: center;
    overflow: hidden;
}

.category-card__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.category-card strong {
    font-size: 0.94rem;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    min-height: 2.7em;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1100px) {
    .purchase-layout {
        grid-template-columns: 1fr;
    }

    .catalog-results {
        flex: 1 1 100%;
        width: 100%;
    }

    .purchase-summary {
        position: static;
    }
}

@media (min-width: 620px) and (max-width: 780px) {
    .store-grid {
        grid-template-columns: repeat(auto-fit, 300px) !important;
        justify-content: center !important;
        display: grid !important;
    }

    .store-card, .product-card, .category-card {
        grid-column: auto !important;
        margin: 0 auto;
        width: 300px !important;
    }
}

@media (max-width: 780px) {

    .catalog-filters {
        display: none;
    }

    .catalog-filters__trigger {
        display: inline-flex;
        width: 100%;
        margin-bottom: 12px;
    }

    .catalog-filters__mobile-backdrop {
        position: fixed;
        inset: 0;
        z-index: 70;
        display: block;
        background: rgba(34, 32, 28, 0.48);
    }

    .catalog-filters__mobile-modal {
        width: 100%;
        height: 100dvh;
        max-width: 100%;
        padding: var(--space-2);
        background: #ffffff;
        overflow: hidden;
    }

    .catalog-filters__mobile-shell {
        height: 100%;
        grid-template-rows: auto minmax(0, 1fr);
    }

        .catalog-filters__mobile-shell .catalog-filters__header {
            display: flex;
        }

        .catalog-filters__mobile-shell .catalog-filters__close {
            display: inline-flex;
        }

        .catalog-filters__mobile-shell .catalog-filters__form {
            height: 100%;
            min-height: 0;
            grid-template-rows: minmax(0, 1fr) auto;
        }

        .catalog-filters__mobile-shell .catalog-filters__content {
            overflow-y: auto;
            padding-inline-end: 2px;
        }

        .catalog-filters__mobile-shell .catalog-filters__actions {
            position: sticky;
            bottom: 0;
            padding-top: var(--space-2);
            background: #ffffff;
            border-top: 1px solid var(--line);
        }

            .catalog-filters__mobile-shell .catalog-filters__actions > * {
                flex: 1 1 0;
            }

    .cart-item-card,
    .order-item-card {
        grid-template-columns: 1fr;
    }

    .cart-item-card__image {
        max-width: 180px;
    }

    .modal-card {
        padding: 1rem;
    }

    .catalog-page-header {
        padding: 0.9rem 1rem;
        margin-top: 0.5rem;
    }

        .catalog-page-header p {
            max-width: none;
        }

    .order-item-card__actions {
        justify-items: start;
    }
}

@media (max-width: 560px) {
    .admin-category-row__info {
        align-items: flex-start;
    }

    .category-strip {
        display: flex;
        overflow-x: auto;
        padding-bottom: 0.35rem;
        scroll-snap-type: x proximity;
    }

    .category-card {
        min-width: 80px;
        flex: 0 0 80px;
        scroll-snap-align: start;
    }
}

.button-danger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    border-radius: 999px;
    padding: 0.82rem 1.2rem;
    background: rgba(216, 67, 51, 0.12);
    color: #d84333;
    border: 1px solid rgba(216, 67, 51, 0.2);
}

.admin-form-shell {
    display: grid;
    gap: 1.5rem;
    padding: 1.5rem;
}

.admin-form-shell__header {
    margin-bottom: 0.5rem;
}

    .admin-form-shell__header h1,
    .admin-form-section__header h2,
    .admin-modal-header h2 {
        margin: 0;
    }

    .admin-form-shell__header p,
    .admin-form-section__header p,
    .admin-modal-header p {
        margin: 0.35rem 0 0;
        color: var(--text-muted);
        line-height: 1.85;
    }

.admin-form-layout,
.admin-attribute-groups {
    display: grid;
    gap: 1.25rem;
}

.admin-form-section {
    display: grid;
    gap: 1.25rem;
    padding: 1.35rem;
    border-radius: 28px;
}

.admin-form-section__header,
.admin-modal-header,
.admin-gallery-card,
.admin-gallery-card__actions,
.admin-helper-card,
.admin-attribute-card,
.admin-attribute-card__header {
    display: grid;
    gap: 0.85rem;
}

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

.admin-form-grid--compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-form-grid__wide {
    grid-column: 1 / -1;
}

.admin-inline-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
}

.admin-checkbox-row,
.admin-radio-row {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
}

    .admin-checkbox-row input,
    .admin-radio-row input {
        width: 18px;
        height: 18px;
        flex: 0 0 auto;
        margin: 0;
    }

.admin-helper-card {
    padding: 1rem 1.1rem;
    border: 1px dashed rgba(34, 32, 28, 0.14);
    border-radius: 22px;
    background: #f7fbff;
}

.admin-helper-card--subtle {
    background: #ffffff;
}

.admin-helper-card strong,
.admin-helper-card p,
.admin-gallery-card__actions p {
    margin: 0;
}

.admin-gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.admin-gallery-card {
    padding: 1rem;
    border-radius: 24px;
}

.admin-gallery-card__image {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 20px;
    background: linear-gradient(135deg, #ecf4fc, #ffffff);
}

.admin-attribute-card {
    padding: 1.2rem;
    border-radius: 28px;
}

.admin-attribute-card__header {
    padding-bottom: 0.85rem;
    border-bottom: 1px solid var(--line);
}

.admin-attribute-table-wrap {
    overflow-x: auto;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
}

    .admin-table th,
    .admin-table td {
        padding: 0.95rem 0.85rem;
        border-bottom: 1px solid var(--line);
        text-align: right;
        vertical-align: middle;
    }

    .admin-table th {
        color: var(--text-muted);
        font-weight: 700;
        white-space: nowrap;
    }

    .admin-table td input,
    .admin-table td select {
        min-width: 120px;
    }

.admin-table-field {
    display: grid;
    gap: 0.45rem;
    min-width: 160px;
}

    .admin-table-field .field-label {
        font-size: 0.82rem;
    }

.admin-table tbody tr:last-child td {
    border-bottom: 0;
}

.admin-form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.admin-form-actions--modal {
    justify-content: flex-start;
}

.rich-editor {
    display: grid;
    gap: 0.75rem;
    width: 100%;
    min-width: 0;
}

.rich-editor--ckeditor {
    border: 1px solid var(--line);
    border-radius: 22px;
    background: #ffffff;
    width: 100%;
    min-width: 0;
    overflow: visible;
    position: relative;
    z-index: 1;
}

    .rich-editor--ckeditor .ck.ck-editor {
        width: 100%;
    }

    .rich-editor--ckeditor .ck.ck-content,
    .rich-editor--ckeditor .ck.ck-editor__top,
    .rich-editor--ckeditor .ck.ck-editor__main,
    .rich-editor--ckeditor .ck.ck-editor__main .ck-editor__editable {
        width: 100%;
    }

        .rich-editor--ckeditor .ck.ck-editor__main > .ck-editor__editable {
            width: 100%;
            min-height: 300px;
            direction: rtl;
            text-align: right;
            overflow-y: auto;
            padding: 1rem 1.1rem;
        }

        .rich-editor--ckeditor .ck.ck-editor__top .ck-sticky-panel .ck-sticky-panel__content,
        .rich-editor--ckeditor .ck.ck-toolbar {
            border: 0;
            box-shadow: none;
        }

    .rich-editor--ckeditor .ck.ck-toolbar,
    .rich-editor--ckeditor .ck.ck-dropdown__panel,
    .rich-editor--ckeditor .ck.ck-balloon-panel {
        z-index: 30;
    }

.rich-editor__surface--ckeditor {
    width: 100%;
    min-height: 300px;
    padding: 0;
    border: 0;
    border-radius: inherit;
    background: transparent;
    line-height: normal;
}

.rich-editor__fallback {
    padding: 1rem 1.1rem;
    color: #d84333;
    line-height: 1.8;
}

.rich-editor__toolbar {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.rich-editor__surface {
    min-height: 240px;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: #ffffff;
    line-height: 1.9;
}

.rich-editor__hidden {
    display: none;
}

.rich-editor__plain-textarea {
    width: 100%;
    min-height: 300px;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(162, 183, 207, 0.22);
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 249, 253, 0.98));
    color: var(--text);
    direction: rtl;
    text-align: right;
    line-height: 1.9;
    resize: vertical;
    box-shadow: 0 10px 24px rgba(80, 104, 129, 0.06);
}

.admin-spec-grid,
.admin-spec-values {
    display: grid;
    gap: 1rem;
}

.admin-spec-card,
.product-spec-list,
.product-description-html {
    padding: var(--space-3);
}

.admin-spec-card {
    display: grid;
    gap: 0.85rem;
    border-radius: 24px;
}

.admin-spec-value-row,
.product-spec-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.product-spec-list {
    display: grid;
    gap: 0;
}

.product-spec-row {
    display: grid;
    grid-template-columns: minmax(0, 180px) minmax(0, 1fr);
    align-items: start;
    gap: var(--space-2);
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--line);
}

    .product-spec-row:last-child {
        border-bottom: 0;
    }

    .product-spec-row strong,
    .product-spec-row span {
        line-height: 1.9;
        word-break: break-word;
    }

    .product-spec-row span {
        color: var(--text-muted);
        text-align: right;
    }

.product-description-html {
    line-height: 2;
    word-break: break-word;
}

.product-description {
    display: grid;
    gap: 0;
    margin-inline: calc(var(--space-3) * -1);
    margin-bottom: calc(var(--space-3) * -1);
}

.product-description__body {
    padding-inline: var(--space-3);
    animation: product-description-fade 0.28s ease;
}

.product-description-preview {
    margin: 0;
    padding: var(--space-3);
    line-height: 2;
    color: var(--text-muted);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-description__toggle {
    width: 100%;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 1rem 1.25rem;
    margin-top: 0.25rem;
    border-radius: 0 0 24px 24px;
    color: #4d6782;
    background: linear-gradient(180deg, rgba(227, 236, 246, 0.18), rgba(227, 236, 246, 0.42));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78), 0 -1px 0 rgba(133, 169, 208, 0.12);
    transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

    .product-description__toggle:hover {
        background: linear-gradient(180deg, rgba(227, 236, 246, 0.28), rgba(227, 236, 246, 0.54));
    }

    .product-description__toggle[aria-expanded="true"] i {
        transform: rotate(180deg);
        animation: none;
    }

    .product-description__toggle i {
        transition: transform 0.2s ease;
        animation: product-description-arrow-bounce 1.45s ease-in-out infinite;
    }

    .product-description__toggle span,
    .product-description__toggle i {
        position: relative;
        top: 0;
    }

@keyframes product-description-arrow-bounce {
    0%, 100% {
        transform: translateY(0);
        opacity: 0.9;
    }

    35% {
        transform: translateY(4px);
        opacity: 1;
    }

    65% {
        transform: translateY(1px);
        opacity: 0.96;
    }
}

@keyframes product-description-fade {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.product-description-html h1,
.product-description-html h2,
.product-description-html h3,
.product-description-html h4,
.product-description-html p,
.product-description-html ul,
.product-description-html ol,
.product-description-html blockquote {
    margin-top: 0;
}

.product-description-html ul,
.product-description-html ol {
    padding-inline-start: 1.5rem;
}

.product-description-html figure {
    margin: 0 0 1.25rem;
    max-width: 100%;
}

.product-description-html img {
    max-width: 100%;
    height: auto;
    border-radius: 20px;
}

.product-description-html table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}

.product-description-html th,
.product-description-html td {
    word-break: break-word;
}

.product-description-html iframe {
    width: 100%;
    min-height: 340px;
    border: 0;
    border-radius: 20px;
}

.product-tabs {
    display: grid;
    gap: var(--space-3);
}

.product-tabs__nav {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    padding-bottom: var(--space-2);
    border-bottom: 1px solid var(--line);
}

.product-tabs__button {
    min-height: 44px;
    padding: 12px 16px;
    border-radius: 999px;
    color: var(--text-muted);
    background: transparent;
    border: 1px solid transparent;
}

    .product-tabs__button.is-active {
        color: var(--text);
        background: rgba(227, 236, 246, 0.76);
        border-color: rgba(138, 174, 214, 0.62);
    }

.product-tabs__panel {
    display: grid;
    gap: var(--space-2);
}

@media (max-width: 780px) {
    .admin-form-grid,
    .admin-form-grid--compact,
    .admin-inline-field {
        grid-template-columns: 1fr;
    }

    .admin-form-actions {
        justify-content: stretch;
    }

        .admin-form-actions .button-primary,
        .admin-form-actions .button-secondary,
        .admin-inline-field .button-secondary {
            width: 100%;
        }
}

@media (max-width: 520px) {
    .admin-form-shell,
    .admin-form-section,
    .admin-gallery-card,
    .admin-attribute-card {
        padding: 1rem;
    }
}

.muted-text {
    margin: 0;
    color: var(--muted-foreground, #74675d);
}

.notification-template-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 440px);
    gap: 1.5rem;
    align-items: start;
}

.notification-template-item {
    border: 1px solid #d8e5f2;
    background: #f6faff;
    border-radius: 1.1rem;
    padding: 0.95rem 1rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    color: #4a3729;
}

.notification-template-table {
    display: grid;
    gap: 0.85rem;
}

.notification-template-row {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(180px, 0.9fr) auto;
    gap: 1rem;
    align-items: center;
    border: 1px solid #d8e5f2;
    background: #f6faff;
    border-radius: 1.2rem;
    padding: 1rem;
}

.notification-template-row--active {
    border-color: #7f9fc2;
    box-shadow: 0 0 0 1px rgba(201, 135, 115, 0.24);
}

.notification-template-row__main {
    border: 0;
    background: transparent;
    padding: 0;
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    color: inherit;
}

    .notification-template-row__main span {
        color: #8a7466;
        font-size: 0.88rem;
    }

.notification-template-meta {
    display: grid;
    gap: 0.45rem;
    color: #7a685d;
    font-size: 0.84rem;
}

.notification-template-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: flex-end;
}

.button-secondary--danger,
.button-primary--danger {
    border-color: #d79c9c;
    color: #9e3131;
}

.button-primary--danger {
    background: #b44a4a;
    color: #fff;
}

.notification-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(42, 31, 24, 0.42);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    z-index: 1600;
}

.notification-modal {
    width: min(100%, 28rem);
    background: #f7fbff;
    border-radius: 1.5rem;
    border: 1px solid #d8e5f2;
    padding: 1.4rem;
    display: grid;
    gap: 1rem;
    position: relative;
    z-index: 1601;
}

.notification-template-item__preview {
    border: 0;
    background: transparent;
    padding: 0;
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    color: inherit;
}

    .notification-template-item__preview strong {
        font-size: 0.98rem;
    }

    .notification-template-item__preview span {
        font-size: 0.86rem;
        color: #8a7466;
    }

.notification-template-item--active {
    border-color: #7f9fc2;
    box-shadow: 0 0 0 1px rgba(201, 135, 115, 0.28);
}

.notification-preview-card {
    border: 1px solid #d8e5f2;
    border-radius: 1.5rem;
    background: linear-gradient(180deg, #f7fbff 0%, #edf5fd 100%);
    overflow: hidden;
}

.notification-preview-card__header {
    padding: 1rem 1.1rem;
    border-bottom: 1px solid #eee2d9;
    background: rgba(255, 255, 255, 0.72);
}

    .notification-preview-card__header p {
        margin: 0.35rem 0 0;
        color: #7f6c5f;
        font-size: 0.9rem;
    }

.notification-preview-empty {
    padding: 2rem 1.1rem;
    color: #7f6c5f;
}

.notification-preview-frame {
    width: 100%;
    min-height: 760px;
    border: 0;
    background: #fff;
}

.notification-placeholders {
    display: grid;
    gap: 0.85rem;
    padding: 1rem 1.1rem;
    border-radius: 1.2rem;
    background: #f3f8ff;
    border: 1px dashed #e5d5ca;
}

.notification-placeholder-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.notification-placeholder-chip {
    border: 1px solid #ddc8bc;
    background: #ffffff;
    color: #6b4b3d;
    border-radius: 999px;
    padding: 0.5rem 0.85rem;
    font-size: 0.88rem;
}

.notification-recipient-search,
.notification-selected-list {
    display: grid;
    gap: 0.75rem;
}

.input-like {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 1rem;
    padding: 0.9rem 1rem;
    background: #fff;
    color: var(--text);
    font: inherit;
}

.notification-search-results {
    display: grid;
    gap: 0.7rem;
}

.notification-search-result {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    border: 1px solid #e8ddd4;
    border-radius: 1rem;
    background: #f7fbff;
    padding: 0.9rem 1rem;
    color: #4a3729;
    text-align: right;
}

.notification-selected-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.notification-selected-chip {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
    border: 1px solid #d8c3b6;
    border-radius: 1rem;
    background: #f1f7ff;
    padding: 0.7rem 0.9rem;
    color: #5a4235;
}

.notification-history-table {
    display: grid;
    gap: 0.9rem;
}

.notification-history-head,
.notification-history-row {
    display: grid;
    grid-template-columns: 1.15fr 1.2fr 0.7fr 0.7fr 0.9fr 1.2fr;
    gap: 1rem;
    align-items: start;
}

.notification-history-head {
    color: #7b695c;
    font-size: 0.85rem;
    padding: 0 0.25rem;
}

.notification-history-row {
    padding: 1rem;
    border: 1px solid #ede1d8;
    border-radius: 1.2rem;
    background: #f7fbff;
}

.notification-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 5.8rem;
    padding: 0.4rem 0.8rem;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
    border: 0;
}

.notification-status-badge--sent {
    background: #e6f5ea;
    color: #25653c;
}

.notification-status-badge--pending {
    background: #edf4fc;
    color: #8a5a11;
}

.notification-status-badge--failed {
    background: #fde8e8;
    color: #a12b2b;
}

.notification-status-badge--skipped {
    background: #eceff3;
    color: #51606f;
}

@media (max-width: 960px) {
    .notification-template-layout {
        grid-template-columns: 1fr;
    }

    .notification-preview-frame {
        min-height: 680px;
    }

    .notification-template-row {
        grid-template-columns: 1fr;
    }

    .notification-history-head {
        display: none;
    }

    .notification-history-row {
        grid-template-columns: 1fr;
    }
}

.product-review-summary {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.review-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    background: #eef7f1;
    color: #1f6b43;
    font-size: 0.8rem;
    font-weight: 700;
}

.review-author {
    display: inline-block;
}

.review-author--phone {
    direction: ltr;
    unicode-bidi: isolate;
    letter-spacing: 0.03em;
}

.review-stars,
.review-stars-picker {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.review-star {
    border: 1px solid rgba(162, 183, 207, 0.24);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 249, 253, 0.98));
    border-radius: 1rem;
    padding: 0.65rem 0.8rem;
    min-width: 3rem;
    display: grid;
    place-items: center;
    gap: 0.2rem;
    box-shadow: 0 10px 24px rgba(80, 104, 129, 0.06);
}

    .review-star.is-active {
        border-color: #7fa4cb;
        color: #3f678f;
        background: #edf4fc;
    }

.review-editor,
.review-form {
    display: grid;
    gap: 1rem;
    padding: var(--space-3);
}

.review-editor__product {
    display: flex;
    gap: 1rem;
    align-items: center;
}

    .review-editor__product img {
        width: 64px;
        height: 64px;
        object-fit: cover;
        border-radius: 1rem;
        background: #f4f5f8;
    }

.review-editor__field {
    display: grid;
    gap: 0.5rem;
}

    .review-editor__field label {
        font-weight: 700;
    }

    .review-editor__field textarea {
        min-height: 8rem;
    }

.review-editor__upload {
    position: relative;
    display: grid;
    place-items: center;
    gap: 0.6rem;
    min-height: 180px;
    padding: 1.4rem;
    border: 1px dashed rgba(133, 169, 208, 0.58);
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(242, 247, 252, 0.95), rgba(255, 255, 255, 0.96));
    box-shadow: 0 14px 32px rgba(80, 104, 129, 0.08);
    text-align: center;
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease, background-color 0.2s ease;
}

    .review-editor__upload:hover,
    .review-editor__upload.is-dragging {
        border-color: rgba(117, 159, 202, 0.92);
        box-shadow: 0 0 0 4px rgba(227, 236, 246, 0.95), 0 20px 40px rgba(80, 104, 129, 0.12);
        transform: translateY(-1px);
    }

.review-editor__upload-copy {
    display: grid;
    gap: 0.45rem;
    justify-items: center;
    color: #56718e;
}

    .review-editor__upload-copy i {
        font-size: 1.5rem;
    }

    .review-editor__upload-copy strong {
        color: var(--text);
    }

.review-editor__file-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.review-editor__previews,
.review-image-strip {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.review-editor__preview,
.review-image-button {
    border: 0;
    background: transparent;
    padding: 0;
}

    .review-editor__preview img,
    .review-image-strip img,
    .review-image-button img {
        width: 88px;
        height: 88px;
        object-fit: cover;
        border-radius: 1rem;
        background: #f4f5f8;
    }

.review-editor__preview {
    display: grid;
    gap: 0.45rem;
    justify-items: center;
}

.review-editor__actions,
.admin-review-filters,
.user-order-card__item {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
}

.form-error,
.form-success {
    margin: 0;
    padding: 0.85rem 1rem;
    border-radius: 1rem;
    font-size: 0.95rem;
}

.form-error {
    color: #a32626;
    background: #fff2f2;
    border: 1px solid #f1c5c5;
}

.form-success {
    color: #1c6b43;
    background: #eefaf3;
    border: 1px solid #c8e7d4;
}

.user-order-card__items,
.admin-review-card {
    display: grid;
    gap: 0.9rem;
    margin-top: 1rem;
}

.review-modal {
    width: min(42rem, calc(100vw - 2rem));
}

.product-gallery-modal {
    width: min(72rem, calc(100vw - 1.5rem));
    max-height: calc(100vh - 1.5rem);
    display: grid;
    gap: 0.9rem;
    overflow: auto;
    padding: 1rem;
    border-radius: 28px;
    background: rgba(255, 252, 247, 0.96);
    box-shadow: 0 28px 70px rgba(17, 16, 14, 0.18);
    position: relative;
    z-index: 1601;
}

.order-item-card__actions {
    justify-items: end;
}

.product-gallery-modal__tabs {
    display: flex;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.product-gallery-modal__tab {
    min-width: 6rem;
    padding: 0.65rem 0.95rem;
    border: 1px solid rgba(34, 32, 28, 0.08);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.84);
    color: inherit;
}

    .product-gallery-modal__tab.is-active {
        background: rgba(34, 32, 28, 0.08);
        border-color: rgba(34, 32, 28, 0.18);
    }

.product-gallery-modal__viewer {
    position: relative;
    display: block;
}

.product-gallery-modal__frame {
    display: grid;
    place-items: center;
    min-height: min(70vh, 36rem);
    padding: 1rem;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(251, 247, 239, 0.95), rgba(255, 255, 255, 0.98));
    overflow: hidden;
    border: 1px solid rgba(34, 32, 28, 0.06);
}

    .product-gallery-modal__frame img {
        max-width: 100%;
        max-height: min(64vh, 34rem);
        width: auto;
        height: auto;
        object-fit: contain;
        border-radius: 1.25rem;
    }

.product-gallery-modal__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 3rem;
    height: 3rem;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.88);
    color: rgba(34, 32, 28, 0.92);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 22px rgba(17, 16, 14, 0.14);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

    .product-gallery-modal__nav:disabled {
        opacity: 0.4;
    }

.product-gallery-modal__nav--next {
    right: 0.85rem;
}

.product-gallery-modal__nav--prev {
    left: 0.85rem;
}

.product-gallery-modal__caption,
.product-gallery-modal__album-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.product-gallery-modal__albums {
    display: grid;
    gap: 1rem;
}

.product-gallery-modal__album {
    display: grid;
    gap: 0.75rem;
}

.product-gallery-modal__close {
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.84);
    color: rgba(34, 32, 28, 0.9);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 22px rgba(17, 16, 14, 0.1);
}

.review-form > textarea,
.review-form > button[type="submit"] {
    display: none;
}

@media (max-width: 1024px) {
    body:has(.admin-sidebar--mobile) {
        overflow: hidden;
        touch-action: none;
    }
}

.pending-order-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem;
    border: 1px solid rgba(199, 141, 58, 0.28);
    background: linear-gradient(135deg, rgba(255, 249, 238, 0.96), rgba(248, 241, 225, 0.92));
}

.pending-order-banner__content {
    display: grid;
    gap: 0.45rem;
}

.pending-order-banner__eyebrow {
    font-size: 0.78rem;
    font-weight: 800;
    color: #46688f;
}

.pending-order-banner__content h2 {
    margin: 0;
    font-size: 1.1rem;
}

.pending-order-banner__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    color: rgba(60, 50, 37, 0.8);
}

.pending-order-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-end;
}

.pending-order-banner__details {
    width: 100%;
    display: grid;
    gap: 0.9rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(143, 97, 28, 0.16);
}

.pending-order-banner__detail-list {
    display: grid;
    gap: 0.75rem;
}

.pending-order-banner__detail-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.72);
}

.pending-order-banner__detail-copy {
    display: grid;
    gap: 0.2rem;
    color: rgba(60, 50, 37, 0.82);
}

.pending-order-banner__detail-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: rgba(143, 97, 28, 0.08);
    font-weight: 700;
}

@media (max-width: 720px) {
    .pending-order-banner {
        flex-direction: column;
        align-items: stretch;
    }

    .pending-order-banner__actions {
        justify-content: stretch;
    }

        .pending-order-banner__actions .button-primary,
        .pending-order-banner__actions .button-secondary,
        .pending-order-banner__actions .button-ghost {
            width: 100%;
        }

    .pending-order-banner__detail-item,
    .pending-order-banner__detail-total {
        flex-direction: column;
        align-items: stretch;
    }
}

.payment-result-shell {
    min-height: calc(100vh - 120px);
    background: radial-gradient(circle at top, rgba(227, 236, 246, 0.78), transparent 38%), linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
    padding: 2rem 1rem 4rem;
}

.payment-result-stage {
    min-height: calc(100vh - 180px);
    display: grid;
    place-items: center;
}

.payment-result-bank-card {
    width: min(100%, 760px);
    display: grid;
    gap: 1.5rem;
    padding: 2rem;
    border-radius: 36px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(34, 32, 28, 0.08);
    box-shadow: 0 28px 80px rgba(34, 32, 28, 0.12);
}

.payment-result-bank-card__hero {
    display: grid;
    justify-items: center;
    text-align: center;
    gap: 0.9rem;
}

.payment-result-bank-card__brand {
    width: 76px;
    height: 76px;
    border-radius: 24px;
    object-fit: cover;
    box-shadow: 0 14px 34px rgba(34, 32, 28, 0.12);
}

.payment-result-state-icon {
    width: 88px;
    height: 88px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: 2rem;
    font-weight: 800;
}

    .payment-result-state-icon.success {
        background: #eaf8ef;
        color: #1f6b43;
    }

    .payment-result-state-icon.danger {
        background: #fff0f0;
        color: #bb2c2c;
    }

    .payment-result-state-icon.info {
        background: #eef6ff;
        color: #225ca8;
    }

    .payment-result-state-icon.muted {
        background: #edf2f8;
        color: #73685d;
    }

.payment-result-kicker {
    color: var(--text-muted);
    font-size: 0.88rem;
}

.payment-result-bank-card__summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

    .payment-result-bank-card__summary div,
    .payment-result-receipt,
    .payment-result-note {
        padding: 1rem 1.1rem;
        border-radius: 22px;
        border: 1px solid rgba(34, 32, 28, 0.08);
        background: #f7fbff;
        display: grid;
        gap: 0.4rem;
    }

        .payment-result-bank-card__summary span,
        .payment-result-receipt span {
            color: var(--text-muted);
            font-size: 0.88rem;
        }

.payment-result-note--danger {
    background: #fff4f4;
    border-color: rgba(187, 44, 44, 0.16);
}

.payment-result-note--muted {
    background: #f7fbff;
}

.payment-result-receipt img {
    width: 100%;
    max-height: 300px;
    object-fit: contain;
    border-radius: 20px;
    background: #fff;
}

.payment-result-cta-grid {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    justify-content: center;
}

.payment-result-spinner {
    width: 54px;
    height: 54px;
    border-radius: 999px;
    border: 4px solid rgba(34, 32, 28, 0.08);
    border-top-color: var(--text);
    animation: meduse-spin 1s linear infinite;
}

@keyframes meduse-spin {
    to {
        transform: rotate(360deg);
    }
}

.pending-order-banner.is-expired {
    border-color: rgba(187, 44, 44, 0.16);
    background: #fff7f7;
}

.payment-expiry-badge.is-warning {
    color: #45698f;
}

.payment-expiry-badge.is-danger {
    color: #bb2c2c;
}

.manual-transfer-form-layout {
    display: grid;
    gap: 1rem;
}

.manual-transfer-form-layout__instructions {
    padding: 1rem 1.1rem;
    border-radius: 22px;
    background: #f1f7ff;
    border: 1px solid rgba(138, 174, 214, 0.42);
}

.payment-highlight--readonly {
    position: relative;
    gap: 0.7rem;
}

.button-secondary--small {
    padding: 0.6rem 0.9rem;
}

.admin-form-shell .payment-summary-grid {
    margin-top: 0.25rem;
}

@media (max-width: 780px) {
    .payment-result-bank-card {
        padding: 1.35rem;
        border-radius: 28px;
    }

    .payment-result-bank-card__summary {
        grid-template-columns: 1fr;
    }

    .payment-result-cta-grid {
        flex-direction: column;
    }

        .payment-result-cta-grid .button-primary,
        .payment-result-cta-grid .button-secondary {
            width: 100%;
        }
}

.icon-button {
    color: #111111;
    border-color: rgba(17, 17, 17, 0.12);
}

    .icon-button i {
        color: inherit;
    }

.site-header--hero .icon-button {
    color: #111111;
    background: transparent;
    text-shadow: none;
}

.brand--mobile-hero {
    flex-direction: column;
    align-items: center;
    gap: 0.45rem;
    color: #ffffff;
    text-align: center;
}

    .brand--mobile-hero .brand__logo {
        width: 54px;
        height: 54px;
    }

    .brand--mobile-hero .brand__text {
        min-width: 0;
    }

.mobile-hero-search {
    gap: 0.85rem;
}

.mobile-header-shell--hero-search .mobile-hero-search__form {
    width: min(100%, 340px);
    background: #111111;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.18);
    backdrop-filter: none;
}

    .mobile-header-shell--hero-search .mobile-hero-search__form,
    .mobile-header-shell--hero-search .mobile-hero-search__form i,
    .mobile-header-shell--hero-search .mobile-hero-search__form input {
        color: #ffffff;
    }

        .mobile-header-shell--hero-search .mobile-hero-search__form input::placeholder {
            color: rgba(255, 255, 255, 0.7);
        }

.store-section--showcase {
    margin-top: var(--space-4);
}

#campaigns.page-shell.stack-lg {
    width: 100%;
    max-width: none;
    margin: 0;
    padding-inline: 0;
}

.store-section--showcase .store-section__layout {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 1.5rem;
    align-items: stretch;
}

.store-section--showcase .store-section__feature {
    position: sticky;
    top: 1.5rem;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 1rem;
    min-height: 100%;
    padding: 1.75rem 1.25rem;
    border-radius: 28px;
    /* customizable background styles */
    /* default plain */
    --feature-bg: #ffffff;
    --feature-box-shadow: 0 18px 38px rgba(17, 17, 17, 0.06);
    background: var(--feature-bg);
    box-shadow: var(--feature-box-shadow);
    text-align: center;
}

/* Admin / storefront customization helpers */
.store-section__feature--highlight {
    --feature-bg: linear-gradient(135deg, rgba(255, 244, 229, 1), rgba(255, 236, 199, 1));
    --feature-box-shadow: 0 18px 38px rgba(255, 165, 0, 0.08);
}

.store-section__feature--glass {
    --feature-bg: rgba(255, 255, 255, 0.36);
    --feature-box-shadow: 0 10px 30px rgba(17,17,17,0.08);
    backdrop-filter: blur(8px) saturate(130%);
    border: 1px solid rgba(255,255,255,0.12);
}

/* allow setting explicit color via inline style or generated class (.store-section__feature--brand-<slug>) */
.store-section__feature--brand {
    /* use --feature-bg as a base color; set via inline style e.g. style="--feature-bg: #fde7e7" */
}

.store-section--showcase .store-section__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 4.5rem;
    min-height: 4.5rem;
    padding: 0.75rem;
    border-radius: 999px;
    background: #2d2d2d;
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.store-section--showcase .store-section__eyebrow {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.85rem;
}

.store-section--showcase .store-section__feature h2 {
    margin: 0;
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    line-height: 1.45;
}

.store-section--showcase .store-section__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 9rem;
    min-height: 3rem;
    padding: 0.8rem 1.4rem;
    border: 1px solid #111111;
    border-radius: 14px;
    background: transparent;
    color: #111111;
    font-weight: 700;
}

.store-section--showcase .store-section__products {
    position: relative;
    min-width: 0;
    overflow: hidden;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.35rem;
}

.store-section--showcase .store-section__scroll {
    height: 100%;
    background: rgba(255, 255, 255, 0.94);
    color: rgba(34, 32, 28, 0.92);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    flex: 0 0 auto;
    transition: opacity 0.18s ease, transform 0.18s ease;
}

    .store-section--showcase .store-section__scroll:hover:not(:disabled) {
        transform: translateY(-1px);
    }

    .store-section--showcase .store-section__scroll:disabled {
        opacity: 0.35;
        cursor: default;
    }

.store-section--showcase .store-section__products:not(.is-scrollable) .store-section__scroll {
    opacity: 0;
    pointer-events: none;
}

.store-section--showcase .store-section__rail {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 300px;
    gap: 1.25rem;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0.1rem 0 0.75rem;
    scroll-snap-type: x proximity;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: rgba(17, 17, 17, 0.28) transparent;
}

.store-section--showcase .store-section__item {
    display: flex;
    min-width: 0;
    scroll-snap-align: start;
}

.store-section--showcase .store-card {
    width: 300px;
    height: 100%;
    gap: 0.85rem;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.store-section--showcase .store-card__media {
    width: 300px;
    aspect-ratio: 9 / 16;
    max-height: 450px;
    height: min(450px, calc(300px * 16 / 9));
    border-radius: 32px;
    border: 0;
    background: #f3f6fa;
    margin-inline: 0;
}

.store-section--showcase .store-card__body {
    gap: 0.75rem;
    padding: 0.2rem 0.15rem 0;
    height: auto;
}

.store-section--showcase .store-card__title {
    font-size: 1.06rem;
    line-height: 1.75;
    /*min-height: calc(1.75em * 2);*/
}

.ai-home-callout {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.4rem 1.6rem;
    background: radial-gradient(circle at top right, rgba(212, 227, 245, 0.92), transparent 36%), linear-gradient(135deg, rgba(248, 251, 255, 0.98), rgba(255, 252, 247, 0.98));
}

.ai-home-callout__copy {
    display: grid;
    gap: 0.5rem;
}

.ai-home-callout__eyebrow,
.ai-hero-card__eyebrow {
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: #4f6d8d;
}

.ai-home-callout h2,
.ai-hero-card h1,
.ai-chat-panel__header h2,
.ai-side-panel h2,
.ai-auth-panel h2 {
    margin: 0;
}

.ai-page-shell {
    display: grid;
    gap: 1.5rem;
    padding-block: 1.5rem 4rem;
}

.ai-hero-card {
    display: grid;
    gap: 1.1rem;
    padding: 1.6rem;
    border-radius: 32px;
    background: radial-gradient(circle at top right, rgba(222, 232, 245, 0.96), transparent 34%), linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 254, 0.98));
    border: 1px solid rgba(133, 169, 208, 0.22);
    box-shadow: 0 20px 50px rgba(80, 104, 129, 0.08);
}

.ai-hero-card__copy {
    display: grid;
    gap: 0.55rem;
}

    .ai-hero-card__copy p,
    .ai-chat-panel__header p,
    .ai-auth-panel p,
    .ai-empty-state p,
    .ai-message p,
    .ai-side-panel__list {
        margin: 0;
        line-height: 1.85;
        color: var(--text-muted);
    }

.ai-hero-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.ai-chip-button {
    border: 1px solid rgba(133, 169, 208, 0.28);
    border-radius: 999px;
    padding: 0.72rem 1rem;
    background: rgba(255, 255, 255, 0.92);
    color: var(--text);
    box-shadow: 0 10px 24px rgba(80, 104, 129, 0.06);
}

.ai-chat-layout {
    display: grid;
    grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
    gap: 1rem;
}

.ai-side-panel,
.ai-chat-panel,
.ai-auth-panel {
    padding: 1.4rem;
}

.ai-side-panel__list {
    padding-inline-start: 1.2rem;
}

.ai-chat-panel {
    display: grid;
    gap: 1rem;
}

.ai-chat-panel__header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.ai-status-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    background: #edf4fc;
    color: #436b95;
    font-size: 0.88rem;
    font-weight: 700;
}

.ai-status-badge--warning {
    background: #fff3e6;
    color: #9a5a00;
}

.ai-chat-history {
    display: grid;
    gap: 0.85rem;
    min-height: 340px;
    max-height: 560px;
    overflow-y: auto;
    padding: 0.3rem;
}

.ai-empty-state {
    display: grid;
    place-items: center;
    gap: 0.5rem;
    min-height: 240px;
    padding: 1.5rem;
    border: 1px dashed rgba(133, 169, 208, 0.32);
    border-radius: 24px;
    background: rgba(247, 250, 254, 0.78);
    text-align: center;
}

.ai-message {
    max-width: min(100%, 640px);
    display: grid;
    gap: 0.35rem;
    padding: 1rem 1.1rem;
    border-radius: 24px;
    border: 1px solid rgba(34, 32, 28, 0.08);
}

.ai-message--assistant {
    justify-self: start;
    background: #f8fbff;
}

.ai-message--thinking {
    min-width: min(100%, 22rem);
    background: radial-gradient(circle at top right, rgba(203, 177, 255, 0.18), transparent 32%), linear-gradient(180deg, #fbf8ff, #f8fbff);
    border-color: rgba(154, 123, 212, 0.24);
    box-shadow: 0 18px 40px rgba(102, 77, 153, 0.08);
}

.ai-message--user {
    justify-self: end;
    background: #f1f7ff;
    border-color: rgba(133, 169, 208, 0.24);
}

.ai-message__meta {
    font-size: 0.8rem;
    font-weight: 700;
    color: #56718e;
}

.ai-thinking-line {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.ai-orb {
    width: 0.95rem;
    height: 0.95rem;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #ffffff, #c39cff 42%, #8f6bdc 100%);
    box-shadow: 0 0 0 6px rgba(195, 156, 255, 0.12), 0 0 28px rgba(143, 107, 220, 0.26);
    animation: ai-orb-pulse 1.8s ease-in-out infinite;
}

.ai-thinking-dots {
    display: inline-flex;
    gap: 0.35rem;
    align-items: center;
}

    .ai-thinking-dots span {
        width: 0.42rem;
        height: 0.42rem;
        border-radius: 50%;
        background: rgba(143, 107, 220, 0.82);
        animation: ai-dot-bounce 1.2s ease-in-out infinite;
    }

        .ai-thinking-dots span:nth-child(2) {
            animation-delay: 0.15s;
        }

        .ai-thinking-dots span:nth-child(3) {
            animation-delay: 0.3s;
        }

.ai-suggestion-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.9rem;
    margin-top: 0.65rem;
}

.ai-picked-card {
    min-width: 0;
}

.ai-picked-card--chat .store-card,
.ai-picked-card--catalog .store-card {
    border: 1px solid rgba(153, 111, 223, 0.36);
    box-shadow: 0 14px 34px rgba(95, 68, 150, 0.08), 0 0 0 4px rgba(177, 140, 238, 0.08);
}

.ai-picked-card--catalog {
    border-radius: 28px;
    transition: transform 180ms ease, filter 180ms ease;
}

    .ai-picked-card--catalog:hover {
        transform: translateY(-2px);
        filter: saturate(1.03);
    }

/*.ai-picked-card--subtle .store-card {
    border: 1px solid rgba(153, 111, 223, 0.24);
    box-shadow:
        0 10px 24px rgba(95, 68, 150, 0.06),
        0 0 0 2px rgba(177, 140, 238, 0.05);
}*/
.validation-message {
    display: block;
    color: red;
}

.ai-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.5rem 0.8rem;
    border-radius: 999px;
    background: rgba(248, 242, 255, 0.96);
    border: 1px solid rgba(153, 111, 223, 0.22);
    color: #6d4fb0;
    font-size: 0.84rem;
    font-weight: 700;
}

.ai-card-badge__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.45rem;
    height: 1.45rem;
    border-radius: 50%;
    background: rgba(153, 111, 223, 0.14);
}

.catalog-toolbar__meta {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
}

.catalog-toolbar__ai {
    border-color: rgba(153, 111, 223, 0.24);
    color: #6d4fb0;
    background: rgba(249, 245, 255, 0.92);
}

    .catalog-toolbar__ai:hover:not(:disabled) {
        background: rgba(245, 238, 255, 1);
    }

.ai-catalog-summary {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.8rem;
    padding: 0.95rem 1.1rem;
    border: 1px solid rgba(153, 111, 223, 0.16);
    background: linear-gradient(180deg, rgba(251, 248, 255, 0.96), rgba(248, 251, 255, 0.96));
    color: #5f4f7c;
}

.ai-variant-assistant {
    display: grid;
    gap: 0.9rem;
    margin-top: 1rem;
    padding: 1rem 1.05rem;
    border-radius: 24px;
    border: 1px solid rgba(153, 111, 223, 0.16);
    background: radial-gradient(circle at top right, rgba(207, 184, 255, 0.16), transparent 30%), linear-gradient(180deg, rgba(252, 249, 255, 0.96), rgba(248, 251, 255, 0.96));
}

.ai-variant-assistant__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

    .ai-variant-assistant__header p,
    .ai-variant-assistant__note {
        margin: 0;
        color: var(--text-muted);
        line-height: 1.8;
    }

.ai-variant-assistant__button {
    flex: 0 0 auto;
    white-space: nowrap;
}

.ai-variant-assistant__note {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.85rem 0.95rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.72);
}

.ai-size-modal {
    gap: 1.2rem;
}

.ai-size-modal__state {
    display: grid;
    gap: 0.9rem;
}

.ai-size-modal__result {
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(153, 111, 223, 0.18);
    background: radial-gradient(circle at top right, rgba(207, 184, 255, 0.18), transparent 34%), linear-gradient(180deg, rgba(252, 249, 255, 0.96), rgba(248, 251, 255, 0.96));
}

.ai-size-modal__score {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 70px;
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    background: rgba(110, 74, 184, 0.08);
    color: #6e4ab8;
    font-weight: 700;
}

.ai-size-modal__alternatives {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    color: var(--text-muted);
}

    .ai-size-modal__alternatives span {
        padding: 0.45rem 0.7rem;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.78);
        border: 1px solid rgba(153, 111, 223, 0.14);
    }

.variant-option.variant-option--ai {
    border-color: rgba(153, 111, 223, 0.34);
    box-shadow: 0 0 0 3px rgba(177, 140, 238, 0.08);
}

.variant-option.is-active.variant-option--ai {
    background: rgba(245, 239, 255, 0.98);
    border-color: rgba(153, 111, 223, 0.52);
    box-shadow: 0 0 0 3px rgba(177, 140, 238, 0.14), 0 10px 22px rgba(95, 68, 150, 0.08);
}

.ai-compose-form {
    display: grid;
    gap: 0.8rem;
}

    .ai-compose-form textarea {
        min-height: 132px;
        resize: vertical;
    }

.ai-compose-form__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.ai-compose-form__hint {
    color: var(--text-muted);
    font-size: 0.92rem;
}

@media (max-width: 960px) {
    .ai-chat-layout,
    .ai-home-callout {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: stretch;
    }

    .ai-home-callout__cta {
        width: 100%;
    }
}

@media (max-width: 780px) {
    .ai-page-shell {
        padding-block: 1rem 5.5rem;
    }

    .ai-chat-history {
        min-height: 280px;
        max-height: none;
    }

    .ai-compose-form__footer,
    .ai-chat-panel__header {
        flex-direction: column;
        align-items: stretch;
    }

        .ai-compose-form__footer .button-primary {
            width: 100%;
        }

    .ai-variant-assistant__header,
    .catalog-toolbar__meta {
        flex-direction: column;
        align-items: stretch;
    }

    .ai-variant-assistant__button,
    .catalog-toolbar__ai {
        width: 100%;
        justify-content: center;
    }
}

@keyframes ai-orb-pulse {
    0%, 100% {
        transform: scale(0.96);
        box-shadow: 0 0 0 6px rgba(195, 156, 255, 0.12), 0 0 28px rgba(143, 107, 220, 0.22);
    }

    50% {
        transform: scale(1.08);
        box-shadow: 0 0 0 10px rgba(195, 156, 255, 0.16), 0 0 34px rgba(143, 107, 220, 0.3);
    }
}

@keyframes ai-dot-bounce {
    0%, 80%, 100% {
        opacity: 0.35;
        transform: translateY(0);
    }

    40% {
        opacity: 1;
        transform: translateY(-3px);
    }
}

.store-section--showcase .store-card__footer {
    align-items: flex-end;
    gap: 0.6rem;
}

    .store-section--showcase .store-card__footer .button-ghost {
        padding: 0;
        font-weight: 700;
    }

@media (max-width: 960px) {
    .store-section--showcase .store-section__layout {
        grid-template-columns: 1fr;
    }

    .store-section--showcase .store-section__feature {
        position: relative;
        top: auto;
        min-height: 0;
    }
}

@media (max-width: 780px) {
    .mobile-hero-search {
        justify-items: center;
    }

    .mobile-header-shell--hero-search .nav-shell {
        padding-block: 1rem 0;
    }

    .mobile-header-shell--hero-search .mobile-hero-search__form {
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 0.75rem 0.95rem;
    }

    .store-section--showcase .store-section__feature {
        padding: 1.35rem 1rem;
    }

    .store-section--showcase .store-section__products {
        gap: 0.2rem;
    }

    .store-section--showcase .store-section__scroll {
        height: 100%;
    }

    .store-section--showcase .store-section__rail {
        grid-auto-columns: minmax(260px, 300px);
        gap: 1rem;
        padding-bottom: 0.45rem;
        scroll-padding-inline: 0.35rem;
    }
}


.product-review-ai-summary {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    margin-top: .85rem;
    padding: .9rem 1rem;
    border: 1px solid rgba(111, 66, 193, .22);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(111, 66, 193, .08), rgba(255, 255, 255, .94));
}

    .product-review-ai-summary p {
        margin: 0;
        color: var(--text-muted, #5f5f66);
    }

.product-review-ai-insight {
    display: grid;
    gap: .75rem;
    margin-top: .85rem;
    padding: .9rem 1rem;
    border: 1px solid rgba(111, 66, 193, .16);
    border-radius: 18px;
    background: rgba(250, 247, 255, .95);
}

.product-review-ai-insight__header {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    color: #6d4fb0;
}

.product-review-ai-insight__grid {
    display: grid;
    gap: .65rem;
}

.product-review-ai-insight__item {
    display: grid;
    gap: .2rem;
}

    .product-review-ai-insight__item span {
        font-size: .82rem;
        color: #7a7292;
    }

    .product-review-ai-insight__item strong {
        color: #443a5b;
        line-height: 1.7;
    }

.ai-outfit-panel {
    margin-top: 1rem;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(111, 66, 193, .2);
    background: linear-gradient(180deg, rgba(111, 66, 193, .08), rgba(255, 255, 255, .98));
}

    .ai-outfit-panel p {
        margin: .35rem 0 0;
    }

.catalog-ai-bar {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    margin-bottom: 1rem;
    padding: .7rem 1rem;
    border-radius: 999px;
    background: rgba(111, 66, 193, .08);
    border: 1px solid rgba(111, 66, 193, .18);
}

.admin-ai-insights {
    margin-top: 1.5rem;
}

.admin-ai-history {
    min-height: 16rem;
}