/* LPHS global theme — override NobleUI / Bootstrap accents (demo1)
   Tokens selaras portal_v2 + lphs-auth.css
*/
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&display=swap");

:root,
[data-bs-theme="light"] {
    --lphs-primary: #14505B;
    --lphs-primary-dark: #0e3a44;
    --lphs-primary-rgb: 20, 80, 91;
    --lphs-secondary: #C2922F;
    --lphs-secondary-rgb: 194, 146, 47;
    --lphs-accent-1: #F3E8D0;
    --lphs-accent-1-rgb: 243, 232, 208;
    --lphs-accent-2: #5E6B73;
    --lphs-accent-2-rgb: 94, 107, 115;
    --lphs-sidebar-bg: #14505B;
    --lphs-sidebar-bg-dark: #0e3a44;
    --lphs-sidebar-border: rgba(243, 232, 208, 0.12);
    --lphs-sidebar-muted: rgba(243, 232, 208, 0.55);
    --lphs-sidebar-text: #F3E8D0;

    /* Bootstrap / NobleUI primary → LPHS teal */
    --bs-primary: #14505B;
    --bs-primary-rgb: 20, 80, 91;
    --bs-primary-text-emphasis: #0e3a44;
    --bs-primary-bg-subtle: #e4eef0;
    --bs-primary-border-subtle: #a8c4c9;
    --bs-link-color: #14505B;
    --bs-link-color-rgb: 20, 80, 91;
    --bs-link-hover-color: #0e3a44;
    --bs-link-hover-color-rgb: 14, 58, 68;
    --bs-focus-ring-color: rgba(20, 80, 91, 0.25);

    --bs-sidebar-color: #5E6B73;
    --bs-sidebar-color-rgb: 94, 107, 115;
}

/* Dark theme: keep LPHS teal accents (switcher hidden; force light preferred) */
[data-bs-theme="dark"] {
    --lphs-primary: #14505B;
    --lphs-primary-dark: #0e3a44;
    --lphs-primary-rgb: 20, 80, 91;
    --bs-primary: #2a7a88;
    --bs-primary-rgb: 42, 122, 136;
    --bs-primary-text-emphasis: #a8d4db;
    --bs-primary-bg-subtle: #14353c;
    --bs-primary-border-subtle: #1f5a64;
    --bs-link-color: #7eb8c2;
    --bs-link-color-rgb: 126, 184, 194;
    --bs-link-hover-color: #a8d4db;
}

/* ---- Typography ---- */
h1, h2, h3, h4, h5, h6,
.sidebar .sidebar-header .sidebar-brand,
.page-title,
.auth-form-wrapper h5 {
    font-family: "Montserrat", "Roboto", Arial, sans-serif;
}

/* ---- Buttons ---- */
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--lphs-primary);
    --bs-btn-border-color: var(--lphs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--lphs-primary-dark);
    --bs-btn-hover-border-color: var(--lphs-primary-dark);
    --bs-btn-focus-shadow-rgb: var(--lphs-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--lphs-primary-dark);
    --bs-btn-active-border-color: var(--lphs-primary-dark);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--lphs-primary);
    --bs-btn-disabled-border-color: var(--lphs-primary);
}

.btn-outline-primary {
    --bs-btn-color: var(--lphs-primary);
    --bs-btn-border-color: var(--lphs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--lphs-primary);
    --bs-btn-hover-border-color: var(--lphs-primary);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--lphs-primary-dark);
    --bs-btn-active-border-color: var(--lphs-primary-dark);
    --bs-btn-disabled-color: var(--lphs-primary);
    --bs-btn-disabled-border-color: var(--lphs-primary);
    --bs-btn-focus-shadow-rgb: var(--lphs-primary-rgb);
}

.btn-soft-primary,
.btn-light-primary {
    color: var(--lphs-primary) !important;
    background-color: rgba(var(--lphs-primary-rgb), 0.12) !important;
    border-color: transparent !important;
}
.btn-soft-primary:hover,
.btn-light-primary:hover {
    color: #fff !important;
    background-color: var(--lphs-primary) !important;
}

/* ---- Links / text utilities ---- */
a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.navbar-brand) {
    color: var(--lphs-primary);
}
a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.navbar-brand):hover {
    color: var(--lphs-primary-dark);
}
.text-primary { color: var(--lphs-primary) !important; }
.bg-primary { background-color: var(--lphs-primary) !important; }
.border-primary { border-color: var(--lphs-primary) !important; }
.text-bg-primary {
    color: #fff !important;
    background-color: RGBA(var(--bs-primary-rgb), var(--bs-bg-opacity, 1)) !important;
}

/* ---- Badges / alerts / pagination ---- */
.badge.bg-primary,
.badge.text-bg-primary { background-color: var(--lphs-primary) !important; }

.alert-primary {
    --bs-alert-color: #0e3a44;
    --bs-alert-bg: #e4eef0;
    --bs-alert-border-color: #a8c4c9;
    --bs-alert-link-color: #0e3a44;
}

.page-item.active .page-link {
    background-color: var(--lphs-primary);
    border-color: var(--lphs-primary);
}
.page-link { color: var(--lphs-primary); }
.page-link:hover { color: var(--lphs-primary-dark); }

.form-check-input:checked {
    background-color: var(--lphs-primary);
    border-color: var(--lphs-primary);
}
.form-control:focus,
.form-select:focus {
    border-color: rgba(var(--lphs-primary-rgb), 0.55);
    box-shadow: 0 0 0 0.2rem rgba(var(--lphs-primary-rgb), 0.2);
}

/* ---- Cards (subtle) ---- */
.page-wrapper:not(.full-page) .card {
    border-color: rgba(var(--lphs-primary-rgb), 0.08);
    box-shadow: 0 1px 3px rgba(var(--lphs-primary-rgb), 0.06);
}
.card .card-header {
    border-bottom-color: rgba(var(--lphs-primary-rgb), 0.08);
}

/* ---- Navbar ---- */
.navbar {
    background: #fff;
    border-bottom: 1px solid rgba(var(--lphs-primary-rgb), 0.08);
}
.navbar .navbar-content .navbar-nav .nav-item .nav-link:hover,
.navbar .navbar-content .navbar-nav .nav-item .nav-link:focus,
.navbar .navbar-content .navbar-nav .nav-item .nav-link[aria-expanded="true"] {
    color: var(--lphs-primary);
}
.navbar .logo-mini-wrapper .logo-mini {
    max-height: 32px;
    width: auto;
}
.navbar .search-form .form-control:focus {
    border-color: rgba(var(--lphs-primary-rgb), 0.45);
    box-shadow: 0 0 0 0.15rem rgba(var(--lphs-primary-rgb), 0.15);
}

/* Force light: hide theme switcher */
.theme-switcher-wrapper {
    display: none !important;
}

/* ---- Sidebar: dark teal LPHS ---- */
.sidebar .sidebar-header {
    background: var(--lphs-sidebar-bg-dark) !important;
    border-right-color: var(--lphs-sidebar-border) !important;
    border-bottom-color: var(--lphs-sidebar-border) !important;
}
.sidebar .sidebar-header .sidebar-brand {
    color: var(--lphs-accent-1) !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    display: flex;
    align-items: center;
    gap: 0.55rem;
    text-decoration: none;
    line-height: 1.15;
    max-width: calc(100% - 40px);
}
.sidebar .sidebar-header .sidebar-brand span {
    color: rgba(243, 232, 208, 0.75) !important;
    font-weight: 600 !important;
    font-size: 0.85em;
}
.sidebar .sidebar-header .sidebar-brand .lphs-logo-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--lphs-accent-1);
    padding: 0.2rem 0.3rem;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
    flex-shrink: 0;
}
.sidebar .sidebar-header .sidebar-brand .lphs-logo-badge img {
    display: block;
    height: 28px;
    width: auto;
    max-width: 36px;
    object-fit: contain;
}
.sidebar .sidebar-header .sidebar-brand .sidebar-brand-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.sidebar .sidebar-header .sidebar-brand .sidebar-brand-text strong {
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sidebar .sidebar-header .sidebar-toggler span {
    background: var(--lphs-accent-1) !important;
}

.sidebar .sidebar-body {
    background: var(--lphs-sidebar-bg) !important;
    border-right-color: var(--lphs-sidebar-border) !important;
    box-shadow: none !important;
}
.sidebar .sidebar-body .nav .nav-item.nav-category {
    color: var(--lphs-sidebar-muted) !important;
}
.sidebar .sidebar-body .nav .nav-item .nav-link {
    color: rgba(243, 232, 208, 0.88) !important;
}
.sidebar .sidebar-body .nav .nav-item .nav-link .link-icon {
    fill: rgba(243, 232, 208, 0.08) !important;
    color: inherit !important;
}
.sidebar .sidebar-body .nav .nav-item .nav-link[aria-expanded="true"],
.sidebar .sidebar-body .nav .nav-item:hover .nav-link,
.sidebar .sidebar-body .nav .nav-item.active .nav-link {
    color: #fff !important;
}
.sidebar .sidebar-body .nav .nav-item:hover .nav-link .link-icon,
.sidebar .sidebar-body .nav .nav-item.active .nav-link .link-icon {
    color: var(--lphs-accent-1) !important;
    fill: rgba(243, 232, 208, 0.18) !important;
}
.sidebar .sidebar-body .nav .nav-item.active .nav-link::before {
    background: var(--lphs-accent-1) !important;
}
.sidebar .sidebar-body .nav.sub-menu .nav-item .nav-link {
    color: rgba(243, 232, 208, 0.7) !important;
}
.sidebar .sidebar-body .nav.sub-menu .nav-item .nav-link::before {
    border-color: rgba(243, 232, 208, 0.35) !important;
}
.sidebar .sidebar-body .nav.sub-menu .nav-item .nav-link.active,
.sidebar .sidebar-body .nav.sub-menu .nav-item:hover .nav-link {
    color: #fff !important;
}
.sidebar .sidebar-body .nav.sub-menu .nav-item .nav-link.active::before,
.sidebar .sidebar-body .nav.sub-menu .nav-item:hover .nav-link::before {
    border-color: var(--lphs-accent-1) !important;
    background: var(--lphs-accent-1) !important;
}
.sidebar-folded:not(.open-sidebar-folded) .sidebar .sidebar-body .nav .nav-item.nav-category::before {
    background: var(--lphs-accent-1) !important;
}

/* Perfect scrollbar on dark sidebar */
.sidebar .ps__rail-y .ps__thumb-y {
    background-color: rgba(243, 232, 208, 0.35) !important;
}

/* ---- Progress / misc NobleUI purple leftovers ---- */
.progress-bar.bg-primary,
.bg-primary.progress-bar {
    background-color: var(--lphs-primary) !important;
}
.list-group-item.active {
    background-color: var(--lphs-primary);
    border-color: var(--lphs-primary);
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: var(--lphs-primary);
}
.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--lphs-primary);
}
.table-primary {
    --bs-table-bg: #e4eef0;
    --bs-table-color: #0e3a44;
    --bs-table-border-color: #a8c4c9;
}

/* Select2 / DataTables accents if present */
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] {
    background-color: var(--lphs-primary) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--lphs-primary) !important;
    border-color: var(--lphs-primary) !important;
    color: #fff !important;
}

/* Footer */
.footer {
    border-top-color: rgba(var(--lphs-primary-rgb), 0.1) !important;
}

/* Soft purple replacements often used in demo markup */
.text-purple,
.text-indigo { color: var(--lphs-primary) !important; }
.bg-purple,
.bg-indigo { background-color: var(--lphs-primary) !important; }

/* ---- Navbar: NobleUI purple leftovers (#6571ff / #6366f1) ---- */

/* Notification bell pulse dot — NobleUI hardcodes #6571ff */
.navbar .navbar-content .navbar-nav .nav-item .nav-link .indicator .circle,
.navbar .navbar-content .navbar-nav .nav-item .nav-link .indicator .circle::before {
    background: var(--lphs-secondary) !important;
    background-color: var(--lphs-secondary) !important;
}

/* Notification/message dropdown icon circles */
.navbar .dropdown-menu .bg-primary,
.navbar .dropdown-menu .rounded-circle.bg-primary,
.navbar .dropdown-menu .d-flex.bg-primary {
    background-color: var(--lphs-primary) !important;
}

/* Profile avatar circles in navbar + dropdown header */
.navbar .profile-pic,
.navbar .nav-profile .profile-pic,
.navbar .nav-profile img.rounded-circle,
.navbar #profileDropdown + .dropdown-menu img.rounded-circle,
.navbar img.rounded-circle[alt="profile"],
.navbar img.rounded-circle[alt="Profile Picture"] {
    border: 2px solid rgba(var(--lphs-primary-rgb), 0.15);
}

/* link-primary: NobleUI hardcodes purple hover rgba(81,90,204) */
.link-primary {
    color: var(--lphs-primary) !important;
    text-decoration-color: rgba(var(--lphs-primary-rgb), 0.5) !important;
}
.link-primary:hover,
.link-primary:focus {
    color: var(--lphs-primary-dark) !important;
    text-decoration-color: var(--lphs-primary-dark) !important;
}

/* Navbar scoped primary utilities */
.navbar .bg-primary {
    background-color: var(--lphs-primary) !important;
}
.navbar .text-primary {
    color: var(--lphs-primary) !important;
}
.navbar a.text-primary:hover,
.navbar a.text-primary:focus {
    color: var(--lphs-primary-dark) !important;
}

/* Sidebar badge on nav items */
.sidebar .badge.bg-primary {
    background-color: var(--lphs-secondary) !important;
    color: #fff !important;
}

/* ---- Nav tabs / pills: NobleUI hardcodes #6571ff on active ---- */

/* Horizontal tabs (profile: Profil Saya / Kata Laluan / etc.) */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-item .nav-link.active,
.nav.nav-tabs .nav-item .nav-link.active {
    color: var(--lphs-primary) !important;
    background-color: var(--bs-body-bg, #fff);
    border-color: var(--bs-border-color) var(--bs-border-color) var(--bs-body-bg, #fff) !important;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
    color: var(--lphs-primary-dark);
}

/* Vertical tabs variant */
.nav-tabs.nav-tabs-vertical .nav-link.active,
.nav.nav-tabs.nav-tabs-vertical .nav-link.active {
    color: var(--lphs-primary) !important;
    background-color: var(--bs-body-bg, #fff);
    border-right-color: transparent !important;
}

/* Underline tabs variant */
.nav-tabs.nav-tabs-line .nav-link.active,
.nav.nav-tabs.nav-tabs-line .nav-link.active {
    color: var(--lphs-primary) !important;
    border-bottom: 2px solid var(--lphs-primary) !important;
}

/* Lucide / Feather SVG icons inside active tabs */
.nav-tabs .nav-link.active svg,
.nav-tabs .nav-link.active [data-lucide],
.nav-tabs .nav-link.active i,
.nav-tabs .nav-link.active .feather {
    color: var(--lphs-primary) !important;
    stroke: var(--lphs-primary);
}

.nav-tabs .nav-link.text-primary,
.nav-tabs .nav-link.active.text-primary {
    color: var(--lphs-primary) !important;
}

/* Nav pills — reinforce active + hover (admin filters, etc.) */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: var(--lphs-primary) !important;
    color: #fff !important;
}
.nav-pills .nav-link:hover:not(.active) {
    color: var(--lphs-primary);
}
.nav-pills .nav-link.active svg,
.nav-pills .nav-link.active .feather,
.nav-pills .nav-link.active [data-lucide] {
    color: #fff !important;
    stroke: #fff;
}

/* ---- Form controls: NobleUI #6571ff leftovers ---- */
.form-check-input:checked,
.form-check-input:checked[type=checkbox],
.form-check-input[type=checkbox]:indeterminate {
    background-color: var(--lphs-primary) !important;
    border-color: var(--lphs-primary) !important;
}
.form-check-input:focus {
    border-color: rgba(var(--lphs-primary-rgb), 0.55);
    box-shadow: 0 0 0 0.2rem rgba(var(--lphs-primary-rgb), 0.2);
}
.form-switch .form-check-input:checked {
    background-color: var(--lphs-primary) !important;
    border-color: var(--lphs-primary) !important;
}

/* Progress bars (--bs-progress-bar-bg hardcoded purple) */
.progress,
.progress-bar {
    --bs-progress-bar-bg: var(--lphs-primary);
}
.progress-bar {
    background-color: var(--lphs-primary) !important;
}

/* DataTables pagination — extended hover/active */
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    background: var(--lphs-primary) !important;
    border-color: var(--lphs-primary) !important;
    color: #fff !important;
    box-shadow: none !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: var(--lphs-primary) !important;
    border-color: var(--lphs-primary) !important;
    background: rgba(var(--lphs-primary-rgb), 0.08) !important;
}

/* List group active (--bs-list-group-active-bg:#6571ff) */
.list-group-item.active {
    background-color: var(--lphs-primary) !important;
    border-color: var(--lphs-primary) !important;
}

/* Feather / Lucide icons in .text-primary contexts */
.text-primary svg,
.text-primary [data-lucide],
.text-primary .feather,
a.text-primary svg {
    color: var(--lphs-primary) !important;
}