:root {
    --gr-primary: #00695c;
    --gr-primary-dark: #004d40;
    --gr-neutral: #546e7a;
    --gr-bg: #f4f6f8;
    --gr-border-card: #9e9e9e;

    /* Ordre d'urgence : 2 (max) > 1 > 0 (non prioritaire, tri par date) > 9 (non prioritaire, toujours en bas). */
    --gr-priorite-2: #c62828; /* rouge */
    --gr-priorite-1: #ff8f00; /* orange */
    --gr-priorite-0: #1565c0; /* bleu */
    --gr-priorite-9: #78909c; /* gris */

    /* Indicateur de retard (missions Appro/Anticip uniquement) : vert < 20 min, orange 20-40 min, rouge >= 40 min. */
    --gr-retard-ok: #2e7d32;
    --gr-retard-attention: #ff8f00;
    --gr-retard-critique: #c62828;

    /* Couleur "primary" du thème Radzen (par défaut un violet #4340D2) remplacée par le vert de la marque -
       toutes les nuances dérivées pour rester cohérent avec la palette Material Teal 800/900. */
    --rz-primary: #00695c;
    --rz-primary-light: #26a69a;
    --rz-primary-lighter: rgba(0, 105, 92, 0.12);
    --rz-primary-dark: #004d40;
    --rz-primary-darker: #00332b;
    --rz-on-primary-lighter: #00695c;
}

/* ---- Toasters (RadzenNotification) : agrandis, centrés en haut plutôt qu'en haut à droite ---- */
.rz-notification {
    inset-inline-end: auto;
    inset-inline-start: 50%;
    inset-block-start: 24px;
    transform: translateX(-50%);
}
.rz-notification-item-wrapper {
    width: auto;
    min-width: 560px;
    max-width: 800px;
}
.rz-notification-item {
    font-size: 1.4rem;
    padding: 28px 32px;
}
.rz-notification-title {
    font-size: 1.7rem;
}
.rz-notification-icon {
    font-size: 2.4rem;
}

body {
    background-color: var(--gr-bg);
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
}

/* ---- Écran de chargement (avant le démarrage de Blazor, HTML statique dans index.html) ---- */
.gr-loading {
    position: fixed;
    inset: 0;
    background: var(--gr-primary-dark);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
}
.gr-loading-icon {
    font-size: 4.5rem;
    margin-bottom: 16px;
}
.gr-loading-title {
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    margin-bottom: 32px;
}
.gr-loading .loading-progress {
    position: relative;
    inset: auto;
    width: 4rem;
    height: 4rem;
    margin: 0;
}
.gr-loading .loading-progress circle:first-child {
    stroke: rgba(255,255,255,0.25);
}
.gr-loading .loading-progress circle:last-child {
    stroke: white;
}
.gr-loading .loading-progress-text {
    position: relative;
    inset: auto;
    margin-top: 10px;
    color: white;
}

/* ---- Toolbar card ---- */
.gr-toolbar {
    background: white;
    border-radius: 8px;
    padding: 14px 20px;
    margin-bottom: 16px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

/* ---- Data grid ---- */
.rz-grid-table { font-size: 0.875rem; }
.rz-grid-table thead th { background: #eceff1 !important; color: #37474f !important; font-weight: 600; }

/* ---- Grid row actions (Paramétrage tables) ---- */
.gr-row-actions {
    display: flex;
    flex-direction: row;
    gap: 16px;
    align-items: center;
    justify-content: flex-end;
}
.gr-row-actions .rz-button {
    width: auto;
}

/* ---- Sélection périmètre chariot (page de connexion et pop-in de changement de périmètre) ---- */
.gr-selection-card {
    position: relative;
    background: white;
    border-radius: 10px;
    padding: 28px;
    margin-bottom: 14px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    cursor: pointer;
    text-align: center;
    font-weight: 600;
    font-size: 1.5rem;
    border: 2px solid transparent;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gr-selection-card:hover { border-color: var(--gr-primary); }
.gr-selection-count {
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 1;
    color: var(--gr-primary-dark);
    background: var(--gr-bg);
    padding: 6px 20px;
    border-radius: 999px;
    white-space: nowrap;
    min-width: 1.8rem;
    text-align: center;
}

/* ---- Pop-in d'ajout/modification (Paramétrage) ---- */
.gr-popin-form { display: flex; flex-direction: column; gap: 14px; min-width: 320px; }
.gr-popin-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.gr-field { display: flex; flex-direction: column; gap: 4px; }
.gr-field-label { font-size: 0.75rem; color: #78909c; font-weight: 500; }

/* WCAG: focus visible */
*:focus-visible {
    outline: 3px solid #ff8f00;
    outline-offset: 2px;
}