/**
 * CVE Brand Colors & Custom Styles
 * Charte graphique basée sur le logo CVE
 * Couleurs principales: Vert lime (#9DC63F) et Bleu marine (#1E3A5F)
 */

:root {
    /* CVE Brand Colors */
    --cve-green: #9DC63F;
    --cve-green-dark: #7AB82E;
    --cve-green-darker: #6AA625;
    --cve-navy: #1E3A5F;
    --cve-navy-light: #2A4A7C;
    --cve-navy-dark: #152840;

    /* Overrides for Tailwind primary colors */
    --primary-50: #f4f9e8;
    --primary-100: #e6f2c8;
    --primary-200: #d4e9a3;
    --primary-300: #c2e07e;
    --primary-400: #b3d861;
    --primary-500: #9DC63F;
    --primary-600: #8BB835;
    --primary-700: #76a62b;
    --primary-800: #629421;
    --primary-900: #4a7510;

    /* Overrides for Tailwind v4 CSS variables - NEW FORMAT */
    /* These override the default Tailwind primary colors with CVE brand colors */
    --color-primary-50: #f4f9e8;
    --color-primary-100: #e6f2c8;
    --color-primary-200: #d4e9a3;
    --color-primary-300: #c2e07e;
    --color-primary-400: #b3d861;
    --color-primary-500: #9DC63F;
    --color-primary-600: #8BB835;
    --color-primary-700: #76a62b;
    --color-primary-800: #629421;
    --color-primary-900: #4a7510;
    --color-primary-950: #3a5c08;
}

/* Tailwind Arbitrary Values fallback (Fix for static tailwind.css) */
.text-\[20px\] { font-size: 20px !important; }
.text-\[10px\] { font-size: 10px !important; }
.text-\[9px\] { font-size: 9px !important; }
.text-\[8px\] { font-size: 8px !important; }
.text-\[11px\] { font-size: 11px !important; }

/* Gradient utilities */
.cve-gradient {
    background: linear-gradient(135deg, var(--cve-green) 0%, var(--cve-navy) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.cve-gradient-bg {
    background: linear-gradient(135deg, var(--cve-green) 0%, var(--cve-navy) 100%);
}

.cve-gradient-reverse {
    background: linear-gradient(135deg, var(--cve-navy) 0%, var(--cve-green) 100%);
}

/* Button styles */
.btn-cve,
.btn-primary {
    background: linear-gradient(135deg, var(--cve-green) 0%, var(--cve-green-dark) 100%);
    border: none;
    color: white;
    transition: all 0.3s ease;
}

.btn-cve:hover,
.btn-primary:hover {
    background: linear-gradient(135deg, var(--cve-green-dark) 0%, var(--cve-green-darker) 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(157, 198, 63, 0.3);
}

.btn-cve:active,
.btn-primary:active {
    transform: translateY(0);
}

/* Secondary button - Navy */
.btn-secondary {
    background: linear-gradient(135deg, var(--cve-navy) 0%, var(--cve-navy-light) 100%);
    border: none;
    color: white;
    transition: all 0.3s ease;
}

.btn-secondary:hover {
    background: linear-gradient(135deg, var(--cve-navy-light) 0%, var(--cve-navy) 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.3);
}

/* Link styles */
.link-cve,
.link-primary {
    color: var(--cve-navy);
    transition: color 0.3s ease;
}

.link-cve:hover,
.link-primary:hover {
    color: var(--cve-green);
}

/* Text colors */
.text-primary-500,
.text-primary {
    color: var(--cve-green) !important;
}

.text-cve-green {
    color: var(--cve-green);
}

.text-cve-navy {
    color: var(--cve-navy);
}

/* Background colors */
html .bg-primary-500,
body .bg-primary-500,
.bg-primary-500,
html .bg-primary,
body .bg-primary,
.bg-primary {
    background-color: var(--cve-green) !important;
}

.bg-cve-green {
    background-color: var(--cve-green);
}

.bg-cve-navy {
    background-color: var(--cve-navy);
}

/* Border colors */
.border-primary-500,
.border-primary {
    border-color: var(--cve-green) !important;
}

.border-cve-green {
    border-color: var(--cve-green);
}

.border-cve-navy {
    border-color: var(--cve-navy);
}

/* Form inputs */
/* File inputs */
input[type="file"]::file-selector-button {
    background-color: rgba(157, 198, 63, 0.1);
    color: var(--cve-green);
    border: 1px solid rgba(157, 198, 63, 0.2);
    border-radius: 6px;
    padding: 6px 12px;
    margin-right: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

input[type="file"]::file-selector-button:hover {
    background-color: rgba(157, 198, 63, 0.2);
    border-color: var(--cve-green);
}

.dark input[type="file"]::file-selector-button {
    background-color: rgba(30, 58, 95, 0.2);
    color: var(--cve-green);
    border-color: rgba(157, 198, 63, 0.3);
}


/* Checkboxes and radios */
.input-check:checked,
.input-check-primary:checked,
.input-check-cve:checked {
    background-color: var(--cve-green);
    border-color: var(--cve-green);
}

/* Badges */
.badge-primary {
    background-color: var(--cve-green);
    color: white;
}

.badge-sub-primary {
    background-color: rgba(157, 198, 63, 0.1);
    color: var(--cve-green);
}

/* Cards with accent */
.card-accent-primary {
    border-left: 4px solid var(--cve-green);
}

.card-accent-secondary {
    border-left: 4px solid var(--cve-navy);
}

/* Progress bars */
.progress-bar-primary {
    background-color: var(--cve-green);
}

/* Alerts */
.alert-primary {
    background-color: rgba(157, 198, 63, 0.1);
    border-color: var(--cve-green);
    color: var(--cve-navy);
}

/* Tabs active state */
.nav-tabs .nav-link.active {
    border-bottom-color: var(--cve-green);
    color: var(--cve-green);
}


/* Sidebar active items */
.sidebar-menu .active {
    background-color: rgba(157, 198, 63, 0.1);
    color: var(--cve-green);
    border-left: 3px solid var(--cve-green);
}

/* Navigation links active state */
.nav-link.active {
    background-color: rgba(157, 198, 63, 0.15) !important;
    color: var(--cve-green) !important;
    font-weight: 600;
    position: relative;
}

.nav-link.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background-color: var(--cve-green);
}

/* Dropdown menu items active state */
.dropdown-menu a.active {
    background-color: rgba(157, 198, 63, 0.1);
    color: var(--cve-green) !important;
    font-weight: 600;
}


/* Icons with primary color */
.icon-primary {
    color: var(--cve-green);
}

.icon-secondary {
    color: var(--cve-navy);
}

/* Ring colors for focus states */
.ring-primary-500 {
    --tw-ring-color: rgba(157, 198, 63, 0.5);
}

/* Dropdown hover */
.dropdown-item:hover {
    background-color: rgba(157, 198, 63, 0.1);
    color: var(--cve-green);
}

/* Table row hover */
.table tbody tr:hover {
    background-color: rgba(157, 198, 63, 0.05);
}

/* Pagination */
.pagination .page-item.active .page-link {
    background-color: var(--cve-green);
    border-color: var(--cve-green);
}

.pagination .page-link:hover {
    color: var(--cve-green);
    background-color: rgba(157, 198, 63, 0.1);
}

/* Switch/Toggle */
.toggle-switch:checked {
    background-color: var(--cve-green);
}

/* Scrollbar customization */
::-webkit-scrollbar-thumb {
    background-color: var(--cve-green);
}

::-webkit-scrollbar-thumb:hover {
    background-color: var(--cve-green-dark);
}

/* Loading spinner */
.spinner-primary {
    border-color: var(--cve-green);
    border-top-color: transparent;
}

/* Charts - override default colors */
[data-chart-colors*="bg-primary-500"] {
    --chart-color-1: var(--cve-green);
    --chart-color-2: var(--cve-navy);
    --chart-color-3: var(--cve-green-dark);
}

/* Stats cards icons */
.stats-icon-primary {
    background: linear-gradient(135deg, var(--cve-green) 0%, var(--cve-green-dark) 100%);
    color: white;
}

.stats-icon-secondary {
    background: linear-gradient(135deg, var(--cve-navy) 0%, var(--cve-navy-light) 100%);
    color: white;
}

/* Dark mode adjustments */
.dark .link-cve,
.dark .link-primary {
    color: var(--cve-green);
}

.dark .link-cve:hover,
.dark .link-primary:hover {
    color: var(--cve-green-dark);
}

/* Utility classes */
.shadow-cve-green {
    box-shadow: 0 4px 12px rgba(157, 198, 63, 0.3);
}

.shadow-cve-navy {
    box-shadow: 0 4px 12px rgba(30, 58, 95, 0.3);
}

/* Hover effects */
.hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(157, 198, 63, 0.2);
}

/* VirtualSelect — autoriser le retour à la ligne pour les textes longs */
.vscomp-option {
    white-space: normal !important;
    height: auto !important;
    min-height: 36px;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    align-items: flex-start !important;
}

.vscomp-option-text {
    white-space: normal !important;
    word-break: break-word;
    line-height: 1.4;
}

.vscomp-value-tag-content {
    white-space: normal !important;
    word-break: break-word;
    line-height: 1.4;
}
/* Custom Select Component (Alpine.js based) */
.custom-select-option {
    transition: all 0.2s ease-in-out !important;
}
.custom-select-option:hover {
    background-color: #e2e8f0 !important; /* Slate-200: Sobre mais visible */
    border-left-color: #9DC63F !important; /* Vert CVE */
    color: #1E3A5F !important; /* Navy CVE */
}
.custom-select-option.active {
    background-color: #e6f2c8 !important; /* Vert pâle CVE */
    border-left-color: #9DC63F !important;
    color: #1E3A5F !important;
}
