:root {
    --adm-accent: #006938;
    --adm-accent-strong: #005b30;
    --adm-accent-soft: #dff0e7;
    --adm-accent-soft-2: #eef7f2;
    --adm-accent-ink: #0c5a35;

    --adm-page-bg-a: #ebf2ee;
    --adm-page-bg-b: #f7faf8;
    --adm-surface: #ffffff;
    --adm-surface-soft: #f4f8f6;
    --adm-border: #d3e1d9;
    --adm-border-strong: #bed2c7;

    --adm-text: #1f2d27;
    --adm-text-soft: #5f7268;

    --adm-danger: #b84035;
    --adm-danger-strong: #9f332a;
    --adm-danger-soft: #fdecea;
    --adm-warning-soft: #fff5e0;
    --adm-warning-text: #8a5c00;
    --adm-info-soft: #e8f3ef;

    --adm-shadow: 0 10px 26px rgba(19, 42, 32, 0.10);
    --adm-shadow-soft: 0 6px 18px rgba(19, 42, 32, 0.08);
}

body {
    background: linear-gradient(180deg, var(--adm-page-bg-a) 0%, var(--adm-page-bg-b) 100%);
    color: var(--adm-text);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--adm-text);
}

label,
.helper-text,
.status-line,
.status-message,
.small,
.library-item-meta,
.playlist-type,
.meta,
.muted {
    color: var(--adm-text-soft);
}

a {
    color: var(--adm-accent-ink);
}

a:hover {
    color: var(--adm-accent-strong);
}

.admin-topnav,
.navbar,
.toolbar,
.panel,
.card,
.workspace-section,
.content-block-card,
.schedule-card,
.playlist-item,
.screen-card,
.modal-card,
.dialog-card,
.feedback-card,
.admin-feedback-card,
.assignment-panel,
.assignment-dialog {
    background: var(--adm-surface);
    border-color: var(--adm-border);
    box-shadow: var(--adm-shadow-soft);
}

.admin-topnav {
    background: linear-gradient(135deg, #ffffff 0%, var(--adm-accent-soft-2) 100%);
    border-color: var(--adm-border-strong);
    box-shadow: var(--adm-shadow);
}

.admin-topnav-brand {
    color: var(--adm-text);
}

.admin-topnav-link,
.nav-link {
    color: var(--adm-accent-ink);
    background: var(--adm-accent-soft-2);
    border-color: var(--adm-border-strong);
}

.admin-topnav-link:hover,
.nav-link:hover {
    background: var(--adm-accent-soft);
    color: var(--adm-accent-strong);
    border-color: var(--adm-accent);
}

.admin-topnav-link.is-active,
.nav-link.is-active {
    background: var(--adm-accent);
    border-color: var(--adm-accent-strong);
    color: #ffffff;
}

.admin-topnav-settings {
    background: var(--adm-surface-soft);
    border-color: var(--adm-border-strong);
    color: var(--adm-text);
}

.admin-topnav-settings:hover {
    background: var(--adm-accent-soft-2);
    border-color: var(--adm-accent);
    color: var(--adm-accent-strong);
}

.admin-topnav-settings.is-active {
    background: var(--adm-accent);
    border-color: var(--adm-accent-strong);
    color: #ffffff;
}

.admin-topnav-logout {
    background: var(--adm-danger-soft);
    border-color: #efc1bb;
    color: var(--adm-danger);
}

.admin-topnav-logout:hover {
    background: #f9ddd9;
    border-color: #e8ada6;
    color: var(--adm-danger-strong);
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="time"],
input[type="date"],
input[type="datetime-local"],
select,
textarea {
    background: var(--adm-surface);
    color: var(--adm-text);
    border: 1px solid var(--adm-border-strong);
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="time"]:focus,
input[type="date"]:focus,
input[type="datetime-local"]:focus,
select:focus,
textarea:focus {
    border-color: var(--adm-accent);
    box-shadow: 0 0 0 3px rgba(0, 105, 56, 0.12);
    outline: none;
}

.btn,
.btn:visited {
    border: 1px solid transparent;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.btn-primary,
.btn-login {
    background: var(--adm-accent);
    border-color: var(--adm-accent-strong);
    color: #ffffff;
}

.btn-primary:hover,
.btn-login:hover {
    background: var(--adm-accent-strong);
    border-color: #004928;
    color: #ffffff;
}

.btn-secondary,
.mode-btn,
.picker-type-tab.is-active {
    background: var(--adm-accent-soft);
    border-color: var(--adm-border-strong);
    color: var(--adm-accent-ink);
}

.btn-secondary:hover,
.mode-btn:hover {
    background: #cfe7db;
    border-color: var(--adm-accent);
    color: var(--adm-accent-strong);
}

.btn-outline,
.picker-type-tab {
    background: var(--adm-surface-soft);
    border-color: var(--adm-border-strong);
    color: var(--adm-text);
}

.btn-outline:hover,
.picker-type-tab:hover {
    background: var(--adm-accent-soft-2);
    border-color: var(--adm-accent);
    color: var(--adm-accent-strong);
}

.btn-danger {
    background: var(--adm-danger);
    border-color: var(--adm-danger-strong);
    color: #ffffff;
}

.btn-danger:hover {
    background: var(--adm-danger-strong);
    border-color: #87251e;
    color: #ffffff;
}

button:disabled,
input[type="submit"]:disabled {
    opacity: 0.62;
}

.target-button.is-active,
.mode-btn.is-active,
.widget-box.is-selected,
.transition-preview-item.is-selected {
    background: var(--adm-accent-soft);
    border-color: var(--adm-accent);
    color: var(--adm-accent-strong);
}

table {
    background: var(--adm-surface);
}

thead th,
th {
    background: var(--adm-surface-soft);
    color: var(--adm-text-soft);
    border-bottom-color: var(--adm-border);
}

td {
    border-bottom-color: #e5eee9;
    color: var(--adm-text);
}

tbody tr:hover {
    background: #f2f7f4;
}

.empty-state {
    background: var(--adm-surface-soft);
    border-color: var(--adm-border);
    color: var(--adm-text-soft);
}

.badge-active,
.status-online,
.status-active {
    background: var(--adm-accent-soft);
    color: var(--adm-accent-strong);
}

.badge-inactive,
.status-offline,
.status-inactive {
    background: var(--adm-danger-soft);
    color: var(--adm-danger-strong);
}

.state-pill {
    background: var(--adm-info-soft);
    color: var(--adm-accent-ink);
}

.state-pill.warn {
    background: var(--adm-warning-soft);
    color: var(--adm-warning-text);
}

.state-pill.error {
    background: var(--adm-danger-soft);
    color: var(--adm-danger-strong);
}

.upload-progress-bar,
.progress-track {
    background: #e4ece8;
}

.upload-progress-fill,
.progress-fill,
.progress-bar-fill {
    background: linear-gradient(90deg, var(--adm-accent) 0%, #2a8b60 100%);
}

.modal-backdrop,
.admin-busy-overlay,
.admin-feedback-overlay {
    background: rgba(12, 29, 21, 0.52);
}

.admin-busy-card,
.feedback-card,
.admin-feedback-card,
.modal-card,
.dialog-card {
    border-color: var(--adm-border);
    box-shadow: 0 20px 42px rgba(8, 24, 18, 0.30);
}

.admin-busy-spinner,
.busy-spinner {
    border-top-color: var(--adm-accent);
}

.admin-busy-text,
.admin-feedback-title,
.feedback-title {
    color: var(--adm-text);
}

.admin-feedback-message,
.feedback-text {
    color: var(--adm-text-soft);
}

.admin-feedback-close {
    background: var(--adm-accent);
    color: #ffffff;
}

.admin-feedback-close:hover {
    background: var(--adm-accent-strong);
}

:root {
    --admin-bg: #edf4f0;
    --admin-surface: #ffffff;
    --admin-surface-muted: #f4f8f6;
    --admin-surface-emphasis: #eaf3ee;
    --admin-border: #cedbd4;
    --admin-border-strong: #b9cec3;
    --admin-border-accent: #c8d9cf;
    --admin-text: #223228;
    --admin-heading: #173324;
    --admin-muted: #5d7267;
    --admin-subtle: #7b8c83;
    --admin-primary: #dbeee2;
    --admin-primary-hover: #cfe6d8;
    --admin-primary-text: #0c5a35;
    --admin-primary-border: #b8d1c1;
    --admin-primary-border-hover: #a6c5b1;
    --admin-save-bg: #57b56e;
    --admin-save-bg-hover: #469e5c;
    --admin-save-border: #2e7945;
    --admin-save-border-hover: #256338;
    --admin-save-text: #ffffff;
    --admin-secondary: #edf5f0;
    --admin-secondary-hover: #e2eee7;
    --admin-secondary-border: #c7d8cd;
    --admin-danger: #b42318;
    --admin-danger-hover: #971b12;
    --admin-outline-bg: #f7fbf8;
    --admin-outline-bg-hover: #edf5f0;
    --admin-outline-border: #c7d8cd;
    --admin-outline-text: #1f2d27;
    --admin-shadow-card: 0 10px 24px rgba(19, 42, 32, 0.10);
    --admin-shadow-modal: 0 24px 80px rgba(19, 42, 32, 0.24);
    --admin-radius-sm: 6px;
    --admin-radius-md: 8px;
    --admin-radius-lg: 12px;
    --admin-radius-xl: 16px;
    --admin-focus-ring: 0 0 0 3px rgba(0, 105, 56, 0.14);
}