:root {
    --cd-bg: #F7F6EA;
    --cd-surface: #F7F6EA;
    --cd-surface-2: #F7F6EA;
    --cd-text: #341D19;
    --cd-muted: #9F3645;
    --cd-border: #9F3645;
    --cd-input-bg: #F7F6EA;
    --cd-link: #CD2C42;
    --cd-link-alt: #9F3645;
}

html[data-color-mode="dark"] {
    --cd-bg: #2C1D1A;
    --cd-surface: #2C1D1A;
    --cd-surface-2: #341D19;
    --cd-text: #FEF5EC;
    --cd-muted: #FEF5EC;
    --cd-border: #D22F45;
    --cd-input-bg: #341D19;
    --cd-link: #D22F45;
    --cd-link-alt: #FEF5EC;
}

/* Legacy variable bridge for pages using custom.css utility classes */
html[data-color-mode="light"] {
    --primary-bg: #F7F6EA;
    --secondary-bg: #F7F6EA;
    --sidebar-bg: #F7F6EA;
    --text-primary: #341D19;
    --text-secondary: #9F3645;
    --border-color: #9F3645;
    --hover-bg: #F7F6EA;
}

html[data-color-mode="dark"] {
    --primary-bg: #2C1D1A;
    --secondary-bg: #341D19;
    --sidebar-bg: #2C1D1A;
    --text-primary: #FEF5EC;
    --text-secondary: #FEF5EC;
    --border-color: #9F3645;
    --hover-bg: #341D19;
}

.primary-bg { background-color: var(--primary-bg) !important; }
.secondary-bg { background-color: var(--secondary-bg) !important; }
.sidebar { background-color: var(--sidebar-bg) !important; }
.dashboard-content { background-color: var(--primary-bg) !important; }

html[data-color-mode="dark"] body,
html[data-color-mode="light"] body {
    background: var(--cd-bg) !important;
    color: var(--cd-text) !important;
}

html[data-color-mode="dark"] .card,
html[data-color-mode="dark"] .modal-content,
html[data-color-mode="dark"] .dropdown-menu,
html[data-color-mode="dark"] .bg-footer-theme,
html[data-color-mode="dark"] .bg-navbar-theme,
html[data-color-mode="dark"] .bg-menu-theme,
html[data-color-mode="dark"] .content-footer,
html[data-color-mode="dark"] .list-group-item,
html[data-color-mode="dark"] .accordion-item,
html[data-color-mode="dark"] .offcanvas,
html[data-color-mode="dark"] .swal2-popup {
    background-color: var(--cd-surface) !important;
    color: var(--cd-text) !important;
    border-color: var(--cd-border) !important;
}

html[data-color-mode="dark"] .table,
html[data-color-mode="dark"] .table th,
html[data-color-mode="dark"] .table td,
html[data-color-mode="dark"] .table thead th {
    color: var(--cd-text) !important;
    border-color: var(--cd-border) !important;
}

html[data-color-mode="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
    color: var(--cd-text) !important;
    background-color: rgba(255, 255, 255, 0.02) !important;
}

html[data-color-mode="dark"] .form-control,
html[data-color-mode="dark"] .form-select,
html[data-color-mode="dark"] .input-group-text,
html[data-color-mode="dark"] textarea,
html[data-color-mode="dark"] input,
html[data-color-mode="dark"] select {
    background-color: var(--cd-input-bg) !important;
    color: var(--cd-text) !important;
    border-color: var(--cd-border) !important;
}

html[data-color-mode="dark"] .form-control::placeholder,
html[data-color-mode="dark"] input::placeholder,
html[data-color-mode="dark"] textarea::placeholder {
    color: var(--cd-muted) !important;
}

html[data-color-mode="dark"] a {
    color: var(--cd-link);
}

html[data-color-mode="dark"] .text-muted,
html[data-color-mode="dark"] .text-secondary,
html[data-color-mode="dark"] .small,
html[data-color-mode="dark"] small {
    color: var(--cd-muted) !important;
}

html[data-color-mode="dark"] .border,
html[data-color-mode="dark"] .border-top,
html[data-color-mode="dark"] .border-bottom,
html[data-color-mode="dark"] .border-start,
html[data-color-mode="dark"] .border-end,
html[data-color-mode="dark"] hr {
    border-color: var(--cd-border) !important;
}

html[data-color-mode="dark"] .layout-menu,
html[data-color-mode="dark"] .menu-vertical,
html[data-color-mode="dark"] .menu-inner,
html[data-color-mode="dark"] .menu-link,
html[data-color-mode="dark"] .menu-text,
html[data-color-mode="dark"] .app-brand-text,
html[data-color-mode="dark"] .navbar,
html[data-color-mode="dark"] .nav-link,
html[data-color-mode="dark"] .dropdown-item,
html[data-color-mode="dark"] .page-link {
    color: var(--cd-text) !important;
}

html[data-color-mode="dark"] .menu-link:hover,
html[data-color-mode="dark"] .dropdown-item:hover,
html[data-color-mode="dark"] .page-link:hover,
html[data-color-mode="dark"] .nav-link:hover {
    background-color: rgba(210, 47, 69, 0.18) !important;
}

html[data-color-mode="dark"] .bg-white,
html[data-color-mode="dark"] .bg-light,
html[data-color-mode="dark"] .bg-gray-50,
html[data-color-mode="dark"] .bg-gray-100,
html[data-color-mode="dark"] .bg-slate-50,
html[data-color-mode="dark"] .bg-slate-100 {
    background-color: var(--cd-surface) !important;
}

html[data-color-mode="dark"] .bg-gray-500,
html[data-color-mode="dark"] .bg-opacity-75 {
    background-color: rgba(0, 0, 0, 0.65) !important;
}

html[data-color-mode="dark"] .card-header.bg-white,
html[data-color-mode="dark"] .card-body.bg-white,
html[data-color-mode="dark"] .modal-body.bg-white,
html[data-color-mode="dark"] .modal-header.bg-white,
html[data-color-mode="dark"] .modal-footer.bg-white {
    background-color: var(--cd-surface) !important;
    color: var(--cd-text) !important;
}

html[data-color-mode="dark"] [style*="background-color: white"],
html[data-color-mode="dark"] [style*="background-color:white"],
html[data-color-mode="dark"] [style*="background: white"],
html[data-color-mode="dark"] [style*="background:white"],
html[data-color-mode="dark"] [style*="background-color:#fff"],
html[data-color-mode="dark"] [style*="background-color: #fff"],
html[data-color-mode="dark"] [style*="background:#fff"],
html[data-color-mode="dark"] [style*="background: #fff"],
html[data-color-mode="dark"] [style*="background-color:#ffffff"],
html[data-color-mode="dark"] [style*="background-color: #ffffff"],
html[data-color-mode="dark"] [style*="background:#ffffff"],
html[data-color-mode="dark"] [style*="background: #ffffff"] {
    background-color: var(--cd-surface) !important;
    color: var(--cd-text) !important;
    border-color: var(--cd-border) !important;
}

html[data-color-mode="dark"] [style*="color:#fff"],
html[data-color-mode="dark"] [style*="color: #fff"],
html[data-color-mode="dark"] [style*="color:#ffffff"],
html[data-color-mode="dark"] [style*="color: #ffffff"],
html[data-color-mode="dark"] [style*="color:white"],
html[data-color-mode="dark"] [style*="color: white"] {
    color: var(--cd-text) !important;
}

html[data-color-mode="dark"] .text-black,
html[data-color-mode="dark"] .text-gray-900,
html[data-color-mode="dark"] .text-gray-800,
html[data-color-mode="dark"] .text-gray-700,
html[data-color-mode="dark"] .text-slate-900,
html[data-color-mode="dark"] .text-slate-800,
html[data-color-mode="dark"] .text-slate-700 {
    color: var(--cd-text) !important;
}

html[data-color-mode="dark"] .text-gray-600,
html[data-color-mode="dark"] .text-gray-500,
html[data-color-mode="dark"] .text-slate-600,
html[data-color-mode="dark"] .text-slate-500 {
    color: var(--cd-muted) !important;
}

html[data-color-mode="dark"] .border-gray-100,
html[data-color-mode="dark"] .border-gray-200,
html[data-color-mode="dark"] .border-gray-300,
html[data-color-mode="dark"] .border-slate-200,
html[data-color-mode="dark"] .border-slate-300 {
    border-color: var(--cd-border) !important;
}

html[data-color-mode="dark"] .text-orange-400,
html[data-color-mode="dark"] .text-orange-500,
html[data-color-mode="dark"] .text-orange-600 {
    color: var(--cd-link) !important;
}

html[data-color-mode="dark"] .hover\:text-orange-600:hover {
    color: var(--cd-link) !important;
}

html[data-color-mode="dark"] .border-orange-500 {
    border-color: var(--cd-link) !important;
}

.btn-primary,
a.btn-primary,
.btn.btn-primary,
a.btn.btn-primary,
.btn-primary:hover,
a.btn-primary:hover {
    color: #FEF5EC !important;
}

.btn-primary,
a.btn-primary,
.btn.btn-primary,
a.btn.btn-primary {
    background-color: #CD2C42 !important;
    border-color: #9F3645 !important;
}

.btn-primary:hover,
a.btn-primary:hover,
.btn.btn-primary:hover,
a.btn.btn-primary:hover,
.btn-primary:focus,
a.btn-primary:focus,
.btn.btn-primary:focus,
a.btn.btn-primary:focus {
    background-color: #9F3645 !important;
    border-color: #9F3645 !important;
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .btn-primary,
html[data-color-mode="dark"] a.btn-primary,
html[data-color-mode="dark"] .btn.btn-primary,
html[data-color-mode="dark"] a.btn.btn-primary {
    background-color: #D22F45 !important;
    border-color: #9F3645 !important;
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .btn-primary:hover,
html[data-color-mode="dark"] a.btn-primary:hover,
html[data-color-mode="dark"] .btn.btn-primary:hover,
html[data-color-mode="dark"] a.btn.btn-primary:hover,
html[data-color-mode="dark"] .btn-primary:focus,
html[data-color-mode="dark"] a.btn-primary:focus,
html[data-color-mode="dark"] .btn.btn-primary:focus,
html[data-color-mode="dark"] a.btn.btn-primary:focus {
    background-color: #9F3645 !important;
    border-color: #9F3645 !important;
    color: #FEF5EC !important;
}

.bg-primary,
.badge.bg-primary,
.text-bg-primary {
    background-color: #CD2C42 !important;
    border-color: #CD2C42 !important;
    color: #FEF5EC !important;
}

.bg-info,
.badge.bg-info,
.text-bg-info,
.bg-success,
.badge.bg-success,
.text-bg-success,
.bg-warning,
.badge.bg-warning,
.text-bg-warning,
.bg-danger,
.badge.bg-danger,
.text-bg-danger {
    background-color: #9F3645 !important;
    border-color: #9F3645 !important;
    color: #FEF5EC !important;
}

.text-primary,
.text-info,
.text-success,
.text-warning,
.text-danger {
    color: #CD2C42 !important;
}

.bg-label-primary,
.bg-light-primary {
    background-color: rgba(205, 44, 66, 0.18) !important;
    color: #CD2C42 !important;
}

.bg-label-info,
.bg-light-info,
.bg-label-success,
.bg-light-success,
.bg-label-warning,
.bg-light-warning,
.bg-label-danger,
.bg-light-danger,
.bg-label-secondary {
    background-color: rgba(159, 54, 69, 0.2) !important;
    color: #9F3645 !important;
}

.btn-outline-primary,
.btn-outline-info,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger {
    border-color: #9F3645 !important;
    color: #9F3645 !important;
}

.btn-outline-primary:hover,
.btn-outline-info:hover,
.btn-outline-success:hover,
.btn-outline-warning:hover,
.btn-outline-danger:hover {
    background-color: #CD2C42 !important;
    border-color: #CD2C42 !important;
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .text-dark,
html[data-color-mode="dark"] .text-body,
html[data-color-mode="dark"] .text-body-emphasis,
html[data-color-mode="dark"] .card-title,
html[data-color-mode="dark"] .card-text,
html[data-color-mode="dark"] .form-label,
html[data-color-mode="dark"] label,
html[data-color-mode="dark"] .table,
html[data-color-mode="dark"] .table * {
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .text-muted,
html[data-color-mode="dark"] .text-secondary,
html[data-color-mode="dark"] .text-body-secondary,
html[data-color-mode="dark"] small {
    color: #FEF5EC !important;
    opacity: 0.9;
}

html[data-color-mode="dark"] .bg-label-primary,
html[data-color-mode="dark"] .bg-light-primary {
    background-color: rgba(210, 47, 69, 0.28) !important;
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .bg-label-info,
html[data-color-mode="dark"] .bg-light-info,
html[data-color-mode="dark"] .bg-label-success,
html[data-color-mode="dark"] .bg-light-success,
html[data-color-mode="dark"] .bg-label-warning,
html[data-color-mode="dark"] .bg-light-warning,
html[data-color-mode="dark"] .bg-label-danger,
html[data-color-mode="dark"] .bg-light-danger,
html[data-color-mode="dark"] .bg-label-secondary {
    background-color: rgba(159, 54, 69, 0.35) !important;
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .hover-shadow:hover {
    box-shadow: 0 0.5rem 1.2rem rgba(210, 47, 69, 0.25) !important;
}

html[data-color-mode="dark"] .apexcharts-text,
html[data-color-mode="dark"] .apexcharts-legend-text,
html[data-color-mode="dark"] .apexcharts-xaxis-label,
html[data-color-mode="dark"] .apexcharts-yaxis-label {
    fill: #FEF5EC !important;
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .apexcharts-gridline,
html[data-color-mode="dark"] .apexcharts-xcrosshairs,
html[data-color-mode="dark"] .apexcharts-ycrosshairs {
    stroke: #9F3645 !important;
}

/* Legacy utility color normalization (Tailwind classes used in dashboards) */
.bg-blue-500,
.bg-blue-600,
.bg-indigo-600,
.bg-indigo-700,
.bg-green-500,
.bg-green-600,
.bg-yellow-500,
.bg-purple-500 {
    background-color: #CD2C42 !important;
}

.hover\:bg-blue-700:hover,
.hover\:bg-indigo-700:hover,
.hover\:bg-indigo-900:hover,
.hover\:bg-green-700:hover,
.hover\:bg-yellow-700:hover,
.hover\:bg-purple-700:hover {
    background-color: #9F3645 !important;
}

.text-blue-600,
.text-blue-700,
.text-green-600,
.text-green-700,
.text-yellow-700,
.text-red-600 {
    color: #CD2C42 !important;
}

.bg-green-100,
.bg-yellow-200 {
    background-color: rgba(205, 44, 66, 0.18) !important;
}

.border-green-500,
.border-blue-500,
.border-yellow-500 {
    border-color: #9F3645 !important;
}

.focus\:ring-indigo-500:focus,
.focus\:ring-blue-500:focus {
    --tw-ring-color: #CD2C42 !important;
}

html[data-color-mode="dark"] .bg-green-100,
html[data-color-mode="dark"] .bg-yellow-200 {
    background-color: rgba(159, 54, 69, 0.35) !important;
    color: #FEF5EC !important;
}

.bg-indigo-900,
.bg-indigo-800 {
    background-color: #341D19 !important;
}

/* Auth + generic Bootstrap readability */
.alert-primary,
.alert-info,
.alert-success,
.alert-warning,
.alert-danger {
    border-color: #9F3645 !important;
}

.alert-primary,
.alert-info,
.alert-success,
.alert-warning {
    background-color: rgba(205, 44, 66, 0.12) !important;
    color: #341D19 !important;
}

.alert-danger {
    background-color: rgba(159, 54, 69, 0.16) !important;
    color: #341D19 !important;
}

html[data-color-mode="dark"] .alert-primary,
html[data-color-mode="dark"] .alert-info,
html[data-color-mode="dark"] .alert-success,
html[data-color-mode="dark"] .alert-warning,
html[data-color-mode="dark"] .alert-danger {
    background-color: rgba(159, 54, 69, 0.28) !important;
    color: #FEF5EC !important;
    border-color: #D22F45 !important;
}

html[data-color-mode="dark"] .authentication-wrapper,
html[data-color-mode="dark"] .authentication-inner,
html[data-color-mode="dark"] .authentication-basic,
html[data-color-mode="dark"] .authentication-cover {
    background-color: #2C1D1A !important;
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .authentication-wrapper .card,
html[data-color-mode="dark"] .authentication-wrapper .card-body {
    background-color: #341D19 !important;
    color: #FEF5EC !important;
    border-color: #9F3645 !important;
}

html[data-color-mode="dark"] .authentication-wrapper .form-label,
html[data-color-mode="dark"] .authentication-wrapper .form-check-label,
html[data-color-mode="dark"] .authentication-wrapper .text-muted,
html[data-color-mode="dark"] .authentication-wrapper .small,
html[data-color-mode="dark"] .authentication-wrapper p,
html[data-color-mode="dark"] .authentication-wrapper span,
html[data-color-mode="dark"] .authentication-wrapper a {
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .authentication-wrapper .input-group-text,
html[data-color-mode="dark"] .authentication-wrapper .form-control,
html[data-color-mode="dark"] .authentication-wrapper .form-select {
    background-color: #2C1D1A !important;
    border-color: #9F3645 !important;
    color: #FEF5EC !important;
}

html[data-color-mode="dark"] .authentication-wrapper .form-control::placeholder {
    color: #FEF5EC !important;
    opacity: 0.8;
}

.auth-login-page {
    background-color: var(--cd-bg) !important;
    color: var(--cd-text) !important;
}

.auth-login-form {
    background-color: var(--cd-surface) !important;
    color: var(--cd-text) !important;
    border: 1px solid var(--cd-border) !important;
}

.auth-login-form label,
.auth-login-form input {
    color: var(--cd-text) !important;
}

.auth-login-form input {
    background-color: var(--cd-input-bg) !important;
    border-color: var(--cd-border) !important;
}

.auth-login-form input::placeholder {
    color: var(--cd-muted) !important;
}

html[data-color-mode="dark"] .note-editor.note-frame,
html[data-color-mode="dark"] .note-toolbar,
html[data-color-mode="dark"] .note-statusbar,
html[data-color-mode="dark"] .note-editable,
html[data-color-mode="dark"] .note-modal-content {
    background-color: var(--cd-surface) !important;
    color: var(--cd-text) !important;
    border-color: var(--cd-border) !important;
}

html[data-color-mode="dark"] .note-toolbar .note-btn,
html[data-color-mode="dark"] .note-dropdown-menu,
html[data-color-mode="dark"] .note-dropdown-item {
    color: var(--cd-text) !important;
    border-color: var(--cd-border) !important;
    background-color: var(--cd-surface-2) !important;
}

html[data-color-mode="dark"] .note-dropdown-menu .note-dropdown-item:hover,
html[data-color-mode="dark"] .note-toolbar .note-btn:hover {
    background-color: rgba(210, 47, 69, 0.18) !important;
}

#global-theme-toggle {
    border: 1px solid var(--cd-border);
    background: var(--cd-surface);
    color: var(--cd-text);
    border-radius: 9999px;
    width: 2.4rem;
    height: 2.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

#global-theme-toggle:hover {
    filter: brightness(1.05);
}

.global-theme-fab {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 1085;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
}

@media print {
    #global-theme-toggle,
    .global-theme-fab {
        display: none !important;
    }
}
