:root {
    --orca-bg: #0a0c10;
    --orca-surface: #111318;
    --orca-elevated: #1a1d24;
    --orca-text: #f5f6f8;
    --orca-muted: #9aa1ac;
    --orca-primary: #2f6fff;
    --orca-primary-hover: #5b8cff;
    --orca-white: #ffffff;
    --orca-black: #0a0c10;
    --bs-primary: #2f6fff;
    --bs-primary-rgb: 47, 111, 255;
}

html.dark-layout {
    --bs-primary: #2f6fff;
    --bs-primary-rgb: 47, 111, 255;
}

/* Brand */
.brand-text,
.text-primary,
a.text-primary,
.main-menu .navbar-header .navbar-brand .brand-text {
    color: var(--orca-primary) !important;
}

html.dark-layout .brand-text,
html.dark-layout .text-primary,
html.dark-layout a.text-primary,
html.dark-layout .main-menu .navbar-header .navbar-brand .brand-text {
    color: var(--orca-text) !important;
}

html.dark-layout a.text-primary,
html.dark-layout .text-primary {
    color: var(--orca-primary-hover) !important;
}

.brand-logo img {
    background: transparent !important;
    border-radius: 0 !important;
    object-fit: contain;
}

.main-menu .navbar-header .navbar-brand .brand-logo img {
    max-width: 42px;
    height: auto;
}

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

html.dark-layout .logo-on-light,
body.blank-page .logo-on-light {
    display: none !important;
}

html.dark-layout .logo-on-dark,
body.blank-page .logo-on-dark {
    display: inline-block !important;
}

/* Buttons */
.btn-primary {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
    color: var(--orca-white) !important;
    box-shadow: 0 8px 24px #2f6fff40 !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.show > .btn-primary.dropdown-toggle {
    background-color: var(--orca-primary-hover) !important;
    border-color: var(--orca-primary-hover) !important;
    color: var(--orca-white) !important;
    box-shadow: 0 8px 24px #2f6fff73 !important;
}

html.dark-layout .btn-primary {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
    color: var(--orca-white) !important;
}

html.dark-layout .btn-primary:hover,
html.dark-layout .btn-primary:focus,
html.dark-layout .btn-primary:active {
    background-color: var(--orca-primary-hover) !important;
    border-color: var(--orca-primary-hover) !important;
    color: var(--orca-white) !important;
}

/* Form focus */
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: var(--orca-primary) !important;
    box-shadow: 0 0 0 0.2rem #2f6fff33 !important;
}

.form-check-input:checked {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
}

html.dark-layout .form-control:focus,
html.dark-layout .form-select:focus {
    border-color: var(--orca-primary) !important;
    box-shadow: 0 0 0 0.2rem #2f6fff47 !important;
}

html.dark-layout .form-check-input:checked {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
}

/* Auth / login */
body.blank-page {
    background-color: var(--orca-bg) !important;
    color: var(--orca-text);
}

body.blank-page .header-navbar {
    background-color: var(--orca-bg) !important;
    box-shadow: none !important;
}

body.blank-page .header-navbar .nav-link,
body.blank-page .header-navbar .selected-language {
    color: var(--orca-text) !important;
}

body.blank-page .auth-wrapper.auth-basic .auth-inner:before,
body.blank-page .auth-wrapper.auth-basic .auth-inner:after {
    display: none;
}

body.blank-page .auth-inner .card {
    background: var(--orca-surface);
    color: var(--orca-text);
    border: 1px solid #1a1d2494;
    box-shadow: 0 16px 40px rgba(10, 12, 16, 0.55);
}

body.blank-page .auth-inner .card-title,
body.blank-page .auth-inner .form-label,
body.blank-page .auth-inner .form-check-label {
    color: var(--orca-text) !important;
}

body.blank-page .auth-inner a {
    color: var(--orca-primary-hover) !important;
}

body.blank-page .auth-inner .form-control,
body.blank-page .auth-inner .form-control-merge,
body.blank-page .auth-inner .input-group-text {
    background-color: var(--orca-elevated) !important;
    border-color: #1a1d24 !important;
    color: var(--orca-text) !important;
}

body.blank-page .auth-inner .brand-logo {
    gap: 0.75rem;
}

body.blank-page .auth-inner .brand-logo img {
    width: 72px;
    max-width: 72px;
    height: auto;
}

body.blank-page .auth-inner .brand-text {
    color: var(--orca-text) !important;
}

body.blank-page .dropdown-menu {
    background: var(--orca-surface);
    border-color: var(--orca-elevated);
}

body.blank-page .dropdown-menu .dropdown-item {
    color: var(--orca-text);
}

body.blank-page .dropdown-menu .dropdown-item:hover {
    background: var(--orca-elevated);
    color: var(--orca-text);
}

/* Dashboard */
html.dark-layout,
html.dark-layout body,
body.dark-layout {
    background-color: var(--orca-bg) !important;
    color: var(--orca-text) !important;
}

html.dark-layout .main-menu,
html.dark-layout .main-menu-content .navigation-main {
    background-color: var(--orca-surface) !important;
    color: var(--orca-text);
}

html.dark-layout .header-navbar,
html.dark-layout .header-navbar.floating-nav {
    background-color: var(--orca-surface) !important;
    color: var(--orca-text);
    box-shadow: 0 4px 24px rgba(10, 12, 16, 0.45) !important;
}

html.dark-layout .footer,
html.dark-layout .card,
html.dark-layout .modal-content {
    background-color: var(--orca-surface) !important;
    color: var(--orca-text);
    border-color: var(--orca-elevated) !important;
}

html.dark-layout .content-wrapper,
html.dark-layout .app-content {
    background-color: var(--orca-bg) !important;
}

html.dark-layout a:hover {
    color: var(--orca-primary-hover) !important;
}

html.dark-layout .navigation .nav-item a {
    color: var(--orca-text) !important;
}

html.dark-layout .navigation .navigation-header {
    color: var(--orca-muted) !important;
}

html.dark-layout .navigation .nav-item.active > a,
html.dark-layout .navigation .nav-item.open > a,
html.dark-layout .main-menu-content .navigation-main .active > a,
html.dark-layout .main-menu-content .navigation-main li.active,
html.dark-layout .main-menu-content .navigation-main a.active {
    background: linear-gradient(118deg, #2f6fff, rgba(47, 111, 255, 0.75)) !important;
    color: #fff !important;
    box-shadow: 0 0 12px 1px rgba(47, 111, 255, 0.4) !important;
}

html.dark-layout .navigation .nav-item.open > a {
    background: var(--orca-elevated) !important;
    box-shadow: none !important;
    color: var(--orca-text) !important;
}

html.dark-layout .navigation .nav-item a:hover {
    background-color: #2f6fff14 !important;
}

html.dark-layout .form-control,
html.dark-layout .form-select {
    background-color: var(--orca-elevated) !important;
    border-color: #1a1d2494 !important;
    color: var(--orca-text) !important;
}

html.dark-layout .badge.bg-primary {
    background-color: var(--orca-primary) !important;
    color: var(--orca-white) !important;
}

html.dark-layout .table,
html.dark-layout .table td,
html.dark-layout .table th,
html.dark-layout .card-title,
html.dark-layout .card-header,
html.dark-layout .footer {
    color: var(--orca-text);
}

html.dark-layout .table thead th {
    background-color: var(--orca-elevated) !important;
    color: var(--orca-muted) !important;
    border-color: #1a1d24 !important;
}

html.dark-layout .table td {
    border-color: #1a1d24 !important;
}

html.dark-layout .pagination .page-item.active .page-link,
html.dark-layout .page-item.active .page-link {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
    color: var(--orca-white) !important;
}

/* Replace Vuexy purple with Orca-Tech blue in light + dark menus */
.main-menu.menu-light .navigation > li.active > a,
.main-menu.menu-dark .navigation > li.active > a,
.main-menu.menu-light .navigation > li ul .active,
.main-menu.menu-dark .navigation > li ul .active {
    background: linear-gradient(118deg, #2f6fff, rgba(47, 111, 255, 0.72)) !important;
    box-shadow: 0 0 12px 1px rgba(47, 111, 255, 0.45) !important;
    color: #fff !important;
}

.main-menu.menu-light .navigation > li ul .active > a,
.main-menu.menu-dark .navigation > li ul .active > a,
.main-menu.menu-light .navigation > li.active > a,
.main-menu.menu-dark .navigation > li.active > a {
    color: #fff !important;
}

.main-menu.menu-light .navigation > li .active > a {
    color: var(--orca-primary) !important;
}

.main-menu .navbar-header .navbar-brand .brand-text,
.main-menu .text-primary,
.main-menu .toggle-icon,
.main-menu .collapse-toggle-icon {
    color: var(--orca-primary) !important;
}

.badge.bg-primary {
    background-color: var(--orca-primary) !important;
    color: #fff !important;
}

.form-check-input:checked,
.form-switch .form-check-input:checked {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
}

.page-item.active .page-link,
.pagination .page-item.active .page-link {
    background-color: var(--orca-primary) !important;
    border-color: var(--orca-primary) !important;
    color: #fff !important;
}