/* ------------------------------------------------------------
   FINALISATION VISUELLE - SURCHARGES NON DESTRUCTIVES
   ------------------------------------------------------------ */

:root {
    --animation-interface: 190ms;
    --fond-verre-noir: rgba(8, 11, 16, 0.72);
    --fond-verre-blanc: rgba(255, 255, 255, 0.82);
    --bord-verre: rgba(255, 255, 255, 0.22);
}

/* ------------------------------------------------------------
   ANIMATIONS GÉNÉRALES
   ------------------------------------------------------------ */

.apparition-interface {
    animation: interface-apparition var(--animation-interface) ease-out both;
}

.fermeture-interface {
    animation: interface-disparition var(--animation-interface) ease-in both;
    pointer-events: none !important;
}

@keyframes interface-apparition {
    from {
        opacity: 0;
        transform: translateY(8px) scale(0.985);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes interface-disparition {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

.fond-popup-creation.apparition-interface {
    animation-name: fond-popup-apparition;
}

.fond-popup-creation.fermeture-interface {
    animation-name: fond-popup-disparition;
}

@keyframes fond-popup-apparition {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fond-popup-disparition {
    from { opacity: 1; }
    to { opacity: 0; }
}

.popup-creation-task.apparition-interface {
    animation-name: popup-creation-apparition;
}

.popup-creation-task.fermeture-interface {
    animation-name: popup-creation-disparition;
}

@keyframes popup-creation-apparition {
    from {
        opacity: 0;
        transform: translate(-50%, calc(-50% + 14px)) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

@keyframes popup-creation-disparition {
    from {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
    to {
        opacity: 0;
        transform: translate(-50%, calc(-50% + 10px)) scale(0.985);
    }
}

/* ------------------------------------------------------------
   ACTIONS FLOTTANTES
   ------------------------------------------------------------ */

.actions-flottantes {
    position: fixed;
    z-index: 3000;
    right: 20px;
    bottom: 20px;
    display: flex;
    gap: 10px;
    align-items: stretch;
}

.bouton-action-flottante,
.bouton-flottant-ajouter,
.bouton-basculer-page {
    position: static;
    width: 142px;
    min-width: 142px;
    height: 46px;
    padding: 0 16px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.58);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.34);
    color: #fff;
    font-weight: 750;
    line-height: 1;
    cursor: pointer;
    transition:
        transform 150ms ease,
        background 150ms ease,
        border-color 150ms ease;
}

.bouton-flottant-ajouter {
    font-size: 25px;
}

.bouton-action-flottante:hover,
.bouton-flottant-ajouter:hover,
.bouton-basculer-page:hover {
    background: rgba(20, 24, 31, 0.78);
    border-color: rgba(255, 255, 255, 0.5);
    transform: translateY(-2px);
}

body.popup-creation-ouverte .actions-flottantes {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}

/* ------------------------------------------------------------
   POPUPS EN VERRE DÉPOLI
   ------------------------------------------------------------ */

.popup-task-primary {
    z-index: 1450;
    border-color: rgba(255, 255, 255, 0.68);
    background: var(--fond-verre-blanc);
    -webkit-backdrop-filter: blur(14px) saturate(125%);
    backdrop-filter: blur(14px) saturate(125%);
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.28);
}

.details-temps-semaine {
    border-color: rgba(120, 126, 136, 0.55);
    background: rgba(255, 255, 255, 0.84);
    -webkit-backdrop-filter: blur(14px) saturate(120%);
    backdrop-filter: blur(14px) saturate(120%);
    animation: details-semaine-apparition 150ms ease-out both;
}

@keyframes details-semaine-apparition {
    from {
        opacity: 0;
        transform: translate(-50%, -5px) scale(0.985);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0) scale(1);
    }
}

/* La popup de création reste au-dessus de la page des priorités. */
.fond-popup-creation {
    z-index: 5000;
}

.popup-creation-task {
    z-index: 5100;
}

/* ------------------------------------------------------------
   PANNEAU COULISSANT DE MODIFICATION
   ------------------------------------------------------------ */

.formulaire-task {
    position: fixed;
    z-index: 1300;
    top: 0;
    left: 50%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
    align-items: start;
    gap: 12px;
    width: min(1120px, calc(100vw - 24px));
    max-height: min(50vh, 560px);
    margin: 0;
    padding: 42px 18px 48px;
    overflow: auto;
    border: 1px solid var(--bord-verre);
    border-top: 0;
    border-radius: 0 0 18px 18px;
    background: var(--fond-verre-noir);
    -webkit-backdrop-filter: blur(16px) saturate(120%);
    backdrop-filter: blur(16px) saturate(120%);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.36);
    color: #fff;
    box-sizing: border-box;
    transform: translate(-50%, 0);
    transition: transform 260ms cubic-bezier(0.2, 0.8, 0.2, 1);
    animation: panneau-descente 260ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.formulaire-task[hidden] {
    display: none;
}

@keyframes panneau-descente {
    from {
        opacity: 0;
        transform: translate(-50%, -100%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

.formulaire-task.panneau-replie {
    transform: translate(-50%, calc(-100% + 36px));
}

.panneau-modification-titre {
    position: absolute;
    top: 13px;
    left: 18px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 14px;
    letter-spacing: 0.02em;
}

.bouton-replier-panneau {
    position: absolute;
    z-index: 2;
    left: 50%;
    bottom: 0;
    width: 82px;
    height: 34px;
    padding: 0 0 2px;
    border: 1px solid var(--bord-verre);
    border-bottom: 0;
    border-radius: 16px 16px 0 0;
    background: var(--fond-verre-noir);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    transform: translateX(-50%);
}

.formulaire-task .commande {
    min-width: 0;
    align-items: stretch;
}

.formulaire-task .commande label,
.formulaire-task .commande > span {
    color: rgba(255, 255, 255, 0.72);
    font-size: 12px;
    font-weight: 650;
}

.formulaire-task input,
.formulaire-task textarea,
.formulaire-task select {
    width: 100%;
    min-width: 0;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.09);
    color: #fff;
    outline: none;
    color-scheme: dark;
    transition: border-color 140ms ease, background 140ms ease;
}

.formulaire-task input:focus,
.formulaire-task textarea:focus,
.formulaire-task select:focus {
    border-color: rgba(126, 188, 255, 0.78);
    background: rgba(255, 255, 255, 0.14);
}

.formulaire-task select option {
    background: #161a21;
    color: #fff;
}

.formulaire-task .champ-large input,
.formulaire-task .champ-description textarea {
    width: 100%;
}

.formulaire-task .champ-description {
    grid-column: span 2;
}

.formulaire-task .modification-jalons-zone,
.formulaire-task .panneau-actions {
    grid-column: 1 / -1;
}

.formulaire-task .modification-jalons-zone {
    border-top-color: rgba(255, 255, 255, 0.18);
}

.formulaire-task .modification-jalons-liste {
    max-height: 220px;
    border-color: rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
}

.formulaire-task .creation-jalon {
    border-color: rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.08);
}

.formulaire-task .creation-jalon-bouton,
.formulaire-task .modification-jalon-termine,
.formulaire-task .modification-ajouter-jalon,
.formulaire-task .bouton-effacer-date {
    border-color: rgba(255, 255, 255, 0.24);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.panneau-actions {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    padding-top: 4px;
}

.panneau-actions button {
    min-width: 132px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-weight: 700;
    cursor: pointer;
}

.panneau-actions .bouton-action-principale {
    background: rgba(56, 126, 214, 0.7);
}

.panneau-actions .bouton-action-secondaire {
    background: rgba(39, 139, 81, 0.62);
}

.panneau-actions .bouton-supprimer-task {
    border-color: rgba(255, 103, 113, 0.62);
    background: rgba(146, 31, 43, 0.52);
    color: #fff;
}

/* ------------------------------------------------------------
   SÉLECTION DES LIGNES
   ------------------------------------------------------------ */

.ligne-task-selectionnee td {
    box-shadow:
        inset 0 2px 0 rgba(20, 25, 31, 0.9),
        inset 0 -2px 0 rgba(20, 25, 31, 0.9);
    filter: brightness(1.12);
}

/* ------------------------------------------------------------
   NOUVELLES TEXTURES TASK_PRIMARY
   ------------------------------------------------------------ */

.case-priorite-jaune {
    background-color: #fff4b5;
    background-image: repeating-linear-gradient(
        135deg,
        rgba(235, 194, 0, 0.82) 0 1px,
        transparent 2px 6px
    );
}

.case-priorite-rouge {
    background-color: #ff7982;
    background-image: repeating-linear-gradient(
        135deg,
        rgba(202, 45, 55, 0.72) 0 1px,
        transparent 2px 6px
    );
}

.case-task-terminee-grise,
.case-task-terminee-blanche {
    background-color: #9cffb1;
    background-image: none;
}

.case-task-terminee-jaune {
    background-color: #9cffb1;
    background-image: repeating-linear-gradient(
        135deg,
        rgba(42, 145, 75, 0.7) 0 1px,
        transparent 2px 6px
    );
}

.case-task-terminee-rouge {
    background-color: #65b879;
    background-image: repeating-linear-gradient(
        135deg,
        rgba(134, 255, 162, 0.86) 0 1px,
        transparent 2px 6px
    );
}

/* ------------------------------------------------------------
   PAGE DES PRIORITÉS SANS BORD BLANC
   ------------------------------------------------------------ */

body.page-priorites-active {
    margin: 0;
    background: #0f1217;
}

body.page-priorites-active .page-priorites {
    min-height: 100vh;
    border-radius: 0;
}

/* ------------------------------------------------------------
   ADAPTATION MOBILE / PORTRAIT
   ------------------------------------------------------------ */

@media (max-width: 760px), (orientation: portrait) {
    .formulaire-task {
        grid-template-columns: 1fr;
        width: 100vw;
        max-height: 50vh;
        padding-right: 12px;
        padding-left: 12px;
        border-right: 0;
        border-left: 0;
        border-radius: 0 0 15px 15px;
    }

    .formulaire-task .champ-description,
    .formulaire-task .commande,
    .formulaire-task .modification-jalons-zone,
    .formulaire-task .panneau-actions {
        grid-column: 1;
    }

    .panneau-actions {
        flex-direction: column;
    }

    .panneau-actions button {
        width: 100%;
    }

    .actions-flottantes {
        right: 12px;
        bottom: 12px;
        gap: 7px;
    }

    .bouton-action-flottante,
    .bouton-flottant-ajouter,
    .bouton-basculer-page {
        width: 122px;
        min-width: 122px;
        height: 44px;
        padding: 0 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 1ms !important;
    }
}

/* ------------------------------------------------------------
   LOT 3 - RÉGLAGES DES MODES ET ATTRIBUTIONS « AUJO »
   ------------------------------------------------------------ */
.outils-calendrier { display: flex; justify-content: flex-end; margin: -32px 0 8px; }
.bouton-reglages-semaines {
    border: 1px solid #bbc3cc; border-radius: 7px; background: #f6f8fa;
    padding: 4px 12px; font-size: 22px; cursor: pointer; color: #263443;
}
.bouton-reglages-semaines:hover,
.bouton-reglages-semaines[aria-expanded="true"] { background: #e2effa; }
.panneau-reglages-semaines[hidden] { display: none !important; }
.panneau-reglages-semaines {
    border: 1px solid #afbbc6; border-radius: 9px; background: #f9fafc;
    padding: 12px 15px; margin-bottom: 14px; max-width: 820px;
    margin-left: auto; box-shadow: 0 4px 12px rgba(20, 30, 45, .11);
}
.reglages-entete { display: flex; align-items: center; justify-content: space-between; }
.reglages-entete h2 { font-size: 16px; margin: 0; }
.reglages-entete button { font-size: 22px; border: 0; background: transparent; cursor: pointer; }
.panneau-reglages-semaines > p { font-size: 12px; margin: 8px 0; }
.reglages-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.reglages-mode {
    border: 1px solid #c6cdd6; border-radius: 8px; padding: 8px;
    display: grid; grid-template-columns: minmax(0, 1fr) 108px;
    align-items: center; gap: 7px;
}
.reglages-mode legend { font-weight: 700; padding: 0 5px; }
.reglages-mode label { font-size: 12px; }
.reglages-mode input { width: 100%; min-width: 0; box-sizing: border-box; padding: 6px; }
.reglages-mode button { grid-column: 1 / -1; margin-top: 5px; padding: 7px; cursor: pointer; }
#message-reglages-semaines { min-height: 15px; font-size: 12px; }
#message-reglages-semaines.erreur-reglages { color: #9e2431; }
#message-reglages-semaines.succes-reglages { color: #17683e; }
.cellule-temps-semaine .commande-mode-semaine { display: flex; justify-content: center; margin-bottom: 3px; }
.cellule-temps-semaine .bouton-mode-semaine {
    border: 1px solid #c0c9d1; background: #fff; border-radius: 999px;
    color: #233546; font-size: 10px; font-weight: 650;
    cursor: pointer; padding: 2px 7px; max-width: 100%; white-space: nowrap;
}
.cellule-temps-semaine .bouton-mode-semaine.mode-chill { background: #eff6ff; border-color: #8badcd; }
.cellule-temps-semaine .bouton-mode-semaine.mode-work { background: #f0f5ed; border-color: #a6c39a; }
.cellule-temps-semaine .bouton-mode-semaine:disabled { cursor: progress; opacity: .55; }
.cellule-temps-semaine .detail-temps-meta { font-size: 11px; margin: 3px 0 6px; color: #43556a; }
/* L'outline reste visible même lorsqu'une ligne est sélectionnée. */
#tableau-task-primary tbody td.case-aujo { box-shadow: inset 0 0 0 2px #67c9ff; }
#tableau-task-primary tbody td.case-aujo.case-aujo-fond { background: #e3f5ff; }
#tableau-task-primary tbody tr.ligne-task-selectionnee td.case-aujo {
    box-shadow: inset 0 0 0 2px #67c9ff, inset 0 0 0 4px #263342;
}
#popup-aujo-option.popup-option-desactivee { opacity: .42; }
@media (max-width: 700px) {
    .outils-calendrier { margin: 0 0 8px; }
    .reglages-grille { grid-template-columns: 1fr; }
    .panneau-reglages-semaines { margin: 0 0 14px; }
    .cellule-temps-semaine .bouton-mode-semaine { padding: 2px 4px; }
}

/* ------------------------------------------------------------
   LOT 4 - PRIORITÉS SUR 30 JOURS / DÉFILEMENT COMMUN
   ------------------------------------------------------------ */
.page-priorites { --largeur-carte-priorite: 286px; --largeur-jour-priorite: 51px; }
.matrice-priorites-defilement { overflow-x: auto; overflow-y: visible; padding-bottom: 18px;
    max-width: 100%; scrollbar-color: #75879b #20252e; }
.matrice-priorites-contenu { width: max-content; min-width: 100%; }
.matrice-entete-dates, .matrice-entete-totaux,
.ligne-priorite-matrice, .matrice-bilans-semaines {
    display: grid; grid-template-columns: var(--largeur-carte-priorite)
        repeat(30, var(--largeur-jour-priorite)); align-items: stretch;
}
.matrice-entete-dates { position: sticky; top: 0; z-index: 10;
    background: #171c24; padding: 4px 0; border-bottom: 1px solid #4e5867; }
.matrice-entete-totaux { background: #222d3b; padding-bottom: 4px; }
.matrice-entete-totaux[hidden] { display: none !important; }
.matrice-entete-cellule, .matrice-total-jour { text-align: center; font-size: 10px;
    padding: 5px 2px; color: #c9d1df; border-left: 1px solid rgba(255,255,255,.07); }
.matrice-entete-carte { position: sticky; left: 0; z-index: 5; background: #171c24;
    font-size: 12px; font-weight: 700; text-align: left; padding-left: 12px; }
.matrice-entete-totaux .matrice-entete-carte { background: #222d3b; }
.matrice-entete-cellule.debut-semaine, .matrice-total-jour.debut-semaine { border-left: 2px solid #9da7b4; }
.matrice-entete-cellule.aujourdhui { background: #2b456a; color: white; font-weight: 700; }
.matrice-total-jour { font-weight: 700; color: #eef4ff; font-size: 9px;
    display: flex; flex-direction: column; justify-content: center;
    align-items: center; gap: 1px; line-height: 1.2; }
.matrice-total-jour small { font-size: 9px; font-weight: 400; color: #eef4ff; }
.page-priorites .liste-cartes-priorites { display: flex; flex-direction: column; gap: 6px; }
.page-priorites .section-priorites { margin-top: 19px; }
.page-priorites .section-priorites h2 { position: sticky; left: 0; width: fit-content; max-width: var(--largeur-carte-priorite);
    margin-bottom: 9px; background: #0f1217; z-index: 4; }
.page-priorites .section-priorites h2 small { font-weight: 400; font-size: 11px; color: #aeb8c4; }
.page-priorites .liste-cartes-priorites.vide::before { width: var(--largeur-carte-priorite); }
.page-priorites .carte-priorite { box-sizing: border-box; min-width: 0; width: var(--largeur-carte-priorite);
    position: sticky; left: 0; z-index: 3; min-height: 70px; padding: 6px 9px;
    border-radius: 7px; cursor: pointer; }
.page-priorites .carte-priorite .jauge-priorite { width: 44px; height: 44px; flex-basis: 44px; }
.page-priorites .carte-priorite { grid-template-columns: 54px minmax(0, 1fr); }
.page-priorites .carte-priorite.sans-degrade-priorite { background: #242830; }
.page-priorites .carte-priorite.sans-echeance-priorite .carte-priorite-date { color: #929baa; }
.page-priorites .carte-priorite.task-green.statut-tardif { background-color: #24382d;
    background-image: repeating-linear-gradient(135deg, rgba(60,166,92,.26) 0 3px, transparent 3px 11px); }
.case-jour-priorite { position: relative; isolation: isolate; box-sizing: border-box; margin: 2px 1px;
    min-height: 66px; padding: 3px 2px; border: 1px solid #505962;
    border-radius: 4px; background: #2E2E2E; color: #d4dce6; cursor: pointer;
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    font-size: 9px; overflow: hidden; }
.case-jour-priorite.debut-semaine { border-left: 3px solid #9da7b4; }
.case-jour-priorite::before { content: ''; position: absolute; inset: 0;
    z-index: 0; background: #b8cbe0; opacity: var(--intensite-case, 0);
    pointer-events: none; }
/* Couche additive limitée aux 10 % inférieurs de la case.
   Opacité de la couleur au bas : 50 %, disparition au seuil de 10 %.
   Seuls les jours <= aujourd'hui peuvent recevoir cette classe. */
.case-jour-priorite::after { content: ''; position: absolute; inset: 0;
    z-index: 1; border-radius: inherit; pointer-events: none;
    mix-blend-mode: screen; opacity: 0; }
.case-jour-priorite.etat-retard-priorite::after { opacity: 1;
    background: linear-gradient(to top,
        rgba(255, 199, 40, .50) 0%, rgba(255, 199, 40, 0) 10%, transparent 10%); }
.case-jour-priorite.etat-deadline-priorite::after { opacity: 1;
    background: linear-gradient(to top,
        rgba(255, 65, 83, .50) 0%, rgba(255, 65, 83, 0) 10%, transparent 10%); }
.case-jour-priorite.case-zero-claire { background: #2E2E2E; }
.case-jour-priorite.case-zero-foncee { background: #1E1E1F; }
/* Dans les cases à fond #2E2E2E / #1E1E1F (sans durée),
   contour et textes, y compris les marqueurs, sont atténués à 20 %. */
.case-jour-priorite.case-zero-claire,
.case-jour-priorite.case-zero-foncee { border-color: rgba(80, 89, 98, .20); }
.case-jour-priorite.case-inconnue-aujo { background: #66666b; }
.case-jour-priorite.case-aujo-priorite { border: 2px solid #63c8ff;
    box-shadow: inset 0 0 0 1px #c1ecff; }
.case-jour-durees { position: relative; z-index: 2; display: flex;
    flex-direction: column; color: #fff; font-size: 9px; font-weight: 750;
    line-height: 1.25; text-shadow: 0 1px 2px #1a1e23; }
.case-jour-durees small { font-size: 9px; color: #e3efff; font-weight: 400; }
.case-jour-priorite:not(.case-avec-temps) .case-jour-durees { opacity: .85; }
.case-jour-priorite.case-zero-claire .case-jour-durees,
.case-jour-priorite.case-zero-foncee .case-jour-durees,
.case-jour-priorite.case-zero-claire .case-jour-marque,
.case-jour-priorite.case-zero-foncee .case-jour-marque { opacity: .20; }
/* Pas de croix, diagonale ou trait dans les cases d'échéance. */
.case-jour-marque { position: relative; z-index: 3; max-width: 100%;
    font-size: 7px; color: #ffdb8c; font-weight: 800;
    text-align: center; overflow-wrap: anywhere; }
.case-jour-priorite.marque-deadline .case-jour-marque { color: #ff5b65; }
.case-jour-priorite:hover, .case-jour-priorite:focus-visible { outline: 2px solid #fff; outline-offset: -2px; }
.matrice-bilans-semaines { padding-top: 6px; }
.bilan-semaine-priorite { box-sizing: border-box; min-width: 0;
    display: flex; flex-direction: column; align-items: stretch;
    justify-content: flex-start; gap: 5px; padding: 12px 8px;
    border: 1px solid #758194; border-radius: 7px;
    background: #1f2c3b; color: #e5eaf0; font-size: 11px; text-align: center; }
.bilan-semaine-priorite strong { font-size: 11px; }
.bilan-semaine-priorite small { font-size: 10px; color: #b9c5d3; }
.bilan-semaine-titre { color: #dce9ff; }
.bilan-semaine-charge { font-weight: 700; font-size: 12px; }
.bilan-semaine-niveau { text-transform: uppercase; font-size: 10px; font-weight: 700; color: #d6e4ff; }
.bilan-semaine-separation { border-top: 1px solid #526179; margin: 7px 0 5px; }
.bilan-semaine-priorite .bilan-heures-ideales-titre { font-size: 16px;
    line-height: 1.2; color: #fff; }
.bilan-semaine-priorite .bilan-heures-total { font-size: 12px; }
.bilan-semaine-priorite .bilan-moyenne-jour { color: #bdcbe0; }
.bilan-equilibre-semaine { margin-top: 8px; border-top: 1px solid #42536b;
    padding-top: 6px; line-height: 1.4; }
.popup-case-priorites[hidden] { display: none !important; }
.popup-case-priorites { position: fixed; z-index: 4000; width: 260px; max-width: calc(100vw - 20px);
    box-sizing: border-box; border: 1px solid #8499b2; border-radius: 10px;
    background: #202b3b; color: #fff; padding: 12px;
    box-shadow: 0 12px 32px rgba(0,0,0,.42); font-size: 13px; }
.popup-case-priorites-entete { display: flex; align-items: start; justify-content: space-between; gap: 6px; }
.popup-case-priorites-entete button { border: 0; background: transparent; color: #fff;
    font-size: 25px; line-height: 1; cursor: pointer; }
.popup-case-priorites p { margin: 8px 0 0; font-size: 12px; }
.popup-case-priorites label { display: flex; align-items: center; margin-top: 12px; gap: 8px; cursor: pointer; }
.popup-case-priorites label[hidden] { display: none; }
#popup-case-priorites-message { color: #ffaaa9; min-height: 13px; }
@media(max-width: 700px) { .page-priorites { --largeur-carte-priorite: 50vw; --largeur-jour-priorite: 48px; }
    .page-priorites .carte-priorite-nom { font-size: 13px; }
    .page-priorites .carte-priorite-date { font-size: 10px; }
    .page-priorites .carte-priorite { grid-template-columns: 40px minmax(0, 1fr); padding: 4px; }
    .page-priorites .carte-priorite .jauge-priorite { width: 34px; height: 34px; flex-basis: 34px; }
}


/* ------------------------------------------------------------
   LOT 5 - RÉPARTITION IDÉALE HEBDOMADAIRE (DANS LE BILAN)
   ------------------------------------------------------------ */
.disponibilites-categorie { display: block; font-size: 11px; font-weight: 700;
    line-height: 1.35; overflow-wrap: anywhere; }
.dispo-sommeil { color: #f0f55b; }
.dispo-chill { color: #4800ff; }
.dispo-sorties { color: #f523fc; }
.dispo-speciales { color: #fc2373; }
.disponibilites-categorie::before { content: ''; display: inline-block; margin-right: 3px;
    border-radius: 50%; width: 6px; height: 6px; vertical-align: baseline; }
.dispo-sommeil::before { background: #f0f55b; }
.dispo-chill::before { background: #4800ff; }
.dispo-sorties::before { background: #f523fc; }
.dispo-speciales::before { background: #fc2373; }
.disponibilite-deficit { color: #ffb6b6; font-size: 10px; }

/* ------------------------------------------------------------
   LOT 5 - NOTIFICATION DE RÉSULTAT D'ENREGISTREMENT
   ------------------------------------------------------------ */
.banniere-resultat[hidden] { display: none !important; }
.banniere-resultat { position: fixed; z-index: 10000; top: 12px; left: 50%;
    transform: translateX(-50%); box-sizing: border-box; width: min(620px, calc(100vw - 24px));
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    padding: 11px 14px; border: 1px solid; border-radius: 8px;
    box-shadow: 0 8px 30px rgba(0,0,0,.4); font-size: 13px; font-weight: 600; }
.banniere-resultat.banniere-succes { color: #c4f6d4; background: #193826; border-color: #57af77; }
.banniere-resultat.banniere-erreur { color: #ffe1df; background: #55232c; border-color: #ed7282; }
#banniere-resultat-fermer { flex: 0 0 auto; border: 0; background: transparent;
    color: inherit; font-size: 23px; cursor: pointer; line-height: 1; }
#banniere-resultat-fermer:focus-visible { outline: 2px solid currentColor; }