:root {
    --fh-bo-navy: #102f5e;
    --fh-bo-deep: #071f3f;
    --fh-bo-blue: #0c65b4;
    --fh-bo-blue-dark: #074f90;
    --fh-bo-cyan: #12a9d6;
    --fh-bo-sky: #eaf7fc;
    --fh-bo-soft: #f3f8fc;
    --fh-bo-line: rgba(16, 47, 94, 0.1);
    --fh-bo-shadow: 0 16px 38px rgba(16, 47, 94, 0.08);
    --bs-primary: var(--fh-bo-blue);
    --bs-primary-active: var(--fh-bo-blue-dark);
    --bs-primary-light: #e8f4fb;
    --bs-primary-inverse: #ffffff;
    --bs-primary-rgb: 12, 101, 180;
    --bs-success: var(--fh-bo-cyan);
    --bs-success-active: #0787ad;
    --bs-success-light: #e8f8fc;
    --bs-success-inverse: #ffffff;
    --bs-success-rgb: 18, 169, 214;
}

body.app-default,
.app-root,
.app-page {
    background:
        linear-gradient(180deg, rgba(234, 247, 252, 0.7), rgba(243, 248, 252, 0.92) 280px),
        var(--fh-bo-soft);
}

.app-header {
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid var(--fh-bo-line);
    box-shadow: 0 12px 30px rgba(16, 47, 94, 0.06);
    backdrop-filter: blur(18px);
}

.app-sidebar,
.app-sidebar-logo {
    background:
        linear-gradient(180deg, #102f5e 0%, #0b3e79 52%, #071f3f 100%) !important;
}

.app-sidebar-logo {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.app-sidebar-logo img {
    max-width: 174px;
    object-fit: contain;
}

.app-sidebar .menu-heading {
    color: rgba(18, 169, 214, 0.92) !important;
    letter-spacing: 0.12em;
}

.app-sidebar .menu-title,
.app-sidebar .menu-link .menu-icon i,
.app-sidebar .menu-arrow::after {
    color: rgba(255, 255, 255, 0.72) !important;
}

.app-sidebar .menu-link:hover,
.app-sidebar .menu-link.active,
.app-sidebar .menu-link.here,
.app-sidebar .menu-accordion.hover > .menu-link,
.app-sidebar .menu-accordion.show > .menu-link {
    background: rgba(18, 169, 214, 0.15) !important;
    box-shadow: inset 3px 0 0 var(--fh-bo-cyan);
}

.app-sidebar .menu-link:hover .menu-title,
.app-sidebar .menu-link.active .menu-title,
.app-sidebar .menu-link.here .menu-title,
.app-sidebar .menu-accordion.show > .menu-link .menu-title,
.app-sidebar .menu-link:hover .menu-icon i,
.app-sidebar .menu-link.active .menu-icon i,
.app-sidebar .menu-link.here .menu-icon i,
.app-sidebar .menu-accordion.show > .menu-link .menu-icon i {
    color: #ffffff !important;
}

.app-sidebar .menu-sub .menu-link.active,
.app-sidebar .menu-sub .menu-link:hover {
    background: rgba(255, 255, 255, 0.09) !important;
    box-shadow: none;
}

.app-sidebar-toggle {
    background: var(--fh-bo-cyan) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 24px rgba(18, 169, 214, 0.24);
}

.page-heading,
.card-title,
.card-label {
    color: var(--fh-bo-navy) !important;
}

.card {
    border: 1px solid var(--fh-bo-line);
    border-radius: 16px;
    box-shadow: var(--fh-bo-shadow) !important;
}

.card-header {
    border-bottom-color: var(--fh-bo-line);
}

.breadcrumb .text-muted,
.text-muted {
    color: #667085 !important;
}

a,
.text-hover-primary:hover,
.text-primary,
.btn-active-color-primary:hover,
.btn-active-color-primary.active,
.menu-state-color .menu-link.active {
    color: var(--fh-bo-blue) !important;
}

.btn.btn-primary,
.btn.btn-success,
.btn.btn-light-primary:hover,
.btn.btn-light-success:hover,
.btn.btn-active-primary.active,
.btn-check:checked + .btn.btn-active-primary {
    background: linear-gradient(135deg, var(--fh-bo-blue), var(--fh-bo-cyan)) !important;
    border-color: var(--fh-bo-blue) !important;
    color: #ffffff !important;
}

.btn.btn-light-primary,
.btn.btn-light-success {
    background: rgba(12, 101, 180, 0.1) !important;
    color: var(--fh-bo-blue) !important;
    border-color: rgba(12, 101, 180, 0.16) !important;
}

.badge-light-primary,
.badge-light-success,
.badge-secondary {
    background: rgba(18, 169, 214, 0.14) !important;
    color: var(--fh-bo-blue-dark) !important;
}

.badge-light-info {
    background: rgba(16, 47, 94, 0.08) !important;
    color: var(--fh-bo-navy) !important;
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(18, 169, 214, 0.72) !important;
    box-shadow: 0 0 0 0.2rem rgba(18, 169, 214, 0.16) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.pagination .page-item.active .page-link {
    background: var(--fh-bo-blue) !important;
    border-color: var(--fh-bo-blue) !important;
    color: #ffffff !important;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: rgba(12, 101, 180, 0.025);
}

.scrolltop {
    background: var(--fh-bo-blue) !important;
}

.auth-wrap {
    background: var(--fh-bo-deep) !important;
}