/* =====================================================
   KNOPEE - TYPOGRAPHIE GLOBALE
   Référence visuelle : interface CFA
   ===================================================== */

/* La police est chargée ici une seule fois pour toutes les pages KnoP. */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');

/*
 * Normalisation globale :
 * - Roboto pour l'interface entière ;
 * - les composants de formulaire et boutons héritent de la même police ;
 * - les graisses spécifiques déjà définies dans les pages restent inchangées.
 */
html,
body,
input,
button,
select,
optgroup,
textarea {
    font-family: "Roboto", sans-serif !important;
}

/* Le menu latéral et l'en-tête doivent conserver le rendu CFA. */
.side-navbar,
.side-navbar .sidebar-link,
.side-navbar .heading,
.sidebar-header,
.activity-switch,
.logout-switch {
    font-family: "Roboto", sans-serif !important;
}

.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}
.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}
.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}
/* your styles go here */
.logo img{
opacity:0.5;
    width:200px;
    
}
.image-clignote  {
   animation-duration: .8s;
   animation-name: clignoter;
   animation-iteration-count: infinite;
   transition: none;
}
@keyframes clignoter {
  0%   { opacity:1; }
  40%   {opacity:0; }
  100% { opacity:1; }
}
/*------------------------Personnalisation--------------------------*/
.ligne-preuve {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid #e5e5e5;
}

.preuve-info {
    display: flex;
    gap: 30px;
    align-items: center;
}

.preuve-actions {
    display: flex;
    gap: 12px;
}

.btn {
    min-width: 110px;
}
.btn:focus,
.btn:active,
.btn.focus,
.btn:active:focus {
	   box-shadow: 0 0 0 0.25rem rgba(10, 81, 160, 0.3);
    box-shadow: none !important;
    outline: none !important;
}
/* Checkbox en lecture seule (non modifiable mais visible clairement) */
.checkbox-readonly {
    pointer-events: none;   /* bloque le clic */
    opacity: 1;             /* évite l’effet grisé */
    cursor: default;
}

/* Optionnel : amélioration visuelle */
.checkbox-readonly {
    width: 18px;
    height: 18px;
    accent-color: #ffc107; /* jaune knop (btn-warning) */
}
/* =========================
   TABLEAUX KNOPEE
========================= */

/* Supprime l'effet striped */
.table-striped > tbody > tr:nth-of-type(odd),
.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #fff !important;
}

/* Garde des lignes propres */
.table tbody tr {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.15s ease-in-out;
}

/* Gris au survol */
.table tbody tr:hover,
.table-striped tbody tr:hover {
    background-color: #f1f3f5 !important;
}

/* Cellules un peu plus propres */
.table td,
.table th {
    vertical-align: middle;
    padding: 10px 12px;
}
/* =====================================================
   KNOPEE UI - BASE GLOBALE
===================================================== */

body {
    background-color: #f5f7fb;
    font-size: 14px;
    color: #495057;
}


/* =====================================================
   TABLEAUX
===================================================== */

/* Supprime le striped Bootstrap */
.table-striped > tbody > tr:nth-of-type(odd),
.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #ffffff !important;
}

/* Structure des lignes */
.table tbody tr {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.15s ease-in-out;
}

/* Hover (important UX) */
.table tbody tr:hover,
.table-striped tbody tr:hover {
    background-color: #f1f5ff !important;
    cursor: pointer;
}

/* En-têtes */
.table thead th {
    background-color: #f8f9fa;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #dee2e6;
}

/* Cellules */
.table td,
.table th {
    padding: 10px 12px;
    vertical-align: middle;
}


/* =====================================================
   BOUTONS
===================================================== */

/* Bouton principal */
.btn-primary {
    background-color: #3b5bdb;
    border-color: #3b5bdb;
    font-weight: 500;
}

.btn-primary:hover {
    background-color: #2f4acb;
    border-color: #2f4acb;
}

/* Bouton warning (souvent utilisé chez vous) */
.btn-warning {
    background-color: transparent !important;
    border: 1px solid #ffb020 !important;
    color: #ffb020 !important;
    font-weight: 500;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: #ffb020 !important;
    border-color: #ffb020 !important;
    color: #ffffff !important;
}


/* =====================================================
   FORMULAIRES
===================================================== */

.form-control {
    border-radius: 6px;
    border: 1px solid #ced4da;
    padding: 8px 10px;
    font-size: 14px;
}

.form-control:focus {
    border-color: #3b5bdb;
    box-shadow: 0 0 0 0.1rem rgba(59, 91, 219, 0.25);
}


/* =====================================================
   CHECKBOX (corrige votre problème de visibilité)
===================================================== */

input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #3b5bdb;
}

input[type="checkbox"][disabled] {
    opacity: 1;
}


/* =====================================================
   CARTES / BLOCS
===================================================== */

.card {
    border: 1px solid #e9ecef;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

.card-header {
    background-color: #f8f9fa;
    font-weight: 600;
}


/* =====================================================
   NAVIGATION (léger ajustement visuel)
===================================================== */

.side-navbar {
    box-shadow: 2px 0 8px rgba(0,0,0,0.05);
}

.header {
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}


/* =====================================================
   PETITS DÉTAILS UX
===================================================== */

/* Liens plus propres */
a {
    text-decoration: none;
}

/* Hover léger sur liens */
a:hover {
    text-decoration: none;
    opacity: 0.9;
}
/* =========================
   TABLEAUX - LISIBILITÉ TEXTE
========================= */

.table {
    font-size: 15px; /* au lieu de 14 */
}

/* En-têtes un peu plus marqués */
.table thead th {
    font-size: 14.5px;
    font-weight: 600;
}

/* Cellules */
.table td {
    font-size: 15px;
}

/* Option : valeurs importantes légèrement accentuées */
.table td strong {
    font-weight: 600;
}
/* Boutons outline dans les tableaux */
.btn-outline-primary,
.btn-outline-primary:link,
.btn-outline-primary:visited {
    color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    background-color: transparent !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    color: #ffffff !important;
    background-color: #3b5bdb !important;
    border-color: #3b5bdb !important;
}
/* =========================
   FORCE TOUS LES BTN-WARNING EN OUTLINE
========================= */

.btn-warning,
.btn-warning:link,
.btn-warning:visited,
.btn-warning:active,
.btn-warning:focus {
    background-color: transparent !important;
    color: #f59f00 !important;
    border: 1px solid #f59f00 !important;
}

/* Hover uniquement en plein */
.btn-warning:hover {
    background-color: #f59f00 !important;
    color: #ffffff !important;
}
/* =========================================
   NORMALISATION DES BOUTONS DANS KNOPEE
========================================= */

/* Tous les boutons warning deviennent visuellement primary */
.btn-warning {
    background-color: transparent !important;
    color: #3b5bdb !important;
    border: 1px solid #3b5bdb !important;
}

/* Hover = bleu plein (comme votre capture) */
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: #3b5bdb !important;
    color: #ffffff !important;
    border-color: #3b5bdb !important;
}
/* =========================================
   BOUTONS OUTLINE : TEXTE TOUJOURS BLEU/BLANC
========================================= */

.btn-outline-primary,
.btn-outline-primary:link,
.btn-outline-primary:visited {
    color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    background-color: transparent !important;
    text-decoration: none !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    color: #ffffff !important;
    background-color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    text-decoration: none !important;
}

/* Même logique pour les anciens btn-warning que vous avez harmonisés */
.btn-warning,
.btn-warning:link,
.btn-warning:visited {
    color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    background-color: transparent !important;
    text-decoration: none !important;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    color: #ffffff !important;
    background-color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    text-decoration: none !important;
}
/* =========================================
   CORRECTION DEFINITIVE TEXTE BOUTONS TABLEAUX
========================================= */

/* Boutons dans tableaux = priorité maximale */
.table a.btn,
.table a.btn:link,
.table a.btn:visited {
    color: #3b5bdb !important;
}

/* Survol = texte blanc (jamais rouge) */
.table a.btn:hover,
.table a.btn:focus,
.table a.btn:active {
    color: #ffffff !important;
}

/* Cas lignes actives / sélectionnées */
.table tr:hover a.btn,
.table tr.active a.btn,
.table tr.selected a.btn {
    color: #ffffff !important;
}
.table a.btn,
.table a.btn:link,
.table a.btn:visited {
    color: #3b5bdb !important;
    text-decoration: none !important;
}

.table a.btn:hover,
.table a.btn:focus,
.table a.btn:active {
    color: #ffffff !important;
    text-decoration: none !important;
}

a.btn-outline-primary,
a.btn-outline-primary:link,
a.btn-outline-primary:visited {
    color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    background-color: transparent !important;
}

a.btn-outline-primary:hover,
a.btn-outline-primary:focus,
a.btn-outline-primary:active {
    color: #ffffff !important;
    background-color: #3b5bdb !important;
    border-color: #3b5bdb !important;
}
.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}
.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}
.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}.fc-event.event-planifie {
    opacity: 0.6;
    background-image: repeating-linear-gradient(
        45deg,
        rgba(255,255,255,.35),
        rgba(255,255,255,.35) 6px,
        rgba(255,255,255,0) 6px,
        rgba(255,255,255,0) 12px
    );
    cursor: not-allowed;
}

.fc-event.event-reel {
    border-radius: 4px;
}
/* your styles go here */
.logo img{
opacity:0.5;
    width:200px;
    
}
.image-clignote  {
   animation-duration: .8s;
   animation-name: clignoter;
   animation-iteration-count: infinite;
   transition: none;
}
@keyframes clignoter {
  0%   { opacity:1; }
  40%   {opacity:0; }
  100% { opacity:1; }
}
/*------------------------Personnalisation--------------------------*/
.ligne-preuve {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid #e5e5e5;
}

.preuve-info {
    display: flex;
    gap: 30px;
    align-items: center;
}

.preuve-actions {
    display: flex;
    gap: 12px;
}

.btn {
    min-width: 110px;
}
.btn:focus,
.btn:active,
.btn.focus,
.btn:active:focus {
	   box-shadow: 0 0 0 0.25rem rgba(10, 81, 160, 0.3);
    box-shadow: none !important;
    outline: none !important;
}
/* Checkbox en lecture seule (non modifiable mais visible clairement) */
.checkbox-readonly {
    pointer-events: none;   /* bloque le clic */
    opacity: 1;             /* évite l’effet grisé */
    cursor: default;
}

/* Optionnel : amélioration visuelle */
.checkbox-readonly {
    width: 18px;
    height: 18px;
    accent-color: #ffc107; /* jaune knop (btn-warning) */
}
/* =========================
   TABLEAUX KNOPEE
========================= */

/* Supprime l'effet striped */
.table-striped > tbody > tr:nth-of-type(odd),
.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #fff !important;
}

/* Garde des lignes propres */
.table tbody tr {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.15s ease-in-out;
}

/* Gris au survol */
.table tbody tr:hover,
.table-striped tbody tr:hover {
    background-color: #f1f3f5 !important;
}

/* Cellules un peu plus propres */
.table td,
.table th {
    vertical-align: middle;
    padding: 10px 12px;
}
/* =====================================================
   KNOPEE UI - BASE GLOBALE
===================================================== */

body {
    background-color: #f5f7fb;
    font-size: 14px;
    color: #495057;
}


/* =====================================================
   TABLEAUX
===================================================== */

/* Supprime le striped Bootstrap */
.table-striped > tbody > tr:nth-of-type(odd),
.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #ffffff !important;
}

/* Structure des lignes */
.table tbody tr {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.15s ease-in-out;
}

/* Hover (important UX) */
.table tbody tr:hover,
.table-striped tbody tr:hover {
    background-color: #f1f5ff !important;
    cursor: pointer;
}

/* En-têtes */
.table thead th {
    background-color: #f8f9fa;
    font-weight: 600;
    color: #495057;
    border-bottom: 2px solid #dee2e6;
}

/* Cellules */
.table td,
.table th {
    padding: 10px 12px;
    vertical-align: middle;
}


/* =====================================================
   BOUTONS
===================================================== */

/* Bouton principal */
.btn-primary {
    background-color: #3b5bdb;
    border-color: #3b5bdb;
    font-weight: 500;
}

.btn-primary:hover {
    background-color: #2f4acb;
    border-color: #2f4acb;
}

/* Bouton warning (souvent utilisé chez vous) */
.btn-warning {
    background-color: transparent !important;
    border: 1px solid #ffb020 !important;
    color: #ffb020 !important;
    font-weight: 500;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: #ffb020 !important;
    border-color: #ffb020 !important;
    color: #ffffff !important;
}


/* =====================================================
   FORMULAIRES
===================================================== */

.form-control {
    border-radius: 6px;
    border: 1px solid #ced4da;
    padding: 8px 10px;
    font-size: 14px;
}

.form-control:focus {
    border-color: #3b5bdb;
    box-shadow: 0 0 0 0.1rem rgba(59, 91, 219, 0.25);
}


/* =====================================================
   CHECKBOX (corrige votre problème de visibilité)
===================================================== */

input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #3b5bdb;
}

input[type="checkbox"][disabled] {
    opacity: 1;
}


/* =====================================================
   CARTES / BLOCS
===================================================== */

.card {
    border: 1px solid #e9ecef;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

.card-header {
    background-color: #f8f9fa;
    font-weight: 600;
}


/* =====================================================
   NAVIGATION (léger ajustement visuel)
===================================================== */

.side-navbar {
    box-shadow: 2px 0 8px rgba(0,0,0,0.05);
}

.header {
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}


/* =====================================================
   PETITS DÉTAILS UX
===================================================== */

/* Liens plus propres */
a {
    text-decoration: none;
}

/* Hover léger sur liens */
a:hover {
    text-decoration: none;
    opacity: 0.9;
}
/* =========================
   TABLEAUX - LISIBILITÉ TEXTE
========================= */

.table {
    font-size: 15px; /* au lieu de 14 */
}

/* En-têtes un peu plus marqués */
.table thead th {
    font-size: 14.5px;
    font-weight: 600;
}

/* Cellules */
.table td {
    font-size: 15px;
}

/* Option : valeurs importantes légèrement accentuées */
.table td strong {
    font-weight: 600;
}
/* Boutons outline dans les tableaux */
.btn-outline-primary,
.btn-outline-primary:link,
.btn-outline-primary:visited {
    color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    background-color: transparent !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    color: #ffffff !important;
    background-color: #3b5bdb !important;
    border-color: #3b5bdb !important;
}
/* =========================
   FORCE TOUS LES BTN-WARNING EN OUTLINE
========================= */

.btn-warning,
.btn-warning:link,
.btn-warning:visited,
.btn-warning:active,
.btn-warning:focus {
    background-color: transparent !important;
    color: #f59f00 !important;
    border: 1px solid #f59f00 !important;
}

/* Hover uniquement en plein */
.btn-warning:hover {
    background-color: #f59f00 !important;
    color: #ffffff !important;
}
/* =========================================
   NORMALISATION DES BOUTONS DANS KNOPEE
========================================= */

/* Tous les boutons warning deviennent visuellement primary */
.btn-warning {
    background-color: transparent !important;
    color: #3b5bdb !important;
    border: 1px solid #3b5bdb !important;
}

/* Hover = bleu plein (comme votre capture) */
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: #3b5bdb !important;
    color: #ffffff !important;
    border-color: #3b5bdb !important;
}
/* =========================================
   BOUTONS OUTLINE : TEXTE TOUJOURS BLEU/BLANC
========================================= */

.btn-outline-primary,
.btn-outline-primary:link,
.btn-outline-primary:visited {
    color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    background-color: transparent !important;
    text-decoration: none !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    color: #ffffff !important;
    background-color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    text-decoration: none !important;
}

/* Même logique pour les anciens btn-warning que vous avez harmonisés */
.btn-warning,
.btn-warning:link,
.btn-warning:visited {
    color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    background-color: transparent !important;
    text-decoration: none !important;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    color: #ffffff !important;
    background-color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    text-decoration: none !important;
}
/* =========================================
   CORRECTION DEFINITIVE TEXTE BOUTONS TABLEAUX
========================================= */

/* Boutons dans tableaux = priorité maximale */
.table a.btn,
.table a.btn:link,
.table a.btn:visited {
    color: #3b5bdb !important;
}

/* Survol = texte blanc (jamais rouge) */
.table a.btn:hover,
.table a.btn:focus,
.table a.btn:active {
    color: #ffffff !important;
}

/* Cas lignes actives / sélectionnées */
.table tr:hover a.btn,
.table tr.active a.btn,
.table tr.selected a.btn {
    color: #ffffff !important;
}
.table a.btn,
.table a.btn:link,
.table a.btn:visited {
    color: #3b5bdb !important;
    text-decoration: none !important;
}

.table a.btn:hover,
.table a.btn:focus,
.table a.btn:active {
    color: #ffffff !important;
    text-decoration: none !important;
}

a.btn-outline-primary,
a.btn-outline-primary:link,
a.btn-outline-primary:visited {
    color: #3b5bdb !important;
    border-color: #3b5bdb !important;
    background-color: transparent !important;
}

a.btn-outline-primary:hover,
a.btn-outline-primary:focus,
a.btn-outline-primary:active {
    color: #ffffff !important;
    background-color: #3b5bdb !important;
    border-color: #3b5bdb !important;
}
/* =========================================
   BADGES METIER KNOPEE
========================================= */

.badge-knop {
    display: inline-block;
    padding: 3px 7px;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    border-radius: 2px;
    white-space: nowrap;
    text-transform: none;
    vertical-align: middle;
}

.badge-knop-primary {
    background: #0b3d91 !important;
    color: #ffffff !important;
}

.badge-knop-warning {
    background: #ffc107 !important;
    color: #212529 !important;
}

.badge-knop-secondary {
    background: #6c757d !important;
    color: #ffffff !important;
}
/* =========================================
   BADGES RAPPROCHEMENTS
========================================= */


.montant-recette {
    color: #0d6efd !important;
    font-weight: 700;
}

.montant-depense {
    color: #dc3545 !important;
    font-weight: 700;
}
.badge-knop {
    padding: 0.28rem 0.55rem;
    border-radius: 0.2rem;
    font-size: 0.72rem;
    font-weight: 700;
}

.badge-rapprochee {
    background: #0d47a1;
    color: #fff;
}

.badge-non-rapprochee {
    background: #f4b400;
    color: #111;
}
.nav-link-disabled {
    opacity: 0.4;
    pointer-events: none;
    cursor: not-allowed;
    filter: grayscale(100%);
}
.nav-link-disabled:hover {
    text-decoration: none;
    color: inherit;
}
.nav-link-disabled .badge-inactif {
    font-size: 0.65rem;
    margin-left: 6px;
    background: #6c757d;
}
.btn-right {
    margin-left: auto;
}