/* ============================================================
   Store admin · Modo oscuro
   ------------------------------------------------------------
   Capa global del tema oscuro. Se apoya en los tokens --sa-* para
   que las pantallas existentes cambien sin duplicar estilos.
   ============================================================ */

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) {
    color-scheme: dark;

    --sa-primary-rgb: 96, 134, 255;
    --sa-primary: rgb(var(--sa-primary-rgb));
    --sa-primary-fg: #ffffff;

    --sa-bg: #080b12;
    --sa-surface: #101622;
    --sa-surface-muted: #151d2b;
    --sa-surface-hover: #1b2535;

    --sa-border: #263244;
    --sa-border-strong: #3a485d;

    --sa-text: #f5f7fb;
    --sa-text-soft: #d7dee9;
    --sa-muted: #96a3b7;

    --sa-danger: #f87171;
    --sa-danger-hover: #ef4444;
    --sa-success: #4ade80;
    --sa-warning: #fbbf24;

    --sa-focus-ring: 0 0 0 3px rgba(var(--sa-primary-rgb), 0.22);

    --app-text-muted: var(--sa-muted);
    --store-admin-table-border: var(--sa-border);
    --bs-body-bg: var(--sa-bg);
    --bs-body-color: var(--sa-text);
    --bs-border-color: var(--sa-border);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) ::selection {
    background: rgba(var(--sa-primary-rgb), 0.34);
    color: var(--sa-text);
}

body.page-store-admin-app .site-brand-logo--dark {
    display: none;
}

body.page-store-admin-app .site-brand-logo--light {
    display: block;
}

html.store-admin-theme-dark body.page-store-admin-app .site-brand-logo--dark,
body.page-store-admin-app.store-admin-theme-dark .site-brand-logo--dark {
    display: block;
}

html.store-admin-theme-dark body.page-store-admin-app .site-brand-logo--light,
body.page-store-admin-app.store-admin-theme-dark .site-brand-logo--light {
    display: none;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-sidebar__theme-toggle.is-active {
    background: rgba(var(--sa-primary-rgb), 0.14);
    border-color: rgba(var(--sa-primary-rgb), 0.25);
    color: var(--sa-primary);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-modal__backdrop {
    background: rgba(0, 0, 0, 0.68);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-modal__dialog {
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.58);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-input::placeholder,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-textarea::placeholder,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-search-input > input::placeholder {
    color: #66758d;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-select {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2396a3b7'%3e%3cpath fill-rule='evenodd' d='M5.23 7.21a.75.75 0 0 1 1.06.02L10 11.06l3.71-3.83a.75.75 0 1 1 1.08 1.04l-4.25 4.39a.75.75 0 0 1-1.08 0L5.21 8.27a.75.75 0 0 1 .02-1.06Z' clip-rule='evenodd'/%3e%3c/svg%3e");
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-help.is-warning {
    border-color: rgba(251, 191, 36, 0.28);
    background: rgba(251, 191, 36, 0.10);
    color: #fde68a;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-badge--warning {
    background: rgba(251, 191, 36, 0.13);
    color: #fde68a;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-table tbody tr.sa-table-row--superadmin-only,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-superadmin-only,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-superadmin-only.sa-accordion {
    border-color: rgba(251, 146, 60, 0.38);
    background: rgba(251, 146, 60, 0.08);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-table tbody tr.sa-table-row--superadmin-only:hover {
    background: rgba(251, 146, 60, 0.11);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-switch__slider {
    background: #39465a;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-switch__slider::after {
    background: #f8fafc;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-private-blur {
    filter: blur(3.5px) brightness(1.35);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-products-table tr.is-plan-locked:hover > td,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-marketing-preview {
    background: var(--sa-surface-muted);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-marketing-automation-metric-card.is-revenue,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-marketing-step-message.is-success,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-product-box__status-badge.is-complete {
    border-color: rgba(74, 222, 128, 0.28);
    background: rgba(74, 222, 128, 0.10);
    color: #bbf7d0;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-marketing-step-message.is-error {
    border-color: rgba(248, 113, 113, 0.28);
    background: rgba(248, 113, 113, 0.10);
    color: #fecaca;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-plan-receipt__tag,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-plan-impact-list i,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-domain-callout--warning .sa-domain-callout__icon,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-domain-callout--warning .sa-domain-callout__copy strong,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-domain-callout--warning .sa-domain-callout__copy p {
    color: #fde68a;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-domain-callout--warning .sa-domain-callout__icon,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-plan-receipt__tag {
    background: rgba(251, 191, 36, 0.12);
}

/* ------------------------------------------------------------
   Estadísticas: la pantalla usa fondos blancos y tinta oscura
   hardcodeados, así que se remapean acá para el modo oscuro.
   ------------------------------------------------------------ */
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-page {
    --sa-stats-ink: var(--sa-text);
    --sa-stats-shadow: 0 12px 32px rgba(0, 0, 0, 0.34);
    --sa-stats-shadow-lg: 0 24px 48px rgba(0, 0, 0, 0.46);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-hero,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-kpi,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-card,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-list-row,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-product-table article {
    background: var(--sa-surface);
    border-color: var(--sa-border);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-hero__feature {
    background: var(--sa-surface-muted);
    border-color: var(--sa-border);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-range__form {
    background: var(--sa-surface);
    border-color: var(--sa-border);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-eyebrow--soft,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-presets,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-range > summary {
    background: var(--sa-surface-muted);
    border-color: var(--sa-border);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-preset.is-active {
    background: var(--sa-primary);
    color: var(--sa-primary-fg);
    box-shadow: none;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-delta,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-delta.is-flat,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-funnel__shape,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-status-list li,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-breakdown__icon,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-list-row i,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-product-table span,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-devices__legend li {
    background: rgba(255, 255, 255, 0.06);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-funnel__step:hover,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-breakdown li:hover {
    background: rgba(255, 255, 255, 0.05);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-delta.is-up,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-product-table span.is-sold,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-funnel__meta em {
    color: #86efac;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-delta.is-down {
    color: #fca5a5;
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-delta.is-flat,
:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-funnel__bar.is-empty {
    color: var(--sa-muted);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-funnel__bar.is-empty {
    background: rgba(255, 255, 255, 0.10);
}

:where(html.store-admin-theme-dark body.page-store-admin-app, body.page-store-admin-app.store-admin-theme-dark) .sa-stats-dot--ink {
    background: #e2e8f0;
}