:root {
    --bg-color: #f2f3f5;
    --surface-color: #ffffff;
    --surface-alt-color: #f8f9fa;
    --surface-hover-color: #eef1f4;
    --text-color: #1f2328;
    --muted-text-color: #5c6670;
    --border-color: #d8dee4;
    --navbar-bg: rgba(255, 255, 255, 0.9);
    --input-bg: #ffffff;
    --input-text: #1f2328;
    --table-bg: #ffffff;
    --table-striped: #f6f8fa;
    --footer-bg: transparent;
    --shadow-color: rgba(15, 23, 42, 0.08);
    --accent-color: #5865f2;
    --accent-hover: #4752c4;
}

html[data-theme="dark"] {
    --bg-color: #313338;
    --surface-color: #2b2d31;
    --surface-alt-color: #232428;
    --surface-hover-color: #35373c;
    --text-color: #dbdee1;
    --muted-text-color: #b5bac1;
    --border-color: #1e1f22;
    --navbar-bg: rgba(30, 31, 34, 0.92);
    --input-bg: #1e1f22;
    --input-text: #f2f3f5;
    --table-bg: #2b2d31;
    --table-striped: #26282c;
    --footer-bg: transparent;
    --shadow-color: rgba(0, 0, 0, 0.25);
    --accent-color: #5865f2;
    --accent-hover: #6d78f7;
}

html, body {
    background: var(--bg-color) !important;
    color: var(--text-color) !important;
    min-height: 100%;
}

body {
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* Главный контейнер */
main.pb-3 {
    background-color: var(--surface-color);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    box-shadow: 0 8px 24px var(--shadow-color);
    padding: 24px;
    margin-top: 20px;
    margin-bottom: 24px;
}

/* Общие тексты */
h1, h2, h3, h4, h5, h6,
label, strong, span, div, p {
    color: var(--text-color);
}

.text-muted {
    color: var(--muted-text-color) !important;
}

/* Навбар */
.navbar {
    background-color: var(--navbar-bg) !important;
    border-color: var(--border-color) !important;
    backdrop-filter: blur(8px);
}

    .navbar-brand,
    .nav-link,
    .navbar .text-dark,
    .navbar span,
    .navbar a {
        color: var(--text-color) !important;
    }

.navbar-brand {
    font-weight: 700;
    letter-spacing: 0.2px;
}

    .navbar .nav-link:hover,
    .navbar-brand:hover {
        color: var(--accent-color) !important;
    }

/* Карточки */
.card,
.modal-content,
.dropdown-menu {
    background-color: var(--surface-alt-color) !important;
    color: var(--text-color) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 14px var(--shadow-color);
}

.card-body {
    padding: 18px;
}

/* Таблицы */
.table {
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
    overflow: hidden;
    border-radius: 12px;
    margin-bottom: 0;
}

    .table thead th {
        background-color: var(--surface-alt-color) !important;
        color: var(--text-color) !important;
        border-color: #404249 !important;
        font-weight: 600;
    }

    .table > :not(caption) > * > * {
        background-color: var(--table-bg) !important;
        color: var(--text-color) !important;
        border-color: #404249 !important;
        vertical-align: middle;
    }

.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: var(--table-striped) !important;
}

.table tbody tr:hover > * {
    background-color: var(--surface-hover-color) !important;
}

/* Формы */
.form-control,
.form-select,
textarea {
    background-color: var(--input-bg) !important;
    color: var(--input-text) !important;
    border: 1px solid #404249 !important;
    border-radius: 10px !important;
    min-height: 42px;
}

    textarea.form-control {
        min-height: 100px;
    }

    .form-control:focus,
    .form-select:focus,
    textarea:focus {
        background-color: var(--input-bg) !important;
        color: var(--input-text) !important;
        border-color: var(--accent-color) !important;
        box-shadow: 0 0 0 0.2rem rgba(88, 101, 242, 0.22) !important;
    }

.form-label {
    color: var(--text-color) !important;
    font-weight: 500;
    margin-bottom: 6px;
}

.form-control::placeholder,
textarea::placeholder {
    color: #9ca3af !important;
}

/* Кнопки */
.btn {
    border-radius: 10px !important;
    font-weight: 500;
}

.btn-primary {
    background-color: var(--accent-color) !important;
    border-color: var(--accent-color) !important;
}

    .btn-primary:hover {
        background-color: var(--accent-hover) !important;
        border-color: var(--accent-hover) !important;
    }

.btn-outline-secondary {
    color: var(--text-color) !important;
    border-color: #4e5058 !important;
    background-color: transparent !important;
}

    .btn-outline-secondary:hover {
        background-color: #404249 !important;
        color: #ffffff !important;
        border-color: #404249 !important;
    }

.btn-outline-primary {
    color: #cdd6f4 !important;
    border-color: var(--accent-color) !important;
}

    .btn-outline-primary:hover {
        background-color: var(--accent-color) !important;
        color: #ffffff !important;
    }

.btn-link {
    color: var(--accent-color) !important;
    text-decoration: none;
}

    .btn-link:hover {
        color: var(--accent-hover) !important;
    }

/* Alerts */
.alert {
    border-radius: 12px !important;
    border-width: 1px !important;
}

.alert-success {
    background-color: #1f3a2a !important;
    border-color: #2d5a3d !important;
    color: #c7f0d8 !important;
}

.alert-danger {
    background-color: #4a1d24 !important;
    border-color: #7a2835 !important;
    color: #ffd7dc !important;
}

/* Footer */
.footer {
    background-color: var(--footer-bg) !important;
    border-color: transparent !important;
    color: var(--muted-text-color) !important;
}

    .footer a {
        color: var(--accent-color) !important;
    }

/* Горизонтальные линии */
hr,
.border,
.border-top,
.border-bottom {
    border-color: var(--border-color) !important;
}

/* Ссылки */
a {
    color: var(--accent-color);
}

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

/* Кнопка переключения темы */
#themeToggle {
    min-width: 130px;
}

/* Табличный блок */
.table-wrapper {
    background-color: var(--surface-alt-color);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 12px;
    box-shadow: 0 4px 14px var(--shadow-color);
}

/* Формы фильтров */
.filter-box {
    background-color: var(--surface-alt-color);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    padding: 16px;
    box-shadow: 0 4px 14px var(--shadow-color);
}