/*
 * Star Cash - Customer Portal Page Refinements
 * -----------------------------------------------------------------------
 * Depends on shop-design-system.css (tokens + base components). This file
 * only holds layout rules for specific page types: product page, wallet,
 * auth pages, orders list, deposits list, search, profile forms.
 *
 * A small "legacy" section at the bottom keeps the pre-redesign shop.*
 * blade views (index/category/product/orders) usable until they are
 * migrated to the new sc- component classes.
 */

/* ==========================================================================
   Page header (title + subtitle used at the top of most shop pages)
   ========================================================================== */

.sc-page-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.sc-page-head h1 {
    margin: 0 0 4px;
    font-size: 20px;
    font-weight: 800;
}

.sc-page-head p {
    margin: 0;
    color: var(--sc-muted);
    font-size: 12.5px;
}

/* ==========================================================================
   Product page
   ========================================================================== */

.sc-product-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    align-items: start;
}

@media (min-width: 720px) {
    .sc-product-layout { grid-template-columns: 300px 1fr; }
}

.sc-product-gallery {
    padding: 0;
    overflow: hidden;
}

.sc-product-gallery img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }

.sc-product-info h1 { margin: 0 0 4px; font-size: 19px; font-weight: 800; }

.sc-product-info__category { margin: 0 0 14px; color: var(--sc-muted); font-size: 12.5px; }

.sc-quote-box {
    margin-bottom: 16px;
    padding: 12px 14px;
    border-radius: var(--sc-radius);
    background: var(--sc-primary-bg);
    border: 1px solid var(--sc-primary-border);
    font-size: 13px;
}

.sc-quote-box strong { color: var(--sc-primary-text); }

.sc-quote-box__price { font-size: 17px; font-weight: 800; direction: ltr; display: inline-block; }

.sc-quote-box__meta { margin-top: 6px; color: var(--sc-muted); font-size: 12px; }

.sc-req-list { display: flex; flex-direction: column; gap: 14px; margin-bottom: 4px; }

.sc-product-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.sc-product-actions .sc-btn { flex: 1; min-width: 140px; }

@media (min-width: 480px) {
    .sc-product-actions .sc-btn { flex: 0 0 auto; }
}

/* ==========================================================================
   Wallet
   ========================================================================== */

.sc-wallet-hero {
    padding: 20px;
    border-radius: var(--sc-radius-lg);
    background: linear-gradient(135deg, var(--sc-primary) 0%, var(--sc-primary-hover) 100%);
    color: var(--sc-primary-contrast);
    margin-bottom: 16px;
}

.sc-wallet-hero__label { font-size: 12.5px; opacity: 0.9; font-weight: 700; margin-bottom: 6px; }

.sc-wallet-hero__value { font-size: 30px; font-weight: 800; direction: ltr; }

.sc-wallet-hero__actions { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }

.sc-wallet-hero__actions .sc-btn {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.3);
    color: var(--sc-primary-contrast);
}

.sc-wallet-hero__actions .sc-btn:hover { background: rgba(255, 255, 255, 0.28); border-color: rgba(255, 255, 255, 0.5); color: var(--sc-primary-contrast); }

.sc-wallet-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 18px;
}

@media (min-width: 640px) {
    .sc-wallet-grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
}

.sc-wallet-card {
    padding: 14px;
    border-radius: var(--sc-radius);
    background: var(--sc-surface);
    border: 1px solid var(--sc-border);
}

.sc-wallet-card__code { font-size: 11px; font-weight: 800; color: var(--sc-muted); letter-spacing: 0.03em; }

.sc-wallet-card__value { font-size: 17px; font-weight: 800; margin-top: 6px; direction: ltr; }

/* ==========================================================================
   Auth pages (login / register / forgot password) - centered card
   ========================================================================== */

.sc-auth-shell {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px 16px 48px;
    min-height: calc(100vh - var(--sc-header-h));
}

.sc-auth-card {
    width: 100%;
    max-width: 400px;
    padding: 26px 24px;
    background: var(--sc-surface);
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    box-shadow: var(--sc-shadow);
}

.sc-auth-card__brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 18px;
    font-size: 20px;
    font-weight: 800;
}

.sc-auth-card__brand span { color: var(--sc-primary); }

.sc-auth-card h1 {
    margin: 0 0 4px;
    font-size: 17px;
    font-weight: 800;
    text-align: center;
}

.sc-auth-card p.sc-auth-card__sub {
    margin: 0 0 20px;
    text-align: center;
    color: var(--sc-muted);
    font-size: 12.5px;
}

.sc-auth-card__divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 18px 0;
    color: var(--sc-muted);
    font-size: 11.5px;
}

.sc-auth-card__divider::before,
.sc-auth-card__divider::after { content: ""; flex: 1; height: 1px; background: var(--sc-border); }

.sc-auth-card__foot { margin-top: 18px; text-align: center; font-size: 12.5px; color: var(--sc-muted); }

.sc-auth-card__foot a { color: var(--sc-primary-text); font-weight: 700; text-decoration: none; }

.sc-social-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-surface);
    color: var(--sc-text);
    font: inherit;
    font-size: 13.5px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}

.sc-social-btn:hover { border-color: var(--sc-primary); background: var(--sc-primary-bg); }

.sc-auth-card__icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    margin: 0 auto 14px;
    border-radius: var(--sc-radius-lg);
    color: var(--sc-primary-text);
    background: var(--sc-primary-bg);
}

.sc-suspended-card {
    max-width: 460px;
    padding: 30px 28px 24px;
    text-align: center;
}

.sc-suspended-card .sc-auth-card__icon {
    width: 58px;
    height: 58px;
    margin-bottom: 16px;
    border: 1px solid var(--sc-primary-border);
    border-radius: 50%;
}

.sc-suspended-card h1 {
    max-width: 360px;
    margin-inline: auto;
    font-size: 19px;
    line-height: 1.65;
}

.sc-suspended-card p.sc-auth-card__sub {
    max-width: 340px;
    margin: 7px auto 0;
    line-height: 1.8;
}

.sc-suspended-card__contacts {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--sc-border);
}

.sc-suspended-card__contacts .sc-drawer-socials__title { margin-bottom: 10px; }
.sc-suspended-card__contacts .sc-drawer-socials__link { width: 44px; height: 44px; }

.sc-suspended-card__logout {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--sc-border);
}

.sc-suspended-card__logout .sc-btn {
    width: auto;
    min-width: 150px;
    margin-inline: auto;
}
.sc-auth-form { display: grid; gap: 2px; }
.sc-auth-alert { margin-bottom: 14px; }
.sc-auth-submit { width: 100%; min-height: 46px; margin-top: 4px; }
.sc-auth-trust-note {
    padding: 10px 12px;
    margin-bottom: 12px;
    border-radius: var(--sc-radius-sm);
    background: var(--sc-surface-2);
    color: var(--sc-muted);
    font-size: 12px;
    line-height: 1.75;
}
.sc-auth-card__foot { display: flex; justify-content: center; flex-wrap: wrap; gap: 7px; }
.sc-google-mark { font: 800 18px/1 Arial, sans-serif; color: #4285f4; }
.sc-totp-input { min-height: 48px; text-align: center; letter-spacing: .12em; font-weight: 800; }

@media (max-width: 480px) {
    .sc-auth-shell { padding: 18px 0 34px; align-items: flex-start; }
    .sc-auth-card { padding: 22px 16px; border-radius: var(--sc-radius); }
    .sc-suspended-card { padding: 26px 18px 20px; }
}

/* Public customer registration */
.sc-register-page {
    width: 100%;
    max-width: 860px;
    margin: 0 auto;
}

.sc-register-page--compact { max-width: 720px; }

.sc-register-head {
    margin-bottom: 16px;
    text-align: center;
}

.sc-register-head h1 {
    margin: 0 0 5px;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.45;
}

.sc-register-head p {
    margin: 0;
    color: var(--sc-muted);
    font-size: 13px;
    line-height: 1.7;
}

.sc-register-form { padding: 20px; }

.sc-register-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px 18px;
}

.sc-register-grid .form-row {
    min-width: 0;
    margin: 0;
}

.sc-register-grid__full { grid-column: 1 / -1; }

.sc-register-form .field {
    min-height: 44px;
    line-height: 1.4;
}

.sc-register-form .shop-err {
    margin: 5px 0 0;
    padding: 0;
    border: 0;
    background: transparent;
    font-size: 11.5px;
    line-height: 1.6;
}

.sc-register-password {
    position: relative;
    min-width: 0;
}

.sc-register-password .field { padding-inline-end: 48px; }

.sc-register-password__toggle {
    position: absolute;
    inset-inline-end: 4px;
    top: 50%;
    width: 38px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--sc-muted);
    font: inherit;
    line-height: 1;
    cursor: pointer;
    transform: translateY(-50%);
}

.sc-register-password__toggle:hover,
.sc-register-password__toggle:focus-visible {
    background: var(--sc-surface-2);
    color: var(--sc-text);
}

.sc-register-password__generate {
    margin-top: 7px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--sc-primary-text);
    font: inherit;
    font-size: 11.5px;
    font-weight: 800;
    cursor: pointer;
}

.sc-register-phone {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 8px;
    min-width: 0;
    direction: ltr;
}

.sc-register-phone .field { min-width: 0; }

.sc-register-phone__dial {
    text-align: center;
    font-weight: 800;
    background: var(--sc-surface-2);
}

.sc-register-actions {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
    margin-top: 18px;
}

.sc-register-actions .btn { min-width: 130px; }

.sc-register-login {
    margin-top: 15px;
    text-align: center;
    font-size: 13px;
}

.sc-register-login a {
    color: var(--sc-primary-text);
    font-weight: 800;
    text-decoration: none;
}

.sc-register-summary {
    display: flex;
    justify-content: center;
    gap: 8px 24px;
    flex-wrap: wrap;
    margin-bottom: 13px;
    padding: 13px 16px;
    font-size: 13px;
}

.sc-register-form .country-combobox {
    position: relative;
    min-width: 0;
}

.sc-register-form .country-combobox-display {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    text-align: start;
    cursor: pointer;
}

.sc-register-form .country-combobox-display-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    width: 100%;
}

.sc-register-form .country-combobox-display-label .cc-name,
.sc-register-form .country-combobox-option .cc-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sc-register-form .country-combobox-display-label .cc-meta,
.sc-register-form .country-combobox-option .cc-meta {
    flex: 0 0 auto;
    color: var(--sc-muted);
    font-size: 11px;
    font-weight: 700;
}

.sc-register-form .country-combobox-display-label .cc-placeholder {
    color: var(--sc-muted);
}

.sc-register-form .country-combobox-caret {
    flex: 0 0 auto;
    color: var(--sc-muted);
    font-size: 12px;
}

.sc-register-form .country-combobox-panel {
    position: absolute;
    z-index: 80;
    inset-inline: 0;
    top: calc(100% + 6px);
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-surface);
    box-shadow: var(--sc-shadow);
}

.sc-register-form .country-combobox-panel[hidden] { display: none !important; }

.sc-register-form .country-combobox-search-wrap {
    padding: 8px;
    border-bottom: 1px solid var(--sc-border);
}

.sc-register-form .country-combobox-input { min-height: 40px; }

.sc-register-form .country-combobox-results {
    max-height: 250px;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.sc-register-form .country-combobox-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    min-height: 42px;
    padding: 8px 11px;
    border: 0;
    border-bottom: 1px solid var(--sc-border);
    background: var(--sc-surface);
    color: var(--sc-text);
    font: inherit;
    font-size: 12.5px;
    text-align: start;
    cursor: pointer;
}

.sc-register-form .country-combobox-option:last-child { border-bottom: 0; }

.sc-register-form .country-combobox-option:hover,
.sc-register-form .country-combobox-option.is-selected {
    background: var(--sc-primary-bg);
    color: var(--sc-primary-text);
}

.sc-register-form .country-combobox-empty {
    padding: 13px;
    color: var(--sc-muted);
    font-size: 12px;
    text-align: center;
}

@media (max-width: 700px) {
    .sc-register-grid { grid-template-columns: minmax(0, 1fr); gap: 13px; }
    .sc-register-grid__full { grid-column: auto; }
}

@media (max-width: 480px) {
    .sc-register-form { padding: 14px; }
    .sc-register-head { margin-bottom: 13px; }
    .sc-register-head h1 { font-size: 20px; }
    .sc-register-phone { grid-template-columns: 84px minmax(0, 1fr); gap: 6px; }
    .sc-register-actions { align-items: stretch; flex-direction: column; }
    .sc-register-actions .btn { width: 100%; min-width: 0; }
    .sc-register-form .country-combobox-results { max-height: min(240px, 45vh); }
}

/* Customer security center */
.sc-security-page-head { margin-bottom: 18px; }
.sc-security-page-head h1 { margin: 0 0 5px; font-size: 23px; }
.sc-security-page-head p { margin: 0; color: var(--sc-muted); font-size: 13px; }
.sc-security-alert { margin-bottom: 14px; }
.sc-security-grid { display: grid; gap: 14px; }
.sc-security-card {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius);
    background: var(--sc-surface);
}
.sc-security-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 15px; }
.sc-security-card__head h2 { margin: 0 0 4px; font-size: 16px; }
.sc-security-card__head p { margin: 0; color: var(--sc-muted); font-size: 12.5px; line-height: 1.7; }
.sc-security-status { display: inline-flex; align-items: center; min-height: 30px; padding: 4px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.sc-security-status.is-on { color: var(--sc-success-text); background: var(--sc-success-bg); }
.sc-security-status.is-off { color: var(--sc-muted); background: var(--sc-surface-2); }
.sc-security-note { padding: 11px 13px; border-radius: var(--sc-radius-sm); background: var(--sc-surface-2); color: var(--sc-muted); font-size: 12.5px; line-height: 1.8; }
.sc-security-form { display: grid; gap: 9px; }
.sc-security-card--danger { border-color: var(--sc-danger-border); }
.sc-security-card--danger h2 { color: var(--sc-danger-text); }
.sc-security-card--compact { padding: 15px; }
.sc-security-card--compact .sc-security-card__head { margin-bottom: 12px; }
.sc-security-card--trusted { align-self: start; }
.sc-twofa-setup { display: grid; gap: 16px; }
.sc-twofa-qr { display: grid; place-items: center; padding: 12px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius); background: #fff; }
.sc-twofa-qr svg { display: block; width: min(230px, 100%); height: auto; }
.sc-twofa-setup__content ol { margin: 0 0 12px; padding-inline-start: 20px; font-size: 13px; line-height: 1.9; }
.sc-twofa-secret { padding: 11px; margin-bottom: 13px; border: 1px dashed var(--sc-border); border-radius: var(--sc-radius-sm); overflow-wrap: anywhere; text-align: center; font: 700 13px/1.8 ui-monospace, monospace; }
.sc-recovery-box { padding: 17px; margin-bottom: 15px; border: 1px solid #f59e0b; border-radius: var(--sc-radius); background: #fffbeb; color: #78350f; }
.sc-recovery-box h2 { margin: 0 0 5px; font-size: 17px; }
.sc-recovery-box p { margin: 0; font-size: 13px; line-height: 1.7; }
.sc-recovery-codes { display: grid; gap: 8px; margin-top: 13px; }
.sc-recovery-codes code { padding: 9px; border-radius: var(--sc-radius-sm); background: #fff; text-align: center; font: 800 13px ui-monospace, monospace; direction: ltr; }
.sc-product-purchase-verification { max-width: 320px; margin-bottom: 12px; }
.sc-product-purchase-verification .sc-totp-input { min-height: 44px; }

/* Persistent customer security warning */
.sc-twofa-warning-shell { padding-block: 10px 0; }
.sc-twofa-warning {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--sc-warning-border);
    border-radius: var(--sc-radius);
    background: var(--sc-warning-bg);
    color: var(--sc-warning-text);
}
.sc-twofa-warning p { min-width: 0; margin: 0; font-size: 12.5px; font-weight: 700; line-height: 1.65; }
.sc-twofa-warning__action {
    flex: 0 0 auto;
    min-height: 38px;
    border-color: var(--sc-warning);
    background: var(--sc-warning);
    color: var(--sc-warning-contrast);
}
.sc-twofa-warning__action:hover { color: var(--sc-warning-contrast); filter: brightness(.96); }

/* Administration topbar button geometry, applied to the matching customer controls. */
.sc-admin-topbar-button {
    width: 43px;
    height: 43px;
    padding: 0;
    border: 1px solid var(--sc-border);
    border-radius: 11px;
    background: var(--sc-surface);
    color: var(--sc-text);
    font-size: 19px;
    line-height: 1;
    transform: none;
}
.sc-admin-topbar-button:hover,
.sc-admin-topbar-button[aria-expanded="true"] {
    border-color: var(--sc-primary);
    background: var(--sc-surface);
    color: var(--sc-text);
    transform: none;
}
.sc-admin-topbar-button:active { transform: translateY(1px); }
.sc-admin-notification-button { position: relative; }
[data-sc-theme-current] { display: inline-flex; align-items: center; justify-content: center; }
[data-sc-theme-current][hidden] { display: none !important; }
.sc-admin-topbar-icon { display: inline-flex; align-items: center; justify-content: center; line-height: 0; }

@media (min-width: 760px) {
    .sc-security-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-security-card--wide { grid-column: 1 / -1; }
    .sc-twofa-setup { grid-template-columns: 250px minmax(0, 1fr); align-items: start; }
    .sc-recovery-codes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
    .sc-security-card { padding: 15px; }
    .sc-security-card__head { flex-direction: column; }
    .sc-twofa-warning { align-items: stretch; flex-direction: column; gap: 8px; }
    .sc-twofa-warning__action { width: 100%; }
    .sc-product-purchase-verification { max-width: none; }
}
[data-theme="dark"] .sc-recovery-box { background: #422006; color: #fde68a; }
[data-theme="dark"] .sc-recovery-codes code { background: #292524; color: #fef3c7; }

/* ==========================================================================
   Orders list
   ========================================================================== */

.sc-orders-list { display: flex; flex-direction: column; gap: 10px; }

.sc-order-row {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 14px;
    background: var(--sc-surface);
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius);
    text-decoration: none;
    color: inherit;
}

.sc-order-row:hover { border-color: var(--sc-primary-border); box-shadow: var(--sc-shadow-sm); }

.sc-order-row__num { font-size: 11px; color: var(--sc-muted); direction: ltr; text-align: start; margin-bottom: 2px; }

.sc-order-row__title { font-size: 13.5px; font-weight: 700; }

.sc-order-row__date { font-size: 11px; color: var(--sc-muted); margin-top: 3px; }

.sc-order-row__end { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }

.sc-order-row__price { font-size: 13px; font-weight: 800; direction: ltr; }

.sc-order-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    font-size: 13px;
}

.sc-order-detail-grid dt { color: var(--sc-muted); font-size: 11.5px; font-weight: 700; margin-bottom: 2px; }
.sc-order-detail-grid dd { margin: 0; font-weight: 700; }

/* ==========================================================================
   Deposits list
   ========================================================================== */

.sc-deposits-list { display: flex; flex-direction: column; gap: 10px; }

.sc-deposit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px;
    background: var(--sc-surface);
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius);
}

.sc-deposit-row__method { font-size: 13.5px; font-weight: 700; }

.sc-deposit-row__date { font-size: 11px; color: var(--sc-muted); margin-top: 3px; }

.sc-deposit-row__amount { font-size: 14px; font-weight: 800; direction: ltr; }

/* ========================================================================== 
   Customer deposit history
   ========================================================================== */

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

.sc-deposit-history {
    --sc-deposit-pending-tint: #fff7ed;
    --sc-deposit-accepted-tint: #f0fdf4;
    --sc-deposit-rejected-tint: #fff1f2;
    width: 100%;
    min-width: 0;
}
html[data-theme="dark"] .sc-deposit-history {
    --sc-deposit-pending-tint: rgba(234, 88, 12, .11);
    --sc-deposit-accepted-tint: rgba(34, 197, 94, .10);
    --sc-deposit-rejected-tint: rgba(239, 68, 68, .11);
}
@media (prefers-color-scheme: dark) {
    html[data-theme="system"] .sc-deposit-history {
        --sc-deposit-pending-tint: rgba(234, 88, 12, .11);
        --sc-deposit-accepted-tint: rgba(34, 197, 94, .10);
        --sc-deposit-rejected-tint: rgba(239, 68, 68, .11);
    }
}

.sc-deposit-history__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
}
.sc-deposit-history__head h1 { margin: 0; font-size: clamp(21px, 3vw, 27px); font-weight: 900; }
.sc-deposit-history__head .sc-btn { flex: 0 0 auto; min-height: 44px; }

.sc-deposit-history-filters {
    display: grid;
    grid-template-columns: minmax(260px, 1.8fr) repeat(2, minmax(150px, 1fr)) auto;
    align-items: end;
    gap: 10px;
    margin-bottom: 16px;
    padding: 14px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
}
.sc-deposit-history-filters > label { display: grid; min-width: 0; gap: 5px; }
.sc-deposit-history-filters > label > span:not(.sc-visually-hidden) { color: var(--sc-muted); font-size: 10.5px; font-weight: 800; }
.sc-deposit-history-filters .sc-input,
.sc-deposit-history-filters .sc-select {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    border-radius: var(--sc-radius-sm);
    font-size: 12px;
}
.sc-deposit-history-search { align-self: end; }
.sc-deposit-history-search .sc-input { padding-inline: 14px; font-size: 13px; }
.sc-deposit-history-filters__reset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding-inline: 12px;
    border-radius: var(--sc-radius-sm);
    background: var(--sc-secondary-bg);
    color: var(--sc-secondary-text);
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}
.sc-deposit-history-live {
    margin: -5px 0 10px;
    color: var(--sc-muted);
    font-size: 11px;
}
.sc-deposit-history-live[hidden] { display: none; }
[data-deposit-history-results].is-loading { opacity: .62; pointer-events: none; }

.sc-deposit-history-table-wrap {
    max-width: 100%;
    overflow: hidden;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
    box-shadow: var(--sc-shadow-sm);
}
.sc-deposit-history-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    color: var(--sc-text);
    font-size: 12px;
}
.sc-deposit-history-table th {
    padding: 12px 10px;
    border-bottom: 1px solid var(--sc-border-strong);
    background: var(--sc-surface-2);
    color: var(--sc-muted);
    font-size: 10.5px;
    font-weight: 900;
    text-align: start;
}
.sc-deposit-history-table th:nth-child(1) { width: 12%; }
.sc-deposit-history-table th:nth-child(2),
.sc-deposit-history-table th:nth-child(3) { width: 18%; }
.sc-deposit-history-table th:nth-child(4) { width: 18%; }
.sc-deposit-history-table th:nth-child(5) { width: 14%; }
.sc-deposit-history-table th:nth-child(6) { width: 20%; }
.sc-deposit-sort {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    min-height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: inherit;
    text-align: start;
    cursor: pointer;
}
.sc-deposit-sort > span {
    position: relative;
    width: 10px;
    height: 14px;
    flex: 0 0 10px;
    opacity: .42;
}
.sc-deposit-sort > span::before,
.sc-deposit-sort > span::after {
    position: absolute;
    inset-inline-start: 1px;
    content: '';
    border-inline: 4px solid transparent;
}
.sc-deposit-sort > span::before { inset-block-start: 1px; border-bottom: 5px solid currentColor; }
.sc-deposit-sort > span::after { inset-block-end: 1px; border-top: 5px solid currentColor; }
.sc-deposit-sort[data-sort-direction="asc"] > span,
.sc-deposit-sort[data-sort-direction="desc"] > span { opacity: 1; color: var(--sc-primary); }
.sc-deposit-sort[data-sort-direction="asc"] > span::after { opacity: .22; }
.sc-deposit-sort[data-sort-direction="desc"] > span::before { opacity: .22; }
.sc-deposit-sort:hover { color: var(--sc-primary-text); }
.sc-deposit-sort:focus-visible { outline: none; border-radius: 4px; box-shadow: var(--sc-focus-ring); }
.sc-deposit-summary-row { cursor: pointer; }
.sc-deposit-summary-row td {
    padding: 13px 10px;
    border-bottom: 1px solid var(--sc-border);
    background: var(--sc-deposit-row-bg, var(--sc-surface));
    vertical-align: middle;
    overflow-wrap: anywhere;
    transition: filter .16s ease, background .16s ease;
}
.sc-deposit-record:last-child .sc-deposit-summary-row td { border-bottom: 0; }
.sc-deposit-summary-row:hover td { filter: brightness(.985); }
.sc-deposit-summary-row:focus-visible { outline: none; }
.sc-deposit-summary-row:focus-visible td { box-shadow: inset 0 0 0 2px var(--sc-primary-border); }
.sc-deposit-record--pending { --sc-deposit-row-bg: var(--sc-deposit-pending-tint); }
.sc-deposit-record--accepted { --sc-deposit-row-bg: var(--sc-deposit-accepted-tint); }
.sc-deposit-record--rejected { --sc-deposit-row-bg: var(--sc-deposit-rejected-tint); }

.sc-deposit-money {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    max-width: 100%;
    white-space: nowrap;
}
.sc-deposit-money strong { font-size: 12.5px; }
.sc-deposit-money span { color: var(--sc-muted); font-size: 10px; font-weight: 800; }
.sc-deposit-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
}
.sc-deposit-status--pending { background: var(--sc-warning-bg); color: var(--sc-warning-text); }
.sc-deposit-status--accepted { background: var(--sc-success-bg); color: var(--sc-success-text); }
.sc-deposit-status--rejected { background: var(--sc-danger-bg); color: var(--sc-danger-text); }

.sc-deposit-detail-row[hidden] { display: none; }
.sc-deposit-detail-row > td { padding: 0; border-bottom: 1px solid var(--sc-border); background: var(--sc-surface); }
.sc-deposit-record:last-child .sc-deposit-detail-row > td { border-bottom: 0; }
.sc-deposit-detail-panel { min-width: 0; padding: 13px 14px; }
.sc-deposit-detail-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--sc-border);
}
.sc-deposit-detail-head > div:first-child { display: flex; align-items: center; gap: 10px; }
.sc-deposit-detail-head > div:first-child > strong { font-size: 17px; font-weight: 900; }
.sc-deposit-detail-head__meta { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; color: var(--sc-muted); font-size: 11px; }
.sc-deposit-detail-head__meta span { padding: 4px 8px; border-radius: 999px; background: var(--sc-surface-2); }

.sc-deposit-notice {
    display: grid;
    gap: 3px;
    margin-top: 12px;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: var(--sc-radius-sm);
    font-size: 12px;
    line-height: 1.7;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
.sc-deposit-notice--pending { border-color: var(--sc-warning-border); background: var(--sc-warning-bg); color: var(--sc-warning-text); font-weight: 800; }
.sc-deposit-notice--rejected { border-color: var(--sc-danger-border); background: var(--sc-danger-bg); color: var(--sc-danger-text); }

.sc-deposit-detail-section { margin-top: 11px; }
.sc-deposit-detail-section + .sc-deposit-detail-section { padding-top: 11px; border-top: 1px solid var(--sc-border); }
.sc-deposit-detail-section h3 { margin: 0 0 7px; color: var(--sc-text); font-size: 12px; font-weight: 900; }
.sc-deposit-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.sc-deposit-stat {
    display: grid;
    align-content: center;
    gap: 2px;
    min-width: 0;
    min-height: 54px;
    padding: 6px 8px;
    border-radius: var(--sc-radius-sm);
    background: var(--sc-surface-2);
}
.sc-deposit-stat--sent { background: var(--sc-info-bg); }
.sc-deposit-stat--credited { background: var(--sc-success-bg); }
.sc-deposit-stat > span { color: var(--sc-muted); font-size: 8.5px; font-weight: 800; line-height: 1.35; }
.sc-deposit-stat > strong { color: var(--sc-text); font-size: 13px; font-weight: 900; line-height: 1.35; overflow-wrap: anywhere; }
.sc-deposit-stat > strong small { margin-inline-start: 4px; color: var(--sc-muted); font-size: 9px; }

.sc-deposit-timeline { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.sc-deposit-timeline > div { display: grid; gap: 4px; min-width: 0; padding: 9px 10px; border-inline-start: 3px solid var(--sc-primary-border); background: var(--sc-surface-2); }
.sc-deposit-timeline span { color: var(--sc-muted); font-size: 9.5px; font-weight: 800; }
.sc-deposit-timeline time,
.sc-deposit-timeline strong { color: var(--sc-text); font-size: 11.5px; font-weight: 800; overflow-wrap: anywhere; }

.sc-deposit-receipt { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; color: var(--sc-muted); font-size: 11px; font-weight: 800; }
.sc-deposit-thumbnail {
    width: 104px;
    height: 78px;
    flex: 0 0 auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-surface-2);
    cursor: zoom-in;
}
.sc-deposit-thumbnail--small { width: 74px; height: 56px; }
.sc-deposit-thumbnail img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sc-deposit-thumbnail:hover { border-color: var(--sc-primary-border); }
.sc-deposit-thumbnail:focus-visible { outline: none; box-shadow: var(--sc-focus-ring); }

.sc-deposit-requirement-list { display: grid; gap: 8px; margin: 0; }
.sc-deposit-requirement-list > div { display: grid; grid-template-columns: minmax(120px, .4fr) minmax(0, 1fr); gap: 12px; align-items: center; padding: 9px 10px; border-radius: var(--sc-radius-sm); background: var(--sc-surface-2); }
.sc-deposit-requirement-list dt { color: var(--sc-muted); font-size: 10px; font-weight: 900; overflow-wrap: anywhere; }
.sc-deposit-requirement-list dd { min-width: 0; margin: 0; color: var(--sc-text); font-size: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }

.sc-deposit-pagination { display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; margin-top: 16px; }
.sc-deposit-pagination a,
.sc-deposit-pagination > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    min-height: 38px;
    padding: 6px 10px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-surface);
    color: var(--sc-text);
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
}
.sc-deposit-pagination a:hover { border-color: var(--sc-primary-border); color: var(--sc-primary-text); }
.sc-deposit-pagination .is-current { border-color: var(--sc-primary); background: var(--sc-primary); color: var(--sc-primary-contrast); }
.sc-deposit-pagination .is-disabled { opacity: .45; }
.sc-deposit-pagination .sc-deposit-pagination__ellipsis { min-width: 24px; padding-inline: 4px; border-color: transparent; background: transparent; }

.sc-deposit-history-empty {
    display: grid;
    place-items: center;
    gap: 12px;
    min-height: 260px;
    padding: 30px 18px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
    color: var(--sc-muted);
    text-align: center;
}
.sc-deposit-history-empty__icon { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: var(--sc-surface-2); color: var(--sc-primary-text); }
.sc-deposit-history-empty strong { color: var(--sc-text); font-size: 14px; }
.sc-deposit-history-empty .sc-btn { min-height: 44px; }

body.sc-deposit-lightbox-open { overflow: hidden; }
.sc-deposit-lightbox { position: fixed; inset: 0; z-index: 170; display: grid; place-items: center; padding: 16px; }
.sc-deposit-lightbox[hidden] { display: none; }
.sc-deposit-lightbox__backdrop { position: absolute; inset: 0; border: 0; background: rgba(2, 12, 11, .76); cursor: zoom-out; }
.sc-deposit-lightbox__dialog { position: relative; z-index: 1; display: grid; place-items: center; width: min(100%, 1100px); max-height: calc(100dvh - 32px); min-width: 0; }
.sc-deposit-lightbox__dialog img { display: block; width: auto; max-width: 100%; height: auto; max-height: calc(100dvh - 32px); object-fit: contain; border-radius: var(--sc-radius); box-shadow: var(--sc-shadow-lg); }
.sc-deposit-lightbox__close { position: absolute; z-index: 2; inset-block-start: 10px; inset-inline-end: 10px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .68); color: #fff; font: inherit; font-size: 27px; cursor: pointer; }
.sc-deposit-lightbox__close:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(255, 255, 255, .45); }

@media (max-width: 1080px) {
    .sc-deposit-history-filters { grid-template-columns: minmax(220px, 1.6fr) repeat(2, minmax(140px, 1fr)) auto; }
}

@media (max-width: 820px) {
    .sc-deposit-history-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-deposit-history-search { grid-column: 1 / -1; }
    .sc-deposit-history-table-wrap { overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
    .sc-deposit-history-table,
    .sc-deposit-history-table tbody,
    .sc-deposit-history-table tr,
    .sc-deposit-history-table td { display: block; width: 100%; box-sizing: border-box; }
    .sc-deposit-history-table { table-layout: auto; }
    .sc-deposit-history-table thead { display: none; }
    .sc-deposit-record { margin-bottom: 11px; overflow: hidden; border: 1px solid var(--sc-border); border-radius: var(--sc-radius); background: var(--sc-deposit-row-bg); box-shadow: var(--sc-shadow-sm); }
    .sc-deposit-summary-row { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 5px; }
    .sc-deposit-summary-row td { display: grid; grid-template-columns: minmax(82px, .75fr) minmax(0, 1fr); gap: 8px; align-items: center; min-width: 0; padding: 7px 8px; border: 0; background: transparent; }
    .sc-deposit-summary-row td::before { content: attr(data-label); color: var(--sc-muted); font-size: 9px; font-weight: 800; }
    .sc-deposit-summary-row td.sc-deposit-cell-empty { display: none; }
    .sc-deposit-detail-row > td { border: 0; background: var(--sc-surface); }
    .sc-deposit-detail-panel { padding: 14px; border-top: 1px solid var(--sc-border); }
    .sc-deposit-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-deposit-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .sc-deposit-history__head { align-items: stretch; flex-direction: column; }
    .sc-deposit-history__head .sc-btn { width: 100%; }
    .sc-deposit-history-filters { grid-template-columns: minmax(0, 1fr); padding: 12px; }
    .sc-deposit-history-search { grid-column: auto; }
    .sc-deposit-history-filters__reset { width: 100%; }
    .sc-deposit-summary-row { grid-template-columns: minmax(0, 1fr) !important; }
    .sc-deposit-summary-row td { grid-template-columns: minmax(96px, .8fr) minmax(0, 1fr); }
    .sc-deposit-detail-head { align-items: flex-start; flex-direction: column; }
    .sc-deposit-detail-head__meta { justify-content: flex-start; }
    .sc-deposit-stats,
    .sc-deposit-timeline { grid-template-columns: minmax(0, 1fr); }
    .sc-deposit-requirement-list > div { grid-template-columns: minmax(0, 1fr); gap: 5px; }
    .sc-deposit-pagination { gap: 4px; }
    .sc-deposit-pagination a,
    .sc-deposit-pagination > span { min-width: 36px; min-height: 36px; padding-inline: 8px; }
}

/* ========================================================================== 
   Customer orders — final list and inline details
   ========================================================================== */
.sc-orders-page { display: grid; gap: 10px; min-width: 0; color: var(--sc-text); }
.sc-orders-head h1 { margin: 0; font-size: clamp(21px, 3vw, 27px); font-weight: 900; }
.sc-orders-toolbar { display: grid; grid-template-columns: auto minmax(240px, 1fr); align-items: center; gap: 10px; padding: 11px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius-lg); background: var(--sc-surface); }
.sc-orders-date-filter { display: flex; align-items: center; gap: 7px; }
.sc-orders-search .sc-input { width: 100%; height: 42px; font-size: 12.8px; }
.sc-orders-date-search { display: inline-grid; place-items: center; width: 42px; height: 42px; flex: 0 0 42px; border: 0; border-radius: var(--sc-radius); background: var(--sc-primary); color: var(--sc-primary-contrast); cursor: pointer; }
.sc-orders-date-search:focus-visible { outline: none; box-shadow: var(--sc-focus-ring); }
.sc-orders-page .sc-date-pill { position: relative; display: inline-flex; align-items: center; min-width: 174px; margin: 0; }
.sc-orders-page .sc-date-pill__label { position: absolute; z-index: 1; inset-block-start: -7px; inset-inline-start: 13px; padding: 0 5px; background: var(--sc-surface); color: var(--sc-muted); font-size: 10.6px; font-weight: 800; line-height: 1; pointer-events: none; }
.sc-orders-page .sc-date-pill__input { width: 100%; min-width: 174px; height: 42px; padding-block: 0; padding-inline: 13px 40px; border: 1px solid var(--sc-border); border-radius: 999px; background: var(--sc-surface); color: var(--sc-text); font: inherit; font-size: 12.7px; font-weight: 700; text-align: center; cursor: pointer; appearance: none; }
.sc-orders-page .sc-date-pill__input:focus { outline: none; border-color: var(--sc-primary); box-shadow: var(--sc-focus-ring); }
.sc-orders-page .sc-date-pill__icon { position: absolute; z-index: 2; inset-inline-end: 9px; inset-block-start: 50%; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; transform: translateY(-50%); border: 0; border-radius: 50%; background: transparent; color: var(--sc-muted); cursor: pointer; }
.sc-orders-live { min-height: 16px; color: var(--sc-muted); font-size: 11px; }
.sc-orders-live[hidden] { display: none; }
.sc-orders-summary { display: grid; grid-template-columns: minmax(0, 1fr) minmax(190px, auto); gap: 10px; margin-bottom: 10px; }
.sc-orders-statuses { display: grid; grid-template-columns: repeat(4, minmax(110px, 1fr)); gap: 7px; }
.sc-orders-status { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-height: 43px; padding: 7px 10px; border: 1px solid transparent; border-radius: var(--sc-radius); color: var(--sc-text); font-size: 11px; font-weight: 850; text-decoration: none; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.sc-orders-status:hover { transform: translateY(-1px); box-shadow: var(--sc-shadow-sm); }
.sc-orders-status strong { min-width: 23px; text-align: center; font-size: 12px; }
.sc-orders-status--all { border-color: #eab30866; background: #fef9c3; color: #854d0e; }
.sc-orders-status--completed { border-color: var(--sc-success-border); background: var(--sc-success-bg); color: var(--sc-success-text); }
.sc-orders-status--rejected { border-color: var(--sc-danger-border); background: var(--sc-danger-bg); color: var(--sc-danger-text); }
.sc-orders-status--pending { border-color: var(--sc-warning-border); background: var(--sc-warning-bg); color: var(--sc-warning-text); }
.sc-orders-status.is-active { border-color: currentColor; box-shadow: inset 0 0 0 1px currentColor; }
.sc-orders-consumed { display: flex; flex-direction: column; justify-content: center; min-height: 43px; padding: 7px 12px; border: 1px solid #fb923c66; border-radius: var(--sc-radius); background: #fff7ed; color: #9a3412; }
.sc-orders-consumed > span { font-size: 9.8px; font-weight: 800; }
.sc-orders-consumed > div { display: flex; gap: 8px; flex-wrap: wrap; }
.sc-orders-consumed strong { font-size: 14px; font-weight: 900; }
.sc-orders-consumed small { font-size: 9px; }
.sc-orders-table-wrap { max-width: 100%; overflow: hidden; border: 1px solid var(--sc-border); border-radius: var(--sc-radius-lg); background: var(--sc-surface); box-shadow: var(--sc-shadow-sm); }
.sc-orders-table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; color: var(--sc-text); font-size: 11.7px; }
.sc-orders-table th { padding: 6px 7px; border-bottom: 1px solid var(--sc-border-strong); background: var(--sc-surface-2); color: var(--sc-muted); font-size: 10.2px; font-weight: 900; text-align: start; }
.sc-orders-table th:nth-child(1) { width: 12%; }
.sc-orders-table th:nth-child(2) { width: 12%; }
.sc-orders-table th:nth-child(3) { width: 7%; }
.sc-orders-table th:nth-child(4) { width: 14%; }
.sc-orders-table th:nth-child(5) { width: 11%; }
.sc-orders-table th:nth-child(6) { width: 12%; }
.sc-orders-table th:nth-child(7) { width: 12%; }
.sc-orders-table th:nth-child(8) { width: 10%; }
.sc-orders-table th:nth-child(9) { width: 10%; }
.sc-orders-table td { padding: 8px 7px; border-bottom: 1px solid var(--sc-border); vertical-align: middle; overflow-wrap: anywhere; }
.sc-orders-row--completed td { background: var(--sc-success-bg); }
.sc-orders-row--rejected td { background: var(--sc-danger-bg); }
.sc-orders-row--pending td { background: var(--sc-warning-bg); }
.sc-orders-row.is-expandable { cursor: pointer; }
.sc-orders-row.is-expandable:hover td { filter: brightness(.985); }
.sc-orders-row:focus-visible { outline: 2px solid var(--sc-primary); outline-offset: -2px; }
.sc-orders-sort { display: inline-flex; align-items: center; gap: 5px; width: 100%; min-height: 28px; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; font-weight: inherit; text-align: start; cursor: pointer; }
.sc-orders-sort > span { position: relative; width: 9px; height: 13px; flex: 0 0 9px; opacity: .35; }
.sc-orders-sort > span::before,.sc-orders-sort > span::after { position: absolute; inset-inline-start: 1px; content: ''; border-inline: 3.5px solid transparent; }
.sc-orders-sort > span::before { inset-block-start: 1px; border-bottom: 4px solid currentColor; }
.sc-orders-sort > span::after { inset-block-end: 1px; border-top: 4px solid currentColor; }
.sc-orders-sort[data-sort-direction] > span { color: var(--sc-primary); opacity: 1; }
.sc-orders-number { display: inline-block; font-weight: 900; direction: ltr; cursor: copy; }
.sc-orders-number.is-copied,.sc-orders-requirements dd.is-copied { color: var(--sc-success-text); }
.sc-orders-status-text,.sc-orders-category,.sc-orders-balance-label { display: block; margin-top: 2px; color: var(--sc-muted); font-size: 9.5px; font-weight: 750; }
.sc-orders-product { display: block; font-size: 12px; font-weight: 900; }
.sc-orders-requirements { display: grid; gap: 3px; margin: 0; }
.sc-orders-requirements > div { display: grid; grid-template-columns: minmax(54px, auto) minmax(0, 1fr); gap: 5px; }
.sc-orders-requirements dt { color: var(--sc-muted); font-size: 9px; font-weight: 800; }
.sc-orders-requirements dd { margin: 0; font-weight: 850; cursor: copy; }
.sc-orders-money { color: inherit; font-weight: 900; white-space: nowrap; }
.sc-orders-money small { font-size: 8.5px; opacity: .75; }
.sc-orders-table time { font-weight: 850; white-space: nowrap; }
.sc-orders-detail-row > td { padding: 0; background: var(--sc-surface) !important; }
.sc-orders-detail-shell { padding: 10px; }
.sc-orders-detail-loading { display: grid; place-items: center; min-height: 92px; color: var(--sc-muted); font-weight: 800; }
.sc-orders-empty { display: grid; place-items: center; gap: 10px; min-height: 150px; padding: 20px; color: var(--sc-muted); text-align: center; }
.sc-orders-empty strong { color: var(--sc-text); font-size: 14px; }
.sc-orders-pagination { margin-top: 10px; }
.sc-orders-page.is-loading [data-orders-results] { opacity: .6; pointer-events: none; }

.sc-order-show-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.sc-order-show-head h1 { margin: 0; font-size: 21px; font-weight: 900; }
.sc-order-show-head p { margin: 2px 0 0; color: var(--sc-muted); font-size: 12px; }
.sc-order-details { display: grid; gap: 10px; padding: 11px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius-lg); background: var(--sc-surface); color: var(--sc-text); }
.sc-order-details__section { min-width: 0; padding-bottom: 9px; border-bottom: 1px solid var(--sc-border); }
.sc-order-details__section:last-of-type { padding-bottom: 0; border-bottom: 0; }
.sc-order-details__section h2 { margin: 0 0 7px; font-size: 12px; font-weight: 900; }
.sc-order-details__section-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sc-order-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.sc-order-detail-grid > div { min-width: 0; padding: 8px 9px; border-radius: var(--sc-radius); background: var(--sc-surface-2); }
.sc-order-detail-grid span { display: block; margin-bottom: 2px; color: var(--sc-muted); font-size: 9px; font-weight: 800; }
.sc-order-detail-grid strong { display: block; font-size: 11.5px; font-weight: 900; overflow-wrap: anywhere; }
.sc-order-detail-grid strong[role="button"] { cursor: copy; }
.sc-order-detail-grid--info { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.sc-order-detail-grid--money { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sc-order-detail-requirements { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 0; }
.sc-order-detail-requirements > div { min-width: 0; padding: 8px 9px; border-radius: var(--sc-radius); background: var(--sc-surface-2); }
.sc-order-detail-requirements dt { color: var(--sc-muted); font-size: 9px; font-weight: 800; }
.sc-order-detail-requirements dd { margin: 2px 0 0; font-size: 11.5px; font-weight: 900; white-space: pre-wrap; overflow-wrap: anywhere; cursor: copy; }
.sc-order-rejection-notice { padding: 10px 11px; border: 1px solid var(--sc-danger-border); border-radius: var(--sc-radius); background: var(--sc-danger-bg); color: var(--sc-danger-text); font-weight: 800; white-space: pre-wrap; }
.sc-order-completion-reply { margin: 0; padding: 9px 10px; border-radius: var(--sc-radius); background: var(--sc-surface-2); line-height: 1.75; white-space: pre-wrap; }
.sc-order-delivery-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.sc-order-delivery-codes code { display: block; min-width: 0; padding: 9px 10px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius); background: var(--sc-surface-2); color: var(--sc-text); font-size: 12px; font-weight: 900; direction: ltr; text-align: center; overflow-wrap: anywhere; cursor: copy; }
.sc-order-repurchase { display: flex; justify-content: center; padding-top: 2px; }
.sc-order-repurchase .sc-btn { width: auto; min-width: 190px; }
.sc-order-details__pending { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px; border-radius: var(--sc-radius); background: var(--sc-warning-bg); color: var(--sc-warning-text); }
.sc-order-dispute { display: grid; gap: 7px; max-width: 520px; padding-top: 8px; border-top: 1px solid var(--sc-border); }
.sc-order-dispute label { font-size: 11px; font-weight: 900; }
.sc-order-cancel { display: flex; justify-content: center; }

html[data-theme="dark"] .sc-orders-status--all { background: #422006; color: #fde68a; }
html[data-theme="dark"] .sc-orders-consumed { background: #431407; color: #fed7aa; }
@media (prefers-color-scheme: dark) {
    html[data-theme="system"] .sc-orders-status--all { background: #422006; color: #fde68a; }
    html[data-theme="system"] .sc-orders-consumed { background: #431407; color: #fed7aa; }
}

@media (max-width: 1000px) {
    .sc-orders-toolbar { grid-template-columns: minmax(0, 1fr); }
    .sc-orders-summary { grid-template-columns: minmax(0, 1fr); }
    .sc-orders-statuses { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .sc-order-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .sc-orders-date-filter { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; }
    .sc-orders-page .sc-date-pill,.sc-orders-page .sc-date-pill__input { min-width: 0; width: 100%; }
    .sc-orders-statuses { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-orders-table-wrap { overflow: visible; border: 0; background: transparent; box-shadow: none; }
    .sc-orders-table,.sc-orders-table tbody { display: block; width: 100%; }
    .sc-orders-table thead { display: none; }
    .sc-orders-row { display: block; width: 100%; margin-bottom: 9px; padding: 6px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius); box-shadow: var(--sc-shadow-sm); }
    .sc-orders-row--completed { background: var(--sc-success-bg); }
    .sc-orders-row--rejected { background: var(--sc-danger-bg); }
    .sc-orders-row--pending { background: var(--sc-warning-bg); }
    .sc-orders-table .sc-orders-row > td { display: grid; grid-template-columns: minmax(105px, .75fr) minmax(0, 1fr); align-items: start; gap: 8px; width: 100%; box-sizing: border-box; padding: 6px 7px; border: 0; background: transparent; }
    .sc-orders-table .sc-orders-row > td::before { content: attr(data-label); color: var(--sc-muted); font-size: 9px; font-weight: 800; }
    .sc-orders-detail-row { display: block; width: 100%; margin: -5px 0 9px; }
    .sc-orders-detail-row > td { display: block; width: 100%; box-sizing: border-box; border: 1px solid var(--sc-border); border-radius: var(--sc-radius); }
    .sc-orders-detail-shell { padding: 7px; }
}

@media (max-width: 520px) {
    .sc-orders-toolbar { padding: 9px; }
    .sc-orders-date-filter { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .sc-orders-date-search { grid-column: 1 / -1; width: 100%; }
    .sc-orders-status { min-height: 46px; padding: 7px 8px; font-size: 10px; }
    .sc-order-show-head { align-items: stretch; flex-direction: column; }
    .sc-order-detail-grid,.sc-order-detail-grid--money,.sc-order-detail-requirements,.sc-order-delivery-codes { grid-template-columns: minmax(0, 1fr); }
    .sc-order-details__section-head { align-items: stretch; flex-direction: column; }
    .sc-order-details__section-head .sc-btn,.sc-order-repurchase .sc-btn { width: 100%; }
    .sc-order-details__pending { align-items: flex-start; flex-direction: column; }
}

/* Customer identity card inside the side drawer only. */
.sc-topbar .sc-balance-pill {
    gap: 7px;
    padding: 7px 8px 7px 12px;
    font-size: 14px;
}
.sc-topbar .sc-balance-pill--positive .sc-balance-pill__value,
.sc-drawer .sc-customer-summary__balance--positive .sc-customer-summary__balance-value { color: #5ee7a6; }
.sc-topbar .sc-balance-pill--negative .sc-balance-pill__value,
.sc-drawer .sc-customer-summary__balance--negative .sc-customer-summary__balance-value { color: #fb7185; }
.sc-balance-pill__add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    background: rgba(var(--sc-topbar-text-rgb), .14);
    color: var(--sc-topbar-text);
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
}
.sc-balance-pill__add:hover { background: rgba(var(--sc-topbar-text-rgb), .24); }
.sc-balance-pill__add:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(var(--sc-topbar-text-rgb), .3); }
.sc-drawer .sc-customer-summary {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 8px;
    padding: 10px 8px 14px;
    text-align: center;
}
.sc-drawer .sc-customer-summary__avatar-link {
    display: block;
    width: 64px;
    height: 64px;
    border-radius: 50%;
}
.sc-drawer .sc-customer-summary__avatar-link:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(94, 231, 166, .35); }
.sc-drawer .sc-customer-summary__avatar { display: block; width: 64px; height: 64px; }
.sc-drawer .sc-customer-summary__body { align-items: center; gap: 4px; width: 100%; }
.sc-drawer .sc-customer-summary__body strong {
    justify-content: center;
    flex-wrap: wrap;
    gap: 5px 8px;
    font-size: 16px;
    line-height: 1.45;
}
.sc-drawer .sc-customer-summary__name { max-width: 100%; color: var(--sc-text); font-size: 16px; font-weight: 900; }
.sc-drawer .sc-customer-summary__number {
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--sc-surface-2);
    color: var(--sc-text);
    font-size: 11px;
}
.sc-drawer .sc-customer-summary__group {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--sc-primary-text);
    font-family: inherit;
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}
.sc-drawer .sc-customer-summary__group:hover { text-decoration: underline; }
.sc-drawer .sc-customer-summary__group:focus-visible { outline: none; border-radius: 3px; box-shadow: var(--sc-focus-ring); }
.sc-drawer .sc-customer-summary__balance {
    position: relative;
    justify-content: center;
    width: 100%;
    padding-inline: 44px;
    text-align: center;
}
.sc-drawer .sc-customer-summary__balance-value {
    display: block;
    width: 100%;
    color: inherit;
    font-size: 15px;
    font-weight: 900;
    text-align: center;
}
.sc-drawer .sc-customer-summary__add { position: absolute; inset-inline-end: 8px; }

.sc-balance-pill__stack,
.sc-customer-summary__balance-stack {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
}
.sc-balance-pill__debt,
.sc-customer-summary__debt,
.sc-wallet-debt-line {
    color: #e74c3c;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
}
.sc-customer-summary__group--vip {
    border: 0;
    background: transparent;
    padding: 0;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    color: var(--sc-muted);
    cursor: default;
}
.sc-wallet-money--debt { color: #e74c3c; }

body.sc-group-goal-modal-open { overflow: hidden; }
.sc-group-goal-modal {
    position: fixed;
    inset: 0;
    z-index: 700;
    display: grid;
    place-items: center;
    padding: 16px;
}
.sc-group-goal-modal[hidden] { display: none; }
.sc-group-goal-modal__backdrop { position: absolute; inset: 0; border: 0; background: rgba(2, 12, 11, .7); cursor: default; }
.sc-group-goal-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(100%, 520px);
    max-height: min(72dvh, 620px);
    overflow: hidden;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
    color: var(--sc-text);
    box-shadow: var(--sc-shadow-lg);
}
.sc-group-goal-modal__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--sc-border);
    background: var(--sc-surface-2);
}
.sc-group-goal-modal__head > div { min-width: 0; }
.sc-group-goal-modal__head span { display: block; margin-bottom: 2px; color: var(--sc-muted); font-size: 10px; font-weight: 800; }
.sc-group-goal-modal__head h2 { margin: 0; font-size: 17px; font-weight: 900; overflow-wrap: anywhere; }
.sc-group-goal-modal__close {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    padding: 0;
    border: 1px solid var(--sc-border);
    border-radius: 50%;
    background: var(--sc-surface);
    color: var(--sc-text);
    font: inherit;
    font-size: 23px;
    cursor: pointer;
}
.sc-group-goal-modal__close:hover { border-color: var(--sc-primary-border); color: var(--sc-primary-text); }
.sc-group-goal-modal__close:focus-visible { outline: none; box-shadow: var(--sc-focus-ring); }
.sc-group-goal-modal__content {
    max-height: calc(min(72dvh, 620px) - 70px);
    padding: 16px;
    overflow: auto;
    color: var(--sc-text);
    font-size: 13px;
    line-height: 1.9;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
.sc-group-goal-modal__content > :first-child { margin-top: 0; }
.sc-group-goal-modal__content > :last-child { margin-bottom: 0; }
.sc-group-goal-modal__content a { color: var(--sc-primary-text); font-weight: 800; text-underline-offset: 3px; }
.sc-group-goal-modal__empty { margin: 0; color: var(--sc-muted); text-align: center; }
.sc-group-goal-modal__description { white-space: normal; }
.sc-group-goal-modal__progress {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 10px;
    margin-top: 14px;
    padding: 13px;
    border: 1px solid var(--sc-primary-border);
    border-radius: var(--sc-radius);
    background: var(--sc-primary-bg);
    white-space: normal;
}
.sc-group-goal-modal__progress p { grid-column: 1 / -1; margin: 0; color: var(--sc-text); font-size: 13px; line-height: 1.7; }
.sc-group-goal-modal__progress p strong { display: inline-block; color: var(--sc-primary-text); font-weight: 900; }
.sc-group-goal-modal__progress-track {
    height: 11px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--sc-surface);
    box-shadow: inset 0 0 0 1px var(--sc-border);
}
.sc-group-goal-modal__progress-track span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: var(--sc-primary);
}
.sc-group-goal-modal__progress small { color: var(--sc-primary-text); font-size: 11px; font-weight: 900; direction: ltr; }

.sc-deposit-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 960px;
    min-width: 0;
}

.sc-method-picker {
    min-width: 0;
    margin: 0;
    padding: 16px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
}

.sc-method-picker legend {
    padding: 0 5px;
    color: var(--sc-text);
    font-size: 15px;
    font-weight: 800;
}

.sc-method-picker h2 {
    margin: 0 0 5px;
    color: var(--sc-text);
    font-size: 15px;
    font-weight: 800;
}

.sc-method-picker__hint {
    margin: 0 0 14px;
    color: var(--sc-muted);
    font-size: 12px;
    line-height: 1.7;
}

.sc-method-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    min-width: 0;
}

.sc-method-option {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    min-width: 0;
    min-height: 132px;
    padding: 10px;
    border-radius: var(--sc-radius);
    border: 1px solid var(--sc-border);
    background: var(--sc-surface);
    cursor: pointer;
    text-align: start;
    font-size: 12px;
    font-weight: 700;
    transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
    -webkit-tap-highlight-color: transparent;
    color: var(--sc-text);
    text-decoration: none;
}

.sc-method-option:hover {
    border-color: var(--sc-primary-border);
    box-shadow: var(--sc-shadow-sm);
}

.sc-method-option:active { transform: scale(0.995); }

.sc-method-option:focus-within {
    outline: none;
    border-color: var(--sc-primary);
    box-shadow: var(--sc-focus-ring);
}

.sc-method-option:focus-visible {
    outline: none;
    border-color: var(--sc-primary);
    box-shadow: var(--sc-focus-ring);
}

.sc-method-option.is-selected {
    border-color: var(--sc-primary);
    background: var(--sc-primary-bg);
    box-shadow: 0 0 0 1px var(--sc-primary);
}

.sc-method-option input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.sc-method-option__top {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 22px;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.sc-method-option__logo {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid var(--sc-border);
    border-radius: 12px;
    background: var(--sc-surface-2);
    color: var(--sc-primary-text);
    font-size: 18px;
    font-weight: 800;
}

.sc-method-option__logo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.sc-method-option__name {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--sc-text);
    font-size: 14px;
    font-weight: 800;
}

.sc-method-option__check {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--sc-border-strong);
    border-radius: 999px;
    background: var(--sc-surface);
    color: transparent;
    font-size: 12px;
}

.sc-method-option.is-selected .sc-method-option__check {
    border-color: var(--sc-primary);
    background: var(--sc-primary);
    color: var(--sc-primary-contrast);
}

.sc-method-option__meta {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.sc-method-option__label {
    color: var(--sc-muted);
    font-size: 10.5px;
    font-weight: 700;
}

.sc-method-option__chips,
.sc-method-option__limits {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    min-width: 0;
}

.sc-method-chip,
.sc-method-option__limits span {
    max-width: 100%;
    padding: 3px 7px;
    border: 1px solid var(--sc-border);
    border-radius: 999px;
    background: var(--sc-surface-2);
    color: var(--sc-text);
    font-size: 10.5px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.sc-method-option__muted { color: var(--sc-muted); font-size: 11px; }

.sc-deposit-details {
    min-width: 0;
    padding: 16px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
}

.sc-deposit-details[hidden],
.sc-method-info[hidden] { display: none !important; }

.sc-method-info {
    margin-bottom: 16px;
    padding: 14px;
    border: 1px solid var(--sc-primary-border);
    border-radius: var(--sc-radius);
    background: var(--sc-primary-bg);
    color: var(--sc-text);
    font-size: 12.5px;
}

.sc-method-info__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.sc-method-info__head strong { font-size: 14px; }
.sc-method-info__head span { color: var(--sc-muted); font-size: 11px; }

.sc-method-info__block + .sc-method-info__block { margin-top: 10px; }
.sc-method-info__block strong { display: block; margin-bottom: 4px; }
.sc-method-info__block ul { margin: 0; padding-inline-start: 20px; line-height: 1.8; }

.sc-method-info__notice {
    margin: 10px 0 0;
    padding: 8px 10px;
    border: 1px solid var(--sc-warning-border);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-warning-bg);
    color: var(--sc-warning-text);
    font-weight: 700;
}

.sc-deposit-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    min-width: 0;
}

@media (min-width: 700px) {
    .sc-deposit-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-deposit-fields__wide { grid-column: 1 / -1; }
}

.sc-deposit-fields .form-row { min-width: 0; margin: 0; }

.sc-deposit-limit {
    min-height: 20px;
    margin-top: 5px;
    color: var(--sc-primary-text);
    font-size: 11px;
    font-weight: 700;
}

.sc-required-mark {
    display: inline-flex;
    margin-inline-start: 5px;
    padding: 2px 6px;
    border-radius: 999px;
    background: var(--sc-warning-bg);
    color: var(--sc-warning-text);
    font-size: 10px;
}

.sc-required-mark[hidden] { display: none; }

.sc-file-field {
    min-height: 46px;
    max-width: 100%;
    padding: 7px;
}

.sc-field-error { margin: 7px 0 0; }

.sc-deposit-actions {
    padding-top: 16px;
    border-top: 1px solid var(--sc-border);
}

.sc-deposit-empty {
    width: 100%;
    max-width: 620px;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 24px;
    border: 1px dashed var(--sc-border-strong);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
    text-align: center;
}

.sc-deposit-empty__icon {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--sc-surface-2);
    color: var(--sc-muted);
    font-size: 26px;
}

.sc-deposit-empty strong { font-size: 15px; }
.sc-deposit-empty span:last-child { color: var(--sc-muted); font-size: 12px; }

@media (max-width: 560px) {
    .sc-method-picker,
    .sc-deposit-details { padding: 13px; }

    .sc-deposit-actions .sc-btn { min-height: 46px; }
}

/* Customer deposit method picker — intentionally contains no financial meta. */
html,
body.sc-body {
    max-width: 100%;
    overflow-x: clip;
}

.sc-deposit-picker-page {
    width: 100%;
    max-width: 1040px;
    min-width: 0;
    margin-inline: auto;
}

.sc-gift-code-teaser {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    margin: 0 auto 14px;
    padding: 10px 18px;
    border-radius: var(--sc-radius-lg);
    background: var(--sc-primary-bg);
    color: var(--sc-primary-text);
    font-size: 14px;
    font-weight: 800;
    text-align: center;
    cursor: default;
    user-select: none;
}

.sc-method-picker {
    width: 100%;
    max-width: 1040px;
    padding: 0;
    margin-inline: auto;
    border: 0;
    background: transparent;
}

.sc-method-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

@media (min-width: 700px) {
    .sc-method-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
}

@media (min-width: 1100px) {
    .sc-method-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.sc-payment-method-card {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 0;
    height: clamp(96px, 28vw, 140px);
    overflow: hidden;
    border: 0;
    border-radius: var(--sc-radius);
    box-shadow: var(--sc-shadow-sm);
    color: var(--sc-text);
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    transition: transform .16s ease, box-shadow .16s ease;
}

.sc-payment-method-card:hover { transform: translateY(-3px); box-shadow: var(--sc-shadow); }
.sc-payment-method-card:active { transform: scale(.985); }
.sc-payment-method-card:focus-visible { outline: none; box-shadow: var(--sc-focus-ring); }
.sc-payment-method-card--image { background: var(--sc-surface); }
.sc-payment-method-card--image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.sc-payment-method-card--name {
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: var(--sc-surface-2);
    text-align: center;
}
.sc-payment-method-card--name span { font-size: clamp(14px, 3vw, 18px); font-weight: 800; overflow-wrap: anywhere; }

.sc-deposit-method-page {
    width: 100%;
    max-width: 960px;
    min-width: 0;
    margin-inline: auto;
    --sc-payment-copy-bg: #d8e8e4;
    --sc-payment-title-bg: #c9dfda;
}

html[data-theme="dark"] .sc-deposit-method-page {
    --sc-payment-copy-bg: #142826;
    --sc-payment-title-bg: #183330;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="system"] .sc-deposit-method-page {
        --sc-payment-copy-bg: #142826;
        --sc-payment-title-bg: #183330;
    }
}

.sc-deposit-method-head {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 58px;
    margin-bottom: 14px;
    padding: 10px 18px;
    border-radius: var(--sc-radius-lg);
    background: var(--sc-payment-title-bg);
    text-align: center;
}
.sc-deposit-method-head h1 { margin: 0; color: var(--sc-text); font-size: clamp(21px, 4vw, 28px); font-weight: 900; }

.sc-payment-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-width: 760px;
    margin: 0 auto 14px;
}

.sc-payment-info-line {
    margin: 0;
    padding: 4px 0;
    color: var(--sc-text);
    font: inherit;
    font-size: 14px;
    line-height: 1.85;
    text-align: center;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.sc-payment-info-line--copy {
    width: 100%;
    min-height: 44px;
    padding: 9px 14px;
    appearance: none;
    border: 0;
    border-radius: var(--sc-radius);
    background: var(--sc-payment-copy-bg);
    cursor: pointer;
    transition: background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.sc-payment-info-line--copy { font-weight: 800; }
.sc-payment-info-line--copy:hover { background: var(--sc-primary-bg); color: var(--sc-primary-text); }
.sc-payment-info-line--copy:active { transform: scale(.995); }
.sc-payment-info-line--copy.is-copied { background: var(--sc-success-bg); color: var(--sc-success-text); box-shadow: 0 0 0 1px var(--sc-success-border); }
.sc-payment-info-line--copy:focus-visible { outline: none; box-shadow: var(--sc-focus-ring); }

.sc-deposit-form { max-width: none; }
.sc-deposit-details { max-width: none; padding: clamp(13px, 2.2vw, 20px); border-radius: var(--sc-radius-lg); }
.sc-deposit-fields { align-items: start; }
.sc-deposit-method-page .sc-deposit-fields { gap: 12px; }
.sc-deposit-fields fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.sc-deposit-method-page .sc-input,
.sc-deposit-method-page .sc-select {
    min-height: 44px;
    padding: 0 14px;
    border-radius: var(--sc-radius);
    font-size: 14px;
}

.sc-deposit-amount-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(140px, 180px);
    align-items: start;
    gap: 12px;
    min-width: 0;
}

.sc-deposit-amount-row .form-row { min-width: 0; }

.sc-currency-picker,
.sc-currency-select {
    min-width: 0;
}

.sc-money-input { position: relative; min-width: 0; }
.sc-money-input__control { padding-inline-end: 82px !important; }
.sc-money-input__currency {
    position: absolute;
    inset-inline-end: 8px;
    top: 50%;
    transform: translateY(-50%);
    padding: 4px 9px;
    border-radius: calc(var(--sc-radius-sm) - 2px);
    background: var(--sc-surface-2);
    color: var(--sc-muted);
    font-size: 11.5px;
    font-weight: 850;
    pointer-events: none;
}

.sc-select-wrap { position: relative; min-width: 0; }
.sc-select-wrap::after {
    content: "";
    position: absolute;
    inset-inline-end: 13px;
    top: 50%;
    width: 7px;
    height: 7px;
    border-inline-end: 2px solid var(--sc-muted);
    border-bottom: 2px solid var(--sc-muted);
    transform: translateY(-70%) rotate(45deg);
    pointer-events: none;
}
.sc-currency-select { min-height: 44px; padding-inline-end: 34px; appearance: none; cursor: pointer; }
.sc-currency-fixed {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 44px;
    background: var(--sc-surface-2);
}
.sc-currency-fixed strong { color: var(--sc-primary-text); font-size: 12px; }

.sc-final-amount { position: relative; }
.sc-final-amount__card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(56px, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 64px;
    padding: 11px 14px;
    border: 1px solid var(--sc-success-border);
    border-radius: var(--sc-radius);
    background: var(--sc-success-bg);
    color: var(--sc-success-text);
}
.sc-final-amount__label { min-width: 0; font-size: 12.5px; font-weight: 800; line-height: 1.55; text-align: start; }
.sc-final-amount__value {
    color: var(--sc-success-text);
    font-size: clamp(18px, 3vw, 24px);
    font-weight: 900;
    direction: ltr;
    text-align: center;
    white-space: nowrap;
}
.sc-final-amount__currency { color: var(--sc-success-text); font-size: 12px; font-weight: 850; text-align: end; white-space: nowrap; }
.sc-final-amount.is-loading .sc-final-amount__value { opacity: .55; }
.sc-final-amount__loading { display: block; margin-top: 5px; color: var(--sc-muted); font-size: 11px; }
.sc-final-amount__loading[hidden] { display: none; }

.sc-currency-options { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
@media (min-width: 480px) {
    .sc-currency-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.sc-currency-option {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 48px;
    padding: 10px 12px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius);
    background: var(--sc-surface);
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.sc-currency-option:hover { border-color: var(--sc-primary-border); }
.sc-currency-option.is-selected { border-color: var(--sc-primary); background: var(--sc-primary-bg); box-shadow: 0 0 0 1px var(--sc-primary); }
.sc-currency-option:focus-within { box-shadow: var(--sc-focus-ring); }
.sc-currency-option input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.sc-currency-option__name { min-width: 0; font-size: 13px; font-weight: 750; overflow-wrap: anywhere; }
.sc-currency-option__code { color: var(--sc-primary-text); font-size: 12px; font-weight: 850; }
.sc-currency-picker__empty { margin: 0; color: var(--sc-danger-text); font-size: 13px; }

.sc-optional-mark {
    display: inline-flex;
    margin-inline-start: 5px;
    padding: 2px 6px;
    border-radius: 999px;
    background: var(--sc-surface-2);
    color: var(--sc-muted);
    font-size: 10px;
}

.sc-file-help { margin: 5px 0 0; color: var(--sc-muted); font-size: 11px; }
.sc-client-file-error { margin-top: 7px; }
.sc-deposit-method-page .sc-file-field { min-height: 44px; padding: 4px 6px; }
.sc-file-field::file-selector-button {
    min-height: 34px;
    margin-inline-end: 10px;
    padding-inline: 12px;
    border: 0;
    border-radius: var(--sc-radius);
    background: var(--sc-secondary-bg);
    color: var(--sc-secondary-text);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.sc-deposit-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 16px;
    padding-top: 14px;
}
.sc-form-actions.sc-deposit-actions { flex-direction: column; }
.sc-deposit-actions .sc-btn { width: 100%; min-height: 44px; border-radius: var(--sc-radius-lg); }
.sc-deposit-actions .sc-deposit-submit { min-height: 48px; font-size: 15px; }
.sc-deposit-actions--single { max-width: none; }

.sc-identity-gate { max-width: none; text-align: center; }
.sc-identity-gate h2 { margin: 0 0 6px; font-size: 18px; }
.sc-identity-gate > p { margin: 0 0 14px; color: var(--sc-muted); line-height: 1.75; }
.sc-identity-gate__notice {
    margin: 14px 0 0 !important;
    padding: 11px 13px;
    border: 1px solid var(--sc-warning-border);
    border-radius: var(--sc-radius);
    background: var(--sc-warning-bg);
    color: var(--sc-warning-text) !important;
    font-size: 13px;
    font-weight: 700;
}

.sc-identity-page .sc-identity-gate { text-align: start; }
.sc-identity-section + .sc-identity-section { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--sc-border); }
.sc-identity-section > h2 { margin: 0 0 10px; font-size: 16px; font-weight: 850; text-align: start; }
.sc-identity-empty { margin: 0; color: var(--sc-muted); font-size: 13px; }
.sc-identity-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.sc-identity-method {
    display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; min-height: 46px;
    padding: 9px 11px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius);
    background: var(--sc-surface); color: var(--sc-text); text-decoration: none;
}
.sc-identity-method:hover,
.sc-identity-method.is-selected { border-color: var(--sc-primary); background: var(--sc-primary-bg); }
.sc-identity-method > span { min-width: 0; font-size: 13px; font-weight: 800; overflow-wrap: anywhere; }
.sc-identity-method small { flex: 0 0 auto; color: var(--sc-primary-text); font-size: 10.5px; font-weight: 800; }
.sc-identity-method small.is-approved { color: var(--sc-success-text); }
.sc-identity-method small.is-pending { color: var(--sc-warning-text); }
.sc-identity-submit-section { text-align: start; }
.sc-identity-form { margin-top: 10px; }
.sc-identity-state { margin: 0; padding: 11px 13px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius); font-size: 13px; font-weight: 750; }
.sc-identity-state--accepted { border-color: var(--sc-success-border); background: var(--sc-success-bg); color: var(--sc-success-text); }
.sc-identity-state--pending { border-color: var(--sc-warning-border); background: var(--sc-warning-bg); color: var(--sc-warning-text); }
.sc-identity-records { display: grid; gap: 8px; }
.sc-identity-record {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0;
    padding: 10px 12px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius); background: var(--sc-surface);
    direction: rtl; overflow: hidden;
}
.sc-identity-record > div {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    min-width: 0; min-height: 58px; padding: 5px 9px; text-align: center;
    border-inline-start: 1px solid var(--sc-border);
}
.sc-identity-record > div:last-child { border-inline-start: 0; }
.sc-identity-record span { color: var(--sc-muted); font-size: 10.5px; font-weight: 700; }
.sc-identity-record strong { display: block; max-width: 100%; color: var(--sc-text); font-size: 12.5px; text-align: center; overflow-wrap: anywhere; }
.sc-identity-record strong.sc-ltr { text-align: center; }
.sc-identity-record .sc-identity-accepted-label { color: var(--sc-success-text); }

@media (max-width: 620px) {
    .sc-identity-methods { grid-template-columns: minmax(0, 1fr); }
    .sc-identity-record { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-identity-record > div:nth-child(odd) { border-inline-start: 0; }
    .sc-identity-record > div { border-bottom: 1px solid var(--sc-border); }
    .sc-identity-record > div:nth-last-child(-n+2) { border-bottom: 0; }
}

@media (max-width: 560px) {
    .sc-deposit-amount-row {
        grid-template-columns: minmax(0, 1fr) 122px;
    }

    .sc-currency-select {
        max-width: 100%;
        text-overflow: ellipsis;
    }

    .sc-deposit-method-page { padding-inline: 2px; }
    .sc-final-amount__card {
        grid-template-columns: minmax(0, 1fr) auto minmax(42px, .55fr);
        gap: 7px;
        padding-inline: 11px;
    }
}

@media (max-width: 899px) {
    .sc-drawer:not(.is-open) { display: none; }
}

@media (max-width: 330px) {
    .sc-method-grid { grid-template-columns: minmax(0, 1fr); }
    .sc-deposit-amount-row { grid-template-columns: minmax(0, 1fr); }
}

/* ========================================================================== 
   Storefront home, category and search — shared final catalog system
   ========================================================================== */

.sc-storefront-title-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 58px;
    margin: 0 0 14px;
    padding: 10px 18px;
    border-radius: var(--sc-radius-lg);
    background: var(--sc-primary-bg);
    text-align: center;
}
.sc-storefront-title-bar h1 { margin: 0; font-size: clamp(21px, 4vw, 28px); font-weight: 900; }

.sc-storefront-slider {
    position: relative;
    width: 100%;
    min-width: 0;
    margin-bottom: 12px;
}
.sc-storefront-slider__viewport {
    display: grid;
    overflow: hidden;
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface-2);
}
.sc-storefront-slider__slide {
    grid-area: 1 / 1;
    min-width: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .42s ease, visibility .42s ease;
}
.sc-storefront-slider__slide.is-active { opacity: 1; visibility: visible; pointer-events: auto; }
.sc-storefront-slider .sc-store-banner { border-radius: 0; box-shadow: none; }
.sc-storefront-slider .sc-store-banner img {
    width: 100%;
    max-height: 350px;
    aspect-ratio: 16 / 5.5;
    object-fit: cover;
}
.sc-storefront-slider__arrow {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0 0 3px;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 50%;
    background: rgba(10, 35, 32, .72);
    color: #fff;
    font: inherit;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    transform: translateY(-50%);
    transition: background .16s ease, transform .16s ease;
}
.sc-storefront-slider__arrow:hover { background: rgba(10, 35, 32, .92); transform: translateY(-50%) scale(1.04); }
.sc-storefront-slider__arrow--previous { inset-inline-start: 12px; }
.sc-storefront-slider__arrow--next { inset-inline-end: 12px; }
.sc-storefront-slider__dots {
    position: absolute;
    inset-inline: 0;
    bottom: 9px;
    z-index: 2;
    display: flex;
    justify-content: center;
    gap: 6px;
    pointer-events: none;
}
.sc-storefront-slider__dots button {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.58);
    cursor: pointer;
    pointer-events: auto;
    transition: width .16s ease, background .16s ease;
}
.sc-storefront-slider__dots button.is-active { width: 22px; background: #fff; }

.sc-storefront-ticker {
    width: 100%;
    min-height: 40px;
    margin-bottom: 12px;
    padding: 8px 14px;
    overflow: hidden;
    border-radius: var(--sc-radius);
    background: var(--sc-ticker-bg, #173b37);
    color: var(--sc-ticker-color, #fff);
    font-size: var(--sc-ticker-font-size, 14px);
    font-weight: 750;
    text-align: center;
}
.sc-storefront-ticker__track { min-width: 100%; }
.sc-storefront-ticker a { color: inherit; text-decoration: none; }
.sc-storefront-ticker.is-animated .sc-storefront-ticker__track {
    display: block;
    min-width: 0;
    width: max-content;
    white-space: nowrap;
    will-change: transform;
    animation: sc-storefront-ticker var(--sc-ticker-speed, 20s) linear infinite;
}
@keyframes sc-storefront-ticker {
    from { transform: translateX(calc(-100% - 16px)); }
    to { transform: translateX(calc(100vw + 16px)); }
}
@media (prefers-reduced-motion: reduce) {
    .sc-storefront-ticker.is-animated .sc-storefront-ticker__track { animation: none; width: auto; }
    .sc-storefront-slider__slide { transition: none; }
}

.sc-catalog-search {
    display: block;
    width: 100%;
    margin-bottom: 18px;
}
.sc-catalog-search .sc-input {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    padding-inline: 16px;
    border-radius: var(--sc-radius);
}

.sc-live-search-results {
    min-width: 0;
    margin-bottom: 18px;
}
.sc-live-search-results[hidden] { display: none; }
.sc-live-search-results > .sc-catalog-section { margin-top: 0; }
.sc-live-search-status {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 12px 16px;
    border-radius: var(--sc-radius);
    background: var(--sc-surface-2);
    color: var(--sc-muted);
    font-size: 14px;
    text-align: center;
}

.sc-catalog-section { margin-block: 20px; }
.sc-catalog-section__title {
    margin: 0 0 11px;
    color: var(--sc-muted);
    font-size: 15px;
    font-weight: 800;
}

.sc-catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 12px;
}
@media (min-width: 700px) {
    .sc-catalog-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 14px; }
}
@media (min-width: 1000px) {
    .sc-catalog-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 1300px) {
    .sc-catalog-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

.sc-catalog-card,
.sc-cat-card,
.sc-product-card {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
}
.sc-cat-card:hover,
.sc-product-card:hover { transform: none; border-color: transparent; box-shadow: none; }
.sc-cat-card__media,
.sc-product-card__media {
    width: 100%;
    overflow: hidden;
    border-radius: var(--sc-radius-lg);
    background: transparent;
}
.sc-cat-card__media img,
.sc-product-card__media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: transparent;
    transition: transform .2s ease;
}
.sc-cat-card:hover .sc-cat-card__media img,
.sc-product-card:hover .sc-product-card__media img { transform: scale(1.025); }
.sc-cat-card__body,
.sc-product-card__body {
    align-items: center;
    min-height: 0;
    padding: 8px 4px 0;
    gap: 3px;
}
.sc-cat-card strong,
.sc-product-card__title {
    color: var(--sc-text);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.55;
    text-align: center;
}
.sc-catalog-card__kind,
.sc-product-card__meta { display: none; }
.sc-product-card__price {
    margin-top: 1px;
    color: var(--sc-primary-text);
    font-size: 13px;
    font-weight: 850;
    text-align: center;
}
.sc-product-card.is-unavailable .sc-product-card__media { position: relative; }
.sc-product-card.is-unavailable .sc-product-card__media img {
    filter: grayscale(1);
    opacity: .58;
}
.sc-product-card.is-unavailable .sc-product-card__title { color: var(--sc-muted); }
.sc-product-card.is-unavailable:hover .sc-product-card__media img { transform: none; }
.sc-product-card__unavailable {
    position: absolute;
    z-index: 1;
    inset-block-start: 8px;
    inset-inline: 8px;
    padding: 5px 7px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-surface);
    color: var(--sc-muted);
    font-size: 10.5px;
    font-weight: 850;
    line-height: 1.4;
    text-align: center;
}
.sc-product-card__login,
.sc-product-card__price-note {
    display: block;
    min-height: 0;
    margin-top: 1px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: var(--sc-muted);
    font-size: 10.5px;
    font-weight: 700;
}

.sc-best-sellers__track {
    display: flex;
    gap: 12px;
    min-width: 0;
}
.sc-best-sellers__track > .sc-product-card { flex: 0 0 calc((100% - 48px) / 5); }

@media (max-width: 699px) {
    .sc-storefront-slider .sc-store-banner img { aspect-ratio: 16 / 8; }
    .sc-storefront-slider__arrow { width: 36px; height: 36px; font-size: 24px; }
    .sc-storefront-slider__arrow--previous { inset-inline-start: 7px; }
    .sc-storefront-slider__arrow--next { inset-inline-end: 7px; }
    .sc-best-sellers__track {
        gap: 6px;
        overflow: visible;
        padding-bottom: 0;
        scroll-snap-type: none;
    }
    .sc-best-sellers__track > .sc-product-card {
        flex: 0 0 calc((100% - 24px) / 5);
        min-width: 0;
    }
}

/* ========================================================================== 
   Search page
   ========================================================================== */

.sc-search-page__form { margin-bottom: 18px; }

.sc-search-suggest {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.sc-search-suggest a {
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--sc-surface-2);
    color: var(--sc-muted);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.sc-search-suggest a:hover { background: var(--sc-primary-bg); color: var(--sc-primary-text); }

/* ==========================================================================
   Profile / account forms
   ========================================================================== */

.sc-profile-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

@media (min-width: 800px) {
    .sc-profile-layout { grid-template-columns: 220px 1fr; }
}

.sc-profile-tabs {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 2px;
}

@media (min-width: 800px) {
    .sc-profile-tabs { flex-direction: column; }
}

.sc-profile-tabs a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: var(--sc-radius-sm);
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    color: var(--sc-muted);
    white-space: nowrap;
}

.sc-profile-tabs a:hover,
.sc-profile-tabs a.is-active { background: var(--sc-primary-bg); color: var(--sc-primary-text); }

.sc-form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

@media (min-width: 560px) {
    .sc-form-grid--2 { grid-template-columns: repeat(2, 1fr); }
}

.sc-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 6px;
}

@media (max-width: 560px) {
    .sc-form-actions { flex-direction: column-reverse; }
    .sc-form-actions .sc-btn { width: 100%; }
}

/* ==========================================================================
   Legacy compatibility - pre-redesign shop.* views
   (resources/views/shop/index|category|product|orders/*.blade.php).
   Keeps those pages usable with the new tokens until they are migrated
   to the sc- component classes above. Safe to delete once migrated.
   ========================================================================== */

.shop-msg,
.shop-ok {
    background: var(--sc-success-bg);
    color: var(--sc-success-text);
    border: 1px solid var(--sc-success-border);
    padding: 10px 12px;
    border-radius: var(--sc-radius-sm);
    margin-bottom: 14px;
    font-size: 13px;
}

.shop-err {
    background: var(--sc-danger-bg);
    color: var(--sc-danger-text);
    border: 1px solid var(--sc-danger-border);
    padding: 10px 12px;
    border-radius: var(--sc-radius-sm);
    margin-bottom: 14px;
    font-size: 13px;
}

.shop-panel {
    background: var(--sc-surface);
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius);
    padding: 18px;
}

.shop-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 14px;
}

.shop-card {
    background: var(--sc-surface);
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    display: block;
    transition: transform .15s ease, box-shadow .15s ease;
}

.shop-card:hover { transform: translateY(-2px); box-shadow: var(--sc-shadow); }

.shop-card img { width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--sc-surface-2); display: block; }

.shop-card-body { padding: 12px; }

.shop-card-body strong { display: block; font-size: 14px; margin-bottom: 4px; }

.shop-card-body span { font-size: 12px; color: var(--sc-muted); }

.field {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-field-bg);
    color: var(--sc-field-text);
    font: inherit;
}

.label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; }

.form-row { margin-bottom: 14px; }

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 16px;
    border-radius: var(--sc-radius-sm);
    border: 1px solid var(--sc-border);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    background: var(--sc-control-bg);
    color: var(--sc-control-text);
}

.btn-primary { background: var(--sc-control-bg); border-color: var(--sc-control-text); color: var(--sc-control-text); }

.btn-secondary { background: var(--sc-control-bg); border-color: var(--sc-control-text); color: var(--sc-control-text); }

table.shop-table { width: 100%; border-collapse: collapse; font-size: 13px; }

table.shop-table th,
table.shop-table td { padding: 10px 8px; border-bottom: 1px solid var(--sc-border); text-align: start; }

@media (max-width: 640px) {
    .shop-product-layout { grid-template-columns: 1fr !important; }
}

/* Product purchase modal. Pricing remains sourced exclusively from the existing quote endpoint. */
body.sc-product-modal-open { overflow: hidden; }

.sc-product-modal {
    position: fixed;
    inset: 0;
    z-index: 140;
    display: grid;
    place-items: center;
    padding: 16px;
}
.sc-product-modal[hidden] { display: none; }
.sc-product-modal__backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(5, 20, 18, .48);
    backdrop-filter: blur(2px);
    cursor: default;
}
.sc-product-modal__shell {
    position: relative;
    z-index: 1;
    width: min(100%, 520px);
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    min-width: 0;
}
.sc-product-modal__body { min-width: 0; }
.sc-product-modal__loading,
.sc-product-modal__load-error {
    display: grid;
    place-items: center;
    min-height: 160px;
    padding: 24px;
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
    box-shadow: var(--sc-shadow-lg);
    color: var(--sc-muted);
    text-align: center;
}
.sc-product-modal__loading::before {
    content: '';
    width: 30px;
    height: 30px;
    margin-bottom: 10px;
    border: 3px solid var(--sc-border);
    border-top-color: var(--sc-primary);
    border-radius: 50%;
    animation: sc-spin .7s linear infinite;
}
.sc-product-modal__load-error { color: var(--sc-danger-text); }

.sc-product-standalone {
    display: grid;
    place-items: center;
    min-height: min(520px, calc(100dvh - var(--sc-header-h) - var(--sc-bottom-h) - 48px));
    padding-block: 8px;
}
.sc-product-standalone > .sc-product-dialog { width: min(100%, 520px); }

.sc-product-dialog {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
    box-shadow: var(--sc-shadow-lg);
}
.sc-product-dialog:focus { outline: none; }
.sc-product-dialog__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    flex: 0 0 auto;
    min-width: 0;
    padding: 16px 18px;
    border-bottom: 1px solid var(--sc-border);
    background: var(--sc-surface-2);
}
.sc-product-dialog__head h1 {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    color: var(--sc-text);
    font-size: clamp(17px, 4vw, 21px);
    font-weight: 900;
    line-height: 1.45;
    overflow-wrap: anywhere;
}
.sc-product-price-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex: 0 0 auto;
    min-height: 34px;
    max-width: 48%;
    padding: 6px 10px;
    border: 1px solid var(--sc-primary-border);
    border-radius: 999px;
    background: var(--sc-primary-bg);
    color: var(--sc-primary-text);
    font-size: 13px;
    font-weight: 900;
    direction: ltr;
    white-space: nowrap;
}
.sc-product-price-badge.has-error { border-color: var(--sc-danger-border); color: var(--sc-danger-text); }
.sc-product-dialog__scroll {
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 16px 18px 18px;
    scrollbar-width: thin;
    scrollbar-color: var(--sc-border-strong) transparent;
}
.sc-product-dialog__scroll::-webkit-scrollbar,
.sc-product-note::-webkit-scrollbar { width: 6px; }
.sc-product-dialog__scroll::-webkit-scrollbar-track,
.sc-product-note::-webkit-scrollbar-track { background: transparent; }
.sc-product-dialog__scroll::-webkit-scrollbar-thumb,
.sc-product-note::-webkit-scrollbar-thumb { border-radius: 999px; background: var(--sc-border-strong); }

.sc-product-dialog form { min-width: 0; }
.sc-product-dialog .form-row { min-width: 0; margin-bottom: 12px; }
.sc-product-dialog .sc-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
    font-size: 12px;
}
.sc-product-dialog .sc-input,
.sc-product-dialog .sc-select {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: 0 12px;
    border-radius: var(--sc-radius-sm);
    font-size: 14px;
}
.sc-product-form-error {
    margin-bottom: 12px;
    padding: 9px 11px;
    border: 1px solid var(--sc-danger-border);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-danger-bg);
    color: var(--sc-danger-text);
    font-size: 12px;
    line-height: 1.6;
}
.sc-product-form-error[hidden],
.sc-product-dialog .sc-field-error[hidden] { display: none; }

.sc-product-choice {
    width: min(100%, 280px);
    margin-inline: auto;
}
.sc-product-choice .sc-select { cursor: pointer; }
.sc-product-quantity {
    width: min(100%, 320px);
    margin-inline: auto;
}
.sc-product-quantity__stepper {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 10px;
    direction: ltr;
}
.sc-product-quantity__button {
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: #fff;
    font: inherit;
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    transition: transform .15s ease, opacity .15s ease, filter .15s ease;
}
.sc-product-quantity__button--plus { background: var(--sc-success); }
.sc-product-quantity__button--minus { background: var(--sc-danger); }
.sc-product-quantity__button:hover:not(:disabled) { filter: brightness(1.06); transform: translateY(-1px); }
.sc-product-quantity__button:active:not(:disabled) { transform: scale(.96); }
.sc-product-quantity__button:focus-visible { outline: none; box-shadow: var(--sc-focus-ring); }
.sc-product-quantity__button:disabled { opacity: .38; cursor: not-allowed; }
.sc-product-quantity__input { text-align: center; direction: ltr; }
.sc-product-bounds {
    display: flex;
    justify-content: center;
    gap: 6px 14px;
    flex-wrap: wrap;
    margin-top: 5px;
    color: var(--sc-muted);
    font-size: 10.5px;
}

.sc-product-counter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    width: min(100%, 390px);
    margin-inline: auto;
}
.sc-product-counter__quantity { text-align: center; direction: ltr; }
.sc-product-counter__price-field { position: relative; min-width: 0; }
.sc-product-counter__price-field .sc-input {
    padding-inline-end: 62px;
    background: var(--sc-surface-2);
    color: var(--sc-text);
    text-align: center;
    direction: ltr;
}
.sc-product-counter__price-field > span {
    position: absolute;
    inset-inline-end: 10px;
    top: 50%;
    max-width: 48px;
    overflow: hidden;
    color: var(--sc-muted);
    font-size: 11px;
    font-weight: 800;
    direction: ltr;
    text-overflow: ellipsis;
    transform: translateY(-50%);
}

.sc-product-requirements { margin-top: 14px; }
.sc-product-requirements h2 {
    margin: 0 0 10px;
    color: var(--sc-text);
    font-size: 14px;
    font-weight: 900;
}
.sc-product-requirements__fields { display: grid; gap: 9px; }
.sc-product-requirements__fields .form-row { margin: 0; }
.sc-product-required,
.sc-product-optional {
    flex: 0 0 auto;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: 9.5px;
    font-weight: 800;
}
.sc-product-required { background: var(--sc-danger-bg); color: var(--sc-danger-text); }
.sc-product-optional { background: var(--sc-secondary-bg); color: var(--sc-secondary-text); }

.sc-product-note {
    max-width: 100%;
    max-height: 12.25em;
    margin-top: 14px;
    padding: 10px 12px;
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: var(--sc-radius-sm);
    background: var(--sc-surface-2);
    color: var(--sc-text);
    font-size: 14px;
    line-height: 1.75;
    overflow-wrap: anywhere;
    scrollbar-width: thin;
    scrollbar-color: var(--sc-border-strong) transparent;
}
.sc-product-note > :first-child { margin-top: 0; }
.sc-product-note > :last-child { margin-bottom: 0; }
.sc-product-note a { overflow-wrap: anywhere; word-break: break-word; }

.sc-product-dialog__message {
    margin: 0;
    color: var(--sc-muted);
    font-size: 13px;
    line-height: 1.7;
    text-align: center;
}
.sc-product-dialog__guest-actions {
    display: flex;
    justify-content: center;
    gap: 9px;
    flex-wrap: wrap;
    margin-top: 14px;
}
.sc-product-dialog__actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 18px;
}
.sc-product-dialog__buy,
.sc-product-dialog__cancel {
    flex: 0 1 150px;
    min-width: 112px;
    min-height: 44px;
    padding: 9px 18px;
    border: 0;
    border-radius: var(--sc-radius);
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 900;
    cursor: pointer;
    transition: transform .15s ease, filter .15s ease, opacity .15s ease;
}
.sc-product-dialog__buy { background: var(--sc-success); }
.sc-product-dialog__cancel { background: var(--sc-danger); }
.sc-product-dialog__buy:hover:not(:disabled),
.sc-product-dialog__cancel:hover { filter: brightness(1.06); transform: translateY(-1px); }
.sc-product-dialog__buy:focus-visible,
.sc-product-dialog__cancel:focus-visible { outline: none; box-shadow: var(--sc-focus-ring); }
.sc-product-dialog__buy:disabled { opacity: .58; cursor: wait; }
.sc-product-dialog.is-quoting [data-quote-total],
.sc-product-dialog.is-quoting [data-quote-total-input] { opacity: .55; }

@media (max-width: 420px) {
    .sc-product-dialog__head { gap: 12px; padding: 14px; }
    .sc-product-dialog__scroll { padding: 14px; }
    .sc-product-price-badge { max-width: 45%; padding-inline: 8px; font-size: 12px; }
    .sc-product-counter { gap: 8px; }
    .sc-product-dialog__actions { gap: 10px; }
    .sc-product-dialog__buy,
    .sc-product-dialog__cancel { min-width: 0; padding-inline: 14px; }
}

@media (prefers-reduced-motion: reduce) {
    .sc-product-modal__loading::before { animation-duration: 1.4s; }
    .sc-product-quantity__button,
    .sc-product-dialog__buy,
    .sc-product-dialog__cancel { transition: none; }
}

/* Integration surfaces: delivery, wallet, deposits, popup. */
.sc-delivery{margin-bottom:14px}.sc-delivery__head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.sc-delivery__head h2{margin:0;font-size:17px}
.sc-delivery__codes{display:grid;gap:9px}.sc-delivery-code{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--sc-border,#e2e8f0);border-radius:12px;background:var(--sc-surface-soft,#f8fafc);min-width:0}
.sc-delivery-code code{direction:ltr;text-align:left;flex:1;min-width:0;overflow-wrap:anywhere;white-space:pre-wrap}.sc-delivery__reply{margin-top:14px}.sc-delivery__reply p{white-space:pre-wrap;overflow-wrap:anywhere;margin:7px 0 0;line-height:1.8}.sc-delivery .sc-btn{min-height:44px}
.sc-copy-line{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px}.sc-copy-line>span{min-width:0;overflow-wrap:anywhere}.sc-copy-line .sc-btn{min-height:44px}
.sc-wallet-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:18px}.sc-wallet-card-label{font-size:12px;color:var(--sc-muted,#64748b);margin-bottom:4px}.sc-wallet-purchase-total{font-size:22px;font-weight:800}.sc-wallet-card-note{font-size:12px;color:var(--sc-muted,#64748b);margin-top:6px;line-height:1.6}
.sc-responsive-table-panel{padding:0;overflow:hidden}.sc-table-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.sc-table-scroll>.shop-table{min-width:640px}
.sc-deposit-requirements{margin-top:16px}.sc-deposit-requirements h2{font-size:15px;margin:0 0 10px}.sc-deposit-requirements dl{display:grid;gap:8px;margin:0}.sc-deposit-requirements dl>div{display:grid;grid-template-columns:minmax(100px,.45fr) minmax(0,1fr);gap:10px}.sc-deposit-requirements dt{font-weight:700}.sc-deposit-requirements dd{margin:0;overflow-wrap:anywhere}
.sc-notify-popup.sc-modal{z-index:3000}.sc-notify-popup__dialog{max-width:520px}.sc-notify-popup .sc-btn{min-height:44px}
.sc-notify-popup--group-goal .sc-notify-popup__dialog{position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--sc-primary,#2563eb) 34%,transparent);box-shadow:0 22px 60px rgba(37,99,235,.2)}
.sc-notify-popup--group-goal .sc-notify-popup__dialog::before,.sc-notify-popup--group-goal .sc-notify-popup__dialog::after{position:absolute;z-index:0;pointer-events:none;color:#eab308;opacity:.75;animation:sc-goal-sparkle 2.6s ease-in-out infinite}
.sc-notify-popup--group-goal .sc-notify-popup__dialog::before{content:"✦  ★  ✨";inset:14px auto auto 18px;font-size:18px}
.sc-notify-popup--group-goal .sc-notify-popup__dialog::after{content:"✨  ✦  ★";inset:auto 18px 58px auto;font-size:16px;animation-delay:-1.3s}
.sc-notify-popup--group-goal .sc-modal__header,.sc-notify-popup--group-goal .sc-modal__body,.sc-notify-popup--group-goal .sc-modal__footer{position:relative;z-index:1}
.sc-notify-popup--group-goal .sc-modal__header h3{color:var(--sc-primary,#2563eb)}
@keyframes sc-goal-sparkle{0%,100%{opacity:.42;transform:translateY(0) scale(.92)}50%{opacity:1;transform:translateY(-5px) scale(1.08)}}
@media(prefers-reduced-motion:reduce){.sc-notify-popup--group-goal .sc-notify-popup__dialog::before,.sc-notify-popup--group-goal .sc-notify-popup__dialog::after{animation:none}}

/* Customer wish entry reuses the storefront drawer, modal, field and button systems. */
.sc-wish-drawer-trigger {
    width: 100%;
    border: 0;
    background: transparent;
    appearance: none;
    font-family: var(--sc-font);
    text-align: start;
    cursor: pointer;
}

.sc-wish-modal__intro {
    margin: 0;
    color: var(--sc-text);
    font-size: 14px;
    line-height: 1.9;
}

.sc-wish-modal .sc-modal__body > .sc-field:last-child {
    margin-bottom: 0;
}
.sc-notify-popup__body{direction:rtl;text-align:right;line-height:1.8}
.sc-notify-item{width:100%;border:0;background:transparent;text-align:inherit;align-items:flex-start!important;height:auto!important;padding:10px!important;cursor:pointer}
.sc-notify-empty{padding:26px 12px}.sc-notify-item__icon{margin-top:2px}.sc-notify-item__icon::before{content:"";display:block;width:16px;height:16px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9M10 21h4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}.sc-notify-item__content{display:flex;flex-direction:column;gap:2px;min-width:0}.sc-notify-item__content strong{font-size:13px}.sc-notify-item__message{font-size:12px;color:var(--sc-muted);font-weight:500}.sc-notify-item__date{font-size:11px;color:var(--sc-muted)}

@media(max-width:700px){
  .sc-delivery-code{align-items:stretch;flex-direction:column}.sc-delivery-code .sc-btn{width:100%}
  .sc-wallet-summary-grid{grid-template-columns:minmax(0,1fr)}
  .sc-wallet-table,.sc-wallet-table tbody,.sc-wallet-table tr,.sc-wallet-table td{display:block;width:100%}.sc-table-scroll>.sc-wallet-table{min-width:0}
  .sc-wallet-table thead{display:none}.sc-wallet-table tbody{padding:10px;box-sizing:border-box}
  .sc-wallet-table tr{border:1px solid var(--sc-border,#e2e8f0);border-radius:12px;padding:8px;margin-bottom:10px;background:var(--sc-surface,#fff);box-sizing:border-box}
  .sc-wallet-table td{display:grid;grid-template-columns:minmax(92px,.42fr) minmax(0,1fr);gap:10px;border:0!important;padding:7px!important;box-sizing:border-box;overflow-wrap:anywhere}
  .sc-wallet-table td:before{content:attr(data-label);font-weight:700;color:var(--sc-muted,#64748b)}
  .sc-deposit-requirements dl>div{grid-template-columns:1fr;gap:3px}
  .sc-notify-popup__dialog{max-height:calc(100vh - 20px)}
}

/* ========================================================================== 
   Customer wallet
   ========================================================================== */
.sc-wallet-page { width: 100%; min-width: 0; }
.sc-wallet-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.sc-wallet-head h1 { margin: 0; font-size: clamp(22px, 3vw, 28px); font-weight: 900; }
.sc-wallet-head p { margin: 2px 0 0; color: var(--sc-muted); font-size: 12.7px; }
.sc-wallet-head .sc-btn { min-height: 44px; flex: 0 0 auto; }

.sc-wallet-page .sc-wallet-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin-bottom: 7px;
}
.sc-wallet-stat {
    display: grid;
    align-content: center;
    gap: 3px;
    min-width: 0;
    min-height: 64px;
    padding: 7px 10px;
    border: 1px solid transparent;
    border-radius: var(--sc-radius);
}
.sc-wallet-stat > span { color: var(--sc-muted); font-size: 10.3px; font-weight: 800; }
.sc-wallet-stat strong { color: var(--sc-text); font-size: 17px; font-weight: 900; line-height: 1.3; overflow-wrap: anywhere; }
.sc-wallet-stat strong small { margin-inline-start: 3px; color: currentColor; font-size: 9.7px; opacity: .72; }
.sc-wallet-stat--balance-positive { border-color: var(--sc-success-border); background: var(--sc-success-bg); }
.sc-wallet-stat--balance-positive strong { color: var(--sc-success-text); }
.sc-wallet-stat--balance-negative { border-color: var(--sc-danger-border); background: var(--sc-danger-bg); }
.sc-wallet-stat--balance-negative strong { color: var(--sc-danger-text); }
.sc-wallet-stat--available { border-color: var(--sc-primary-border); background: var(--sc-primary-bg); }
.sc-wallet-stat--available strong { color: var(--sc-primary-text); }
.sc-wallet-stat--limit { border-color: rgba(244, 63, 94, .22); background: rgba(244, 63, 94, .08); }
.sc-wallet-stat--limit strong { color: var(--sc-danger-text); }
.sc-wallet-stat--purchases { border-color: rgba(234, 88, 12, .24); background: rgba(249, 115, 22, .1); }
.sc-wallet-stat--purchases strong { color: #c2410c; }
.sc-wallet-stat__totals { display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap; }
html[data-theme="dark"] .sc-wallet-stat--purchases strong { color: #fb923c; }
@media (prefers-color-scheme: dark) {
    html[data-theme="system"] .sc-wallet-stat--purchases strong { color: #fb923c; }
}

.sc-wallet-toolbar {
    display: grid;
    grid-template-columns: auto minmax(160px, .65fr) minmax(260px, 1.5fr);
    align-items: end;
    gap: 7px;
    margin-bottom: 6px;
    padding: 8px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
}
.sc-wallet-date-filter { display: flex; align-items: center; gap: 6px; min-width: 0; }
.sc-wallet-date-search {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    padding: 0;
    border: 0;
    border-radius: var(--sc-radius-sm);
    background: var(--sc-primary);
    color: var(--sc-primary-contrast);
    cursor: pointer;
}
.sc-wallet-date-search:hover { filter: brightness(1.05); }
.sc-wallet-date-search:focus-visible { outline: none; box-shadow: var(--sc-focus-ring); }
.sc-wallet-filter-field { display: grid; min-width: 0; gap: 5px; }
.sc-wallet-filter-field > span:not(.sc-visually-hidden) { color: var(--sc-muted); font-size: 10.7px; font-weight: 800; }
.sc-wallet-filter-field .sc-select,
.sc-wallet-filter-field .sc-input { width: 100%; min-width: 0; min-height: 42px; font-size: 12.7px; }
.sc-wallet-filter-field--search { align-self: end; }
.sc-wallet-filter-field--search .sc-input { padding-inline: 13px; font-size: 13px; }
.sc-wallet-live { margin: 0 0 3px; color: var(--sc-muted); font-size: 11.7px; }
.sc-wallet-live[hidden] { display: none; }

.sc-wallet-ledger > h2 { margin: 0 0 5px; font-size: 16px; font-weight: 900; }
.sc-wallet-table-wrap {
    max-width: 100%;
    overflow: hidden;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-surface);
    box-shadow: var(--sc-shadow-sm);
}
.sc-wallet-page .sc-wallet-table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; color: var(--sc-text); font-size: 12.3px; }
.sc-wallet-page .sc-wallet-table th {
    padding: 7px 8px;
    border-bottom: 1px solid var(--sc-border-strong);
    background: var(--sc-surface-2);
    color: var(--sc-muted);
    font-size: 10.8px;
    font-weight: 900;
    text-align: start;
}
.sc-wallet-page .sc-wallet-table th:nth-child(1) { width: 13%; }
.sc-wallet-page .sc-wallet-table th:nth-child(2),
.sc-wallet-page .sc-wallet-table th:nth-child(3),
.sc-wallet-page .sc-wallet-table th:nth-child(4) { width: 14%; }
.sc-wallet-page .sc-wallet-table th:nth-child(5) { width: 17%; }
.sc-wallet-page .sc-wallet-table th:nth-child(6) { width: 17%; }
.sc-wallet-page .sc-wallet-table th:nth-child(7) { width: 11%; }
.sc-wallet-page .sc-wallet-table th:nth-child(2),
.sc-wallet-page .sc-wallet-table th:nth-child(3),
.sc-wallet-page .sc-wallet-table th:nth-child(4),
.sc-wallet-page .sc-wallet-table td:nth-child(2),
.sc-wallet-page .sc-wallet-table td:nth-child(3),
.sc-wallet-page .sc-wallet-table td:nth-child(4) {
    text-align: center;
}
.sc-wallet-page .sc-wallet-table th:nth-child(2) .sc-wallet-sort,
.sc-wallet-page .sc-wallet-table th:nth-child(3) .sc-wallet-sort,
.sc-wallet-page .sc-wallet-table th:nth-child(4) .sc-wallet-sort {
    justify-content: center;
}
.sc-wallet-page .sc-wallet-table td:nth-child(2) > .sc-wallet-money,
.sc-wallet-page .sc-wallet-table td:nth-child(3) > .sc-wallet-balance,
.sc-wallet-page .sc-wallet-table td:nth-child(4) > .sc-wallet-balance {
    display: block;
    width: 100%;
    text-align: center;
}
.sc-wallet-page .sc-wallet-table td {
    padding: 7px 8px;
    border-bottom: 1px solid var(--sc-border);
    background: var(--sc-surface);
    vertical-align: middle;
    overflow-wrap: anywhere;
}
.sc-wallet-page .sc-wallet-table tr:last-child td { border-bottom: 0; }
.sc-wallet-page .sc-wallet-table tr[hidden] { display: none !important; }
.sc-wallet-sort {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: 100%;
    min-height: 30px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: inherit;
    text-align: start;
    cursor: pointer;
}
.sc-wallet-sort > span { position: relative; width: 9px; height: 13px; flex: 0 0 9px; opacity: .38; }
.sc-wallet-sort > span::before,
.sc-wallet-sort > span::after { position: absolute; inset-inline-start: 1px; content: ''; border-inline: 3.5px solid transparent; }
.sc-wallet-sort > span::before { inset-block-start: 1px; border-bottom: 4px solid currentColor; }
.sc-wallet-sort > span::after { inset-block-end: 1px; border-top: 4px solid currentColor; }
.sc-wallet-sort[data-sort-direction="asc"] > span,
.sc-wallet-sort[data-sort-direction="desc"] > span { color: var(--sc-primary); opacity: 1; }
.sc-wallet-sort[data-sort-direction="asc"] > span::after,
.sc-wallet-sort[data-sort-direction="desc"] > span::before { opacity: .2; }
.sc-wallet-sort:hover { color: var(--sc-primary-text); }
.sc-wallet-sort:focus-visible { outline: none; border-radius: 4px; box-shadow: var(--sc-focus-ring); }
.sc-wallet-kind { display: inline-flex; align-items: center; min-height: 24px; padding: 2px 7px; border-radius: 999px; font-size: 10.3px; font-weight: 900; }
.sc-wallet-kind--orders { min-height: 0; padding: 0; border-radius: 0; background: transparent; color: var(--sc-text); }
.sc-wallet-order-status--completed { color: var(--sc-success-text); }
.sc-wallet-order-status--pending { color: #c2410c; }
.sc-wallet-order-status--rejected { color: var(--sc-danger-text); }
html[data-theme="dark"] .sc-wallet-order-status--pending { color: #fb923c; }
@media (prefers-color-scheme: dark) {
    html[data-theme="system"] .sc-wallet-order-status--pending { color: #fb923c; }
}
.sc-wallet-kind--deposits { background: var(--sc-success-bg); color: var(--sc-success-text); }
.sc-wallet-kind--manual_debit { background: var(--sc-danger-bg); color: var(--sc-danger-text); }
.sc-wallet-kind--manual_credit { background: var(--sc-primary-bg); color: var(--sc-primary-text); }
.sc-wallet-money,
.sc-wallet-balance { white-space: nowrap; font-size: 12.8px; font-weight: 900; }
.sc-wallet-page .sc-wallet-table td:nth-child(5),
.sc-wallet-page .sc-wallet-table td:nth-child(6) time { color: var(--sc-text); font-weight: 900; }
.sc-wallet-money small,
.sc-wallet-balance small { font-size: 9.2px; opacity: .72; }
.sc-wallet-money--positive,
.sc-wallet-balance--positive { color: var(--sc-success-text); }
.sc-wallet-money--negative,
.sc-wallet-balance--negative { color: var(--sc-danger-text); }
.sc-wallet-order-link { color: var(--sc-primary-text); font-weight: 900; text-decoration: none; white-space: nowrap; }
.sc-wallet-order-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.sc-wallet-order-link:focus-visible { outline: none; border-radius: 3px; box-shadow: var(--sc-focus-ring); }
.sc-wallet-empty { display: grid; place-items: center; gap: 4px; min-height: 112px; padding: 16px; color: var(--sc-muted); text-align: center; }
.sc-wallet-empty[hidden] { display: none; }
.sc-wallet-empty strong { color: var(--sc-text); font-size: 13.7px; }
.sc-wallet-empty span { font-size: 11.7px; }
.sc-wallet-pagination:empty { display: none; }
.sc-wallet-pagination button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    min-height: 38px;
    padding: 6px 10px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-surface);
    color: var(--sc-text);
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}
.sc-wallet-pagination button:hover { border-color: var(--sc-primary-border); color: var(--sc-primary-text); }
.sc-wallet-pagination button:focus-visible { outline: none; box-shadow: var(--sc-focus-ring); }
.sc-wallet-page.is-loading .sc-wallet-table-wrap { opacity: .58; pointer-events: none; }

/* Existing Material date component, themed with customer appearance tokens. */
.sc-wallet-page .sc-date-pill { position: relative; display: inline-flex; align-items: center; min-width: 174px; margin: 0; }
.sc-wallet-page .sc-date-pill__label { position: absolute; z-index: 1; inset-block-start: -7px; inset-inline-start: 13px; padding: 0 5px; background: var(--sc-surface); color: var(--sc-muted); font-size: 10.6px; font-weight: 800; line-height: 1; pointer-events: none; }
.sc-wallet-page .sc-date-pill__input { width: 100%; min-width: 174px; height: 42px; padding-block: 0; padding-inline: 13px 40px; border: 1px solid var(--sc-border); border-radius: 999px; background: var(--sc-surface); color: var(--sc-text); font: inherit; font-size: 12.7px; font-weight: 700; text-align: center; cursor: pointer; appearance: none; }
.sc-wallet-page .sc-date-pill__input:focus { outline: none; border-color: var(--sc-primary); box-shadow: var(--sc-focus-ring); }
.sc-wallet-page .sc-date-pill__icon { position: absolute; z-index: 2; inset-inline-end: 9px; inset-block-start: 50%; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; transform: translateY(-50%); border: 0; border-radius: 50%; background: transparent; color: var(--sc-muted); cursor: pointer; }
.sc-wallet-page .sc-date-pill__icon:hover { background: var(--sc-primary-bg); color: var(--sc-primary-text); }
body.sc-md-date-open { overflow: hidden; }
.sc-md-date { position: fixed; inset: 0; z-index: 12000; display: flex; align-items: center; justify-content: center; padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); box-sizing: border-box; }
.sc-md-date[hidden] { display: none !important; }
.sc-md-date__backdrop { position: absolute; inset: 0; background: rgba(2, 12, 11, .66); }
.sc-md-date__dialog { position: relative; z-index: 1; display: flex; flex-direction: column; width: min(340px, calc(100vw - 24px)); max-height: min(92dvh, 560px); overflow: auto; border: 1px solid var(--sc-border); border-radius: 16px; background: var(--sc-surface); color: var(--sc-text); box-shadow: var(--sc-shadow-lg); }
.sc-md-date__header { padding: 18px 20px 16px; border-radius: 16px 16px 0 0; background: var(--sc-primary); color: var(--sc-primary-contrast); }
.sc-md-date__weekday { margin-bottom: 4px; font-size: 13px; font-weight: 600; opacity: .92; }
.sc-md-date__title { font-size: 24px; font-weight: 800; line-height: 1.25; }
.sc-md-date__body { padding: 12px 14px 8px; }
.sc-md-date__nav { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.sc-md-date__nav-btn,
.sc-md-date__month-btn { border: 0; background: transparent; color: var(--sc-text); font-family: inherit; cursor: pointer; }
.sc-md-date__nav-btn { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; font-size: 22px; line-height: 1; }
.sc-md-date__nav-btn:hover,
.sc-md-date__month-btn:hover { background: var(--sc-primary-bg); color: var(--sc-primary-text); }
.sc-md-date__month-btn { flex: 1; min-width: 0; height: 36px; padding: 0 8px; border-radius: 10px; font-size: 14px; font-weight: 800; }
.sc-md-date__weekdays,
.sc-md-date__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; }
.sc-md-date__weekdays[hidden],
.sc-md-date__grid[hidden],
.sc-md-date__years[hidden] { display: none !important; }
.sc-md-date__weekdays { margin-bottom: 4px; }
.sc-md-date__wd { padding: 4px 0; color: var(--sc-muted); font-size: 12px; font-weight: 700; text-align: center; }
.sc-md-date__cell { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--sc-text); font-family: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.sc-md-date__cell--empty { visibility: hidden; pointer-events: none; }
.sc-md-date__cell:hover:not(.sc-md-date__cell--empty) { background: var(--sc-primary-bg); color: var(--sc-primary-text); }
.sc-md-date__cell.is-today { box-shadow: inset 0 0 0 1.5px var(--sc-primary); }
.sc-md-date__cell.is-selected { background: var(--sc-primary); color: var(--sc-primary-contrast); box-shadow: none; }
.sc-md-date__years { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; min-height: 220px; padding: 6px 0 4px; }
.sc-md-date__year { height: 44px; border: 1px solid var(--sc-border); border-radius: 10px; background: var(--sc-surface); color: var(--sc-text); font-family: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.sc-md-date__year:hover { border-color: var(--sc-primary); background: var(--sc-primary-bg); color: var(--sc-primary-text); }
.sc-md-date__year.is-selected { border-color: var(--sc-primary); background: var(--sc-primary); color: var(--sc-primary-contrast); }
.sc-md-date__actions { display: flex; justify-content: flex-start; gap: 8px; padding: 8px 14px 14px; }
.sc-md-date__btn { min-width: 88px; height: 38px; padding: 0 14px; border: 1px solid transparent; border-radius: 10px; font-family: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }
.sc-md-date__btn--ghost { border-color: var(--sc-border); background: transparent; color: var(--sc-text); }
.sc-md-date__btn--ghost:hover { background: var(--sc-surface-2); }
.sc-md-date__btn--primary { background: var(--sc-primary); color: var(--sc-primary-contrast); }
.sc-md-date__btn--primary:hover { filter: brightness(1.05); }

@media (max-width: 980px) {
    .sc-wallet-page .sc-wallet-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-wallet-toolbar { grid-template-columns: auto minmax(150px, 1fr); }
    .sc-wallet-filter-field--search { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
    .sc-wallet-table-wrap { overflow: visible; border: 0; background: transparent; box-shadow: none; }
    .sc-wallet-page .sc-wallet-table,
    .sc-wallet-page .sc-wallet-table tbody,
    .sc-wallet-page .sc-wallet-table tr,
    .sc-wallet-page .sc-wallet-table td { display: block; width: 100%; box-sizing: border-box; }
    .sc-wallet-page .sc-wallet-table { table-layout: auto; }
    .sc-wallet-page .sc-wallet-table thead { display: none; }
    .sc-wallet-page .sc-wallet-table tbody { padding: 0; }
    .sc-wallet-page .sc-wallet-table tr { margin-bottom: 9px; padding: 6px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius); background: var(--sc-surface); box-shadow: var(--sc-shadow-sm); }
    .sc-wallet-page .sc-wallet-table td { display: grid; grid-template-columns: minmax(100px, .75fr) minmax(0, 1fr); align-items: center; gap: 8px; padding: 6px 7px !important; border: 0; background: transparent; }
    .sc-wallet-page .sc-wallet-table td::before { content: attr(data-label); color: var(--sc-muted); font-size: 9px; font-weight: 800; }
}
@media (max-width: 560px) {
    .sc-wallet-head { align-items: stretch; flex-direction: column; }
    .sc-wallet-head .sc-btn { width: 100%; }
    .sc-wallet-page .sc-wallet-summary-grid { grid-template-columns: minmax(0, 1fr); }
    .sc-wallet-toolbar { grid-template-columns: minmax(0, 1fr); padding: 10px; }
    .sc-wallet-date-filter,
    .sc-wallet-filter-field--search { grid-column: auto; }
    .sc-wallet-date-filter .sc-date-pill { flex: 1; min-width: 0; }
    .sc-wallet-date-filter .sc-date-pill__input { min-width: 0; }
    .sc-wallet-page .sc-wallet-table td { grid-template-columns: minmax(98px, .8fr) minmax(0, 1fr); }
    .sc-md-date__dialog { width: min(100%, calc(100vw - 16px)); max-height: min(90dvh, 560px); }
    .sc-md-date__title { font-size: 20px; }
    .sc-md-date__cell { height: 36px; }
}

@media (prefers-reduced-motion: reduce) {
    .sc-wallet-page *, .sc-md-date * { scroll-behavior: auto !important; transition: none !important; }
}

/* Customer monthly inventory: reuses wallet cards, dates, tables and pagination. */
.sc-product-financial-security-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px; margin-bottom: 12px; }
.sc-product-financial-security-slot { min-width: 0; }
.sc-product-financial-security-slot .form-row { width: 100%; margin-bottom: 0; }
.sc-product-financial-security-slot--sale .sc-product-sale-price,
.sc-product-financial-security-slot--two-factor .sc-product-purchase-verification { width: 100%; max-width: 320px; }
.sc-product-sale-price__field { position: relative; display: flex; align-items: center; min-width: 0; overflow: hidden; border-radius: var(--sc-radius-sm); }
.sc-product-sale-price__field .sc-input { width: 100%; box-sizing: border-box; padding-right: 13px; padding-left: 66px; text-align: right; }
.sc-product-sale-price__field > span { position: absolute; inset-block: 1px; inset-inline-end: 1px; display: flex; align-items: center; justify-content: center; width: 54px; border-inline-start: 1px solid var(--sc-border); background: var(--sc-surface-2); color: var(--sc-muted); font-size: 11px; font-weight: 850; line-height: 1; white-space: nowrap; unicode-bidi: isolate; pointer-events: none; }

@media (max-width: 380px) {
    .sc-product-financial-security-row { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    .sc-product-financial-security-slot--sale .sc-product-sale-price,
    .sc-product-financial-security-slot--two-factor .sc-product-purchase-verification { max-width: 100%; }
}

.sc-monthly-inventory-head { align-items: end; margin-bottom: 10px; }
.sc-monthly-profit-setting { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius); background: var(--sc-surface); }
.sc-monthly-profit-setting .sc-btn { width: auto; flex: 0 0 auto; }
.sc-monthly-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; color: var(--sc-text); font-size: 12px; font-weight: 850; cursor: pointer; }
.sc-monthly-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.sc-monthly-toggle__track { display: inline-flex; align-items: center; width: 36px; height: 20px; padding: 2px; border: 1px solid var(--sc-border-strong); border-radius: 999px; background: var(--sc-surface-2); transition: background .18s ease, border-color .18s ease; }
.sc-monthly-toggle__track > span { width: 14px; height: 14px; border-radius: 50%; background: var(--sc-muted); transition: transform .18s ease, background .18s ease; }
.sc-monthly-toggle input:checked + .sc-monthly-toggle__track { border-color: var(--sc-primary); background: var(--sc-primary-bg); }
.sc-monthly-toggle input:checked + .sc-monthly-toggle__track > span { transform: translateX(-16px); background: var(--sc-primary); }
.sc-monthly-toggle input:focus-visible + .sc-monthly-toggle__track { box-shadow: var(--sc-focus-ring); }

.sc-monthly-stat--deposits { border-color: var(--sc-primary-border); background: var(--sc-primary-bg); }
.sc-monthly-stat--deposits strong { color: var(--sc-primary-text); }
.sc-monthly-stat--profit-positive { border-color: var(--sc-success-border); background: var(--sc-success-bg); }
.sc-monthly-stat--profit-positive strong { color: var(--sc-success-text); }
.sc-monthly-stat--profit-negative { border-color: var(--sc-danger-border); background: var(--sc-danger-bg); }
.sc-monthly-stat--profit-negative strong { color: var(--sc-danger-text); }
.sc-monthly-stat--profit-zero { border-color: var(--sc-border); background: var(--sc-surface-2); }
.sc-monthly-stat--profit-zero strong,
.sc-wallet-money--zero { color: var(--sc-muted); }

.sc-monthly-toolbar { display: flex; align-items: center; margin-bottom: 7px; padding: 8px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius-lg); background: var(--sc-surface); }
.sc-monthly-filter-toolbar { grid-template-columns: auto minmax(220px, 1fr); }
.sc-monthly-inventory-page.is-loading [data-monthly-inventory-results] { opacity: .58; pointer-events: none; }
.sc-monthly-results-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: 7px; }
.sc-monthly-result-stat--cost { border-color: var(--sc-primary-border); background: var(--sc-primary-bg); }
.sc-monthly-result-stat--cost strong { color: var(--sc-primary-text); }
.sc-monthly-inventory-table th:nth-child(1) { width: 32%; }
.sc-monthly-inventory-table th:nth-child(2) { width: 14%; }
.sc-monthly-inventory-table th:nth-child(3),
.sc-monthly-inventory-table th:nth-child(4),
.sc-monthly-inventory-table th:nth-child(5) { width: 18%; }
.sc-monthly-inventory-table th:not(:first-child),
.sc-monthly-inventory-table td:not(:first-child) { text-align: center; }
.sc-monthly-inventory-table td:first-child strong { color: var(--sc-text); font-weight: 900; }

@media (max-width: 760px) {
    .sc-monthly-inventory-table th:nth-child(n) { width: auto; }
    .sc-monthly-inventory-table td:not(:first-child) { text-align: initial; }
}
@media (max-width: 560px) {
    .sc-monthly-inventory-head { align-items: stretch; }
    .sc-monthly-profit-setting { justify-content: space-between; }
    .sc-monthly-filter-toolbar { grid-template-columns: minmax(0, 1fr); }
    .sc-monthly-results-summary { grid-template-columns: minmax(0, 1fr); }
    .sc-monthly-toolbar,
    .sc-monthly-toolbar .sc-wallet-date-filter { width: 100%; box-sizing: border-box; }
}

@media (prefers-reduced-motion: reduce) {
    .sc-monthly-toggle__track,
    .sc-monthly-toggle__track > span { transition: none; }
}

/* Final compact customer order/deposit details and order actions. */
.sc-btn--xs { min-height: 32px; padding: 5px 10px; border-radius: var(--sc-radius-sm); font-size: 10.5px; line-height: 1.2; }
.sc-btn--danger { border-color: var(--sc-danger-border); background: var(--sc-danger); color: #fff; }
.sc-btn--danger:hover { filter: brightness(1.05); }
.sc-btn:disabled { cursor: not-allowed; opacity: .5; transform: none; }

.sc-orders-table th:last-child,
.sc-orders-table td:last-child { width: 112px; text-align: center; }
.sc-orders-page .sc-orders-table > thead > tr > th,
.sc-orders-page .sc-orders-table > tbody > .sc-orders-row > td { text-align: center; }
.sc-orders-page .sc-orders-table > thead .sc-orders-sort { justify-content: center; text-align: center; }
.sc-orders-page .sc-orders-row .sc-orders-number,
.sc-orders-page .sc-orders-row .sc-orders-status-text,
.sc-orders-page .sc-orders-row .sc-orders-product,
.sc-orders-page .sc-orders-row .sc-orders-category,
.sc-orders-page .sc-orders-row .sc-orders-balance-label { margin-inline: auto; text-align: center; }
.sc-orders-page .sc-orders-row .sc-orders-requirements,
.sc-orders-page .sc-orders-row .sc-order-wait-actions { justify-items: center; text-align: center; }
.sc-orders-page .sc-orders-row .sc-orders-repurchase { justify-content: center; margin-inline: auto; }
.sc-orders-requirements { justify-items: center; }
.sc-orders-requirements > div { display: block; width: 100%; text-align: center; }
.sc-orders-requirements dd { width: 100%; overflow-wrap: anywhere; text-align: center; }
.sc-orders-repurchase { width: 100%; min-width: 0; white-space: nowrap; }
.sc-order-wait-actions { display: grid; justify-items: center; gap: 5px; text-align: center; }
.sc-order-cancel-countdown { color: var(--sc-warning-text); font-size: 9.5px; font-weight: 800; line-height: 1.45; }
.sc-order-cancel-countdown b { font-size: inherit; }
.sc-order-processing-label { color: var(--sc-warning-text); }
.sc-order-cancel { display: flex; justify-content: center; margin: 0; }

.sc-orders-page .sc-orders-detail-shell { padding: 6px; }
[data-order-details].sc-order-details { gap: 5px; padding: 6px; }
[data-order-details] .sc-order-details__section { min-height: 0; padding: 5px 6px; border: 0; border-radius: var(--sc-radius); }
[data-order-details] .sc-order-details__section + .sc-order-details__section { border-top: 1px solid var(--sc-border); }
[data-order-details] .sc-order-details__section h2 { margin-bottom: 4px; font-size: 11px; text-align: center; }
[data-order-details] .sc-order-details__section--info { background: var(--sc-info-bg); }
[data-order-details] .sc-order-details__section--requirements { background: var(--sc-primary-bg); }
[data-order-details] .sc-order-details__section--money { background: var(--sc-success-bg); }
[data-order-details] .sc-order-details__section--times { background: var(--sc-surface-2); }
[data-order-details] .sc-order-details__section--rejected { background: var(--sc-danger-bg); }
[data-order-details] .sc-order-details__section--reply { background: var(--sc-info-bg); }
[data-order-details] .sc-order-details__section--codes { background: var(--sc-warning-bg); }
[data-order-details] .sc-order-detail-grid,
[data-order-details] .sc-order-detail-requirements { gap: 5px; }
[data-order-details] .sc-order-detail-grid > div,
[data-order-details] .sc-order-detail-requirements > div { display: grid; align-content: center; justify-items: center; min-height: 0; padding: 5px 6px; text-align: center; }
[data-order-details] .sc-order-detail-requirements,
[data-order-details] .sc-order-detail-grid--money,
[data-order-details] .sc-order-delivery-codes { display: flex; flex-wrap: wrap; justify-content: center; }
[data-order-details] .sc-order-detail-requirements > div { flex: 1 1 200px; max-width: calc(33.333% - 4px); }
[data-order-details] .sc-order-detail-grid--money > div { flex: 1 1 180px; max-width: calc(33.333% - 4px); }
[data-order-details] .sc-order-delivery-codes code { flex: 1 1 220px; max-width: calc(50% - 3px); }
[data-order-details] .sc-order-details__section--times .sc-order-detail-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
[data-order-details] .sc-order-detail-grid--money > div:first-child { background: var(--sc-success-bg); }
[data-order-details] .sc-order-detail-grid--money > div:nth-child(2) { background: var(--sc-primary-bg); }
[data-order-details] .sc-order-detail-grid--money > div:nth-child(3) { background: var(--sc-info-bg); }
[data-order-details] .sc-order-detail-grid span,
[data-order-details] .sc-order-detail-requirements dt { width: 100%; margin-bottom: 2px; font-size: 8.5px; text-align: center; }
[data-order-details] .sc-order-detail-grid strong,
[data-order-details] .sc-order-detail-requirements dd { width: 100%; margin-inline: auto; font-size: 11px; text-align: center; overflow-wrap: anywhere; word-break: break-word; }
[data-order-details] .sc-order-rejection-notice,
[data-order-details] .sc-order-completion-reply { padding: 5px 7px; text-align: center; }
[data-order-details] .sc-order-details__section-head { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; }
[data-order-details] .sc-order-details__section-head h2 { grid-column: 2; }
[data-order-details] .sc-order-details__section-head .sc-btn { grid-column: 3; justify-self: end; }
[data-order-details] .sc-order-delivery-codes { gap: 5px; }
[data-order-details] .sc-order-delivery-codes code { padding: 6px 7px; background: var(--sc-surface); }
[data-order-details] .sc-order-actions { display: flex; align-items: center; justify-content: center; gap: 7px; flex-wrap: wrap; padding-top: 1px; }
[data-order-details] .sc-order-details__pending { padding: 7px; }
[data-order-details] .sc-order-details__pending > div:first-child { display: grid; gap: 2px; text-align: center; }

.sc-deposit-detail-panel { padding: 9px 10px; }
.sc-deposit-detail-head { padding-bottom: 7px; }
.sc-deposit-detail-head > div:first-child,
.sc-deposit-detail-head__meta { justify-content: center; }
.sc-deposit-detail-head__meta span { padding: 3px 7px; }
.sc-deposit-notice { margin-top: 7px; padding: 7px 8px; text-align: center; }
.sc-deposit-detail-section { margin-top: 7px; padding: 7px; border-radius: var(--sc-radius); }
.sc-deposit-detail-section + .sc-deposit-detail-section { padding-top: 7px; border-top: 1px solid var(--sc-border); }
.sc-deposit-detail-section--amounts { background: var(--sc-success-bg); }
.sc-deposit-detail-section--times { background: var(--sc-surface-2); }
.sc-deposit-detail-section--attachments { background: var(--sc-info-bg); }
.sc-deposit-detail-section h3 { margin-bottom: 5px; font-size: 11px; }
.sc-deposit-stats,
.sc-deposit-timeline { gap: 5px; }
.sc-deposit-stat,
.sc-deposit-timeline > div { display: grid; align-content: center; min-height: 54px; padding: 6px 7px; text-align: center; border-inline-start: 0; border-radius: var(--sc-radius-sm); }
.sc-deposit-stat:nth-child(3) { background: var(--sc-primary-bg); }
.sc-deposit-stat:nth-child(4) { background: var(--sc-info-bg); }
.sc-deposit-stat > span,
.sc-deposit-timeline span { font-size: 8.5px; text-align: center; }
.sc-deposit-stat > strong,
.sc-deposit-timeline time,
.sc-deposit-timeline strong { margin-inline: auto; font-size: 11px; text-align: center; overflow-wrap: anywhere; word-break: break-word; }
.sc-deposit-receipt { justify-content: center; gap: 8px; margin-bottom: 7px; text-align: center; }
.sc-deposit-requirement-list { gap: 5px; }
.sc-deposit-requirement-list > div { grid-template-columns: minmax(95px, .35fr) minmax(0, 1fr); gap: 7px; min-height: 48px; padding: 6px 7px; text-align: center; }
.sc-deposit-requirement-list dt,
.sc-deposit-requirement-list dd { text-align: center; overflow-wrap: anywhere; word-break: break-word; }
.sc-deposit-requirement-list dd { display: flex; align-items: center; justify-content: center; }

.sc-order-action-modal { position: fixed; z-index: 13000; inset: 0; display: flex; align-items: center; justify-content: center; padding: 14px; }
.sc-order-action-modal[hidden] { display: none !important; }
.sc-order-action-modal__backdrop { position: absolute; inset: 0; border: 0; background: rgba(2, 12, 11, .62); cursor: default; }
.sc-order-action-modal__dialog { position: relative; z-index: 1; display: grid; gap: 10px; width: min(440px, 100%); max-height: calc(100dvh - 28px); overflow: auto; padding: 14px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius-lg); background: var(--sc-surface); color: var(--sc-text); box-shadow: var(--sc-shadow-lg); }
.sc-order-action-modal__dialog h2 { margin: 0; font-size: 16px; }
.sc-order-action-modal__dialog form { display: grid; gap: 8px; }
.sc-order-action-modal__dialog label { font-size: 11px; font-weight: 850; }
.sc-order-action-modal__dialog textarea { min-height: 104px; resize: vertical; }
.sc-order-action-modal__error { margin: 0; color: var(--sc-danger-text); font-size: 11px; font-weight: 800; }
.sc-order-action-modal__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.sc-order-action-modal__actions .sc-btn { width: 100%; }
body.sc-order-action-modal-open { overflow: hidden; }
.sc-toast--error { border-color: var(--sc-danger-border); color: var(--sc-danger-text); }

@media (max-width: 760px) {
    .sc-orders-table th:last-child,
    .sc-orders-table td:last-child { width: 100%; }
    .sc-orders-table .sc-orders-row > td:last-child { text-align: initial; }
    .sc-orders-table .sc-orders-row > td:last-child .sc-orders-repurchase { justify-self: center; width: auto; min-width: 110px; }
}

@media (max-width: 520px) {
    [data-order-details].sc-order-details { padding: 5px; }
    [data-order-details] .sc-order-details__section { padding: 5px; }
    [data-order-details] .sc-order-detail-grid,
    [data-order-details] .sc-order-details__section--times .sc-order-detail-grid { grid-template-columns: minmax(0, 1fr); }
    [data-order-details] .sc-order-detail-requirements > div,
    [data-order-details] .sc-order-detail-grid--money > div,
    [data-order-details] .sc-order-delivery-codes code { flex-basis: 100%; max-width: 100%; }
    [data-order-details] .sc-order-details__section-head { grid-template-columns: minmax(0, 1fr); gap: 5px; }
    [data-order-details] .sc-order-details__section-head h2,
    [data-order-details] .sc-order-details__section-head .sc-btn { grid-column: 1; justify-self: stretch; }
    [data-order-details] .sc-order-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
    [data-order-details] .sc-order-actions .sc-btn { width: 100%; }
    .sc-deposit-detail-panel { padding: 7px; }
    .sc-deposit-requirement-list > div { grid-template-columns: minmax(0, 1fr); gap: 3px; }
    .sc-order-action-modal { align-items: flex-end; padding: 8px; }
    .sc-order-action-modal__actions { grid-template-columns: minmax(0, 1fr); }
}

/* Customer notification page and shared rich popup content. */
.sc-notifications-page { width: 100%; min-width: 0; }
.sc-notifications-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.sc-notifications-head h1 { margin: 0 0 3px; font-size: clamp(21px, 3vw, 26px); font-weight: 900; }
.sc-notifications-head p { margin: 0; color: var(--sc-muted); font-size: 12.5px; }
.sc-notifications-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.sc-push-control { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 9px; min-width: 0; }
.sc-push-control__status { color: var(--sc-muted); font-size: 11.5px; font-weight: 700; }
.sc-push-control__help { flex-basis: 100%; max-width: 520px; color: var(--sc-danger); font-size: 10.5px; line-height: 1.55; }
.sc-notifications-pagination {
    display: grid;
    justify-items: center;
    gap: 5px;
    margin-top: 10px;
}
.sc-notifications-pagination .sc-deposit-pagination { margin-top: 0; }
.sc-notifications-pagination__meta {
    margin: 0;
    color: var(--sc-muted);
    font-size: 10.5px;
    font-weight: 700;
}
.sc-notifications-panel { min-width: 0; }
.sc-notifications-table td { vertical-align: top; }
.sc-notifications-table tr.is-unread { background: color-mix(in srgb, var(--sc-primary) 6%, var(--sc-surface)); }
.sc-notification-heading { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 150px; }
.sc-notification-heading a,
.sc-notification-heading strong { color: var(--sc-text); font-size: 13px; font-weight: 850; }
.sc-notification-read-state { color: var(--sc-muted); font-size: 12px; }
.sc-notifications-empty { padding: 24px 12px; }
.sc-notification-rich { max-width: 100%; color: var(--sc-text); overflow-wrap: anywhere; }
.sc-notification-rich > :first-child { margin-top: 0; }
.sc-notification-rich > :last-child { margin-bottom: 0; }
.sc-notification-rich p,
.sc-notification-rich div,
.sc-notification-rich blockquote { max-width: 100%; }
.sc-notification-rich a { color: var(--sc-primary-text); text-decoration: underline; }
.sc-notification-rich--compact { min-width: 220px; max-width: 440px; font-size: 12.5px; line-height: 1.75; }
.sc-static-page-content { color: var(--sc-text); overflow-wrap: anywhere; }
.sc-static-page-content > :first-child { margin-top: 0; }
.sc-static-page-content > :last-child { margin-bottom: 0; }
.sc-static-page-content h1,
.sc-static-page-content h2,
.sc-static-page-content h3,
.sc-static-page-content h4 { margin: 1em 0 .45em; color: var(--sc-text); line-height: 1.45; }
.sc-static-page-content p,
.sc-static-page-content ul,
.sc-static-page-content ol,
.sc-static-page-content blockquote { margin: .55em 0; }
.sc-static-page-content a { color: var(--sc-primary-text); text-decoration: underline; }
/* TinyMCE previously stored its white editing canvas on content elements.
   Neutralise only that legacy surface in dark mode; intentional text and
   coloured highlight values remain untouched. */
html[data-theme="dark"] .sc-static-page-content [style*="background-color: rgb(255, 255, 255)" i] {
    background-color: transparent !important;
}
@media (prefers-color-scheme: dark) {
    html[data-theme="system"] .sc-static-page-content [style*="background-color: rgb(255, 255, 255)" i] {
        background-color: transparent !important;
    }
}
.sc-notify-popup__body.sc-notification-rich { font-size: 14px; }
.sc-notify-item__icon::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9M10 21h4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; }
.sc-push-guest-prompt {
    position: fixed;
    z-index: 1180;
    inset-inline-start: max(12px, env(safe-area-inset-left));
    bottom: max(12px, env(safe-area-inset-bottom));
    display: flex;
    align-items: center;
    gap: 12px;
    width: min(420px, calc(100vw - 24px));
    padding: 10px 12px;
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-md);
    background: var(--sc-surface);
    color: var(--sc-text);
    box-shadow: var(--sc-shadow-md);
}
.sc-push-guest-prompt[hidden] { display: none !important; }
.sc-push-guest-prompt > div { display: grid; min-width: 0; gap: 2px; }
.sc-push-guest-prompt strong { font-size: 12.5px; }
.sc-push-guest-prompt span,
.sc-push-guest-prompt small { color: var(--sc-muted); font-size: 10.5px; line-height: 1.5; }
.sc-push-guest-prompt small { color: var(--sc-danger); }

.sc-legal-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding-top: 4px;
    padding-bottom: 18px;
    font-size: 11.5px;
    font-weight: 750;
}
.sc-legal-links__row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px 16px;
}
.sc-legal-links__row--developer {
    gap: 0;
}
.sc-legal-links a {
    color: #2563eb;
    text-decoration: none;
    transition: color .18s ease, text-decoration-color .18s ease;
}
.sc-legal-links a:hover { color: #1d4ed8; text-decoration: underline; }
.sc-legal-links__developer {
    font-weight: 700;
    opacity: .92;
}
.sc-developer-page__logo {
    display: block;
    width: 188px;
    max-width: 48vw;
    height: auto;
    margin-inline: auto;
    background: transparent;
    background-color: transparent;
}
.sc-developer-page {
    direction: rtl;
    text-align: center;
}
.sc-developer-page__intro {
    display: grid;
    gap: 4px;
    margin: 16px auto 0;
}
.sc-developer-page__lead,
.sc-developer-page__subtext {
    margin: 0;
}
.sc-developer-page__lead {
    color: var(--sc-text);
    font-size: 15px;
    font-weight: 750;
}
.sc-developer-page__subtext {
    color: var(--sc-muted);
    font-size: 13.5px;
}
.sc-developer-page__name {
    display: block;
    margin-top: 16px;
    color: var(--sc-text);
    font-size: 19px;
    font-weight: 850;
}
.sc-developer-page__contact {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    margin-top: 12px;
}
.sc-developer-page__contact-title {
    color: var(--sc-muted);
    font-size: 12.5px;
    font-weight: 800;
}
.sc-developer-page__phone {
    color: var(--sc-text);
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .025em;
}
.sc-developer-page a.sc-developer-page__whatsapp {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    max-width: 100%;
    margin-top: 3px;
    padding: 0 18px;
    border-radius: var(--sc-radius-md);
    background: #128c4a;
    color: #000;
    font-size: 13.5px;
    font-weight: 800;
    text-decoration: none;
    transition: background-color .16s ease, transform .16s ease;
}
.sc-developer-page a.sc-developer-page__whatsapp:hover {
    background: #0f7a40;
    color: #000;
    transform: translateY(-1px);
}
.sc-developer-page a.sc-developer-page__whatsapp:focus-visible {
    color: #000;
    outline: none;
    box-shadow: var(--sc-focus-ring);
}
[data-theme="dark"] .sc-legal-links a { color: #60a5fa; }
[data-theme="dark"] .sc-legal-links a:hover { color: #93c5fd; }
@media (prefers-color-scheme: dark) {
    html[data-theme="system"] .sc-legal-links a { color: #60a5fa; }
    html[data-theme="system"] .sc-legal-links a:hover { color: #93c5fd; }
}
@media (min-width: 900px) {
    .sc-legal-links {
        width: calc(100% - var(--sc-desktop-drawer-w));
        max-width: none;
        margin-inline-start: var(--sc-desktop-drawer-w);
        margin-inline-end: 0;
    }
}
.sc-push-guest-prompt .sc-btn { flex: 0 0 auto; min-height: 40px; }

@media (max-width: 700px) {
    .sc-notifications-head { align-items: stretch; flex-direction: column; }
    .sc-notifications-head .sc-btn { width: 100%; }
    .sc-notifications-actions,
    .sc-push-control { align-items: stretch; flex-direction: column; }
    .sc-push-control__status { text-align: center; }
    .sc-notifications-panel .sc-table-scroll { overflow: visible; }
    .sc-notifications-table,
    .sc-notifications-table tbody,
    .sc-notifications-table tr,
    .sc-notifications-table td { display: block; width: 100%; min-width: 0; box-sizing: border-box; }
    .sc-notifications-table { min-width: 0 !important; }
    .sc-notifications-table thead { display: none; }
    .sc-notifications-table tbody { padding: 8px; }
    .sc-notifications-table tr { margin-bottom: 8px; padding: 7px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius-md); background: var(--sc-surface); }
    .sc-notifications-table tr.is-unread { background: color-mix(in srgb, var(--sc-primary) 7%, var(--sc-surface)); }
    .sc-notifications-table td { display: grid; grid-template-columns: minmax(78px, .32fr) minmax(0, 1fr); gap: 8px; padding: 7px !important; border: 0 !important; }
    .sc-notifications-table td::before { content: attr(data-label); color: var(--sc-muted); font-size: 11px; font-weight: 800; }
    .sc-notification-rich--compact { min-width: 0; max-width: 100%; }
}

@media (max-width: 480px) {
    .sc-push-guest-prompt { align-items: stretch; flex-direction: column; }
    .sc-push-guest-prompt .sc-btn { width: 100%; }
    .sc-developer-page__logo { max-width: 62vw; }
    .sc-developer-page__whatsapp { width: min(100%, 280px); }
}
/* Customer API page - uses the existing security cards and storefront tokens. */
.sc-api-page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.sc-api-page { width: min(100%, 920px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-inline: auto; }
.sc-api-card { min-width: 0; }
.sc-api-help { grid-column: 1 / -1; }
.sc-api-token-once { display: grid; gap: 7px; padding: 11px; border: 1px solid var(--sc-success-border); border-radius: var(--sc-radius-md); background: var(--sc-success-bg); }
.sc-api-token-once > strong { color: var(--sc-success-text); font-size: 13px; }
.sc-api-token-once > small { color: var(--sc-muted); font-size: 11px; }
.sc-api-token-row { display: flex; align-items: center; gap: 8px; min-width: 0; }
.sc-api-token-row .sc-input { min-width: 0; direction: ltr; text-align: left; }
.sc-api-token-action { margin-top: 10px; }
.sc-api-security-warning { margin-top: 9px; border: 1px solid var(--sc-warning-border); background: var(--sc-warning-bg); color: var(--sc-warning-text); }
.sc-api-security-warning strong { color: inherit; }
.sc-api-toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; padding: 9px 11px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius-md); background: var(--sc-surface-2); cursor: pointer; }
.sc-api-toggle-row strong, .sc-api-toggle-row small { display: block; }
.sc-api-toggle-row strong { font-size: 13px; }
.sc-api-toggle-row small { margin-top: 3px; color: var(--sc-muted); font-size: 11px; }
.sc-api-switch { position: relative; flex: 0 0 38px; width: 38px; height: 22px; }
.sc-api-switch input { position: absolute; opacity: 0; pointer-events: none; }
.sc-api-switch i { position: absolute; inset: 0; border-radius: 999px; background: var(--sc-border-strong); transition: background .2s ease; }
.sc-api-switch i::after { content: ''; position: absolute; top: 3px; right: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(15,23,42,.2); transition: transform .2s ease; }
.sc-api-switch input:checked + i { background: var(--sc-primary); }
.sc-api-switch input:checked + i::after { transform: translateX(-16px); }
.sc-api-switch input:focus-visible + i { outline: 2px solid var(--sc-primary); outline-offset: 2px; }
.sc-api-textarea { min-height: 96px; resize: vertical; direction: ltr; text-align: left; }
.sc-api-help code { display: block; padding: 10px 12px; border-radius: var(--sc-radius-sm); background: var(--sc-surface-2); color: var(--sc-primary); overflow-wrap: anywhere; }
.sc-api-help p { color: var(--sc-muted); font-size: 12px; line-height: 1.8; }
@media (max-width: 720px) {
    .sc-api-page { grid-template-columns: 1fr; }
    .sc-api-help { grid-column: auto; }
    .sc-api-page-head { flex-direction: column; }
    .sc-api-token-row { align-items: stretch; flex-direction: column; }
    .sc-api-token-row .sc-btn { width: 100%; min-height: 44px; }
}
.sc-api-docs-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.sc-api-docs-head > code { max-width: 100%; padding: 8px 10px; border-radius: var(--sc-radius-sm); background: var(--sc-surface-2); color: var(--sc-primary); overflow-wrap: anywhere; }
.sc-api-docs { width: min(100%, 1000px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-inline: auto; }
.sc-api-docs__section { min-width: 0; padding: 15px; }
.sc-api-docs__section h2 { margin: 0 0 8px; font-size: 15px; }
.sc-api-docs__section p { margin: 6px 0 0; color: var(--sc-muted); font-size: 12px; line-height: 1.8; }
.sc-api-docs__section pre { max-width: 100%; margin: 9px 0 0; padding: 11px; border-radius: var(--sc-radius-sm); background: var(--sc-surface-2); overflow: auto; direction: ltr; text-align: left; font-size: 11px; line-height: 1.65; }
.sc-api-endpoints { display: grid; gap: 6px; }
.sc-api-endpoints > div { display: grid; grid-template-columns: 44px minmax(180px, 1fr) minmax(120px, auto); align-items: center; gap: 7px; min-height: 35px; padding: 6px 8px; border: 1px solid var(--sc-border); border-radius: var(--sc-radius-sm); }
.sc-api-endpoints b { color: var(--sc-primary); font-size: 11px; }
.sc-api-endpoints code { overflow-wrap: anywhere; font-size: 11px; }
.sc-api-endpoints span { color: var(--sc-muted); direction: rtl; font-size: 10.5px; }
.sc-api-status-map, .sc-api-errors { display: flex; flex-wrap: wrap; gap: 7px; }
.sc-api-status-map code, .sc-api-errors code { padding: 6px 8px; border-radius: var(--sc-radius-sm); background: var(--sc-surface-2); font-size: 10.5px; }
@media (max-width: 760px) {
    .sc-api-docs { grid-template-columns: 1fr; }
    .sc-api-docs-head { flex-direction: column; }
    .sc-api-endpoints > div { grid-template-columns: 42px minmax(0, 1fr); }
    .sc-api-endpoints span { grid-column: 1 / -1; }
}
.sc-identity-page .sc-global-verified-mark {
    color: #2563eb;
    font-weight: 900;
}

.sc-identity-page .sc-global-supplement-mark {
    color: #b45309;
    font-weight: 900;
    cursor: help;
}

.sc-identity-page .sc-global-supplement-details {
    margin-top: 10px;
    padding: 9px 12px;
    border: 1px solid rgba(180, 83, 9, .3);
    border-radius: var(--sc-radius-sm, 10px);
}

.sc-identity-page .sc-global-supplement-details summary {
    cursor: pointer;
    font-weight: 800;
}

.sc-identity-page .sc-global-supplement-details p {
    margin: 8px 0 0;
}

.sc-identity-page .sc-identity-global-overview {
    padding: 14px;
    border: 1px solid color-mix(in srgb, var(--sc-primary) 28%, var(--sc-border));
    border-radius: var(--sc-radius);
    background: color-mix(in srgb, var(--sc-primary-bg) 60%, var(--sc-surface));
}

.sc-identity-page .sc-identity-method--global {
    width: 100%;
}

.sc-identity-page .sc-identity-state a {
    color: inherit;
    font-weight: 850;
    text-decoration: underline;
}
