/* =====================================================================
   Portail LFPL — choix du thème (13/10/2026). Chargée EN DERNIER par base.html.twig.

   - Thème sombre (par défaut) : rendu d'origine, défini par portal.css et agenda.css, INCHANGÉ.
     Cette feuille n'y ajoute que le bouton de bascule.
   - Thème clair (<html data-theme="clair">) : surcharges de cette feuille uniquement, alignées sur le
     thème clair de l'accueil d'app.lfpl.fr (piste A) : fond #F4F6FA, barre et cartes blanches, titres marine.

   Toutes les surcharges commencent par [data-theme="clair"] .night : elles ne visent que les pages à fond
   de nuit (classe « night » sur <body>) et l'emportent sur les règles « body.night … » de portal.css.
   Le back-office EasyAdmin n'est pas concerné (gabarit propre, déjà clair).
   ===================================================================== */

/* ---------------------------------------------------------------------
   Bouton de bascule (les deux thèmes) — partial _partials/theme_toggle.html.twig
   Le soleil propose le thème clair (visible en sombre), la lune le thème sombre (visible en clair).
   --------------------------------------------------------------------- */
.theme-toggle .theme-ico--lune { display: none; }
[data-theme="clair"] .theme-toggle .theme-ico--lune { display: inline-block; }
[data-theme="clair"] .theme-toggle .theme-ico--soleil { display: none; }

/* Pages de connexion : bouton à droite du logo, sur le fond de nuit. */
.auth-brand__top { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.auth-brand .theme-toggle { color: #fff; border-color: rgba(255, 255, 255, .3); border-radius: 999px; }
.auth-brand .theme-toggle:hover { background: rgba(255, 255, 255, .12); color: #fff; }

@media (max-width: 640px) {
    /* Icône seule, comme les autres boutons de la barre ; le nom reste donné par aria-label. */
    .auth-brand .theme-toggle { width: 44px; min-height: 44px; padding: 0; }
    .auth-brand .theme-toggle .label { display: none; }
}

/* ---------------------------------------------------------------------
   Thème clair : variables du portail
   --------------------------------------------------------------------- */
[data-theme="clair"] {
    --glass: #FFFFFF;
    --glass-hover: #FFFFFF;
    --glass-line: #E3E8EF;
    --on-dark-muted: #4A5567;
    --focus-ring: 0 0 0 3px #416EA9;   /* anneau bleu plein : l'or translucide se perd sur fond clair */
}

[data-theme="clair"] body.night { background: #F4F6FA; color: var(--ink); }
[data-theme="clair"] .home-bg { display: none; }

[data-theme="clair"] .night .site-footer a,
[data-theme="clair"] .night .empty--glass a { color: #325491; }
[data-theme="clair"] .night .site-footer a:hover,
[data-theme="clair"] .night .empty--glass a:hover { color: #1F2F59; }

/* ---------------------------------------------------------------------
   Thème clair : barre supérieure (variante « dark » de _topbar.html.twig)
   --------------------------------------------------------------------- */
[data-theme="clair"] .night .topbar--dark { background: #FFFFFF; border-bottom-color: #E3E8EF; color: var(--ink); }
[data-theme="clair"] .night .topbar--dark .brand { color: var(--navy); }
[data-theme="clair"] .night .topbar--dark .brand small,
[data-theme="clair"] .night .topbar--dark .user-chip .who small { color: var(--muted); }
[data-theme="clair"] .night .topbar--dark .avatar { background: var(--navy); color: #fff; }
[data-theme="clair"] .night .topbar--dark .btn--ghost { background: #FFFFFF; color: var(--navy); border-color: #C5D3EF; }
[data-theme="clair"] .night .topbar--dark .btn--ghost:hover { background: #E9EEFA; color: var(--navy); border-color: #9FB2CC; }

/* ---------------------------------------------------------------------
   Thème clair : accueil du portail (titre, recherche, filtres, tuiles)
   --------------------------------------------------------------------- */
[data-theme="clair"] .night .home-hero .eyebrow { color: #B0141A; }
[data-theme="clair"] .night .home-hero h1 { color: #1F2F59; }
[data-theme="clair"] .night .home-hero .lead { color: #4A5567; }

[data-theme="clair"] .night .search--glass .ico { color: #566174; opacity: 1; }
[data-theme="clair"] .night .search--glass input { color: var(--ink); background: #FFFFFF; border-color: #C5D3EF; }
[data-theme="clair"] .night .search--glass input::placeholder { color: #6B7586; }
[data-theme="clair"] .night .search--glass input:hover { border-color: #9FB2CC; }
[data-theme="clair"] .night .search--glass input:focus { border-color: #416EA9; box-shadow: 0 0 0 4px rgba(65, 110, 169, .18); }
[data-theme="clair"] .night .search--glass input::-webkit-search-cancel-button { filter: none; }
[data-theme="clair"] .night .search--glass kbd { border-color: #D3DAE4; background: #F6F8FB; color: #4A5567; }

/* Filtres de rubrique uniquement (.chips) : la pastille .chip des rendez-vous de l'agenda n'est pas touchée. */
[data-theme="clair"] .night .chips .chip { background: #FFFFFF; color: #2D427B; border-color: #D3DAE4; }
[data-theme="clair"] .night .chips .chip:hover { background: #F9FAFC; border-color: #9FB2CC; }
[data-theme="clair"] .night .chips .chip[aria-pressed="true"] { background: #2D427B; color: #FFFFFF; border-color: #2D427B; }

[data-theme="clair"] .night .tile,
[data-theme="clair"] .night .tile:hover { color: var(--ink); }
[data-theme="clair"] .night .tile { background: #FFFFFF; border-color: #E3E8EF; box-shadow: 0 1px 2px rgba(16, 33, 60, .05); }
[data-theme="clair"] .night .tile:hover {
    border-color: #9FB2CC;
    box-shadow: 0 2px 6px rgba(16, 33, 60, .06), 0 14px 30px -12px rgba(16, 33, 60, .18);
}
[data-theme="clair"] .night .tile:focus-visible { box-shadow: 0 0 0 3px #416EA9; }
/* Pictogramme : couleur de l'application assombrie de 18 % (blanc lisible même sur l'or), repli sans color-mix. */
[data-theme="clair"] .night .tile-icon {
    background: var(--c);
    background: color-mix(in srgb, var(--c) 82%, #000);
    box-shadow: 0 6px 16px -8px var(--c);
}
[data-theme="clair"] .night .tile-cat { color: #616C7A; }
[data-theme="clair"] .night .tile-badge { background: #F4F6FA; border-color: #D3DAE4; color: #3D4757; }
[data-theme="clair"] .night .tile h3 { color: #1F2F59; }
[data-theme="clair"] .night .tile p { color: #4A5567; }
[data-theme="clair"] .night .tile-go { background: #E9EEFA; color: #2D427B; }

[data-theme="clair"] .night .empty--glass { background: #FFFFFF; border-color: #D3DAE4; }
[data-theme="clair"] .night .empty--glass h2 { color: var(--navy); }
[data-theme="clair"] .night .empty--glass p { color: var(--muted); }
[data-theme="clair"] .night .empty--glass .card-icon { background: #EAF1FA; color: var(--blue); }

[data-theme="clair"] .night .site-footer { color: var(--muted); }
[data-theme="clair"] .night .site-footer::before { background: #D3DAE4; }

/* ---------------------------------------------------------------------
   Thème clair : connexion, mot de passe (auth_layout), accès refusé, choix du service
   --------------------------------------------------------------------- */
[data-theme="clair"] .night .auth-brand { color: var(--ink); }
[data-theme="clair"] .night .brand-logo span { color: var(--navy); opacity: 1; }
[data-theme="clair"] .night .brand-logo img { box-shadow: 0 0 0 1px #E3E8EF, 0 1px 3px rgba(16, 33, 60, .08); }
[data-theme="clair"] .night .auth-brand h1 { color: #1F2F59; }
[data-theme="clair"] .night .auth-brand h1 em { color: #B0141A; }
[data-theme="clair"] .night .auth-brand .lead { color: #4A5567; }
[data-theme="clair"] .night .brand-points li { color: #3D4757; }
[data-theme="clair"] .night .brand-points .pt-ico { background: #E9EEFA; border-color: #C5D3EF; color: var(--navy); }
[data-theme="clair"] .night .auth-brand .theme-toggle { background: #FFFFFF; color: var(--navy); border-color: #C5D3EF; }
[data-theme="clair"] .night .auth-brand .theme-toggle:hover { background: #E9EEFA; color: var(--navy); border-color: #9FB2CC; }

/* Carte blanche sur fond clair : bordure et ombre légère au lieu de l'ombre portée du fond de nuit. */
[data-theme="clair"] .night .auth-card { border-color: #E3E8EF; box-shadow: var(--shadow-1); }
[data-theme="clair"] .night .auth-footer { color: var(--muted); }
[data-theme="clair"] .night .auth-footer a { color: #325491; }
[data-theme="clair"] .night .auth-footer a:hover { color: #1F2F59; }

/* ---------------------------------------------------------------------
   Thème clair : colonne agenda de l'accueil (annule l'habillage sombre de agenda.css)
   Les fenêtres (saisie, vue mois) sont claires dans les deux thèmes.
   --------------------------------------------------------------------- */
[data-theme="clair"] .night .agenda { background: #FFFFFF; border-color: #E3E8EF; box-shadow: 0 1px 2px rgba(16, 33, 60, .05); color: var(--encre); }
[data-theme="clair"] .night .agenda-head { background: #FFFFFF; color: var(--encre); border-bottom: 1px solid #E3E8EF; }
[data-theme="clair"] .night .agenda-head .ic-cal { background: var(--voile); color: var(--marine); }
/* L'icône du gabarit est tracée en blanc (stroke="#fff") : la propriété CSS l'emporte sur l'attribut. */
[data-theme="clair"] .night .agenda-head .ic-cal svg { stroke: currentColor; }
[data-theme="clair"] .night .agenda-head h2 { color: #1F2F59; }
[data-theme="clair"] .night .agenda-head .sub { color: var(--encre-3); }
[data-theme="clair"] .night .ag-ics { color: #325491; opacity: 1; }
[data-theme="clair"] .night .ag-ics:hover { color: #1F2F59; }
[data-theme="clair"] .night .ag-ics svg { color: #325491; }
[data-theme="clair"] .night .btn-add { background: var(--or-clair); color: #1F2F59; }
[data-theme="clair"] .night .btn-month { background: #FFFFFF; color: var(--marine); border-color: var(--trait); }
[data-theme="clair"] .night .btn-month:hover { background: var(--voile); }

[data-theme="clair"] .night .agenda .legend { background: #FAFBFD; border-bottom-color: var(--line); }
[data-theme="clair"] .night .agenda .legend .lg { color: var(--encre-2); }
[data-theme="clair"] .night .agenda .day-label { color: var(--encre-3); }
[data-theme="clair"] .night .agenda .day-label::after { background: var(--line); }

[data-theme="clair"] .night .agenda .event { background: #FFFFFF; border-color: var(--line); }
[data-theme="clair"] .night .agenda .event .title { color: var(--encre); }
[data-theme="clair"] .night .agenda .event .meta { color: var(--encre-3); }
[data-theme="clair"] .night .agenda .event .time,
[data-theme="clair"] .night .agenda .event .loc { color: var(--encre-2); }
[data-theme="clair"] .night .agenda .event .note,
[data-theme="clair"] .night .agenda .event .by { color: var(--encre-3); }
[data-theme="clair"] .night .agenda .event .del,
[data-theme="clair"] .night .agenda .event .edit { color: var(--encre-3); }
[data-theme="clair"] .night .agenda .event .del:hover { background: #FBECEC; color: var(--rouge); }
[data-theme="clair"] .night .agenda .event .edit:hover { background: var(--voile); color: var(--marine); }

[data-theme="clair"] .night .agenda .ag-state { color: var(--encre-3); }
[data-theme="clair"] .night .agenda .ag-state svg { color: var(--trait); }
[data-theme="clair"] .night .agenda .ag-state .ag-retry { background: #FFFFFF; border-color: var(--trait); color: var(--marine); }
[data-theme="clair"] .night .agenda .ag-state .ag-retry:hover { background: var(--voile); }
[data-theme="clair"] .night .agenda .ag-spinner { border-color: var(--voile); border-top-color: var(--marine); }
[data-theme="clair"] .night .ag-overlay { background: rgba(16, 23, 45, .55); }