/* ============================================================
   Brand Colors — Utilitaires pour Bootstrap 5.3
   Palette issue de la charte graphique.
   Ne surcharge que les COULEURS : le reste (padding, radius,
   focus, transitions...) reste géré par Bootstrap.
   ============================================================ */

:root {
    /* --- Couleurs principales (claires) --- */
    --brand-midblue:  #0071CE;
    --brand-gold:     #B38B38;
    --brand-yellow:   #FFD600;
    --brand-green:    #74C045;
    --brand-teal:     #00BBB4;
    --brand-blue:     #1C9AD6;
    --brand-purple:   #9993C8;

    /* --- Couleurs foncées (partenaires de dégradé) --- */
    --brand-darkblue:    #00205C;
    --brand-darkgold:    #773F05;
    --brand-darkorange:  #FF671D;
    --brand-darkgreen:   #366131;
    --brand-middarkblue: #0054A3;
    --brand-darkpurple:  #723F98;
}

/* ============================================================
   1. Fonds unis  ->  .bg-midblue, .bg-gold, ...
   ============================================================ */
.bg-midblue     { background-color: var(--brand-midblue)     !important; }
.bg-gold        { background-color: var(--brand-gold)        !important; }
.bg-yellow      { background-color: var(--brand-yellow)      !important; }
.bg-green       { background-color: var(--brand-green)       !important; }
.bg-teal        { background-color: var(--brand-teal)        !important; }
.bg-blue        { background-color: var(--brand-blue)        !important; }
.bg-purple      { background-color: var(--brand-purple)      !important; }

.bg-darkblue    { background-color: var(--brand-darkblue)    !important; }
.bg-darkgold    { background-color: var(--brand-darkgold)    !important; }
.bg-darkorange  { background-color: var(--brand-darkorange)  !important; }
.bg-darkgreen   { background-color: var(--brand-darkgreen)   !important; }
.bg-middarkblue { background-color: var(--brand-middarkblue) !important; }
.bg-darkpurple  { background-color: var(--brand-darkpurple)  !important; }

/* ============================================================
   2. Couleurs de texte  ->  .text-midblue, ...
   ============================================================ */
.text-midblue    { color: var(--brand-midblue)     !important; }
.text-gold       { color: var(--brand-gold)        !important; }
.text-yellow     { color: var(--brand-yellow)      !important; }
.text-green      { color: var(--brand-green)       !important; }
.text-teal       { color: var(--brand-teal)        !important; }
.text-blue       { color: var(--brand-blue)        !important; }
.text-purple     { color: var(--brand-purple)      !important; }
.text-darkblue   { color: var(--brand-darkblue)    !important; }
.text-darkgold   { color: var(--brand-darkgold)    !important; }
.text-darkorange { color: var(--brand-darkorange)  !important; }
.text-darkgreen  { color: var(--brand-darkgreen)   !important; }
.text-middarkblue{ color: var(--brand-middarkblue) !important; }
.text-darkpurple { color: var(--brand-darkpurple)  !important; }

/* ============================================================
   3. Dégradés (clair -> foncé)  ->  .bg-gradient-midblue, ...
   Angle 135deg — change-le librement (ex. 180deg = vertical).
   ============================================================ */
.bg-gradient-midblue { background-image: linear-gradient(135deg, var(--brand-midblue), var(--brand-darkblue))    !important; }
.bg-gradient-gold    { background-image: linear-gradient(135deg, var(--brand-gold),    var(--brand-darkgold))    !important; }
.bg-gradient-yellow  { background-image: linear-gradient(135deg, var(--brand-yellow),  var(--brand-darkorange))  !important; }
.bg-gradient-green   { background-image: linear-gradient(135deg, var(--brand-green),   var(--brand-darkgreen))   !important; }
.bg-gradient-teal    { background-image: linear-gradient(135deg, var(--brand-teal),    var(--brand-darkblue))    !important; }
.bg-gradient-blue    { background-image: linear-gradient(135deg, var(--brand-blue),    var(--brand-middarkblue)) !important; }
.bg-gradient-purple  { background-image: linear-gradient(135deg, var(--brand-purple),  var(--brand-darkpurple))  !important; }

/* ============================================================
   4. Boutons unis  ->  .btn-midblue, .btn-gold, ...
   On ne touche qu'aux variables --bs-btn-*.
   Au survol / à l'appui, le bouton bascule sur sa couleur
   foncée partenaire (logique de la charte).
   ============================================================ */
.btn-midblue {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-midblue);
    --bs-btn-border-color: var(--brand-midblue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-darkblue);
    --bs-btn-hover-border-color: var(--brand-darkblue);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-darkblue);
    --bs-btn-active-border-color: var(--brand-darkblue);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--brand-midblue);
    --bs-btn-disabled-border-color: var(--brand-midblue);
    --bs-btn-focus-shadow-rgb: 0, 113, 206;
}

.btn-gold {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-gold);
    --bs-btn-border-color: var(--brand-gold);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-darkgold);
    --bs-btn-hover-border-color: var(--brand-darkgold);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-darkgold);
    --bs-btn-active-border-color: var(--brand-darkgold);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--brand-gold);
    --bs-btn-disabled-border-color: var(--brand-gold);
    --bs-btn-focus-shadow-rgb: 179, 139, 56;
}

.btn-yellow {
    --bs-btn-color: var(--brand-darkblue);
    --bs-btn-bg: var(--brand-yellow);
    --bs-btn-border-color: var(--brand-yellow);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-darkorange);
    --bs-btn-hover-border-color: var(--brand-darkorange);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-darkorange);
    --bs-btn-active-border-color: var(--brand-darkorange);
    --bs-btn-disabled-color: var(--brand-darkblue);
    --bs-btn-disabled-bg: var(--brand-yellow);
    --bs-btn-disabled-border-color: var(--brand-yellow);
    --bs-btn-focus-shadow-rgb: 255, 214, 0;
}

.btn-green {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-green);
    --bs-btn-border-color: var(--brand-green);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-darkgreen);
    --bs-btn-hover-border-color: var(--brand-darkgreen);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-darkgreen);
    --bs-btn-active-border-color: var(--brand-darkgreen);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--brand-green);
    --bs-btn-disabled-border-color: var(--brand-green);
    --bs-btn-focus-shadow-rgb: 116, 192, 69;
}

.btn-teal {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-teal);
    --bs-btn-border-color: var(--brand-teal);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-darkblue);
    --bs-btn-hover-border-color: var(--brand-darkblue);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-darkblue);
    --bs-btn-active-border-color: var(--brand-darkblue);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--brand-teal);
    --bs-btn-disabled-border-color: var(--brand-teal);
    --bs-btn-focus-shadow-rgb: 0, 187, 180;
}

.btn-blue {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-blue);
    --bs-btn-border-color: var(--brand-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-middarkblue);
    --bs-btn-hover-border-color: var(--brand-middarkblue);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-middarkblue);
    --bs-btn-active-border-color: var(--brand-middarkblue);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--brand-blue);
    --bs-btn-disabled-border-color: var(--brand-blue);
    --bs-btn-focus-shadow-rgb: 28, 154, 214;
}

.btn-purple {
    --bs-btn-color: var(--brand-darkblue);
    --bs-btn-bg: var(--brand-purple);
    --bs-btn-border-color: var(--brand-purple);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-darkpurple);
    --bs-btn-hover-border-color: var(--brand-darkpurple);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-darkpurple);
    --bs-btn-active-border-color: var(--brand-darkpurple);
    --bs-btn-disabled-color: var(--brand-darkblue);
    --bs-btn-disabled-bg: var(--brand-purple);
    --bs-btn-disabled-border-color: var(--brand-purple);
    --bs-btn-focus-shadow-rgb: 153, 147, 200;
}

/* ============================================================
   5. Boutons en dégradé (bonus)  ->  .btn-gradient-midblue, ...
   Fond dégradé clair->foncé, léger assombrissement au survol.
   ============================================================ */
.btn-gradient-midblue,
.btn-gradient-gold,
.btn-gradient-yellow,
.btn-gradient-green,
.btn-gradient-teal,
.btn-gradient-blue,
.btn-gradient-purple {
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-color: #fff;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-border-color: transparent;
    border: 0;
    background-repeat: no-repeat;
}

.btn-gradient-midblue:hover, .btn-gradient-midblue:active,
.btn-gradient-gold:hover,    .btn-gradient-gold:active,
.btn-gradient-yellow:hover,  .btn-gradient-yellow:active,
.btn-gradient-green:hover,   .btn-gradient-green:active,
.btn-gradient-teal:hover,    .btn-gradient-teal:active,
.btn-gradient-blue:hover,    .btn-gradient-blue:active,
.btn-gradient-purple:hover,  .btn-gradient-purple:active {
    filter: brightness(0.93);
}

.btn-gradient-midblue { background-image: linear-gradient(135deg, var(--brand-midblue), var(--brand-darkblue)); }
.btn-gradient-gold    { background-image: linear-gradient(135deg, var(--brand-gold),    var(--brand-darkgold)); }
.btn-gradient-green   { background-image: linear-gradient(135deg, var(--brand-green),   var(--brand-darkgreen)); }
.btn-gradient-teal    { background-image: linear-gradient(135deg, var(--brand-teal),    var(--brand-darkblue)); }
.btn-gradient-blue    { background-image: linear-gradient(135deg, var(--brand-blue),    var(--brand-middarkblue)); }
.btn-gradient-purple  { background-image: linear-gradient(135deg, var(--brand-purple),  var(--brand-darkpurple)); }

/* Le jaune commence trop clair : texte foncé pour rester lisible */
.btn-gradient-yellow {
    --bs-btn-color: var(--brand-darkblue);
    --bs-btn-hover-color: var(--brand-darkblue);
    --bs-btn-active-color: var(--brand-darkblue);
    background-image: linear-gradient(135deg, var(--brand-yellow), var(--brand-darkorange));
}

[class*=sidebar-dark-] .sidebar a {
    color: white !important;
}

.bg-gain {
    background-color: #2D2E84 !important;
}


@font-face {
    font-family: 'Effra';
    src: url('/fonts/Effra/Effra_Rg.ttf') format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Effra';
    src: url('/fonts/Effra/Effra_Md.ttf') format("truetype");
    font-weight: bold;
    font-style: normal;
}
/*
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto/Roboto-Italic.ttf') format("truetype");
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto/Roboto-BoldItalic.ttf') format("truetype");
    font-weight: bold;
    font-style: italic;
}

 */


body {
    font-family: 'Effra',  sans-serif;
}

.ag-theme-alpine {
    font-family: 'Effra',  sans-serif !important;
}


body.sidebar-mini:not(.filemaker), aside.main-sidebar {
    /*
    background: url("/img/csr/body-bg.jpg") no-repeat center center #004265 !important;
    background-size: cover!important;

     */
    /*background-color: #004265;*/
}

body.login-page, body.register-page {
    /*
    background: url("/img/csr/body-bg.jpg") no-repeat center center #004265 !important;
    background-size: cover!important;
     */
    background-image: linear-gradient(135deg, var(--brand-teal),    var(--brand-darkblue))    !important;
}

.brand-link .brand-image {
    max-height: 50px !important;
}

h1, h2, h3, h4, h5 {
    font-weight: bold !important;
}
