:root {
    color-scheme: light;
    --blue: #0757b7;
    --blue-deep: #063f88;
    --orange: #ff6b00;
    --ink: #10243e;
    --muted: #5d7189;
    --page-bg: #f3f7fc;
    --topbar-bg: #ffffff;
    --surface: #ffffff;
    --surface-alt: #eef5fd;
    --hero-accent: #e8f2ff;
    --line: #dbe6f3;
    --control-border: #b9cce2;
    --secondary-bg: #eaf3ff;
    --sidebar-bg: #063f88;
    --sidebar-active: #0757b7;
    --focus-ring: rgba(7, 87, 183, .22);
    --card-shadow: 0 10px 30px rgba(6, 63, 136, .07);
    --table-line: #e5edf6;
    --success-text: #067343;
    --success-bg: #daf7ea;
    --warning-text: #a14700;
    --warning-bg: #fff0dc;
    --danger-text: #9c2635;
    --danger-bg: #ffe3e7;
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --blue: #72b3ff;
    --blue-deep: #a9d1ff;
    --orange: #ff8a33;
    --ink: #f3f7fd;
    --muted: #b5c6d9;
    --page-bg: #030914;
    --topbar-bg: #07111f;
    --surface: #091827;
    --surface-alt: #0c2136;
    --hero-accent: #0d2c4a;
    --line: #203a53;
    --control-border: #345570;
    --secondary-bg: #102b46;
    --sidebar-bg: #020711;
    --sidebar-active: #0b5fac;
    --focus-ring: rgba(114, 179, 255, .3);
    --card-shadow: 0 14px 36px rgba(0, 0, 0, .28);
    --table-line: #28445f;
    --success-text: #80e2b3;
    --success-bg: #113f32;
    --warning-text: #ffc078;
    --warning-bg: #493018;
    --danger-text: #ffabb5;
    --danger-bg: #4a2029;
}

html, body {
    margin: 0;
    min-height: 100%;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    color: var(--ink);
    background: var(--page-bg);
    transition: color .2s ease, background-color .2s ease;
}

body > * { color: inherit; }
:root[data-theme="dark"],
:root[data-theme="dark"] body,
:root[data-theme="dark"] .shell,
:root[data-theme="dark"] .workspace,
:root[data-theme="dark"] .content {
    color: var(--ink);
    background-color: var(--page-bg);
}

:root[data-theme="dark"] .topbar { background-color: var(--topbar-bg); }
:root[data-theme="dark"] .sidebar { background-color: var(--sidebar-bg); }

*, *::before, *::after { box-sizing: border-box; }
h1 { margin: 0 0 1rem; font-size: clamp(2rem, 4vw, 3.25rem); letter-spacing: -.04em; }
h2 { font-size: 1.15rem; }
p { color: var(--muted); line-height: 1.65; }
.eyebrow { margin: 0 0 .5rem; color: var(--orange); font-size: .78rem; font-weight: 800; letter-spacing: .16em; }

.hero-card, .form-card, .table-card, .feature-grid article {
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: var(--card-shadow);
    transition: color .2s ease, background-color .2s ease, border-color .2s ease;
}

.hero-card { min-height: 330px; padding: clamp(28px, 5vw, 64px); display: flex; align-items: center; justify-content: space-between; gap: 30px; background: linear-gradient(135deg, var(--surface) 60%, var(--hero-accent)); }
.hero-card > div:first-child { max-width: 720px; }
.hero-card p:not(.eyebrow) { font-size: 1.12rem; }
.actions { display: flex; gap: 12px; margin-top: 24px; flex-wrap: wrap; }
.primary-action, .secondary-action { display: inline-block; border: 0; border-radius: 10px; padding: 11px 18px; font-weight: 750; text-decoration: none; cursor: pointer; }
.primary-action { color: #fff; background: var(--orange); }
.secondary-action { color: var(--blue); background: var(--secondary-bg); }
.status-orb { width: 150px; aspect-ratio: 1; border-radius: 50%; display: grid; place-content: center; text-align: center; color: #fff; background: #0757b7; box-shadow: 0 0 0 16px rgba(7, 87, 183, .14); }
.status-orb span { font-size: .75rem; letter-spacing: .15em; }
.status-orb strong { font-size: 2.3rem; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 18px; }
.feature-grid article { padding: 26px; }
.feature-grid article > span { color: var(--orange); font-weight: 900; }
.form-card { padding: 28px; margin: 22px 0; }
.form-card.narrow { max-width: 520px; margin: 40px auto; }
.form-card form, .form-card label { display: grid; gap: 7px; }
.form-card form { gap: 18px; }
.form-card label { color: var(--ink); font-weight: 700; }

input, select, textarea { min-height: 44px; padding: 9px 12px; color: var(--ink); background: var(--surface); border: 1px solid var(--control-border); border-radius: 9px; font: inherit; }
input:focus, select:focus, textarea:focus { outline: 3px solid var(--focus-ring); border-color: var(--blue); }
.inline-form, .field-grid { display: grid; grid-template-columns: 1fr 2fr auto; gap: 16px; align-items: end; }
.field-grid { grid-template-columns: repeat(2, 1fr); align-items: initial; }
.table-card { overflow: auto; }
.table-card.device-grid-card { overflow: hidden; }
table { width: 100%; border-collapse: collapse; color: var(--ink); }
th, td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--table-line); white-space: nowrap; }
th { color: var(--blue-deep); background: var(--surface-alt); font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; }
.device-grid-toolbar { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 18px; color: var(--ink); }
.device-grid-actions { display: flex; align-items: center; gap: 14px; }
.device-grid-actions > span { color: var(--muted); font-size: .86rem; }
.programming-profile-selector { display: flex; align-items: center; gap: 8px; color: var(--ink); font-size: .82rem; font-weight: 800; }
.device-grid-search { display: flex; align-items: center; justify-content: flex-end; gap: 14px; flex: 1; }
.programming-result-message { color: var(--success-text); font-size: .86rem; font-weight: 800; }
.device-grid-card .k-grid { border: 0; border-radius: inherit; }
.device-grid-card .k-grid-toolbar { padding: 14px 16px; background: var(--surface); border-color: var(--line); }
.device-grid-card .k-grid-content { min-height: 120px; }
.device-grid-card .k-selected > td { background: var(--surface-alt) !important; }
.company-logo-cell { width: 100%; text-align: center; }
.company-logo { display: block; width: 72px; height: 46px; margin: 0 auto; object-fit: contain; border-radius: 8px; background: transparent; }
.company-logo-placeholder { display: grid; width: 72px; height: 46px; margin: 0 auto; place-items: center; color: var(--muted); background: var(--surface-alt); border: 1px dashed var(--control-border); border-radius: 8px; }
.client-location { min-width: 220px; max-width: 360px; overflow: hidden; text-overflow: ellipsis; }
.status { display: inline-block; border-radius: 999px; padding: 5px 9px; font-size: .78rem; font-weight: 800; }
.status.active { color: var(--success-text); background: var(--success-bg); }
.status.suspended { color: var(--warning-text); background: var(--warning-bg); }
.status.retired { color: var(--danger-text); background: var(--danger-bg); }
.alert-error { margin-bottom: 14px; padding: 12px; color: var(--danger-text); background: var(--danger-bg); border-radius: 8px; }
.result-message { font-weight: 700; color: var(--blue); }
.validation-message { color: var(--danger-text); }

.theme-icon-moon, .theme-label-dark { display: none; }
:root[data-theme="dark"] .theme-icon-sun,
:root[data-theme="dark"] .theme-label-light { display: none; }
:root[data-theme="dark"] .theme-icon-moon,
:root[data-theme="dark"] .theme-label-dark { display: block; }
:root[data-theme="dark"] .theme-switch-track { background: linear-gradient(135deg, #071426, #164d7a); border-color: #315d7d; box-shadow: inset 0 2px 6px rgba(0, 0, 0, .45); }
:root[data-theme="dark"] .theme-switch-thumb { color: #a9d1ff; background: #06111f; transform: translateX(30px); box-shadow: 0 2px 9px rgba(0, 0, 0, .55); }
:root[data-theme="dark"] .theme-switch { color: #d8e7f7; background: #0b2034; box-shadow: 0 6px 18px rgba(0, 0, 0, .35); }

.k-input, .k-picker, .k-numerictextbox, .k-textbox, .k-input-inner, .k-popup, .k-list, .k-table, .k-grid {
    color: var(--ink) !important;
    background-color: var(--surface) !important;
    border-color: var(--control-border) !important;
}

:root[data-theme="dark"] .k-grid,
:root[data-theme="dark"] .k-grid-header,
:root[data-theme="dark"] .k-grid-header-wrap,
:root[data-theme="dark"] .k-grid-content,
:root[data-theme="dark"] .k-table-thead,
:root[data-theme="dark"] .k-table-tbody,
:root[data-theme="dark"] .k-table-row,
:root[data-theme="dark"] .k-table-th,
:root[data-theme="dark"] .k-table-td,
:root[data-theme="dark"] .k-dialog,
:root[data-theme="dark"] .k-dialog-titlebar,
:root[data-theme="dark"] .k-window,
:root[data-theme="dark"] .k-window-content,
:root[data-theme="dark"] .k-popup,
:root[data-theme="dark"] .k-list,
:root[data-theme="dark"] .k-list-content,
:root[data-theme="dark"] .k-animation-container {
    color: var(--ink) !important;
    background-color: var(--surface) !important;
    border-color: var(--line) !important;
}

:root[data-theme="dark"] .k-table-row:hover,
:root[data-theme="dark"] .k-list-item:hover { background-color: var(--surface-alt) !important; }

.k-button-solid-primary { color: #fff !important; background-color: var(--orange) !important; border-color: var(--orange) !important; }

.k-numerictextbox .k-input-spinner .k-button,
.k-numerictextbox .k-spinner-increase,
.k-numerictextbox .k-spinner-decrease {
    color: #fff !important;
    background-color: var(--orange) !important;
    border-color: var(--orange) !important;
}

.k-numerictextbox .k-input-spinner .k-button:hover,
.k-numerictextbox .k-spinner-increase:hover,
.k-numerictextbox .k-spinner-decrease:hover {
    color: #fff !important;
    background-color: color-mix(in srgb, var(--orange) 82%, #9a3100) !important;
}

.k-checkbox {
    color: #fff !important;
    background-color: var(--surface-alt) !important;
    border: 2px solid var(--control-border) !important;
    accent-color: #00b84a;
}

.k-checkbox:checked,
.k-checkbox.k-checked,
.k-checkbox:indeterminate {
    color: #fff !important;
    background-color: #00b84a !important;
    border-color: #00b84a !important;
}

.k-checkbox:hover,
.k-checkbox:focus-visible {
    border-color: #00b84a !important;
    box-shadow: 0 0 0 3px var(--focus-ring) !important;
}

.k-checkbox:disabled,
.k-numerictextbox .k-button:disabled {
    opacity: .5;
}

.device-grid-card .k-grid .k-checkbox {
    display: block;
    width: 26px;
    min-width: 26px;
    height: 26px;
    margin-inline: auto;
    border-radius: 6px;
}

.device-grid-card .k-grid .k-table-th:first-child,
.device-grid-card .k-grid .k-table-td:first-child {
    text-align: center;
}

.k-grid .k-grid-pager,
.k-grid .k-pager,
:root[data-theme="dark"] .k-grid .k-grid-pager,
:root[data-theme="dark"] .k-grid .k-pager {
    color: var(--ink) !important;
    background-color: var(--surface-alt) !important;
    border-color: var(--line) !important;
}

.k-pager .k-button {
    color: var(--blue-deep) !important;
    background-color: transparent !important;
    border-color: transparent !important;
}

.k-pager .k-button:hover,
.k-pager .k-button:focus-visible {
    color: var(--ink) !important;
    background-color: var(--secondary-bg) !important;
}

.k-pager .k-selected,
.k-pager .k-button.k-selected {
    color: #fff !important;
    background-color: var(--orange) !important;
    border-color: var(--orange) !important;
}

.k-window-titlebar,
.k-dialog-titlebar,
:root[data-theme="dark"] .k-window-titlebar,
:root[data-theme="dark"] .k-dialog-titlebar {
    color: #fff !important;
    background-color: var(--orange) !important;
    border-color: var(--orange) !important;
}

.k-window-titlebar .k-window-title,
.k-dialog-titlebar .k-window-title,
.k-window-titlebar .k-button,
.k-dialog-titlebar .k-button {
    color: #fff !important;
}

.k-window-titlebar .k-button:hover,
.k-dialog-titlebar .k-button:hover {
    background-color: rgba(255, 255, 255, .18) !important;
}

@media (max-width: 900px) {
    .feature-grid { grid-template-columns: 1fr; }
    .status-orb { display: none; }
    .inline-form, .field-grid { grid-template-columns: 1fr; }
    .device-grid-toolbar, .device-grid-actions, .device-grid-search { width: 100%; align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
    html, body, .hero-card, .form-card, .table-card, .feature-grid article { transition: none; }
}