/* Tema PT. Nirada Jaya Nastari - Merah, Hitam, Putih */
:root {
    --bs-primary: #c41e3a !important;
    --bs-primary-rgb: 196, 30, 58 !important;
    --njn-red: #c41e3a;
    --njn-red-dark: #9a1830;
    --njn-black: #1a1a1a;
    --njn-white: #ffffff;
    --njn-gray: #f5f5f5;
}

body {
    background-color: var(--njn-gray);
}

/* Sidebar scrollbar / hover safety override */
.layout-menu .menu-inner {
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.20) transparent;
}

.layout-menu .menu-inner::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.layout-menu .menu-inner::-webkit-scrollbar-track {
    background: transparent;
}

.layout-menu .menu-inner::-webkit-scrollbar-thumb {
    background-color: rgba(255,255,255,0.20);
    border-radius: 999px;
    border: 0;
}

.layout-menu .menu-inner::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255,255,255,0.20);
}

.layout-menu .menu-inner .ps__rail-y,
.layout-menu .menu-inner .ps__rail-x {
    background: transparent !important;
}

.layout-menu .menu-inner .ps__thumb-y,
.layout-menu .menu-inner .ps__thumb-x {
    background-color: rgba(255,255,255,0.20) !important;
    border-radius: 999px !important;
}

.layout-menu .menu-inner .ps__thumb-y:hover,
.layout-menu .menu-inner .ps__thumb-x:hover,
.layout-menu .menu-inner .ps__rail-y:hover .ps__thumb-y,
.layout-menu .menu-inner .ps__rail-x:hover .ps__thumb-x {
    background-color: rgba(255,255,255,0.20) !important;
}

/* Override the JS-generated menu inner shadow layer that creates a white/gradient effect under the logo while scrolling */
.menu-inner-shadow {
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: 0 !important;
    display: none !important;
}

.bg-menu-theme,
.layout-menu {
    background-color: var(--njn-black) !important;
}

.menu-inner .menu-item.active > .menu-link,
.menu-inner .menu-item.active > .menu-link:not(.menu-toggle) {
    background-color: rgba(196, 30, 58, 0.15) !important;
    color: var(--njn-red) !important;
}

.menu-inner .menu-link:hover {
    color: var(--njn-red) !important;
}

.menu-header-text {
    color: rgba(255, 255, 255, 0.5) !important;
}

.menu-inner .menu-link,
.app-brand-text {
    color: rgba(255, 255, 255, 0.85) !important;
}

.text-primary {
    color: var(--njn-red) !important;
}

.bg-primary,
.btn-primary {
    background-color: var(--njn-red) !important;
    border-color: var(--njn-red) !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--njn-red-dark) !important;
    border-color: var(--njn-red-dark) !important;
}

.btn-outline-primary {
    color: var(--njn-red) !important;
    border-color: var(--njn-red) !important;
}

.btn-outline-primary:hover {
    background-color: var(--njn-red) !important;
    border-color: var(--njn-red) !important;
    color: var(--njn-white) !important;
}

.bg-label-primary {
    background-color: rgba(196, 30, 58, 0.12) !important;
    color: var(--njn-red) !important;
}

.layout-navbar {
    border-bottom: 2px solid var(--njn-red);
}

.footer-link.text-primary,
a.text-primary {
    color: var(--njn-red) !important;
}

.badge.bg-label-primary {
    background-color: rgba(196, 30, 58, 0.15) !important;
    color: var(--njn-red) !important;
}

.card {
    border: 1px solid rgba(26, 26, 26, 0.08);
}

.app-brand .text-primary svg {
    color: var(--njn-red) !important;
}

.page-item.active .page-link {
    background-color: var(--njn-red) !important;
    border-color: var(--njn-red) !important;
}

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

.alert-primary {
    background-color: rgba(196, 30, 58, 0.1) !important;
    border-color: rgba(196, 30, 58, 0.2) !important;
    color: var(--njn-red-dark) !important;
}