/* public/assets/css/theme.css */

/* 1) Your theme tokens */
:root {
    /* Brand */
    --color-theme: #2e4a52;
    --color-primary: #2e4a52;
    --color-primary-rgb: 0, 0, 0;
    --color-secondary: #ffffff;
    --color-secondary-rgb: 255, 255, 255;

    /* Semantic */
    --color-success: #198754;
    --color-info: #0dcaf0;
    --color-warning: #ffc107;
    --color-danger: #dc3545;

    /* Neutrals */
    --color-light: #fff;
    --color-dark: #212529;
    --color-muted: #6c757d;
    --color-muted-rgb: 108, 117, 125;
    --color-default: #dee2e6;
    --color-default-rgb: 222, 226, 230;

    /* Sidebar */
    --sidebar-bg: var(--color-light);
    --sidebar-text: #2e4a52;
    --sidebar-text-hover: #2e4a52;
    --sidebar-active-bg: #e9ecef;
    --sidebar-active-border: var(--color-primary);

    /* Typography */
    --font-size-base: 0.875rem;

    /* Nav link overrides */
    --bs-nav-link-padding-x: 1rem;
    --bs-nav-link-padding-y: 0.5rem;
    --bs-nav-link-font-weight: 400;
    --bs-nav-link-color: var(--color-primary);
    --bs-nav-link-hover-color: var(--color-primary);
    --bs-nav-link-disabled-color: var(--color-muted);

    --bg-color-theme: var(--color-theme);
}

.btn-primary {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: var(--color-secondary) !important;
}

/* 2) Utility overrides for Bootstrap “dark” and theme helpers */
.btn-dark,
.bg-dark {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: var(--color-secondary) !important;
}

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

/* THEME SETUP */
.btn-theme {
    background-color: #2e4a52;
    border-color: #2e4a52;
    color: #fff;
}

.text-theme {
    color: #2e4a52 !important;
}

.bg-theme {
    background-color: #2e4a52 !important;
}

/* Semantic text colors */
.text-primary {
    color: var(--color-primary) !important;
}
.text-secondary {
    color: var(--color-secondary) !important;
}
.text-success {
    color: var(--color-success) !important;
}
.text-info {
    color: var(--color-info) !important;
}
.text-warning {
    color: var(--color-warning) !important;
}
.text-danger {
    color: var(--color-danger) !important;
}
.text-light {
    color: var(--color-light) !important;
}
.text-muted {
    color: var(--color-muted) !important;
}
.text-default {
    color: var(--color-default) !important;
}

/* Semantic background colors */
.bg-primary {
    background-color: var(--color-primary) !important;
}
.bg-secondary {
    background-color: var(--color-secondary) !important;
}
.bg-success {
    background-color: var(--color-success) !important;
}
.bg-info {
    background-color: var(--color-info) !important;
}
.bg-warning {
    background-color: var(--color-warning) !important;
}
.bg-danger {
    background-color: var(--color-danger) !important;
}
.bg-light {
    background-color: var(--color-light) !important;
}
.bg-muted {
    background-color: var(--color-muted) !important;
}
.bg-default {
    background-color: var(--color-default) !important;
}

/* Form control focus */
.form-control:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 0.2rem rgba(var(--color-primary-rgb), 0.25);
}

form label {
    color: var(--color-primary) !important;
}

/* Alerts */
.alert-primary {
    background-color: var(--color-primary);
    color: #fff;
}
.alert-secondary {
    background-color: var(--color-secondary);
    color: #000;
}
.alert-success {
    background-color: var(--color-success);
    color: #fff;
}
.alert-info {
    background-color: var(--color-info);
    color: #000;
}
.alert-warning {
    background-color: var(--color-warning);
    color: #212529;
}
.alert-danger {
    background-color: var(--color-danger);
    color: #fff;
}
.alert-light {
    background-color: var(--color-light);
    color: #000;
}
.alert-muted {
    background-color: var(--color-muted);
    color: #fff;
}
.alert-default {
    background-color: var(--color-default);
    color: #000;
}

/* Badges */
.badge-primary {
    background-color: var(--color-primary);
    color: #fff;
}
.badge-secondary {
    background-color: var(--color-secondary);
    color: #000;
}
.badge-success {
    background-color: var(--color-success);
    color: #fff;
}
.badge-info {
    background-color: var(--color-info);
    color: #000;
}
.badge-warning {
    background-color: var(--color-warning);
    color: #212529;
}
.badge-danger {
    background-color: var(--color-danger);
    color: #fff;
}
.badge-light {
    background-color: var(--color-light);
    color: #000;
}
.badge-muted {
    background-color: var(--color-muted);
    color: #fff;
}
.badge-default {
    background-color: var(--color-default);
    color: #000;
}

/* 3) Override Bootstrap’s CSS variables to use your theme tokens */
:root,
[data-bs-theme="light"] {
    --bs-blue: var(--color-info);
    --bs-indigo: var(--color-primary);
    --bs-purple: var(--color-primary);
    --bs-pink: var(--color-secondary);
    --bs-red: var(--color-danger);
    --bs-orange: var(--color-warning);
    --bs-yellow: var(--color-warning);
    --bs-green: var(--color-success);
    --bs-teal: var(--color-info);
    --bs-cyan: var(--color-info);
    --bs-black: var(--color-dark);
    --bs-white: var(--color-secondary);

    --bs-gray: var(--color-muted);
    --bs-gray-dark: var(--color-dark);
    --bs-gray-100: var(--color-light);
    --bs-gray-200: var(--color-default);
    --bs-gray-300: var(--color-default);
    --bs-gray-400: var(--color-default);
    --bs-gray-500: var(--color-muted);
    --bs-gray-600: var(--color-muted);
    --bs-gray-700: var(--color-dark);
    --bs-gray-800: var(--color-dark);
    --bs-gray-900: var(--color-dark);

    --bs-primary: var(--color-primary);
    --bs-secondary: var(--color-secondary);
    --bs-success: var(--color-success);
    --bs-info: var(--color-info);
    --bs-warning: var(--color-warning);
    --bs-danger: var(--color-danger);
    --bs-light: var(--color-light);
    --bs-dark: var(--color-dark);

    --bs-primary-rgb: var(--color-primary-rgb);
    --bs-secondary-rgb: var(--color-secondary-rgb);
    --bs-success-rgb: var(--color-success-rgb, 25, 135, 84);
    --bs-info-rgb: var(--color-info-rgb, 13, 202, 240);
    --bs-warning-rgb: var(--color-warning-rgb, 255, 193, 7);
    --bs-danger-rgb: var(--color-danger-rgb, 220, 53, 69);
    --bs-light-rgb: var(--color-light-rgb, 248, 249, 250);
    --bs-dark-rgb: var(--color-dark-rgb, 33, 37, 41);

    --bs-link-color: var(--color-primary);
    --bs-link-hover-color: var(--color-primary);
    --bs-secondary-color: var(--color-muted);
    --bs-body-color: var(--color-dark);
    --bs-body-bg: var(--color-secondary);

    --bs-border-color: var(--color-default);

    --bs-focus-ring-color: rgba(var(--color-primary-rgb), 0.25);
}