/* Monochrome portal theme with consistent semantic button colors */
:root {
    --mono-bg: #f4f5f7;
    --mono-surface: #ffffff;
    --mono-border: #d9dde3;
    --mono-text: #1f2937;
    --mono-muted: #5f6b7a;
    --mono-sidebar: #111827;
    --mono-sidebar-hover: #1f2937;
    --mono-sidebar-text: #e5e7eb;
    --mono-accent: #374151;

    --btn-success: #198754;
    --btn-primary: #0d6efd;
    --btn-warning: #ffc107;
    --btn-danger: #dc3545;
}

html {
    overflow-y: scroll;
    scrollbar-gutter: stable;
}

body,
.content-wrapper,
.login-page,
.wrapper {
    background: linear-gradient(180deg, #f8f9fb 0%, var(--mono-bg) 100%) !important;
    color: var(--mono-text);
}

.main-header.navbar,
.main-footer,
.card,
.modal-content,
.dropdown-menu,
.small-box,
.info-box,
.table,
.dataTables_wrapper .dataTables_paginate .paginate_button {
    border-color: var(--mono-border) !important;
}

.main-header.navbar,
.main-footer,
.card,
.modal-content,
.dropdown-menu {
    background-color: var(--mono-surface) !important;
    color: var(--mono-text) !important;
}

.main-sidebar,
.main-sidebar .nav-sidebar .nav-link,
.main-sidebar .brand-link {
    background-color: var(--mono-sidebar) !important;
    color: var(--mono-sidebar-text) !important;
}

.main-sidebar .nav-sidebar .nav-link:hover,
.main-sidebar .nav-sidebar .nav-link.active {
    background-color: var(--mono-sidebar-hover) !important;
    color: #ffffff !important;
}

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

.badge-warning,
.navbar-badge {
    color: #111827 !important;
}

.btn-success,
.btn-default-success {
    background-color: var(--btn-success) !important;
    border-color: var(--btn-success) !important;
    color: #fff !important;
}

.btn-primary,
.btn-default-primary,
.btn-info {
    background-color: var(--btn-primary) !important;
    border-color: var(--btn-primary) !important;
    color: #fff !important;
}

.btn-warning,
.btn-default-warning {
    background-color: var(--btn-warning) !important;
    border-color: var(--btn-warning) !important;
    color: #212529 !important;
}

.btn-danger,
.btn-default-danger {
    background-color: var(--btn-danger) !important;
    border-color: var(--btn-danger) !important;
    color: #fff !important;
}

.btn-secondary,
.btn-light,
.btn-default {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: #fff !important;
}

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

a:hover {
    color: #111827;
}

.form-control,
.custom-select,
.select2-container--bootstrap4 .select2-selection {
    border-color: var(--mono-border) !important;
}

.form-control:focus,
.custom-select:focus,
.select2-container--bootstrap4.select2-container--focus .select2-selection {
    border-color: #9ca3af !important;
    box-shadow: 0 0 0 0.2rem rgba(55, 65, 81, 0.15) !important;
}

.table thead th {
    background-color: #eef1f4;
    color: #111827;
}

@media (max-width: 768px) {
    .content-wrapper {
        padding-top: 0.5rem;
    }
}