:root {
    color-scheme: light;
    --ys-app-bg: #f8fafc;
    --ys-app-bg-2: #eff6ff;
    --ys-surface: #ffffff;
    --ys-surface-soft: #f8fafc;
    --ys-surface-muted: #f1f5f9;
    --ys-border: #e2e8f0;
    --ys-border-soft: #edf2f7;
    --ys-text: #0f172a;
    --ys-text-2: #334155;
    --ys-muted: #64748b;
    --ys-muted-2: #94a3b8;
    --ys-shadow: rgba(15, 23, 42, .08);
    --ys-accent: #0ea5e9;
    --ys-accent-2: #6366f1;
}

html[data-theme="dark"] {
    color-scheme: dark;
    --ys-app-bg: #020617;
    --ys-app-bg-2: #07111f;
    --ys-surface: #0f172a;
    --ys-surface-soft: #111827;
    --ys-surface-muted: #1e293b;
    --ys-border: #263244;
    --ys-border-soft: rgba(148, 163, 184, .14);
    --ys-text: #e5edf8;
    --ys-text-2: #cbd5e1;
    --ys-muted: #94a3b8;
    --ys-muted-2: #64748b;
    --ys-shadow: rgba(0, 0, 0, .34);
    --ys-accent: #38bdf8;
    --ys-accent-2: #818cf8;
}

html[data-theme="dark"] body:not(.page-sales) {
    background:
        radial-gradient(circle at 18% 0%, rgba(14, 165, 233, .10), transparent 28rem),
        radial-gradient(circle at 88% 8%, rgba(99, 102, 241, .12), transparent 28rem),
        linear-gradient(135deg, var(--ys-app-bg), var(--ys-app-bg-2)) !important;
    color: var(--ys-text);
}

html[data-theme="dark"] .app-content-shell,
html[data-theme="dark"] .app-mobile-shell,
html[data-theme="dark"] .app-mobile-content {
    color: var(--ys-text);
}

html[data-theme="dark"] .app-mobile-header-card {
    border-color: rgba(148, 163, 184, .20) !important;
    background: rgba(15, 23, 42, .78) !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .22);
}

html[data-theme="dark"] #mobileSidebarOpen,
html[data-theme="dark"] #mobileSidebarClose,
html[data-theme="dark"] .ys-theme-toggle {
    border-color: rgba(148, 163, 184, .20) !important;
    background: rgba(15, 23, 42, .78) !important;
    color: var(--ys-text-2) !important;
}

html[data-theme="dark"] .app-mobile-header-greeting {
    color: var(--ys-text-2) !important;
}

html[data-theme="dark"] .app-mobile-header-greeting .text-indigo-700 {
    color: #93c5fd !important;
}

html[data-theme="dark"] .app-mobile-header-context {
    color: #64748b !important;
}

html[data-theme="dark"] #mobileSidebar,
html[data-theme="dark"] .app-desktop-sidebar {
    border-color: rgba(148, 163, 184, .28) !important;
    background: #111827 !important;
    box-shadow: 4px 0 24px rgba(0, 0, 0, .35);
}

html[data-theme="dark"] [data-sidebar-root] .bg-sky-50,
html[data-theme="dark"] [data-sidebar-root] .bg-slate-100 {
    background: rgba(14, 165, 233, .16) !important;
    color: #e0f2fe !important;
}

html[data-theme="dark"] [data-sidebar-root] .text-sky-900,
html[data-theme="dark"] [data-sidebar-root] .text-slate-900 {
    color: #e0f2fe !important;
}

html[data-theme="dark"] [data-sidebar-root] .ring-sky-100 {
    --tw-ring-color: rgba(56, 189, 248, .22) !important;
    --tw-ring-shadow: 0 0 #0000 !important;
}

.ys-theme-toggle {
    display: inline-flex;
    height: 2.5rem;
    width: 2.5rem;
    align-items: center;
    justify-content: center;
    border: 1px solid #e2e8f0;
    border-radius: .9rem;
    background: rgba(255, 255, 255, .92);
    color: #64748b;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .06);
    transition: border-color .16s ease, color .16s ease, background .16s ease, transform .16s ease;
}

.ys-theme-toggle:hover {
    transform: translateY(-1px);
    border-color: #bae6fd;
    color: #0369a1;
}

html[data-theme="dark"] .ys-theme-toggle:hover {
    border-color: rgba(56, 189, 248, .35) !important;
    color: #bae6fd !important;
}

.auth-page-host {
    --auth-panel-bg:
        radial-gradient(circle at 26% 82%, rgba(14, 165, 233, .14), transparent 22rem),
        linear-gradient(180deg, #ffffff 0%, #f8fbff 48%, #edf9ff 100%);
    --auth-ambient-a: rgba(79, 70, 229, .22);
    --auth-ambient-b: rgba(14, 165, 233, .28);
    --auth-ambient-c: rgba(34, 211, 238, .16);
    --auth-ambient-opacity: .72;
    --auth-sheen-opacity: .42;
    min-height: 100vh;
    color-scheme: light;
}

.auth-theme-toggle {
    position: fixed;
    top: 1.25rem;
    right: 1.25rem;
    z-index: 80;
    border-radius: 999px;
    backdrop-filter: blur(14px);
}

html[data-theme="dark"] .auth-page-host {
    --auth-panel-bg:
        linear-gradient(180deg, rgba(15, 23, 42, .72), rgba(2, 6, 23, .94)),
        radial-gradient(circle at 35% 76%, rgba(14, 165, 233, .16), transparent 24rem);
    --auth-ambient-a: rgba(99, 102, 241, .30);
    --auth-ambient-b: rgba(56, 189, 248, .26);
    --auth-ambient-c: rgba(34, 211, 238, .16);
    --auth-ambient-opacity: .62;
    --auth-sheen-opacity: .34;
    color-scheme: dark;
    background:
        radial-gradient(circle at 16% 74%, rgba(14, 165, 233, .16), transparent 28rem),
        radial-gradient(circle at 40% 18%, rgba(99, 102, 241, .18), transparent 30rem),
        linear-gradient(135deg, #020617 0%, #0b1220 46%, #030712 100%) !important;
}

html[data-theme="light"] .auth-page-host {
    --auth-panel-bg:
        radial-gradient(circle at 24% 82%, rgba(14, 165, 233, .16), transparent 23rem),
        radial-gradient(circle at 78% 16%, rgba(99, 102, 241, .08), transparent 21rem),
        linear-gradient(180deg, #ffffff 0%, #f8fbff 48%, #eef9ff 100%);
    --auth-ambient-opacity: .76;
    --auth-sheen-opacity: .44;
    color-scheme: light;
}

.auth-page-host section:first-of-type:not(.login-form-panel) {
    position: relative;
    isolation: isolate;
    background: var(--auth-panel-bg) !important;
}

.auth-page-host section:first-of-type:not(.login-form-panel) > * {
    position: relative;
    z-index: 1;
}

.auth-page-host section:first-of-type:not(.login-form-panel)::before,
.auth-page-host section:first-of-type:not(.login-form-panel)::after {
    content: "";
    position: absolute;
    pointer-events: none;
    border-radius: 999px;
    z-index: 0;
}

.auth-page-host section:first-of-type:not(.login-form-panel)::before {
    left: -16%;
    right: -10%;
    bottom: 3%;
    height: 42%;
    opacity: var(--auth-ambient-opacity);
    background:
        radial-gradient(circle at 28% 50%, var(--auth-ambient-a), transparent 34%),
        radial-gradient(circle at 76% 46%, var(--auth-ambient-b), transparent 36%),
        radial-gradient(circle at 55% 74%, var(--auth-ambient-c), transparent 32%);
    filter: blur(26px) saturate(1.15);
    transform: translate3d(-3%, 0, 0) scale(1.02);
    animation: auth-ambient-drift 11s ease-in-out infinite alternate;
}

.auth-page-host section:first-of-type:not(.login-form-panel)::after {
    left: 14%;
    right: 14%;
    bottom: 13%;
    height: 18%;
    opacity: var(--auth-sheen-opacity);
    background: linear-gradient(100deg, rgba(79, 70, 229, .16), rgba(14, 165, 233, .30), rgba(34, 211, 238, .18));
    filter: blur(18px);
    transform: translate3d(0, 0, 0) scaleX(.9);
    animation: auth-ambient-sheen 7.5s ease-in-out infinite alternate;
}

html[data-theme="dark"] .auth-page-host .login-shell,
html[data-theme="dark"] .auth-page-host > [class*="h-screen"][class*="w-screen"],
html[data-theme="dark"] .auth-page-host .login-form-panel {
    background:
        radial-gradient(circle at 18% 72%, rgba(14, 165, 233, .18), transparent 25rem),
        radial-gradient(circle at 72% 18%, rgba(99, 102, 241, .16), transparent 28rem),
        linear-gradient(145deg, #020617 0%, #0b1220 52%, #030712 100%) !important;
    color: #e5edf8 !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type {
    background:
        linear-gradient(180deg, rgba(15, 23, 42, .72), rgba(2, 6, 23, .94)),
        radial-gradient(circle at 35% 76%, rgba(14, 165, 233, .16), transparent 24rem) !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type .text-slate-950,
html[data-theme="dark"] .auth-page-host section:first-of-type .text-slate-900,
html[data-theme="dark"] .auth-page-host section:first-of-type .text-slate-800 {
    color: #eef6ff !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type .text-slate-700,
html[data-theme="dark"] .auth-page-host section:first-of-type .text-slate-600,
html[data-theme="dark"] .auth-page-host section:first-of-type .text-slate-500 {
    color: #aebcd0 !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type .text-slate-400 {
    color: #7f8ea4 !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type .border-slate-100,
html[data-theme="dark"] .auth-page-host section:first-of-type .border-slate-200,
html[data-theme="dark"] .auth-page-host section:first-of-type .border-slate-300 {
    border-color: rgba(148, 163, 184, .22) !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type .bg-white,
html[data-theme="dark"] .auth-page-host section:first-of-type .bg-slate-50,
html[data-theme="dark"] .auth-page-host section:first-of-type .bg-slate-50\/70 {
    background-color: rgba(15, 23, 42, .72) !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type .border-l-2 {
    border-color: #38bdf8 !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
html[data-theme="dark"] .auth-page-host section:first-of-type select,
html[data-theme="dark"] .auth-page-host section:first-of-type textarea {
    border-color: rgba(148, 163, 184, .24) !important;
    background: rgba(15, 23, 42, .82) !important;
    color: #eef6ff !important;
    -webkit-text-fill-color: #eef6ff !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}

html[data-theme="dark"] .auth-page-host section:first-of-type input:not([type="checkbox"]):not([type="radio"]):focus,
html[data-theme="dark"] .auth-page-host section:first-of-type select:focus,
html[data-theme="dark"] .auth-page-host section:first-of-type textarea:focus {
    border-color: rgba(56, 189, 248, .72) !important;
    background: rgba(15, 23, 42, .96) !important;
    box-shadow: 0 0 0 .25rem rgba(56, 189, 248, .14), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type input::placeholder,
html[data-theme="dark"] .auth-page-host section:first-of-type textarea::placeholder {
    color: #718096 !important;
    -webkit-text-fill-color: #718096 !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type input:disabled {
    border-color: rgba(148, 163, 184, .18) !important;
    background: rgba(15, 23, 42, .50) !important;
    color: #94a3b8 !important;
    -webkit-text-fill-color: #94a3b8 !important;
}

html[data-theme="dark"] .auth-page-host section:first-of-type input:-webkit-autofill,
html[data-theme="dark"] .auth-page-host section:first-of-type input:-webkit-autofill:hover,
html[data-theme="dark"] .auth-page-host section:first-of-type input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px rgba(15, 23, 42, .95) inset !important;
    -webkit-text-fill-color: #eef6ff !important;
    caret-color: #eef6ff !important;
}

html[data-theme="light"] .auth-page-host section:first-of-type input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
html[data-theme="light"] .auth-page-host section:first-of-type select,
html[data-theme="light"] .auth-page-host section:first-of-type textarea {
    border-color: #e2e8f0 !important;
    background: #ffffff !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
}

html[data-theme="light"] .auth-page-host section:first-of-type input:disabled {
    background: #f8fafc !important;
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
}

html[data-theme="light"] .auth-page-host section:first-of-type input:-webkit-autofill,
html[data-theme="light"] .auth-page-host section:first-of-type input:-webkit-autofill:hover,
html[data-theme="light"] .auth-page-host section:first-of-type input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    -webkit-text-fill-color: #0f172a !important;
    caret-color: #0f172a !important;
}

html[data-theme="dark"] .auth-page-host .remember-me__box {
    border-color: rgba(148, 163, 184, .32) !important;
    background: rgba(15, 23, 42, .80) !important;
}

html[data-theme="dark"] .auth-page-host [data-pw-toggle]:hover {
    background: rgba(148, 163, 184, .10) !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .auth-page-host .bg-emerald-50 {
    background-color: rgba(16, 185, 129, .12) !important;
}

html[data-theme="dark"] .auth-page-host .bg-rose-50 {
    background-color: rgba(244, 63, 94, .12) !important;
}

@media (prefers-reduced-motion: reduce) {
    .auth-page-host section:first-of-type:not(.login-form-panel)::before,
    .auth-page-host section:first-of-type:not(.login-form-panel)::after {
        animation: none !important;
    }
}

@keyframes auth-ambient-drift {
    0% {
        transform: translate3d(-4%, -2%, 0) scale(1.02) rotate(-2deg);
    }
    45% {
        transform: translate3d(4%, 3%, 0) scale(1.10) rotate(2deg);
    }
    100% {
        transform: translate3d(1%, -1%, 0) scale(1.05) rotate(-1deg);
    }
}

@keyframes auth-ambient-sheen {
    0% {
        transform: translate3d(-8%, 2%, 0) scaleX(.88);
    }
    50% {
        transform: translate3d(4%, -5%, 0) scaleX(1.08);
    }
    100% {
        transform: translate3d(9%, 1%, 0) scaleX(.96);
    }
}

@media (max-width: 767.98px) {
    .auth-theme-toggle {
        top: .875rem;
        right: .875rem;
        height: 2.35rem;
        width: 2.35rem;
    }
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-toggle] {
    border-color: rgba(56, 189, 248, .22) !important;
    background:
        linear-gradient(135deg, rgba(14, 165, 233, .10), rgba(99, 102, 241, .07)),
        rgba(15, 23, 42, .82) !important;
    color: var(--ys-text) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 12px 24px rgba(0, 0, 0, .18);
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-toggle]:hover,
html[data-theme="dark"] [data-sidebar-branch] [data-branch-toggle][aria-expanded="true"] {
    border-color: rgba(56, 189, 248, .36) !important;
    background:
        linear-gradient(135deg, rgba(14, 165, 233, .15), rgba(99, 102, 241, .10)),
        rgba(15, 23, 42, .96) !important;
    box-shadow: 0 0 0 .14rem rgba(56, 189, 248, .10), 0 16px 30px rgba(0, 0, 0, .22);
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-toggle] .text-sky-700 {
    color: #7dd3fc !important;
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-toggle] .text-slate-900 {
    color: var(--ys-text) !important;
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-panel] {
    border-color: rgba(56, 189, 248, .22) !important;
    background: rgba(15, 23, 42, .98) !important;
    box-shadow: 0 22px 48px rgba(0, 0, 0, .34);
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-panel] .text-slate-500 {
    color: var(--ys-muted) !important;
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-panel] .text-slate-700,
html[data-theme="dark"] [data-sidebar-branch] [data-branch-panel] button {
    color: var(--ys-text-2) !important;
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-panel] button:hover {
    background: rgba(148, 163, 184, .09) !important;
    color: var(--ys-text) !important;
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-panel] .bg-sky-100,
html[data-theme="dark"] [data-sidebar-branch] [data-branch-panel] button.bg-sky-100 {
    background: linear-gradient(90deg, rgba(14, 165, 233, .18), rgba(99, 102, 241, .12)) !important;
    color: #bae6fd !important;
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-panel] a {
    border-color: rgba(56, 189, 248, .22) !important;
    color: #7dd3fc !important;
}

html[data-theme="dark"] [data-sidebar-branch] [data-branch-panel] a:hover {
    background: rgba(14, 165, 233, .10) !important;
}

.sidebar-branch-static {
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    border-radius: 8px;
    padding: .45rem .65rem;
}

.sidebar-branch-static-kicker {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #6b7280;
}

.sidebar-branch-static-kicker i {
    color: #9ca3af;
    font-size: 9px;
}

.sidebar-branch-static-label {
    color: #9ca3af;
    font-size: 9px;
    font-weight: 650;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.sidebar-branch-static-value {
    margin-top: 2px;
    overflow: hidden;
    color: #111827;
    font-size: 12px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: "IBM Plex Sans", "Source Sans 3", "Segoe UI", system-ui, sans-serif;
}

html[data-theme="dark"] .sidebar-branch-static {
    border-color: rgba(148, 163, 184, .16);
    background: rgba(15, 23, 42, .55);
}

html[data-theme="dark"] .sidebar-branch-static-label {
    color: var(--ys-muted);
}

html[data-theme="dark"] .sidebar-branch-static-value {
    color: var(--ys-text);
}

/* Standard app pages: dark compatibility layer for Tailwind-heavy Razor views. */
html[data-theme="dark"] #app-content {
    color: var(--ys-text);
}

html[data-theme="dark"] #app-content .bg-white,
html[data-theme="dark"] #app-content .bg-white\/90,
html[data-theme="dark"] #app-content .bg-white\/80,
html[data-theme="dark"] #app-content .bg-white\/70,
html[data-theme="dark"] #app-content .bg-white\/60,
html[data-theme="dark"] #app-content .modal-content,
html[data-theme="dark"] #app-content .dropdown-menu,
html[data-theme="dark"] #app-content .et-grid-shell {
    background: rgba(15, 23, 42, .86) !important;
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .bg-gradient-to-br.from-white,
html[data-theme="dark"] #app-content .bg-gradient-to-br.via-white,
html[data-theme="dark"] #app-content .bg-gradient-to-br.to-slate-50,
html[data-theme="dark"] #app-content .bg-gradient-to-r.from-white,
html[data-theme="dark"] #app-content .bg-gradient-to-r.via-white,
html[data-theme="dark"] #app-content .bg-gradient-to-r.to-slate-50,
html[data-theme="dark"] #app-content .bg-gradient-to-r.from-slate-100\/90,
html[data-theme="dark"] #app-content .bg-gradient-to-r.to-slate-50\/90,
html[data-theme="dark"] #app-content .bg-gradient-to-b.from-white,
html[data-theme="dark"] #app-content .bg-gradient-to-b.via-white,
html[data-theme="dark"] #app-content .bg-gradient-to-b.to-slate-50 {
    background:
        radial-gradient(circle at 0% 0%, rgba(56, 189, 248, .08), transparent 26rem),
        linear-gradient(135deg, rgba(15, 23, 42, .92), rgba(17, 24, 39, .82)) !important;
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .bg-slate-50,
html[data-theme="dark"] #app-content .bg-slate-50\/50,
html[data-theme="dark"] #app-content .bg-slate-50\/70,
html[data-theme="dark"] #app-content .bg-slate-50\/80,
html[data-theme="dark"] #app-content .bg-slate-100,
html[data-theme="dark"] #app-content .bg-slate-100\/90,
html[data-theme="dark"] #app-content .bg-slate-100\/95,
html[data-theme="dark"] #app-content .bg-gray-50,
html[data-theme="dark"] #app-content .bg-gray-100,
html[data-theme="dark"] #app-content .to-slate-50,
html[data-theme="dark"] #app-content .to-slate-50\/90,
html[data-theme="dark"] #app-content .to-slate-50\/80,
html[data-theme="dark"] #app-content .modal-body {
    background: rgba(30, 41, 59, .74) !important;
    color: var(--ys-text-2) !important;
}

html[data-theme="dark"] #app-content .border-slate-100,
html[data-theme="dark"] #app-content .border-slate-200,
html[data-theme="dark"] #app-content .border-white\/80,
html[data-theme="dark"] #app-content .border-white\/70,
html[data-theme="dark"] #app-content .border-white\/60,
html[data-theme="dark"] #app-content .border-gray-100,
html[data-theme="dark"] #app-content .border-gray-200,
html[data-theme="dark"] #app-content .divide-slate-100 > :not([hidden]) ~ :not([hidden]),
html[data-theme="dark"] #app-content .divide-slate-200 > :not([hidden]) ~ :not([hidden]),
html[data-theme="dark"] #app-content .ring-slate-200,
html[data-theme="dark"] #app-content .ring-slate-200\/60 {
    border-color: rgba(148, 163, 184, .18) !important;
    --tw-divide-opacity: 1;
    --tw-ring-color: rgba(148, 163, 184, .22) !important;
}

html[data-theme="dark"] #app-content .shadow-sm,
html[data-theme="dark"] #app-content .shadow-md,
html[data-theme="dark"] #app-content .shadow-lg,
html[data-theme="dark"] #app-content .shadow-xl,
html[data-theme="dark"] #app-content .shadow-2xl {
    box-shadow: 0 18px 44px rgba(0, 0, 0, .22) !important;
}

html[data-theme="dark"] #app-content .text-slate-950,
html[data-theme="dark"] #app-content .text-slate-900,
html[data-theme="dark"] #app-content .text-gray-950,
html[data-theme="dark"] #app-content .text-gray-900 {
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .text-slate-800,
html[data-theme="dark"] #app-content .text-slate-700,
html[data-theme="dark"] #app-content .text-gray-800,
html[data-theme="dark"] #app-content .text-gray-700 {
    color: var(--ys-text-2) !important;
}

html[data-theme="dark"] #app-content .text-slate-600,
html[data-theme="dark"] #app-content .text-slate-500,
html[data-theme="dark"] #app-content .text-gray-600,
html[data-theme="dark"] #app-content .text-gray-500 {
    color: var(--ys-muted) !important;
}

html[data-theme="dark"] #app-content .text-slate-400,
html[data-theme="dark"] #app-content .text-gray-400 {
    color: #71819a !important;
}

html[data-theme="dark"] #app-content input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] #app-content select,
html[data-theme="dark"] #app-content textarea,
html[data-theme="dark"] #app-content .form-control,
html[data-theme="dark"] #app-content .form-select,
html[data-theme="dark"] #app-content [contenteditable="true"] {
    border-color: rgba(148, 163, 184, .22) !important;
    background: rgba(2, 6, 23, .42) !important;
    color: var(--ys-text) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}

html[data-theme="dark"] #app-content input::placeholder,
html[data-theme="dark"] #app-content textarea::placeholder {
    color: #64748b !important;
}

html[data-theme="dark"] #app-content input:focus,
html[data-theme="dark"] #app-content select:focus,
html[data-theme="dark"] #app-content textarea:focus,
html[data-theme="dark"] #app-content .form-control:focus,
html[data-theme="dark"] #app-content .form-select:focus {
    border-color: rgba(56, 189, 248, .58) !important;
    background: rgba(15, 23, 42, .92) !important;
    box-shadow: 0 0 0 .22rem rgba(56, 189, 248, .13) !important;
}

html[data-theme="dark"] #app-content input[type="date"]::-webkit-calendar-picker-indicator,
html[data-theme="dark"] #app-content input[type="time"]::-webkit-calendar-picker-indicator,
html[data-theme="dark"] #app-content input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    filter: invert(1) opacity(.72);
}

html[data-theme="dark"] #app-content table {
    color: var(--ys-text-2);
}

html[data-theme="dark"] #app-content thead,
html[data-theme="dark"] #app-content thead tr,
html[data-theme="dark"] #app-content tr.bg-slate-50,
html[data-theme="dark"] #app-content tr.bg-slate-50\/70 {
    background: rgba(15, 23, 42, .96) !important;
}

html[data-theme="dark"] #app-content tbody,
html[data-theme="dark"] #app-content tbody tr,
html[data-theme="dark"] #app-content .odd\:bg-white:nth-child(odd),
html[data-theme="dark"] #app-content .even\:bg-slate-50\/50:nth-child(even) {
    border-color: rgba(148, 163, 184, .12) !important;
    background: rgba(15, 23, 42, .60) !important;
}

html[data-theme="dark"] #app-content tbody tr:hover,
html[data-theme="dark"] #app-content .hover\:bg-slate-50:hover,
html[data-theme="dark"] #app-content .hover\:bg-slate-50\/70:hover,
html[data-theme="dark"] #app-content .hover\:bg-slate-50\/50:hover,
html[data-theme="dark"] #app-content .hover\:bg-gray-50:hover,
html[data-theme="dark"] #app-content .hover\:bg-sky-50\/40:hover,
html[data-theme="dark"] #app-content .hover\:bg-lime-50\/40:hover,
html[data-theme="dark"] #app-content .hover\:bg-lime-50\/60:hover {
    background: rgba(56, 189, 248, .07) !important;
}

html[data-theme="dark"] #app-content .hover\:text-slate-900:hover,
html[data-theme="dark"] #app-content .hover\:text-slate-950:hover {
    color: #f8fafc !important;
}

html[data-theme="dark"] #app-content a.border-slate-200,
html[data-theme="dark"] #app-content button.border-slate-200,
html[data-theme="dark"] #app-content .btn,
html[data-theme="dark"] #app-content .btn-light {
    border-color: rgba(148, 163, 184, .22) !important;
}

html[data-theme="dark"] #app-content a.bg-white:hover,
html[data-theme="dark"] #app-content button.bg-white:hover,
html[data-theme="dark"] #app-content .btn-light:hover {
    background: rgba(30, 41, 59, .94) !important;
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content kbd,
html[data-theme="dark"] #app-content code {
    border-color: rgba(148, 163, 184, .18) !important;
    background: rgba(2, 6, 23, .46) !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] #app-content .modal-header,
html[data-theme="dark"] #app-content .modal-footer {
    border-color: rgba(148, 163, 184, .16) !important;
}

html[data-theme="dark"] #app-content .modal-backdrop,
html[data-theme="dark"] .modal-backdrop {
    background-color: #020617 !important;
}

html[data-theme="dark"] #app-content iframe.bg-white {
    background: #ffffff !important;
}

html[data-theme="dark"] #app-content .bg-indigo-50 {
    background: rgba(99, 102, 241, .14) !important;
}

html[data-theme="dark"] #app-content .bg-sky-50 {
    background: rgba(14, 165, 233, .12) !important;
}

html[data-theme="dark"] #app-content .bg-emerald-50 {
    background: rgba(16, 185, 129, .12) !important;
}

html[data-theme="dark"] #app-content .bg-violet-50 {
    background: rgba(139, 92, 246, .13) !important;
}

html[data-theme="dark"] #app-content .bg-amber-50 {
    background: rgba(245, 158, 11, .13) !important;
}

html[data-theme="dark"] #app-content .bg-rose-50 {
    background: rgba(244, 63, 94, .13) !important;
}

html[data-theme="dark"] #app-content .text-indigo-700,
html[data-theme="dark"] #app-content .text-indigo-600 {
    color: #a5b4fc !important;
}

html[data-theme="dark"] #app-content .text-sky-700,
html[data-theme="dark"] #app-content .text-sky-600 {
    color: #7dd3fc !important;
}

html[data-theme="dark"] #app-content .text-emerald-800,
html[data-theme="dark"] #app-content .text-emerald-700,
html[data-theme="dark"] #app-content .text-emerald-600 {
    color: #6ee7b7 !important;
}

html[data-theme="dark"] #app-content .text-violet-700,
html[data-theme="dark"] #app-content .text-violet-600 {
    color: #c4b5fd !important;
}

html[data-theme="dark"] #app-content .text-amber-900,
html[data-theme="dark"] #app-content .text-amber-800,
html[data-theme="dark"] #app-content .text-amber-700 {
    color: #fcd34d !important;
}

html[data-theme="dark"] #app-content .text-rose-800,
html[data-theme="dark"] #app-content .text-rose-700,
html[data-theme="dark"] #app-content .text-rose-600 {
    color: #fda4af !important;
}

html[data-theme="dark"] #app-content .border-dashed {
    border-color: rgba(148, 163, 184, .28) !important;
}

html[data-theme="dark"] #app-content .ag-root-wrapper,
html[data-theme="dark"] #app-content .ag-theme-alpine,
html[data-theme="dark"] #app-content .ag-theme-quartz,
html[data-theme="dark"] #app-content .tabulator {
    --ag-background-color: rgba(15, 23, 42, .86);
    --ag-foreground-color: var(--ys-text-2);
    --ag-border-color: rgba(148, 163, 184, .18);
    --ag-header-background-color: rgba(15, 23, 42, .96);
    --ag-odd-row-background-color: rgba(2, 6, 23, .22);
    --ag-row-hover-color: rgba(56, 189, 248, .08);
    border-color: rgba(148, 163, 184, .18) !important;
    background: rgba(15, 23, 42, .86) !important;
    color: var(--ys-text-2) !important;
}

html[data-theme="dark"] #app-content .tabulator-header,
html[data-theme="dark"] #app-content .tabulator .tabulator-header,
html[data-theme="dark"] #app-content .tabulator-col {
    border-color: rgba(148, 163, 184, .18) !important;
    background: rgba(15, 23, 42, .96) !important;
    color: var(--ys-muted) !important;
}

html[data-theme="dark"] #app-content .tabulator-row,
html[data-theme="dark"] #app-content .tabulator-row.tabulator-row-even,
html[data-theme="dark"] #app-content .tabulator-row.tabulator-row-odd {
    border-color: rgba(148, 163, 184, .12) !important;
    background: rgba(15, 23, 42, .70) !important;
    color: var(--ys-text-2) !important;
}

html[data-theme="dark"] #app-content .tabulator-row:hover {
    background: rgba(56, 189, 248, .08) !important;
}

/* Dark theme hardening: closes remaining light surfaces on Tailwind-heavy pages
   such as Kasa/YoneticiOzet, KasaGunSonu and Alis/Create. */
html[data-theme="dark"] #app-content .bg-white,
html[data-theme="dark"] #app-content .bg-white\/95,
html[data-theme="dark"] #app-content .bg-white\/90,
html[data-theme="dark"] #app-content .bg-white\/80,
html[data-theme="dark"] #app-content .bg-white\/75,
html[data-theme="dark"] #app-content .bg-white\/70,
html[data-theme="dark"] #app-content .bg-white\/60,
html[data-theme="dark"] #app-content .bg-white\/50,
html[data-theme="dark"] #app-content .bg-slate-50,
html[data-theme="dark"] #app-content .bg-slate-50\/95,
html[data-theme="dark"] #app-content .bg-slate-50\/90,
html[data-theme="dark"] #app-content .bg-slate-50\/80,
html[data-theme="dark"] #app-content .bg-slate-50\/75,
html[data-theme="dark"] #app-content .bg-slate-50\/70,
html[data-theme="dark"] #app-content .bg-slate-50\/60,
html[data-theme="dark"] #app-content .bg-slate-50\/50,
html[data-theme="dark"] #app-content .bg-slate-100,
html[data-theme="dark"] #app-content .bg-slate-100\/95,
html[data-theme="dark"] #app-content .bg-slate-100\/90,
html[data-theme="dark"] #app-content .bg-slate-100\/80,
html[data-theme="dark"] #app-content .bg-gray-50,
html[data-theme="dark"] #app-content .bg-gray-100 {
    background: rgba(15, 23, 42, .86) !important;
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .from-white,
html[data-theme="dark"] #app-content .from-slate-50,
html[data-theme="dark"] #app-content .from-slate-100,
html[data-theme="dark"] #app-content .from-sky-50,
html[data-theme="dark"] #app-content .from-emerald-50,
html[data-theme="dark"] #app-content .from-amber-50,
html[data-theme="dark"] #app-content .from-rose-50 {
    --tw-gradient-from: rgba(15, 23, 42, .96) var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgba(15, 23, 42, 0) var(--tw-gradient-to-position) !important;
}

html[data-theme="dark"] #app-content .via-white,
html[data-theme="dark"] #app-content .via-slate-50,
html[data-theme="dark"] #app-content .via-slate-100 {
    --tw-gradient-via: rgba(17, 24, 39, .90) var(--tw-gradient-via-position) !important;
}

html[data-theme="dark"] #app-content .to-white,
html[data-theme="dark"] #app-content .to-slate-50,
html[data-theme="dark"] #app-content .to-slate-100,
html[data-theme="dark"] #app-content .to-sky-50,
html[data-theme="dark"] #app-content .to-emerald-50,
html[data-theme="dark"] #app-content .to-amber-50,
html[data-theme="dark"] #app-content .to-rose-50 {
    --tw-gradient-to: rgba(2, 6, 23, .82) var(--tw-gradient-to-position) !important;
}

html[data-theme="dark"] #app-content .bg-sky-50,
html[data-theme="dark"] #app-content .bg-sky-50\/90,
html[data-theme="dark"] #app-content .bg-sky-50\/80,
html[data-theme="dark"] #app-content .bg-sky-50\/70,
html[data-theme="dark"] #app-content .bg-sky-100,
html[data-theme="dark"] #app-content .hover\:bg-sky-50:hover,
html[data-theme="dark"] #app-content .hover\:bg-sky-100:hover {
    background: rgba(14, 165, 233, .14) !important;
}

html[data-theme="dark"] #app-content .bg-emerald-50,
html[data-theme="dark"] #app-content .bg-emerald-50\/90,
html[data-theme="dark"] #app-content .bg-emerald-50\/80,
html[data-theme="dark"] #app-content .bg-emerald-50\/70,
html[data-theme="dark"] #app-content .bg-emerald-100,
html[data-theme="dark"] #app-content .hover\:bg-emerald-50:hover,
html[data-theme="dark"] #app-content .hover\:bg-emerald-100:hover {
    background: rgba(16, 185, 129, .14) !important;
}

html[data-theme="dark"] #app-content .bg-amber-50,
html[data-theme="dark"] #app-content .bg-amber-50\/90,
html[data-theme="dark"] #app-content .bg-amber-50\/80,
html[data-theme="dark"] #app-content .bg-amber-50\/70,
html[data-theme="dark"] #app-content .bg-amber-100,
html[data-theme="dark"] #app-content .hover\:bg-amber-50:hover,
html[data-theme="dark"] #app-content .hover\:bg-amber-100:hover {
    background: rgba(245, 158, 11, .15) !important;
}

html[data-theme="dark"] #app-content .bg-rose-50,
html[data-theme="dark"] #app-content .bg-rose-50\/90,
html[data-theme="dark"] #app-content .bg-rose-50\/80,
html[data-theme="dark"] #app-content .bg-rose-50\/70,
html[data-theme="dark"] #app-content .bg-rose-100,
html[data-theme="dark"] #app-content .hover\:bg-rose-50:hover,
html[data-theme="dark"] #app-content .hover\:bg-rose-100:hover {
    background: rgba(244, 63, 94, .14) !important;
}

html[data-theme="dark"] #app-content .bg-indigo-50,
html[data-theme="dark"] #app-content .bg-indigo-50\/90,
html[data-theme="dark"] #app-content .bg-indigo-50\/80,
html[data-theme="dark"] #app-content .bg-indigo-100,
html[data-theme="dark"] #app-content .bg-violet-50,
html[data-theme="dark"] #app-content .bg-violet-50\/90,
html[data-theme="dark"] #app-content .bg-violet-50\/80,
html[data-theme="dark"] #app-content .bg-violet-100 {
    background: rgba(99, 102, 241, .14) !important;
}

html[data-theme="dark"] #app-content .border-slate-50,
html[data-theme="dark"] #app-content .border-slate-100,
html[data-theme="dark"] #app-content .border-slate-200,
html[data-theme="dark"] #app-content .border-slate-300,
html[data-theme="dark"] #app-content .border-gray-100,
html[data-theme="dark"] #app-content .border-gray-200,
html[data-theme="dark"] #app-content .border-sky-100,
html[data-theme="dark"] #app-content .border-sky-200,
html[data-theme="dark"] #app-content .border-emerald-100,
html[data-theme="dark"] #app-content .border-emerald-200,
html[data-theme="dark"] #app-content .border-amber-100,
html[data-theme="dark"] #app-content .border-amber-200,
html[data-theme="dark"] #app-content .border-rose-100,
html[data-theme="dark"] #app-content .border-rose-200,
html[data-theme="dark"] #app-content .border-indigo-100,
html[data-theme="dark"] #app-content .border-indigo-200,
html[data-theme="dark"] #app-content .border-violet-100,
html[data-theme="dark"] #app-content .border-violet-200 {
    border-color: rgba(148, 163, 184, .20) !important;
}

html[data-theme="dark"] #app-content .divide-slate-100 > :not([hidden]) ~ :not([hidden]),
html[data-theme="dark"] #app-content .divide-slate-200 > :not([hidden]) ~ :not([hidden]),
html[data-theme="dark"] #app-content .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
html[data-theme="dark"] #app-content .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: rgba(148, 163, 184, .14) !important;
}

html[data-theme="dark"] #app-content .focus\:ring-sky-100:focus,
html[data-theme="dark"] #app-content .focus\:ring-sky-500\/10:focus,
html[data-theme="dark"] #app-content .focus\:ring-slate-900\/15:focus,
html[data-theme="dark"] #app-content .focus\:ring-indigo-500\/10:focus {
    --tw-ring-color: rgba(56, 189, 248, .18) !important;
    box-shadow: 0 0 0 .22rem rgba(56, 189, 248, .15) !important;
}

html[data-theme="dark"] #app-content .modal,
html[data-theme="dark"] #app-content .modal-content,
html[data-theme="dark"] #app-content .dropdown-menu,
html[data-theme="dark"] #app-content .popover {
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .btn-close {
    filter: invert(1) grayscale(1) opacity(.78);
}

html[data-theme="dark"] #app-content select option {
    background: #0f172a !important;
    color: #e5e7eb !important;
}

/* Purchase screen custom grid and lookup components. */
html[data-theme="dark"] #app-content .locked-overlay {
    background: rgba(2, 6, 23, .72) !important;
}

html[data-theme="dark"] #app-content .alis-combo-shell,
html[data-theme="dark"] #app-content .alis-suggest-panel,
html[data-theme="dark"] #app-content .alis-grid-shell,
html[data-theme="dark"] #app-content .alis-bottom-summary,
html[data-theme="dark"] #app-content .alis-total-item,
html[data-theme="dark"] #app-content .alis-payment-mini,
html[data-theme="dark"] #app-content .alis-odeme-line,
html[data-theme="dark"] #app-content .js-odeme-banka-wrap,
html[data-theme="dark"] #app-content .alis-payment-modal > div {
    border-color: rgba(148, 163, 184, .20) !important;
    background: rgba(15, 23, 42, .88) !important;
    color: var(--ys-text) !important;
    box-shadow: 0 22px 52px rgba(0, 0, 0, .28) !important;
}

html[data-theme="dark"] #app-content .alis-grid-scroll,
html[data-theme="dark"] #app-content .alis-grid-footer,
html[data-theme="dark"] #app-content .alis-suggest-search,
html[data-theme="dark"] #app-content .alis-suggest-head,
html[data-theme="dark"] #app-content .alis-price-table th,
html[data-theme="dark"] #app-content .alis-grid th,
html[data-theme="dark"] #app-content .alis-grid tr.is-empty td {
    border-color: rgba(148, 163, 184, .16) !important;
    background: rgba(2, 6, 23, .46) !important;
    color: var(--ys-muted) !important;
}

html[data-theme="dark"] #app-content .alis-grid td,
html[data-theme="dark"] #app-content .alis-price-table td,
html[data-theme="dark"] #app-content .alis-suggest-row,
html[data-theme="dark"] #app-content .alis-suggest-row span,
html[data-theme="dark"] #app-content .alis-suggest-panel .suggestion-item {
    border-color: rgba(148, 163, 184, .14) !important;
    background: rgba(15, 23, 42, .70) !important;
    color: var(--ys-text-2) !important;
}

html[data-theme="dark"] #app-content .alis-grid tr.is-active td,
html[data-theme="dark"] #app-content .alis-suggest-row:hover,
html[data-theme="dark"] #app-content .alis-suggest-panel .suggestion-item.is-active {
    background: rgba(14, 165, 233, .16) !important;
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .alis-grid input,
html[data-theme="dark"] #app-content .alis-grid select,
html[data-theme="dark"] #app-content .alis-price-table input,
html[data-theme="dark"] #app-content .alis-price-table select,
html[data-theme="dark"] #app-content .alis-suggest-search input {
    background: transparent !important;
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .alis-grid input:focus,
html[data-theme="dark"] #app-content .alis-grid select:focus,
html[data-theme="dark"] #app-content .alis-price-table input:focus,
html[data-theme="dark"] #app-content .alis-price-table select:focus {
    background: rgba(2, 132, 199, .18) !important;
    color: var(--ys-text) !important;
    box-shadow: inset 0 0 0 2px rgba(56, 189, 248, .72) !important;
}

html[data-theme="dark"] #app-content .alis-grid .grid-readonly,
html[data-theme="dark"] #app-content .alis-grid .alis-suggest-panel,
html[data-theme="dark"] #app-content .alis-total-item strong,
html[data-theme="dark"] #app-content .alis-total-item.is-grand strong {
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .alis-total-item span,
html[data-theme="dark"] #app-content .alis-payment-mini,
html[data-theme="dark"] #app-content .alis-grid-footer,
html[data-theme="dark"] #app-content .alis-suggest-panel .suggestion-state {
    color: var(--ys-muted) !important;
}

html[data-theme="dark"] #app-content .alis-total-item.is-grand {
    border-color: rgba(56, 189, 248, .32) !important;
    background: linear-gradient(135deg, rgba(14, 165, 233, .20), rgba(15, 23, 42, .82)) !important;
}

html[data-theme="dark"] #app-content .alis-grid .grid-action button,
html[data-theme="dark"] #app-content .alis-price-delete {
    background: rgba(244, 63, 94, .14) !important;
    color: #fda4af !important;
}

html[data-theme="dark"] #app-content .alis-grid .grid-action button.is-price {
    background: rgba(14, 165, 233, .14) !important;
    color: #7dd3fc !important;
}

html[data-theme="dark"] #app-content .alis-suggest-panel .combo-code,
html[data-theme="dark"] #app-content .alis-grid-footer kbd {
    border-color: rgba(148, 163, 184, .20) !important;
    background: rgba(2, 6, 23, .46) !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] #app-content .alis-suggest-row mark {
    background: rgba(234, 179, 8, .28) !important;
    color: #fde68a !important;
}

/* Legacy/custom page components with inline page CSS. */
html[data-theme="dark"] #app-content .card,
html[data-theme="dark"] #app-content .variant-hero,
html[data-theme="dark"] #app-content .variant-card,
html[data-theme="dark"] #app-content .variant-btn,
html[data-theme="dark"] #app-content .variant-tab,
html[data-theme="dark"] #app-content .variant-counter,
html[data-theme="dark"] #app-content .variant-icon-btn,
html[data-theme="dark"] #app-content .stock-create-card,
html[data-theme="dark"] #app-content .stock-create-btn,
html[data-theme="dark"] #app-content .stock-variant-inline,
html[data-theme="dark"] #app-content .stock-variant-list,
html[data-theme="dark"] #app-content .stock-variant-empty,
html[data-theme="dark"] #app-content .stock-variant-panel,
html[data-theme="dark"] #app-content .stock-input-group,
html[data-theme="dark"] #app-content .stock-price-box,
html[data-theme="dark"] #app-content .stock-price-tabs,
html[data-theme="dark"] #app-content .stock-price-tabs div,
html[data-theme="dark"] #app-content .stock-category-menu,
html[data-theme="dark"] #app-content .stock-category-option,
html[data-theme="dark"] #app-content .stock-chip,
html[data-theme="dark"] #app-content .stock-description-tools,
html[data-theme="dark"] #app-content .stock-editor,
html[data-theme="dark"] #app-content .transfer-card,
html[data-theme="dark"] #app-content .transfer-info-note,
html[data-theme="dark"] #app-content .badge-soft,
html[data-theme="dark"] #app-content .history-container,
html[data-theme="dark"] #app-content .movement-card,
html[data-theme="dark"] #app-content .inventory-card,
html[data-theme="dark"] #app-content .negative-card {
    border-color: rgba(148, 163, 184, .20) !important;
    background: rgba(15, 23, 42, .86) !important;
    color: var(--ys-text) !important;
    box-shadow: 0 18px 44px rgba(0, 0, 0, .22) !important;
}

html[data-theme="dark"] #app-content .variant-title,
html[data-theme="dark"] #app-content .variant-card-title,
html[data-theme="dark"] #app-content .variant-name,
html[data-theme="dark"] #app-content .variant-field label,
html[data-theme="dark"] #app-content .variant-check,
html[data-theme="dark"] #app-content .stock-create-title,
html[data-theme="dark"] #app-content .stock-section-title,
html[data-theme="dark"] #app-content .stock-field label,
html[data-theme="dark"] #app-content .stock-label,
html[data-theme="dark"] #app-content .transfer-grid strong {
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .variant-subtitle,
html[data-theme="dark"] #app-content .variant-muted,
html[data-theme="dark"] #app-content .variant-empty,
html[data-theme="dark"] #app-content .variant-help,
html[data-theme="dark"] #app-content .stock-help,
html[data-theme="dark"] #app-content .transfer-meta-line,
html[data-theme="dark"] #app-content .transfer-grid div {
    color: var(--ys-muted) !important;
}

html[data-theme="dark"] #app-content .variant-table th,
html[data-theme="dark"] #app-content .stock-variant-list th,
html[data-theme="dark"] #app-content .history-table th,
html[data-theme="dark"] #app-content .transfer-table th {
    border-color: rgba(148, 163, 184, .16) !important;
    background: rgba(2, 6, 23, .48) !important;
    color: var(--ys-muted) !important;
}

html[data-theme="dark"] #app-content .variant-table td,
html[data-theme="dark"] #app-content .stock-variant-list td,
html[data-theme="dark"] #app-content .history-table td,
html[data-theme="dark"] #app-content .transfer-table td {
    border-color: rgba(148, 163, 184, .12) !important;
    background: rgba(15, 23, 42, .66) !important;
    color: var(--ys-text-2) !important;
}

html[data-theme="dark"] #app-content .variant-table tbody tr:hover,
html[data-theme="dark"] #app-content .stock-category-option:hover,
html[data-theme="dark"] #app-content .stock-icon-btn:hover,
html[data-theme="dark"] #app-content .transfer-search-item:hover {
    background: rgba(56, 189, 248, .08) !important;
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .variant-input,
html[data-theme="dark"] #app-content .stock-input,
html[data-theme="dark"] #app-content .stock-select,
html[data-theme="dark"] #app-content .stock-textarea,
html[data-theme="dark"] #app-content .stock-input-group input {
    border-color: rgba(148, 163, 184, .22) !important;
    background: rgba(2, 6, 23, .42) !important;
    color: var(--ys-text) !important;
}

html[data-theme="dark"] #app-content .variant-input:focus,
html[data-theme="dark"] #app-content .stock-input:focus,
html[data-theme="dark"] #app-content .stock-select:focus,
html[data-theme="dark"] #app-content .stock-textarea:focus,
html[data-theme="dark"] #app-content .stock-input-group input:focus {
    border-color: rgba(56, 189, 248, .58) !important;
    background: rgba(15, 23, 42, .94) !important;
    box-shadow: 0 0 0 .22rem rgba(56, 189, 248, .13) !important;
}

html[data-theme="dark"] #app-content .variant-btn.primary,
html[data-theme="dark"] #app-content .variant-tab.active,
html[data-theme="dark"] #app-content .stock-create-btn.primary {
    border-color: rgba(56, 189, 248, .50) !important;
    background: linear-gradient(135deg, #0284c7, #4f46e5) !important;
    color: #fff !important;
}

html[data-theme="dark"] #app-content .variant-btn.soft,
html[data-theme="dark"] #app-content .variant-tag,
html[data-theme="dark"] #app-content .variant-price {
    color: #7dd3fc !important;
}

html[data-theme="dark"] #app-content .variant-pill,
html[data-theme="dark"] #app-content .stock-alert.ok {
    border-color: rgba(16, 185, 129, .24) !important;
    background: rgba(16, 185, 129, .13) !important;
    color: #6ee7b7 !important;
}

html[data-theme="dark"] #app-content .variant-pill.off,
html[data-theme="dark"] #app-content .variant-alert,
html[data-theme="dark"] #app-content .variant-toast,
html[data-theme="dark"] #app-content .variant-modal-error,
html[data-theme="dark"] #app-content .stock-alert.err {
    border-color: rgba(244, 63, 94, .26) !important;
    background: rgba(244, 63, 94, .13) !important;
    color: #fda4af !important;
}

html[data-theme="dark"] #app-content .quick-price-table tr.is-dirty,
html[data-theme="dark"] #app-content .price-modal-row.is-edited {
    background: rgba(245, 158, 11, .14) !important;
}

html[data-theme="dark"] #app-content .quick-price-table tr.is-error {
    background: rgba(244, 63, 94, .14) !important;
}

html[data-theme="dark"] #app-content .quick-price-input:focus {
    background: rgba(15, 23, 42, .94) !important;
}