:root,
[data-bs-theme="dark"] {
    --panel-bg: #070b12;
    --panel-bg-soft: #0d1320;
    --panel-surface: #111827;
    --panel-surface-2: #151f31;
    --panel-border: rgba(148, 163, 184, .18);
    --panel-text: #e5edf8;
    --panel-muted: #93a4bb;
    --panel-primary: #38bdf8;
    --panel-primary-2: #22c55e;
    --panel-danger: #fb7185;
    --panel-warning: #f59e0b;
}

html[data-bs-theme="dark"],
html[data-bs-theme="dark"] body {
    background: var(--panel-bg);
    color: var(--panel-text);
}

body.panel-dark,
.app-root,
.app-page,
.app-main,
.app-wrapper,
.app-content {
    background:
        radial-gradient(circle at top left, rgba(56, 189, 248, .12), transparent 32rem),
        linear-gradient(180deg, #070b12 0%, #0b1020 100%);
}

.app-header {
    background: rgba(13, 19, 32, .88) !important;
    border-bottom: 1px solid var(--panel-border);
    backdrop-filter: blur(16px);
}

.app-sidebar {
    background: linear-gradient(180deg, #0b1120 0%, #070b12 100%) !important;
    border-right: 1px solid var(--panel-border);
}

.app-sidebar .menu-heading,
.app-sidebar .menu-title {
    color: var(--panel-muted);
}

.app-sidebar .menu-link {
    border-radius: 8px;
    min-height: 42px;
}

.app-sidebar .menu-link.active,
.app-sidebar .menu-link:hover {
    background: rgba(56, 189, 248, .12);
}

.app-sidebar .menu-link.active .menu-title,
.app-sidebar .menu-link:hover .menu-title {
    color: var(--panel-text);
}

.card,
.modal-content,
.menu-sub-dropdown {
    background: rgba(17, 24, 39, .96) !important;
    border: 1px solid var(--panel-border) !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .28);
}

.card {
    border-radius: 8px;
}

.card-header,
.modal-header,
.modal-footer,
.separator,
.table-row-dashed tr,
.table-row-dashed td,
.table-row-dashed th {
    border-color: var(--panel-border) !important;
}

.table {
    color: var(--panel-text);
}

.table thead th,
.text-gray-500,
.text-gray-600,
.text-muted {
    color: var(--panel-muted) !important;
}

.text-gray-800,
.text-gray-900,
.fw-bold,
h1, h2, h3, h4, h5, h6 {
    color: var(--panel-text) !important;
}

.form-control,
.form-select,
.dataTables_filter input,
.form-control.form-control-solid {
    background-color: #0b1220 !important;
    border-color: var(--panel-border) !important;
    color: var(--panel-text) !important;
}

.form-control::placeholder {
    color: #64748b;
}

.btn-primary {
    background: linear-gradient(135deg, #0284c7, #22c55e) !important;
    border: 0 !important;
    color: #fff !important;
}

.btn-warning {
    background-color: rgba(245, 158, 11, .18) !important;
    border-color: rgba(245, 158, 11, .28) !important;
    color: #fbbf24 !important;
}

.btn-danger {
    background-color: rgba(251, 113, 133, .18) !important;
    border-color: rgba(251, 113, 133, .32) !important;
    color: #fb7185 !important;
}

.btn-light {
    background-color: #1f2937 !important;
    border-color: var(--panel-border) !important;
    color: var(--panel-text) !important;
}

.panel-dashboard {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.panel-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 20px;
    align-items: center;
    padding: 24px;
    border: 1px solid var(--panel-border);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(2, 132, 199, .20), rgba(34, 197, 94, .10)), #0d1320;
}

.panel-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.panel-stat-card {
    min-height: 132px;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid var(--panel-border);
    background: linear-gradient(180deg, rgba(21, 31, 49, .98), rgba(13, 19, 32, .98));
}

.panel-stat-card .stat-icon {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: rgba(56, 189, 248, .12);
    color: var(--panel-primary);
}

.panel-stat-value {
    margin-top: 16px;
    font-size: 30px;
    line-height: 1;
    font-weight: 700;
    color: var(--panel-text);
}

.panel-stat-label {
    margin-top: 8px;
    color: var(--panel-muted);
    font-size: 13px;
}

.panel-action-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.panel-action {
    display: flex;
    gap: 14px;
    align-items: center;
    min-height: 84px;
    padding: 18px;
    border-radius: 8px;
    border: 1px solid var(--panel-border);
    background: rgba(17, 24, 39, .86);
    color: var(--panel-text);
}

.panel-action:hover {
    border-color: rgba(56, 189, 248, .45);
    color: #fff;
}

.panel-action i {
    color: var(--panel-primary);
}

@media (max-width: 1199px) {
    .panel-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .panel-hero,
    .panel-action-grid,
    .panel-stat-grid {
        grid-template-columns: 1fr;
    }

    .panel-hero {
        padding: 18px;
    }
}