:root {
    --as-dark-gray: #262b33;
    --as-gray: #6f7782;
    --as-gray-soft: #aab2bd;
    --as-surface: #edf1f5;
    --as-panel: #ffffff;
    --as-blue-accent: #2f62ad;
    --as-blue-accent-strong: #254f8d;
    --as-text: #111111;

    /* Backward-compatible aliases used in existing view snippets */
    --as-navy: var(--as-dark-gray);
    --as-blue: var(--as-blue-accent);
    --as-blue-strong: var(--as-blue-accent-strong);
    --as-red: var(--as-blue-accent);
    --as-black: var(--as-text);

    --bs-primary: var(--as-dark-gray);
    --bs-primary-rgb: 38, 43, 51;
    --bs-secondary: var(--as-gray);
    --bs-secondary-rgb: 111, 119, 130;
    --bs-success: var(--as-blue-accent);
    --bs-success-rgb: 47, 98, 173;
    --bs-danger: var(--as-dark-gray);
    --bs-danger-rgb: 38, 43, 51;
    --bs-link-color: var(--as-blue-accent);
    --bs-link-hover-color: var(--as-blue-accent-strong);
}

body {
    background-color: var(--as-surface);
    color: var(--as-text);
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
label,
th,
td,
small,
.main-content,
.content-box,
.card-body,
.modal-content,
.table,
.form-label,
.form-control,
.form-select {
    color: var(--as-text);
}

.bg-dark,
.navbar.bg-dark {
    background: linear-gradient(90deg, #1f232a, #313741) !important;
}

.sidebar {
    background: linear-gradient(180deg, #252b34, #3a414c) !important;
    color: #f0f3f8 !important;
}

.sidebar a {
    color: #e3e8ef !important;
}

.sidebar a:hover,
.sidebar a:focus {
    color: #ffffff !important;
}

.toggle-btn {
    background-color: var(--as-blue-accent) !important;
    border-color: var(--as-blue-accent) !important;
    color: #ffffff !important;
}

.btn-primary {
    --bs-btn-bg: var(--as-dark-gray);
    --bs-btn-border-color: var(--as-dark-gray);
    --bs-btn-hover-bg: #1b1f26;
    --bs-btn-hover-border-color: #1b1f26;
    --bs-btn-active-bg: #161920;
    --bs-btn-active-border-color: #161920;
}

.btn-danger {
    --bs-btn-bg: #4a525d;
    --bs-btn-border-color: #4a525d;
    --bs-btn-hover-bg: #3d444d;
    --bs-btn-hover-border-color: #3d444d;
    --bs-btn-active-bg: #323840;
    --bs-btn-active-border-color: #323840;
}

.btn-secondary {
    --bs-btn-bg: var(--as-gray);
    --bs-btn-border-color: var(--as-gray);
    --bs-btn-hover-bg: #5d646e;
    --bs-btn-hover-border-color: #5d646e;
}

.btn-success {
    --bs-btn-bg: var(--as-blue-accent);
    --bs-btn-border-color: var(--as-blue-accent);
    --bs-btn-hover-bg: var(--as-blue-accent-strong);
    --bs-btn-hover-border-color: var(--as-blue-accent-strong);
}

.login-box,
.forgot-box,
.reset-box {
    border-top-color: var(--as-blue-accent) !important;
}

.login-footer {
    background: var(--as-blue-accent) !important;
    color: #ffffff !important;
}

.card,
.content-box {
    background: var(--as-panel);
    border: 1px solid rgba(38, 43, 51, 0.12);
    box-shadow: 0 10px 24px rgba(38, 43, 51, 0.08);
}

.table thead th {
    background-color: #dde3ea;
    color: #1b2129;
    border-color: #c8d0da;
}

.text-warning {
    color: var(--as-blue-accent) !important;
}

.text-danger {
    color: var(--as-blue-accent) !important;
}

.bg-danger {
    background-color: #4a525d !important;
}

.alert-danger {
    color: #111111;
    background-color: #e8edf3;
    border-color: #b7c3d3;
}

a {
    color: var(--as-blue-accent);
}

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