/* ===== Warna brand (ubah di sini saja) ===== */
:root {
    --ardaka-blue: #1a56db;
    --ardaka-blue-dark: #1e429f;
    --ardaka-blue-soft: #dbe8ff;
    --ardaka-blue-rgb: 26, 86, 219;
}

/* ===== Variabel Bootstrap ===== */
:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --bs-primary: var(--ardaka-blue);
    --bs-primary-rgb: var(--ardaka-blue-rgb);
    --bs-link-color: var(--ardaka-blue);
    --bs-link-color-rgb: var(--ardaka-blue-rgb);
    --bs-link-hover-color: var(--ardaka-blue-dark);
}

/* ===== Tombol ===== */
.btn-primary {
    --bs-btn-bg: var(--ardaka-blue);
    --bs-btn-border-color: var(--ardaka-blue);
    --bs-btn-hover-bg: var(--ardaka-blue-dark);
    --bs-btn-hover-border-color: var(--ardaka-blue-dark);
    --bs-btn-active-bg: var(--ardaka-blue-dark);
    --bs-btn-active-border-color: var(--ardaka-blue-dark);
    --bs-btn-disabled-bg: var(--ardaka-blue);
    --bs-btn-disabled-border-color: var(--ardaka-blue);
    --bs-btn-focus-shadow-rgb: var(--ardaka-blue-rgb);
}

.btn-outline-primary {
    --bs-btn-color: var(--ardaka-blue);
    --bs-btn-border-color: var(--ardaka-blue);
    --bs-btn-hover-bg: var(--ardaka-blue);
    --bs-btn-hover-border-color: var(--ardaka-blue);
    --bs-btn-active-bg: var(--ardaka-blue);
    --bs-btn-active-border-color: var(--ardaka-blue);
    --bs-btn-disabled-color: var(--ardaka-blue);
    --bs-btn-disabled-border-color: var(--ardaka-blue);
}

/* ===== Form ===== */
.form-control:focus,
.form-select:focus {
    border-color: var(--ardaka-blue);
    box-shadow: 0 0 0 0.2rem rgba(var(--ardaka-blue-rgb), 0.15);
}

.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--ardaka-blue);
    border-color: var(--ardaka-blue);
}

/* ===== Pagination, dropdown, nav, progress, list ===== */
.pagination {
    --bs-pagination-color: var(--ardaka-blue);
    --bs-pagination-hover-color: var(--ardaka-blue-dark);
    --bs-pagination-active-bg: var(--ardaka-blue);
    --bs-pagination-active-border-color: var(--ardaka-blue);
}

.dropdown-menu {
    --bs-dropdown-link-active-bg: var(--ardaka-blue);
}
.nav-pills {
    --bs-nav-pills-link-active-bg: var(--ardaka-blue);
}
.progress {
    --bs-progress-bar-bg: var(--ardaka-blue);
}
.list-group {
    --bs-list-group-active-bg: var(--ardaka-blue);
    --bs-list-group-active-border-color: var(--ardaka-blue);
}

/* ===== Sidebar Mazer ===== */
.sidebar-wrapper .menu .sidebar-item.active > .sidebar-link {
    background-color: var(--ardaka-blue);
}

.sidebar-wrapper .menu .submenu .submenu-item.active > a,
.sidebar-wrapper .menu .submenu .submenu-item a:hover {
    color: var(--ardaka-blue);
}

/* ===== Dark mode: warna brand ===== */
html[data-bs-theme="dark"] {
    --bs-primary: var(--ardaka-blue);
    --bs-primary-rgb: var(--ardaka-blue-rgb);
    --bs-link-color: #6d9bff;
    --bs-link-hover-color: #9bbcff;
}

html[data-bs-theme="dark"] .btn-primary {
    --bs-btn-bg: var(--ardaka-blue);
    --bs-btn-border-color: var(--ardaka-blue);
    --bs-btn-hover-bg: var(--ardaka-blue-dark);
    --bs-btn-hover-border-color: var(--ardaka-blue-dark);
    --bs-btn-active-bg: var(--ardaka-blue-dark);
    --bs-btn-active-border-color: var(--ardaka-blue-dark);
    --bs-btn-disabled-bg: var(--ardaka-blue);
    --bs-btn-disabled-border-color: var(--ardaka-blue);
    background-color: var(--ardaka-blue);
    border-color: var(--ardaka-blue);
}

html[data-bs-theme="dark"] .btn-primary:hover,
html[data-bs-theme="dark"] .btn-primary:active {
    background-color: var(--ardaka-blue-dark);
    border-color: var(--ardaka-blue-dark);
}

html[data-bs-theme="dark"] .btn-outline-primary {
    --bs-btn-color: #6d9bff;
    --bs-btn-border-color: var(--ardaka-blue);
    --bs-btn-hover-bg: var(--ardaka-blue);
    --bs-btn-hover-border-color: var(--ardaka-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--ardaka-blue);
    --bs-btn-active-border-color: var(--ardaka-blue);
}

html[data-bs-theme="dark"] .form-control:focus,
html[data-bs-theme="dark"] .form-select:focus {
    border-color: var(--ardaka-blue);
    box-shadow: 0 0 0 0.2rem rgba(var(--ardaka-blue-rgb), 0.35);
}

html[data-bs-theme="dark"] .form-check-input:checked {
    background-color: var(--ardaka-blue);
    border-color: var(--ardaka-blue);
}

html[data-bs-theme="dark"] .pagination {
    --bs-pagination-color: #6d9bff;
    --bs-pagination-hover-color: #9bbcff;
    --bs-pagination-active-bg: var(--ardaka-blue);
    --bs-pagination-active-border-color: var(--ardaka-blue);
}

html[data-bs-theme="dark"]
    .sidebar-wrapper
    .menu
    .sidebar-item.active
    > .sidebar-link {
    background-color: var(--ardaka-blue);
}

html[data-bs-theme="dark"]
    .sidebar-wrapper
    .menu
    .submenu
    .submenu-item.active
    > a,
html[data-bs-theme="dark"]
    .sidebar-wrapper
    .menu
    .submenu
    .submenu-item
    a:hover {
    color: #6d9bff;
}

html[data-bs-theme="dark"] .text-primary {
    color: #6d9bff !important;
}

/* ===== Sidebar: ringkas & profesional ===== */
/* ===== SIDEBAR: spasi & tampilan ===== */
#sidebar .sidebar-wrapper {
    display: flex;
    flex-direction: column;
    scrollbar-width: thin;
    scrollbar-color: rgba(var(--ardaka-blue-rgb), 0.35) transparent;
}

#sidebar .sidebar-wrapper::-webkit-scrollbar {
    width: 6px;
}
#sidebar .sidebar-wrapper::-webkit-scrollbar-thumb {
    background: rgba(var(--ardaka-blue-rgb), 0.3);
    border-radius: 3px;
}

/* Header */
#sidebar .sidebar-wrapper .sidebar-header {
    padding: 0.9rem 1.1rem 0.5rem !important;
}

#sidebar .sidebar-wrapper .sidebar-header .logo img {
    height: 34px;
    width: auto;
}

/* Area menu */
#sidebar .sidebar-wrapper .sidebar-menu {
    flex: 1 1 auto;
    margin-top: 0.25rem !important;
    padding: 0 0.75rem !important;
}

#sidebar .sidebar-wrapper .menu {
    margin: 0 !important;
    padding: 0 !important;
}

/* Judul section */
#sidebar .sidebar-wrapper .menu .sidebar-title {
    margin: 1rem 0 0.35rem !important;
    padding: 0 0.75rem !important;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #8a97b1;
}

#sidebar .sidebar-wrapper .menu .sidebar-title:first-child {
    margin-top: 0.25rem !important;
}

/* Item menu */
#sidebar .sidebar-wrapper .menu .sidebar-item {
    margin-top: 2px !important;
}

#sidebar .sidebar-wrapper .menu .sidebar-link {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.875rem;
    border-radius: 0.5rem;
}

#sidebar .sidebar-wrapper .menu .sidebar-item.has-sub > .sidebar-link {
    padding-right: 2rem !important;
}

#sidebar .sidebar-wrapper .menu .sidebar-link i {
    display: inline-flex;
    justify-content: center;
    width: 1.25rem;
    font-size: 1.05rem;
    line-height: 1;
}

#sidebar
    .sidebar-wrapper
    .menu
    .sidebar-item:not(.active)
    > .sidebar-link:hover {
    background: rgba(var(--ardaka-blue-rgb), 0.08);
    color: var(--ardaka-blue);
}

#sidebar .sidebar-wrapper .menu .sidebar-item.active > .sidebar-link {
    color: #fff;
    background-color: var(--ardaka-blue);
    box-shadow: 0 2px 6px rgba(var(--ardaka-blue-rgb), 0.25);
}

/* Submenu */
#sidebar .sidebar-wrapper .menu .submenu {
    margin: 2px 0 4px 1.15rem !important;
    padding: 0 0 0 1.75rem !important;
    border-left: 1px solid rgba(var(--ardaka-blue-rgb), 0.2);
    background: transparent;
}

#sidebar .sidebar-wrapper .menu .submenu .submenu-item a {
    padding: 0.4rem 0.75rem !important;
    font-size: 0.85rem;
    border-radius: 0.4rem;
}

#sidebar .sidebar-wrapper .menu .submenu .submenu-item.active > a {
    font-weight: 600;
    color: var(--ardaka-blue);
    background: rgba(var(--ardaka-blue-rgb), 0.08);
}

/* Footer (toggle tema) */
#sidebar .sidebar-wrapper .sidebar-footer {
    position: sticky;
    bottom: 0;
    margin-top: auto;
    padding: 0.75rem 1.25rem !important;
    background-color: inherit;
    border-top: 1px solid rgba(138, 151, 177, 0.2);
    color: #6b7a99;
}

/* ===== Sidebar: dark mode ===== */
html[data-bs-theme="dark"] #sidebar .sidebar-wrapper .menu .sidebar-title {
    color: #7d8ba8;
}

html[data-bs-theme="dark"] #sidebar .sidebar-wrapper .menu .sidebar-link {
    color: #c5cde0;
}

html[data-bs-theme="dark"]
    #sidebar
    .sidebar-wrapper
    .menu
    .sidebar-item:not(.active)
    > .sidebar-link:hover {
    color: #6d9bff;
    background: rgba(var(--ardaka-blue-rgb), 0.18);
}

html[data-bs-theme="dark"]
    #sidebar
    .sidebar-wrapper
    .menu
    .sidebar-item.active
    > .sidebar-link {
    color: #fff;
    background-color: var(--ardaka-blue);
}

html[data-bs-theme="dark"] #sidebar .sidebar-wrapper .menu .submenu {
    background: transparent;
    border-left-color: rgba(109, 155, 255, 0.25);
}

html[data-bs-theme="dark"]
    #sidebar
    .sidebar-wrapper
    .menu
    .submenu
    .submenu-item
    a {
    color: #aab4cc;
}

html[data-bs-theme="dark"]
    #sidebar
    .sidebar-wrapper
    .menu
    .submenu
    .submenu-item
    a:hover {
    color: #6d9bff;
}

html[data-bs-theme="dark"]
    #sidebar
    .sidebar-wrapper
    .menu
    .submenu
    .submenu-item.active
    > a {
    color: #6d9bff;
    background: rgba(var(--ardaka-blue-rgb), 0.18);
}

html[data-bs-theme="dark"] #sidebar .sidebar-wrapper .sidebar-footer {
    color: #9aa7c2;
    border-top-color: rgba(125, 139, 168, 0.25);
}

/* Logo mengikuti tema */
.brand-logo-dark {
    display: none;
}

html[data-bs-theme="dark"] .brand-logo-light {
    display: none;
}

html[data-bs-theme="dark"] .brand-logo-dark {
    display: inline-block;
}

/* ===== HEADER ===== */
#main header .app-navbar {
    padding: 0.5rem 1.25rem !important;
    background-color: var(--bs-body-bg);
    border-bottom: 1px solid rgba(138, 151, 177, 0.2);
}

#main header .burger-btn {
    color: #6b7a99;
    line-height: 1;
}

#main header .burger-btn:hover {
    color: var(--ardaka-blue);
}

#main header .header-institution {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--ardaka-blue);
}

/* Tombol pengguna */
#main header .user-trigger {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.3rem 0.5rem;
    background: transparent;
    border: 0;
    border-radius: 0.6rem;
    color: inherit;
}

#main header .user-trigger:hover,
#main header .user-trigger.show {
    background: rgba(var(--ardaka-blue-rgb), 0.08);
}

#main header .user-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ardaka-blue);
    background: rgba(var(--ardaka-blue-rgb), 0.12);
}

#main header .user-name {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25;
}

#main header .user-role {
    display: block;
    font-size: 0.75rem;
    line-height: 1.25;
    color: #8a97b1;
}

/* Dropdown */
#main header .user-dropdown {
    min-width: 15rem;
    padding: 0.5rem;
    border: 1px solid rgba(138, 151, 177, 0.2);
    border-radius: 0.75rem;
    box-shadow: 0 10px 30px rgba(var(--ardaka-blue-rgb), 0.12);
}

#main header .user-dropdown-header {
    padding: 0.5rem 0.75rem;
}

#main header .user-dropdown .dropdown-divider {
    margin: 0.35rem 0;
}

#main header .user-dropdown .dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    font-size: 0.875rem;
}

#main header .user-dropdown .dropdown-item i {
    top: 0;
    font-size: 1rem;
    line-height: 1;
}

#main header .user-dropdown .dropdown-item:hover {
    color: var(--ardaka-blue);
    background: rgba(var(--ardaka-blue-rgb), 0.08);
}

#main header .user-dropdown .dropdown-item.text-danger:hover {
    background: rgba(220, 53, 69, 0.08);
}

/* ===== HEADER: dark mode ===== */
html[data-bs-theme="dark"] #main header .app-navbar {
    border-bottom-color: rgba(125, 139, 168, 0.25);
}

html[data-bs-theme="dark"] #main header .header-institution {
    color: #6d9bff;
}

html[data-bs-theme="dark"] #main header .burger-btn {
    color: #aab4cc;
}

html[data-bs-theme="dark"] #main header .user-avatar {
    color: #6d9bff;
    background: rgba(var(--ardaka-blue-rgb), 0.25);
}

html[data-bs-theme="dark"] #main header .user-trigger:hover,
html[data-bs-theme="dark"] #main header .user-trigger.show {
    background: rgba(var(--ardaka-blue-rgb), 0.18);
}

html[data-bs-theme="dark"] #main header .user-role {
    color: #7d8ba8;
}

html[data-bs-theme="dark"] #main header .user-dropdown {
    border-color: rgba(125, 139, 168, 0.25);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

html[data-bs-theme="dark"] #main header .user-dropdown .dropdown-item:hover {
    color: #6d9bff;
    background: rgba(var(--ardaka-blue-rgb), 0.18);
}

/* ===== DASHBOARD ===== */
#main-content .dash-stat .card-body {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 1.1rem 1.25rem;
}

#main-content .dash-stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: 0.5rem;
    border-radius: 0.65rem;
    font-size: 1.15rem;
}

#main-content .dash-stat-icon i {
    line-height: 1;
}

#main-content .dash-stat-icon.tone-primary {
    color: var(--ardaka-blue);
    background: rgba(var(--ardaka-blue-rgb), 0.12);
}
#main-content .dash-stat-icon.tone-success {
    color: var(--bs-success);
    background: rgba(var(--bs-success-rgb), 0.12);
}
#main-content .dash-stat-icon.tone-warning {
    color: var(--bs-warning);
    background: rgba(var(--bs-warning-rgb), 0.15);
}
#main-content .dash-stat-icon.tone-info {
    color: var(--bs-info);
    background: rgba(var(--bs-info-rgb), 0.15);
}

#main-content .dash-stat-label {
    font-size: 0.8rem;
    color: #8a97b1;
}

#main-content .dash-stat-value {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.1;
}

#main-content .dash-stat-hint {
    font-size: 0.75rem;
    color: #8a97b1;
}

#main-content .user-avatar-lg {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    font-weight: 600;
    color: var(--ardaka-blue);
    background: rgba(var(--ardaka-blue-rgb), 0.12);
}

#main-content .dash-quick {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

#main-content .dash-quick a {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.5rem 0.65rem;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    color: inherit;
    text-decoration: none;
}

#main-content .dash-quick a:hover {
    color: var(--ardaka-blue);
    background: rgba(var(--ardaka-blue-rgb), 0.08);
}

#main-content .dash-quick i {
    width: 1.25rem;
    font-size: 1.05rem;
    line-height: 1;
    text-align: center;
}

/* Dark mode */
html[data-bs-theme="dark"] #main-content .dash-stat-icon.tone-primary,
html[data-bs-theme="dark"] #main-content .user-avatar-lg {
    color: #6d9bff;
    background: rgba(var(--ardaka-blue-rgb), 0.25);
}

html[data-bs-theme="dark"] #main-content .dash-stat-label,
html[data-bs-theme="dark"] #main-content .dash-stat-hint {
    color: #7d8ba8;
}

html[data-bs-theme="dark"] #main-content .dash-quick a:hover {
    color: #6d9bff;
    background: rgba(var(--ardaka-blue-rgb), 0.18);
}