/*
 * KambohTyara brand theme overrides
 * Palette: #404040 (charcoal) + #FFC107 (amber)
 * Loaded after style.bundle.css — overrides Metronic/Bootstrap variables.
 */

:root,
[data-bs-theme=light] {
    /* Primary / accent -> amber */
    --bs-primary: #FFC107;
    --bs-primary-rgb: 255, 193, 7;
    --bs-primary-active: #E0A800;
    --bs-primary-light: #FFF8E1;
    --bs-primary-inverse: #404040;
    --bs-primary-bg-subtle: #FFF3CD;
    --bs-primary-border-subtle: #FFE69C;
    --bs-primary-text-emphasis: #664D03;
    --bs-text-primary: #FFC107;

    /* Links */
    --bs-link-color: #FFC107;
    --bs-link-color-rgb: 255, 193, 7;
    --bs-link-hover-color: #E0A800;
    --bs-link-hover-color-rgb: 224, 168, 0;
    --bs-focus-ring-color: rgba(255, 193, 7, 0.25);

    /* Dark / neutral -> charcoal */
    --bs-dark: #404040;
    --bs-dark-rgb: 64, 64, 64;
    --bs-text-dark: #404040;
    --bs-gray-dark: #404040;

    /* Body text and headings shift from navy to charcoal */
    --bs-body-color: #404040;
    --bs-body-color-rgb: 64, 64, 64;
    --bs-heading-color: #404040;
    --bs-gray-900: #262626;
    --bs-gray-800: #404040;
    --bs-gray-700: #555555;
    --bs-text-gray-900: #262626;
    --bs-text-gray-800: #404040;
    --bs-text-gray-700: #555555;

    /* Active/checked components get amber backgrounds, so use dark text */
    --bs-component-active-color: #404040;
    --bs-component-checked-color: #404040;
    --bs-nav-pills-link-active-color: #404040;
    --bs-progress-bar-color: #404040;
}

[data-bs-theme=dark] {
    --bs-primary: #FFC107;
    --bs-primary-rgb: 255, 193, 7;
    --bs-primary-active: #E0A800;
    --bs-primary-light: #4A4021;
    --bs-primary-inverse: #404040;
    --bs-text-primary: #FFC107;
    --bs-link-color: #FFC107;
    --bs-link-color-rgb: 255, 193, 7;
    --bs-link-hover-color: #E0A800;
    --bs-link-hover-color-rgb: 224, 168, 0;
}

/* Force Metronic component / menu / pagination vars that were hard-coded */
:root,
[data-bs-theme=light],
[data-bs-theme=dark] {
    --bs-menu-link-color-hover: #FFC107;
    --bs-menu-link-color-show: #FFC107;
    --bs-menu-link-color-here: #FFC107;
    --bs-menu-link-color-active: #FFC107;
    --bs-component-hover-color: #FFC107;
    --bs-component-active-bg: #FFC107;
    --bs-component-checked-bg: #FFC107;
    --bs-component-active-color: #404040;
    --bs-component-checked-color: #404040;
    --bs-btn-bg: #FFC107;
    --bs-btn-border-color: #FFC107;
    --bs-btn-hover-bg: #E0A800;
    --bs-btn-hover-border-color: #E0A800;
    --bs-btn-active-bg: #E0A800;
    --bs-btn-active-border-color: #E0A800;
    --bs-btn-disabled-bg: #FFC107;
    --bs-btn-disabled-border-color: #FFC107;
    --bs-scrolltop-bg-color: #FFC107;
    --bs-scrolltop-bg-color-hover: #E0A800;
    --bs-progress-bar-bg: #FFC107;
    --bs-nav-pills-link-active-bg: #FFC107;
    --bs-ribbon-label-bg: #FFC107;
}

/* ---------------------------------------------------------------------------
 * Light sidebar
 * ------------------------------------------------------------------------- */

[data-kt-app-layout=light-sidebar] .app-sidebar {
    background-color: #ffffff;
    border-right: 1px solid #F1F1F2;
}

[data-kt-app-layout=light-sidebar] .app-sidebar .app-sidebar-logo {
    border-bottom: 1px dashed #DBDFE9;
    min-height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
}

[data-kt-app-layout=light-sidebar] .app-sidebar .app-sidebar-logo > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0 auto;
}

[data-kt-app-layout=light-sidebar] .app-sidebar .app-sidebar-logo .app-sidebar-logo-default,
[data-kt-app-layout=light-sidebar] .app-sidebar .app-sidebar-logo .app-sidebar-logo-minimize {
    margin-left: auto;
    margin-right: auto;
}

/* Active menu item: amber background with charcoal text */
[data-kt-app-layout=light-sidebar] .app-sidebar .menu > .menu-item .menu-link.active {
    background-color: #FFC107 !important;
    color: #404040 !important;
}

[data-kt-app-layout=light-sidebar] .app-sidebar .menu > .menu-item .menu-link.active .menu-title,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu > .menu-item .menu-link.active .menu-icon,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu > .menu-item .menu-link.active .menu-icon i,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu > .menu-item .menu-link.active .menu-icon .svg-icon {
    color: #404040 !important;
}

[data-kt-app-layout=light-sidebar] .app-sidebar .menu > .menu-item .menu-link.active .menu-bullet .bullet {
    background-color: #404040 !important;
}

/* Hover: amber accent */
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link:hover:not(.disabled):not(.active),
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover > .menu-link:not(.disabled):not(.active),
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-title,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-title,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-icon,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-icon i,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-icon .svg-icon,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-icon,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-icon i {
    color: #FFC107 !important;
}

[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-bullet .bullet,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-bullet .bullet {
    background-color: #FFC107 !important;
}

[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-arrow:after,
[data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-arrow:after {
    background-color: #FFC107 !important;
}

/* ---------------------------------------------------------------------------
 * Misc components
 * ------------------------------------------------------------------------- */

.form-check-input:checked {
    background-color: #FFC107;
    border-color: #FFC107;
}

/* Pagination — force amber active state */
.page-item.active .page-link,
.pagination .page-item.active .page-link {
    background-color: #FFC107 !important;
    border-color: #FFC107 !important;
    color: #404040 !important;
}

.page-link:hover,
.page-link:focus {
    color: #FFC107;
}

/* ---------------------------------------------------------------------------
 * Brand stat cards (used on dashboard and overview pages)
 * ------------------------------------------------------------------------- */

.brand-card-dark {
    background-color: #404040 !important;
}

.brand-card-amber {
    background-color: #FFC107 !important;
}

.brand-card-amber .text-white {
    color: #404040 !important;
}