/* En-tête : sélecteur de contexte (école / année), bascule clair/sombre et menu utilisateur.
   Voir resources/views/include/entete-contexte.blade.php et entete-utilisateur.blade.php.
   Jetons : educom-ui.css (surfaces neutres clair/sombre) + theme.css (marque). */

/* ---------- Sélecteur de contexte ---------- */
.ctx-selecteur { margin-left: .5rem; }
.ctx-pastille {
    display: inline-flex; align-items: center; gap: .6rem;
    min-height: 44px;
    padding: .3rem .85rem .3rem .35rem; border-radius: 999px;
    background: var(--edu-surface-glass, rgba(255, 255, 255, .7));
    border: 1px solid var(--edu-border, rgba(15, 23, 42, .08));
    box-shadow: var(--edu-shadow-1, 0 1px 2px rgba(15, 23, 42, .05)), var(--edu-highlight, none);
    color: var(--edu-text, inherit); text-decoration: none;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease; max-width: 360px;
}
.ctx-pastille:hover, .ctx-selecteur.show .ctx-pastille {
    border-color: rgba(var(--edu-color-primary-rgb, 10, 132, 255), .35);
    box-shadow: var(--edu-shadow-2, 0 4px 12px rgba(15, 23, 42, .08));
    color: var(--edu-text, inherit);
}
.ctx-logo {
    width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0; overflow: hidden;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(var(--edu-color-primary-rgb, 10, 132, 255), .12); color: var(--edu-color-primary, var(--edu-color-primary)); font-size: .95rem;
    box-shadow: 0 0 0 1px var(--edu-border, rgba(15, 23, 42, .08));
}
.ctx-logo img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.ctx-logo-plateforme { background: linear-gradient(145deg, var(--edu-color-primary, var(--edu-color-primary)), var(--edu-color-secondary, var(--edu-color-primary))); color: #fff; }
.ctx-logo-alerte { background: rgba(var(--edu-color-danger-rgb, 255, 59, 48), .12); color: var(--edu-color-danger, var(--edu-color-danger)); }
.ctx-textes { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.ctx-ecole { font-weight: 600; font-size: .85rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -.005em; }
.ctx-annee { font-size: .74rem; color: var(--edu-text-muted, #6E6E73); white-space: nowrap; }
.ctx-chevron { font-size: .9rem; color: var(--edu-text-muted, #6E6E73); margin-left: .1rem; }

.ctx-menu { width: 340px; padding: .4rem 0 0; border-radius: var(--edu-radius-lg, 16px); overflow: hidden; }
.ctx-section-titre { padding: .55rem 1rem .3rem; font-size: .68rem; font-weight: 650; letter-spacing: .07em; text-transform: uppercase; color: var(--edu-text-muted, #6E6E73); }
.ctx-liste { max-height: 230px; overflow-y: auto; padding: 0 .4rem .3rem; }
.ctx-liste form { margin: 0; }
.ctx-item {
    display: flex; align-items: center; gap: .6rem; width: 100%; min-height: 44px; padding: .45rem .55rem;
    border: 0; border-radius: var(--edu-radius-md, 10px); background: transparent; text-align: left; color: var(--edu-text, inherit); font-size: .85rem;
    transition: background .15s ease;
}
.ctx-item:not(:disabled):hover { background: rgba(var(--edu-color-primary-rgb, 10, 132, 255), .08); }
.ctx-item.actif { background: rgba(var(--edu-color-primary-rgb, 10, 132, 255), .10); font-weight: 600; cursor: default; opacity: 1; }
.ctx-item-logo {
    width: 30px; height: 30px; border-radius: calc(var(--edu-radius-md, 10px) - 3px); flex-shrink: 0; overflow: hidden;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(var(--edu-color-secondary-rgb, 88, 86, 214), .12); color: var(--edu-color-secondary, var(--edu-color-primary)); font-weight: 700; font-size: .85rem;
}
.ctx-item-logo img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.ctx-item-annee { background: rgba(var(--edu-color-success-rgb, 52, 199, 89), .14); color: var(--edu-success-text, var(--edu-color-success)); }
.ctx-item-texte { flex-grow: 1; min-width: 0; display: flex; flex-direction: column; }
.ctx-item-texte small { color: var(--edu-text-muted, #6E6E73); font-weight: 400; font-size: .72rem; }
.ctx-coche { color: var(--edu-color-primary, var(--edu-color-primary)); }
.ctx-item-texte small.ctx-detail { color: var(--edu-color-secondary, var(--edu-color-primary)); font-weight: 600; }
.ctx-lien { display: block; padding: .65rem 1rem; border-top: 1px solid var(--edu-border, #e5e7eb); font-size: .8rem; color: var(--edu-color-primary, var(--edu-color-primary)); text-decoration: none; }
.ctx-lien:hover { background: rgba(var(--edu-color-primary-rgb, 10, 132, 255), .06); }

@media (max-width: 767.98px) {
    .ctx-pastille { padding: .25rem; max-width: none; }
    .ctx-textes, .ctx-chevron { display: none; }
    .ctx-menu { width: calc(100vw - 24px); }
}

/* ---------- Bascule rapide clair / sombre (bouton rond de l'en-tête) ---------- */
.mu-mode-rapide .mu-bouton-mode { position: relative; overflow: hidden; }
.mu-mode-rapide .mu-bouton-mode i {
    position: absolute; inset: 0; margin: auto; width: 20px; height: 20px; line-height: 20px;
    transition: transform .35s cubic-bezier(.34, 1.56, .64, 1), opacity .2s ease;
}
/* Clair : on propose la lune ; sombre : le soleil */
.mu-mode-rapide .mu-icone-clair { opacity: 0; transform: rotate(-90deg) scale(.5); }
.mu-mode-rapide .mu-icone-sombre { opacity: 1; transform: none; }
[data-theme="dark"] .mu-mode-rapide .mu-icone-clair { opacity: 1; transform: none; color: var(--edu-color-warning); }
[data-theme="dark"] .mu-mode-rapide .mu-icone-sombre { opacity: 0; transform: rotate(90deg) scale(.5); }

/* ---------- Menu utilisateur ---------- */
.mu-declencheur {
    display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: .25rem .6rem .25rem .25rem;
    border-radius: 999px; color: var(--edu-text, inherit); text-decoration: none; transition: background .15s ease;
}
.mu-declencheur:hover, .mu-profil.show .mu-declencheur { background: var(--edu-fill, rgba(118, 118, 128, .12)); color: var(--edu-text, inherit); }
.mu-declencheur .ti-chevron-down { color: var(--edu-text-muted, #6E6E73); }
.mu-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; box-shadow: 0 0 0 2px var(--edu-surface, #fff), 0 0 0 3px var(--edu-border, rgba(0, 0, 0, .08)); }
.mu-initiales { display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: .85rem; letter-spacing: .02em; }
.mu-avatar-lg { width: 52px; height: 52px; font-size: 1.1rem; }
.mu-nom { font-weight: 600; font-size: .85rem; }

.mu-menu { width: 312px; padding: 0; border-radius: var(--edu-radius-lg, 16px); overflow: hidden; }
.mu-entete {
    display: flex; gap: .8rem; align-items: center; padding: 1rem;
    background: linear-gradient(135deg, rgba(var(--edu-color-primary-rgb, 10, 132, 255), .12), rgba(var(--edu-color-secondary-rgb, 88, 86, 214), .10));
    border-bottom: 1px solid var(--edu-border, rgba(0, 0, 0, .06));
}
.mu-identite { display: flex; flex-direction: column; min-width: 0; }
.mu-identite strong { font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--edu-text, inherit); }
.mu-identite small { color: var(--edu-text-muted, #6E6E73); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.badge.mu-role {
    --edu-badge-rgb: var(--edu-color-secondary-rgb, 88, 86, 214);
    background: rgba(var(--edu-color-secondary-rgb, 88, 86, 214), .14); color: var(--edu-color-secondary, var(--edu-color-primary));
    font-weight: 600; margin-right: .2rem;
}
[data-theme="dark"] .badge.mu-role { color: color-mix(in srgb, var(--edu-color-primary) 17%, #fff); }
.mu-contexte { padding: .55rem 1rem; font-size: .78rem; color: var(--edu-text-muted, #6E6E73); border-bottom: 1px solid var(--edu-border, #e5e7eb); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mu-contexte i { color: var(--edu-color-primary, var(--edu-color-primary)); }
.mu-liens { padding: .35rem .4rem; }
.mu-liens .dropdown-item, .mu-pied .dropdown-item { display: flex; align-items: center; gap: .65rem; min-height: 38px; padding: .45rem .7rem; font-size: .86rem; border-radius: var(--edu-radius-sm, 8px); }
.mu-liens .dropdown-item i, .mu-pied .dropdown-item i { font-size: 1.1rem; width: 20px; text-align: center; color: var(--edu-text-muted, #6E6E73); }
.mu-liens .dropdown-item:hover i { color: var(--edu-color-primary, var(--edu-color-primary)); }
.mu-pied { border-top: 1px solid var(--edu-border, #e5e7eb); padding: .35rem .4rem; }
.mu-pied .dropdown-item.text-danger i { color: inherit; }

/* Choix du mode d'affichage : contrôle segmenté façon iOS */
.mu-apparence { padding: .6rem 1rem .75rem; border-top: 1px solid var(--edu-border, #e5e7eb); }
.mu-apparence-titre { display: block; margin-bottom: .45rem; font-size: .68rem; font-weight: 650; letter-spacing: .07em; text-transform: uppercase; color: var(--edu-text-muted, #6E6E73); }
.mu-segment {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; padding: 3px;
    border-radius: calc(var(--edu-radius-md, 10px) + 2px); background: var(--edu-fill, rgba(118, 118, 128, .12));
}
.mu-segment [data-edu-mode-choix] {
    display: inline-flex; align-items: center; justify-content: center; gap: .3rem;
    min-height: 32px; padding: .3rem .4rem; border: 0; border-radius: var(--edu-radius-md, 10px);
    background: transparent; color: var(--edu-text-muted, #6E6E73); font-size: .78rem; font-weight: 500; cursor: pointer;
    transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
.mu-segment [data-edu-mode-choix]:hover:not(.active) { color: var(--edu-text, #1D1D1F); }
.mu-segment [data-edu-mode-choix].active {
    background: var(--edu-surface, #fff); color: var(--edu-text, #1D1D1F); font-weight: 600;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08), 0 3px 8px rgba(0, 0, 0, .06);
}
[data-theme="dark"] .mu-segment [data-edu-mode-choix].active { background: #636366; color: #fff; }
.mu-segment [data-edu-mode-choix]:focus-visible { outline: 2px solid var(--edu-color-primary, var(--edu-color-primary)); outline-offset: 1px; }

[data-theme="dark"] .ctx-pastille { background: rgba(44, 44, 46, .72); }
[data-theme="dark"] .ctx-logo img, [data-theme="dark"] .ctx-item-logo img { background: #fff; }

/* Utilitaire absent de Bootstrap 5.0 : autorise la troncature (text-truncate) dans un conteneur flex */
.min-w-0 { min-width: 0 !important; }

/* ---------- Notifications push (assets/js/pwa-push.js) ---------- */
#pwaPushBouton.pwa-push-actif { color: var(--edu-color-primary, var(--edu-color-primary)); }
#pwaPushBouton:disabled { opacity: .4; cursor: not-allowed; }