:root {
    --projecthub-navy: #101b33;
    --projecthub-navy-light: #172746;
    --projecthub-orange: #ff6534;
    --projecthub-orange-dark: #d64b21;
    --projecthub-paper: #f6f4ed;
    --projecthub-white: #fffef9;
    --projecthub-ink: #12182a;
    --projecthub-muted: #6f7180;
    --projecthub-line: #d8d4c9;
    --vz-primary: #ff6534;
    --vz-primary-rgb: 255, 101, 52;
    --vz-link-color: #d64b21;
    --vz-link-hover-color: #101b33;
    --vz-body-bg: #f6f4ed;
    --vz-body-color: #12182a;
    --vz-heading-color: #12182a;
    --vz-border-color: #d8d4c9;
}

html,
body {
    background: var(--projecthub-paper);
    color: var(--projecthub-ink);
    font-family: "DM Sans", Arial, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.navbar-brand-box {
    color: var(--projecthub-ink);
    font-family: "Space Grotesk", Arial, sans-serif;
    letter-spacing: -0.025em;
}

a {
    color: var(--projecthub-orange-dark);
}

a:hover {
    color: var(--projecthub-navy);
}

.page-content,
.main-content,
.footer {
    background: var(--projecthub-paper);
}

#page-topbar {
    border: 0;
    border-bottom: 4px solid var(--projecthub-orange);
    background: var(--projecthub-navy) !important;
    box-shadow: 0 10px 28px -22px rgba(16, 27, 51, 0.95);
    backdrop-filter: none;
}

#page-topbar .navbar-header .header-item,
#page-topbar .navbar-header .btn-topbar,
#page-topbar .navbar-header .user-name-text,
#page-topbar #topnav-hamburger-icon {
    color: #fff !important;
}

#page-topbar .navbar-header .user-name-sub-text {
    color: rgba(255, 255, 255, 0.7) !important;
}

#page-topbar .hamburger-icon span {
    background-color: #fff !important;
}

#page-topbar .topbar-user {
    background: var(--projecthub-navy-light) !important;
}

#page-topbar #page-header-user-dropdown {
    color: #fff !important;
}

#page-topbar .navbar-header .btn-topbar:hover,
#page-topbar .navbar-header .btn-topbar:focus,
#page-topbar .navbar-header .topbar-user .btn:hover,
#page-topbar .navbar-header .topbar-user .btn:focus {
    background: rgba(255, 101, 52, 0.2);
    color: #fff !important;
}

#page-topbar .horizontal-logo .logo-dark {
    display: none !important;
}

#page-topbar .horizontal-logo .logo-light {
    display: inline-block !important;
}

.app-menu.navbar-menu {
    border-right: 0;
    background: var(--projecthub-navy);
    box-shadow: 8px 0 28px -24px rgba(16, 27, 51, 0.9);
}

.app-menu .navbar-brand-box {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    background: var(--projecthub-navy);
}

.app-menu .logo-dark {
    display: none !important;
}

.app-menu .logo-light {
    display: inline-block !important;
}

.app-menu .menu-title,
.app-menu .menu-title span {
    color: #8797b5 !important;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.app-menu .navbar-nav .nav-link {
    border-radius: 0.35rem;
    color: #aeb9cf;
}

.app-menu .navbar-nav .nav-link i {
    color: #8797b5;
}

.app-menu .navbar-nav .nav-link:hover,
.app-menu .navbar-nav .nav-link:focus {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}

.app-menu .navbar-nav .nav-link:hover i,
.app-menu .navbar-nav .nav-link:focus i {
    color: #ff8e68;
}

.app-menu .navbar-nav .nav-link.active,
.app-menu .navbar-nav .show > .nav-link,
.app-menu .navbar-nav .nav-link[aria-expanded="true"] {
    background: rgba(255, 101, 52, 0.14);
    color: #fff;
}

.app-menu .navbar-nav .nav-link.active i,
.app-menu .navbar-nav .show > .nav-link i,
.app-menu .navbar-nav .nav-link[aria-expanded="true"] i {
    color: var(--projecthub-orange);
}

.app-menu .menu-dropdown .nav-link {
    color: #8797b5;
}

.app-menu .menu-dropdown .nav-link.active {
    background: transparent;
    color: #ff8e68;
}

.app-menu .hamburger-icon span,
.app-menu .btn-vertical-sm-hover {
    color: #aeb9cf;
}

.card,
.modal-content,
.dropdown-menu,
.offcanvas,
.list-group-item {
    border-color: var(--projecthub-line);
    background-color: var(--projecthub-white);
}

.card {
    border-radius: 0.65rem;
    box-shadow: none;
}

.card-header,
.card-footer {
    border-color: var(--projecthub-line);
    background: transparent;
}

.card-title {
    color: var(--projecthub-ink);
}

.shadow,
.shadow-sm,
.shadow-lg {
    box-shadow: 0 16px 40px -32px rgba(16, 27, 51, 0.7) !important;
}

.btn {
    border-radius: 0.35rem;
    font-weight: 700;
}

.btn-primary,
.btn-soft-primary {
    border-color: var(--projecthub-orange) !important;
    background: var(--projecthub-orange) !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-soft-primary:hover,
.btn-soft-primary:focus {
    border-color: var(--projecthub-navy) !important;
    background: var(--projecthub-navy) !important;
    color: #fff !important;
}

.btn-outline-primary {
    border-color: var(--projecthub-navy);
    color: var(--projecthub-navy);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    border-color: var(--projecthub-navy);
    background: var(--projecthub-navy);
    color: #fff;
}

.btn-link {
    color: var(--projecthub-orange-dark);
}

.text-primary {
    color: var(--projecthub-orange-dark) !important;
}

.bg-primary,
.badge.bg-primary {
    background-color: var(--projecthub-orange) !important;
}

.bg-primary-subtle,
.bg-soft-primary {
    background-color: rgba(255, 101, 52, 0.12) !important;
}

.border-primary {
    border-color: var(--projecthub-orange) !important;
}

.form-control,
.form-select,
.input-group-text,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border-color: var(--projecthub-line);
    border-radius: 0.35rem;
    background-color: var(--projecthub-white);
    color: var(--projecthub-ink);
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: var(--projecthub-orange);
    box-shadow: 0 0 0 0.2rem rgba(255, 101, 52, 0.12);
}

.form-check-input:checked {
    border-color: var(--projecthub-orange);
    background-color: var(--projecthub-orange);
}

.form-label,
label {
    color: var(--projecthub-ink);
}

.table {
    --vz-table-color: var(--projecthub-ink);
    --vz-table-border-color: var(--projecthub-line);
}

.table > thead {
    background: #ebe8df;
}

.table > thead th {
    color: #4f5361;
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.table-hover > tbody > tr:hover > * {
    --vz-table-accent-bg: rgba(255, 101, 52, 0.055);
}

.nav-tabs {
    border-color: var(--projecthub-line);
}

.nav-tabs .nav-link {
    color: var(--projecthub-muted);
}

.nav-tabs .nav-link.active,
.nav-pills .nav-link.active {
    border-color: var(--projecthub-orange);
    background: var(--projecthub-orange);
    color: #fff;
}

.pagination .page-link {
    border-color: var(--projecthub-line);
    color: var(--projecthub-navy);
}

.pagination .page-item.active .page-link {
    border-color: var(--projecthub-orange);
    background: var(--projecthub-orange);
    color: #fff;
}

.alert-primary {
    border-color: rgba(255, 101, 52, 0.32);
    background: #fff0e9;
    color: var(--projecthub-ink);
}

.progress-bar {
    background-color: var(--projecthub-orange);
}

.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item.active {
    background: rgba(255, 101, 52, 0.1);
    color: var(--projecthub-ink);
}

.page-title-box,
.page-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 0;
    border-radius: 0.75rem;
    background: var(--projecthub-navy) !important;
    color: #fff;
    padding: 2.5rem !important;
    margin: 0 0 2.25rem !important;
    box-shadow: 10px 10px 0 var(--projecthub-orange) !important;
}

.page-title-box::after,
.page-hero::after {
    content: "P" !important;
    position: absolute !important;
    right: -1.5rem !important;
    bottom: -8.75rem !important;
    inset: auto -1.5rem -8.75rem auto !important;
    z-index: -1 !important;
    color: var(--projecthub-navy-light) !important;
    background: none !important;
    font: 700 25rem/1 "Space Grotesk", Arial, sans-serif !important;
    opacity: 1 !important;
    pointer-events: none;
}

.page-title-box > *,
.page-hero > * {
    position: relative;
    z-index: 1;
}

.page-title-box h1,
.page-title-box h2,
.page-title-box h3,
.page-title-box h4,
.page-title-box h5,
.page-title-box h6,
.page-hero h1,
.page-hero h2,
.page-hero h3,
.page-hero h4,
.page-hero h5,
.page-hero h6 {
    color: #fff !important;
}

.page-title-box h4 {
    font-size: clamp(1.65rem, 3vw, 2.35rem) !important;
    font-weight: 700 !important;
    letter-spacing: -0.035em;
    text-transform: none !important;
}

.page-title-box p,
.page-hero p,
.page-title-box .text-muted,
.page-title-box .text-dark,
.page-title-box .text-body,
.page-hero .text-muted,
.page-hero .text-dark,
.page-hero .text-body {
    color: rgba(255, 255, 255, 0.82) !important;
}

.page-title-box .breadcrumb,
.page-title-box .breadcrumb-item,
.page-title-box .breadcrumb-item.active,
.page-title-box .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.76) !important;
}

.page-title-box .breadcrumb-item a,
.page-hero-subtitle {
    color: #ff9a78 !important;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.page-title-box .breadcrumb-item a:hover {
    color: #fff !important;
}

.footer {
    border-top: 1px solid var(--projecthub-line);
    color: var(--projecthub-muted);
}

@media (max-width: 767.98px) {
    .app-menu.navbar-menu {
        box-shadow: none;
    }

    .page-title-box,
    .page-hero {
        padding: 1.75rem 1.5rem !important;
        box-shadow: 6px 6px 0 var(--projecthub-orange) !important;
    }

    .page-title-box .page-title-right {
        margin-top: 0.75rem;
    }
}

@media print {
    body,
    .page-content,
    .main-content {
        background: #fff !important;
    }
}
