:root {
    --bleuCristalens: #1a237e;
    --cyanCristalens: #17a2b8;
    --tabCyan: #e0ffff;
    --cyan-clair  : #e0f7fa;
    --gris-fond   : #f4f6f9;
    --rouge-alerte: #dc3545;
    --orange-warn : #fd7e14;
}




.kpi-card {
    border: none;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.07);
    transition: transform 0.2s ease; /* légère animation au survol */
}

.kpi-card:hover {
    transform: translateY(-3px);
}

/* Carré coloré qui contient l'icône */
.kpi-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    color: white;
    flex-shrink: 0; /* empêche l'icône de rétrécir */
}

/* Variantes de couleur pour les icônes KPI */
.kpi-icon.cyan   { background-color: var(--cyanCristalens); }
.kpi-icon.marine { background-color: var(--bleuCristalens); }
.kpi-icon.orange { background-color: #fd7e14; }
.kpi-icon.vert   { background-color: #28a745; }
.kpi-icon.rouge   { background-color: #dc3545;}

/* Gros chiffre dans la carte */
.kpi-value {
    font-size: 1.5 rem;
    font-weight: 700;
    color: var(--bleuCristalens);
    line-height: 1.1;
}

/* Libellé sous le chiffre */
.kpi-label {
    font-size: 0.8rem;
    color: #6c757d;
}




















body {
    /*zoom: 0.75;*/ /* Réduit tout à 75% */
     -moz-transform: scale(0.75); /*Correction pour les anciennes versions de Firefox */
    -moz-transform-origin: 0 0;
}


.header_list_item {
    color: white;
    background-color: var(--bleuCristalens);
}

.selectionMenu:link, .selectionMenu:visited {
  background-image: linear-gradient(to bottom right, #17a2b8, #0f6f7e);
  color: white;
  padding: 14px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

.selectionMenu:hover, .selectionMenu:active {
  /* background-color: var(--bleuCristalens); */
  background-image: linear-gradient(135deg, #3949ab 0%, #1a237e 100%);
}

#indexInfos {
    margin-top: 25px;
    min-height: 24px; /* Évite le saut de ligne au chargement */
}

.info-item {
    /* font-weight: bold; */
    min-width: 100px; /* Assure que chaque bloc garde sa place */
    text-align: center;
}