/* ════════════════════════════════════════════════════════════════════════════
   EDUCATED 6 — CADRE : BARRE DU HAUT · ONGLETS DES ÉCRANS · RUBAN · LISTES
   Fichier : wwwroot/css/frame-v6.css — chargé en dernier quand Navigation:Mode = V6
             (Pages/_Host.cshtml). Comportements : Js/frame-v6.js.
   Maquette : « Back office Educated — maquette » (cadre XAF : barre du haut 52 px,
              rail + panneau du module sous la barre, onglets des écrans en tête
              de la zone de travail).
   Toutes les règles commencent par html.ed6-railmode : elles l'emportent sur
   topbar.css, ribbon.css et grid.css (chargés avant, mêmes !important) et ne
   touchent pas le mode Classic.

   Disposition (grille CSS sur le gabarit XAF, sans toucher au DOM Blazor) :
     ┌──────────────────────── barre du haut ────────────────────────┐
     │ rail │ panneau │ onglets des écrans ouverts                    │
     │      │         │ ruban (Accueil / Vue + barre d'actions)       │
     │      │         │ écran                                          │
   Le conteneur XAF (menu + MDI) et le composant d'onglets passent en
   display: contents pour que leurs enfants se placent dans la grille.
   ════════════════════════════════════════════════════════════════════════════ */


/* ── Jetons ─────────────────────────────────────────────────────────────── */

html.ed6-railmode body {
    --f-ink-0: #14122B;
    --f-ink-1: #2B2846;
    --f-ink-2: #4A4766;
    --f-ink-3: #6E6A8A;
    --f-line: #E9E7F3;
    --f-line-2: #EFEEF6;
    --f-soft: #F3F2F9;
    --f-page: #F5F4FA;
    --f-head: #FAFAFE;
    --f-brand: #5351FB;
    --f-brand-dk: #342484;
    --f-brand-50: #EEEEFF;
    --f-brand-100: #DDDDFE;
    --f-ring: rgba(83, 81, 251, .16);

    /* Gabarit Standard (body.xaf-size-m) */
    --tb-h: 52px;
    --tb-ctl-h: 34px;
    --ed6-panel-w: 236px;
    --mdi-tab-h: 32px;
    --mdi-pad-top: 6px;
    --rb-tabs-h: 34px;
    --rb-bar-h: 44px;
    --rb-btn-h: 30px;
    --rb-fs: 12.5px;
    --rb-search-w: 240px;
    --page-px: 20px;
    --page-py: 16px;

    /* Icônes XAF (multicolores) recolorées en silhouette : encre au repos, bleu au survol */
    --rb-ico: brightness(0) saturate(100%) invert(25%) sepia(7%) saturate(2345%) hue-rotate(206deg) brightness(97%) contrast(84%);
    --rb-ico-hover: brightness(0) saturate(100%) invert(49%) sepia(73%) saturate(6490%) hue-rotate(231deg) brightness(98%) contrast(102%);
    --rb-ico-white: brightness(0) invert(1);
}

/* Gabarit Compact (body.xaf-size-s) : même dessin, resserré */
html.ed6-railmode body.xaf-size-s {
    --tb-h: 46px;
    --tb-ctl-h: 30px;
    --ed6-panel-w: 216px;
    --mdi-tab-h: 28px;
    --mdi-pad-top: 5px;
    --rb-tabs-h: 30px;
    --rb-bar-h: 38px;
    --rb-btn-h: 28px;
    --rb-fs: 12px;
    --rb-search-w: 210px;
    --page-px: 16px;
    --page-py: 12px;
}


/* ════════════════════════════════════════════════════════════════════════════
   1. DISPOSITION
   ════════════════════════════════════════════════════════════════════════════ */

html.ed6-railmode .main-ribbon-template.app {
    display: grid !important;
    grid-template-columns: var(--ed6-rail-w) auto minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto minmax(0, 1fr) !important;
    background: var(--f-page) !important;
    overflow: hidden !important;
}

    html.ed6-railmode .main-ribbon-template.app > .header { grid-column: 1 / -1 !important; grid-row: 1 !important; }
    html.ed6-railmode .main-ribbon-template.app > .main-ribbon { grid-column: 3 !important; grid-row: 3 !important; min-width: 0 !important; }

    /* Menu + MDI : leurs enfants vont dans la grille */
    html.ed6-railmode .main-ribbon-template.app > .xaf-flex-auto.overflow-hidden.d-flex,
    html.ed6-railmode .main-ribbon-template.app > .xaf-flex-auto.overflow-hidden.d-flex > .w-100.overflow-auto,
    html.ed6-railmode .main-ribbon-template.app > .xaf-flex-auto.overflow-hidden.d-flex > .w-100.overflow-auto > dxbl-tabs.xaf-tabbed-mdi {
        display: contents !important;
        /* Ces conteneurs gardent leurs classes overflow-hidden / overflow-auto : DevExpress
           y voit une zone de découpe de 0 px (display: contents) et n'ouvrait plus ses
           listes déroulantes placées dans l'écran (menu de filtre des colonnes…). */
        overflow: visible !important;
    }

    html.ed6-railmode .main-ribbon-template.app .xaf-flex-auto > .xaf-sidebar {
        grid-column: 2 !important;
        grid-row: 2 / -1 !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
    }

    html.ed6-railmode .main-ribbon-template.app .xaf-flex-auto > .sidebar-sm-shadow { grid-column: 3 !important; grid-row: 4 !important; }

    html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist {
        grid-column: 3 !important;
        grid-row: 2 !important;
        min-width: 0 !important;
    }

    html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-content-panel {
        grid-column: 3 !important;
        grid-row: 4 !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        overflow: auto !important;
        background: var(--f-page) !important;
    }

/* Zone de l'écran : fond de page, marges de la maquette */
html.ed6-railmode .dxbl-theme-fluent .main-ribbon-template .main-content.xaf-flex-auto,
html.ed6-railmode .main-ribbon-template .main-content.xaf-flex-auto {
    padding: var(--page-py) var(--page-px) var(--page-py) var(--page-px) !important;
    background: var(--f-page) !important;
}


/* ════════════════════════════════════════════════════════════════════════════
   2. BARRE DU HAUT
   ════════════════════════════════════════════════════════════════════════════ */

html.ed6-railmode .main-ribbon-template.app > .header.navbar-dark,
html.ed6-railmode .main-ribbon-template.app > .header {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    height: var(--tb-h) !important;
    min-height: var(--tb-h) !important;
    padding: 0 14px 0 0 !important;
    margin: 0 !important;
    background: #FFFFFF !important;
    border: 0 !important;
    border-bottom: 1px solid var(--f-line) !important;
    box-shadow: none !important;
    position: relative !important;
    z-index: 40 !important;
    box-sizing: border-box !important;
    font-family: "Geist", "Public Sans", system-ui, sans-serif !important;
}

    /* Logo : même largeur que rail + panneau, le fil d'Ariane s'aligne sur l'écran */
    html.ed6-railmode .header .header-left-side {
        flex: none !important;
        width: calc(var(--ed6-rail-w) + var(--ed6-panel-w)) !important;
        height: 100% !important;
        padding: 0 0 0 16px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        box-sizing: border-box !important;
    }

    html.ed6-railmode.ed6-nav-mini .header .header-left-side { width: auto !important; padding-right: 10px !important; }

        html.ed6-railmode .header .header-left-side > a { display: flex !important; align-items: center !important; height: 100% !important; }

        /* Filet vertical de l'ancienne barre (topbar.css) : il flottait au milieu de l'espace */
        html.ed6-railmode .header .header-left-side > a::after,
        html.ed6-railmode .header .header-left-side::after { display: none !important; content: none !important; }

        html.ed6-railmode .header .header-logo {
            margin: 0 !important;
            height: 26px !important;
            min-width: 128px !important;
            background-position: left center !important;
            background-size: contain !important;
        }

    /* Les éléments du bloc droit XAF se rangent directement dans la barre */
    html.ed6-railmode .header .header-right-side {
        display: contents !important;
    }

    /* Fil d'Ariane : module › écran */
    html.ed6-railmode .header .header-right-side > div:has(> .view-caption-root),
    html.ed6-railmode .header .header-right-side > [role="heading"] {
        flex: 0 1 auto !important;
        min-width: 0 !important;
        max-width: 30vw !important;
        margin: 0 !important;
        position: static !important;
    }

    html.ed6-railmode .header .view-caption-root,
    html.ed6-railmode .header .xaf-caption-container {
        display: flex !important;
        align-items: center !important;
        min-width: 0 !important;
        height: auto !important;
    }

    html.ed6-railmode .header .acur-breadcrumb-group {
        flex: none !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        color: var(--f-ink-3) !important;
        white-space: nowrap !important;
    }

        html.ed6-railmode .header .acur-breadcrumb-group:not(:empty)::after {
            content: "›";
            margin: 0 7px;
            color: #A9A5C0;
            font-weight: 400;
        }

    /* Liste V6 : le module seul (l'onglet et le titre de la grille nomment l'écran) */
    html.ed6-railmode.ed6-list-titled .header .xaf-view-caption-lg { display: none !important; }
    html.ed6-railmode.ed6-list-titled .header .acur-breadcrumb-group { color: var(--f-ink-0) !important; font-weight: 600 !important; }
        html.ed6-railmode.ed6-list-titled .header .acur-breadcrumb-group::after { content: none !important; }
    /* Le nom du module est court : il ne se réduit pas, c'est la recherche globale qui cède la place */
    html.ed6-railmode.ed6-list-titled .header div:has(> .view-caption-root) { flex-shrink: 0 !important; }

    html.ed6-railmode .header .xaf-view-caption-lg {
        min-width: 0 !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        color: var(--f-ink-0) !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

/* ── Recherche globale (Ctrl K) ─────────────────────────────────────────── */

html.ed6-railmode .header .gs-trigger {
    position: static !important;
    left: auto !important;
    transform: none !important;
    flex: 1 1 320px !important;
    width: auto !important;
    min-width: 170px !important;
    max-width: 600px !important;
    height: var(--tb-ctl-h) !important;
    margin: 0 auto 0 6px !important;
    padding: 0 8px 0 10px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: var(--f-soft) !important;
    border: 1px solid #ECEAF5 !important;
    border-radius: 9px !important;
    box-shadow: none !important;
    color: var(--f-ink-3) !important;
    cursor: text !important;
    transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease !important;
}

    html.ed6-railmode .header .gs-trigger:hover { border-color: #DEDBEC !important; background: #F0EFF8 !important; }

    html.ed6-railmode .header .gs-trigger:focus-visible,
    html.ed6-railmode .header .gs-trigger:focus-within {
        background: #FFFFFF !important;
        border-color: var(--f-brand) !important;
        box-shadow: 0 0 0 3px var(--f-ring) !important;
        outline: none !important;
    }

    html.ed6-railmode .header .gs-trigger svg { color: var(--f-ink-3) !important; flex: none !important; }

    html.ed6-railmode .header .gs-trigger-label {
        flex: 1 !important;
        min-width: 0 !important;
        font-size: 12.5px !important;
        font-weight: 400 !important;
        color: var(--f-ink-3) !important;
        text-align: left !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* Raccourci affiché « Ctrl K » (postes Windows) au lieu de ⌘K */
    html.ed6-railmode .header .gs-trigger-kbd {
        flex: none !important;
        font-size: 0 !important;
        padding: 2px 6px !important;
        background: #FFFFFF !important;
        border: 1px solid #DCD9EA !important;
        border-radius: 5px !important;
        box-shadow: none !important;
        line-height: 1 !important;
    }

        html.ed6-railmode .header .gs-trigger-kbd::after {
            content: "Ctrl K";
            font: 600 10.5px/1.2 "Geist", system-ui, sans-serif;
            color: var(--f-ink-2);
            letter-spacing: .02em;
        }

/* ── Bloc de droite : année · établissement | avatar · réglages ──────────── */

html.ed6-railmode .header .d-flex.ms-auto {
    flex: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 0 0 auto !important;
    height: 100% !important;
}

    html.ed6-railmode .header .d-flex.ms-auto > .filterbyschoolyear-action { order: 1 !important; }
    html.ed6-railmode .header .d-flex.ms-auto > .school-info { order: 2 !important; }
    html.ed6-railmode .header .d-flex.ms-auto > .account-container { order: 3 !important; }
    html.ed6-railmode .header .d-flex.ms-auto > .theme-settings { order: 4 !important; }
    html.ed6-railmode .header .d-flex.ms-auto > .modal-backdrop { order: 9 !important; }

/* Année académique : pastille « Année académique 2026-2027 ▾ » (tout type d'établissement).
   Le libellé est DANS la liste déroulante (::before) : la liste qui s'ouvre prend
   alors la largeur de la pastille et s'aligne sur elle. */
html.ed6-railmode .header .filterbyschoolyear-action {
    display: inline-flex !important;
    align-items: center !important;
    height: var(--tb-ctl-h) !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

    html.ed6-railmode .header .academic-year-selector,
    html.ed6-railmode .header .academic-year-selector:hover,
    html.ed6-railmode .header .academic-year-selector:focus-within {
        display: inline-flex !important;
        align-items: center !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        flex: none !important;
        height: var(--tb-ctl-h) !important;
        margin: 0 !important;
        padding: 0 0 0 10px !important;
        background: #FFFFFF !important;
        border: 1px solid #E1DEEE !important;
        border-radius: 9px !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        cursor: pointer !important;
        --dxbl-text-edit-border-color: transparent;
        transition: border-color 120ms ease, box-shadow 120ms ease !important;
    }

        html.ed6-railmode .header .academic-year-selector:hover { border-color: #CFCBE3 !important; }
        html.ed6-railmode .header .academic-year-selector:focus-within { border-color: var(--f-brand) !important; box-shadow: 0 0 0 3px var(--f-ring) !important; }

        html.ed6-railmode .header .academic-year-selector::before {
            content: "Année académique";
            flex: none;
            margin-right: 6px;
            font: 500 12px/1 "Geist", system-ui, sans-serif;
            color: var(--f-ink-3);
            white-space: nowrap;
            pointer-events: none;
        }

        html.ed6-railmode .header .academic-year-selector .dxbl-text-edit-input {
            width: 72px !important;
            min-width: 72px !important;
            height: 100% !important;
            padding: 0 !important;
            border: 0 !important;
            font: 600 12.5px/1 "Geist", system-ui, sans-serif !important;
            font-variant-numeric: tabular-nums !important;
            color: var(--f-ink-0) !important;
            background: transparent !important;
            text-overflow: clip !important;
            cursor: pointer !important;
        }

        html.ed6-railmode .header .academic-year-selector .dxbl-btn-group { height: 100% !important; }

        html.ed6-railmode .header .academic-year-selector .dxbl-edit-btn-dropdown {
            width: 26px !important;
            min-width: 26px !important;
            height: 100% !important;
            padding: 0 !important;
            background: transparent !important;
            border: 0 !important;
            box-shadow: none !important;
            color: var(--f-ink-3) !important;
            border-radius: 0 8px 8px 0 !important;
        }

            html.ed6-railmode .header .academic-year-selector .dxbl-edit-btn-dropdown:hover { color: var(--f-brand) !important; background: transparent !important; }

@media (max-width: 1279.98px) {
    html.ed6-railmode .header .academic-year-selector::before { content: "Année"; }
}

/* Liste des années (DropDownCssClass="ed6-year-dropdown", AcademicYearSelector.razor) */
html.ed6-railmode .ed6-year-dropdown {
    box-sizing: border-box !important;
    margin-top: 4px !important;
    padding: 4px !important;
    background: #FFFFFF !important;
    border: 1px solid var(--f-line) !important;
    border-radius: 10px !important;
    box-shadow: 0 16px 36px -12px rgba(20, 15, 62, .28), 0 2px 6px rgba(20, 15, 62, .06) !important;
    overflow: hidden !important;
}

    html.ed6-railmode .ed6-year-dropdown .dxbl-dropdown-body,
    html.ed6-railmode .ed6-year-dropdown .dxbl-list-box-render-container,
    html.ed6-railmode .ed6-year-dropdown .dxbl-scroll-viewer,
    html.ed6-railmode .ed6-year-dropdown ul { background: transparent !important; border: 0 !important; padding: 0 !important; margin: 0 !important; }

    html.ed6-railmode .ed6-year-dropdown li[role="option"] {
        display: flex !important;
        align-items: center !important;
        height: 30px !important;
        padding: 0 10px !important;
        margin: 0 !important;
        border-radius: 7px !important;
        background: transparent !important;
        color: var(--f-ink-1) !important;
        font: 500 12.5px/1 "Geist", system-ui, sans-serif !important;
        font-variant-numeric: tabular-nums !important;
        cursor: pointer !important;
    }

        html.ed6-railmode .ed6-year-dropdown li[role="option"]:hover,
        html.ed6-railmode .ed6-year-dropdown li[role="option"].dxbl-list-box-item-focused { background: var(--f-soft) !important; color: var(--f-ink-0) !important; }

        /* Année en cours : fond clair et coche, au lieu d'un aplat bleu */
        html.ed6-railmode .ed6-year-dropdown li[role="option"][aria-selected="true"],
        html.ed6-railmode .ed6-year-dropdown li[role="option"].dxbl-list-box-item-selected {
            background: var(--f-brand-50) !important;
            color: var(--f-brand-dk) !important;
            font-weight: 600 !important;
        }

            html.ed6-railmode .ed6-year-dropdown li[role="option"][aria-selected="true"]::after {
                content: "";
                width: 10px;
                height: 5px;
                margin: -3px 0 0 auto;
                border-left: 2px solid var(--f-brand);
                border-bottom: 2px solid var(--f-brand);
                transform: rotate(-45deg);
            }

/* Établissement : logo + nom, séparé par un filet (information, pas un menu) */
html.ed6-railmode .header .school-info,
html.ed6-railmode .header .school-info:hover {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    height: var(--tb-ctl-h) !important;
    max-width: 260px !important;
    margin: 0 0 0 4px !important;
    padding: 0 4px 0 12px !important;
    background: transparent !important;
    border: 0 !important;
    border-left: 1px solid var(--f-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    cursor: default !important;
}

    html.ed6-railmode .header .school-info .school_image {
        flex: none !important;
        width: calc(var(--tb-ctl-h) - 6px) !important;
        height: calc(var(--tb-ctl-h) - 6px) !important;
        margin: 0 !important;
        padding: 2px !important;
        border: 1px solid var(--f-line) !important;
        border-radius: 7px !important;
        background: #FFFFFF !important;
        box-shadow: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
    }

        html.ed6-railmode .header .school-info .school_image img { width: 100% !important; height: 100% !important; object-fit: contain !important; }

    html.ed6-railmode .header .school-info > div:not(.school_image) {
        display: flex !important;
        align-items: baseline !important;
        gap: 0 !important;
        min-width: 0 !important;
        padding: 0 !important;
    }

    html.ed6-railmode .header .school-info .SchoolName {
        display: block !important;
        font: 600 12.5px/1.2 "Geist", system-ui, sans-serif !important;
        color: var(--f-ink-0) !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 150px !important;
    }

    /* L'adresse complète ne tient pas dans la barre : le nom suffit (adresse en info-bulle) */
    html.ed6-railmode .header .school-info .SchoolAdress { display: none !important; }

@media (max-width: 1023.98px) {
    html.ed6-railmode .header .school-info > div:not(.school_image) { display: none !important; }
}

/* Avatar : initiales de l'utilisateur (frame-v6.js, data-ed6-initials) */
html.ed6-railmode .header .account-container {
    display: inline-flex !important;
    align-items: center !important;
    gap: 2px !important;
    margin: 0 !important;
    position: relative !important;
    cursor: pointer !important;
}

    html.ed6-railmode .header .account-container .account-button,
    html.ed6-railmode .header .account-container .account-button:hover {
        width: calc(var(--tb-ctl-h) - 4px) !important;
        height: calc(var(--tb-ctl-h) - 4px) !important;
        min-width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: linear-gradient(135deg, #5351FB 0%, #342484 100%) !important;
        box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3px var(--f-brand-100) !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        transform: none !important;
    }

        html.ed6-railmode .header .account-container .account-button:hover { box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3.5px #B9B8FD !important; }

        html.ed6-railmode .header .account-container .account-button[data-ed6-initials] .xaf-image { display: none !important; }

        html.ed6-railmode .header .account-container .account-button[data-ed6-initials]::after {
            content: attr(data-ed6-initials);
            font: 700 11px/1 "Geist", system-ui, sans-serif;
            color: #FFFFFF;
            letter-spacing: .03em;
        }

    /* Chevron du menu du compte */
    html.ed6-railmode .header .account-container::after {
        content: "";
        width: 6px;
        height: 6px;
        margin: -3px 2px 0 6px;
        border-right: 1.6px solid var(--f-ink-3);
        border-bottom: 1.6px solid var(--f-ink-3);
        transform: rotate(45deg);
        pointer-events: none;
        transition: border-color 120ms;
    }

    html.ed6-railmode .header .account-container:hover::after { border-color: var(--f-brand); }

/* Menu du compte */
html.ed6-railmode .account-main.dropdown-menu {
    min-width: 264px !important;
    padding: 6px !important;
    border: 1px solid var(--f-line) !important;
    border-radius: 14px !important;
    box-shadow: 0 16px 40px -12px rgba(20, 15, 62, .28), 0 2px 6px rgba(20, 15, 62, .06) !important;
    font-family: "Geist", system-ui, sans-serif !important;
}

    html.ed6-railmode .account-main .user-info-container {
        display: grid !important;
        grid-template-columns: 40px minmax(0, 1fr) !important;
        column-gap: 12px !important;
        row-gap: 0 !important;
        align-items: center !important;
        padding: 10px 4px 4px !important;
    }

        html.ed6-railmode .account-main .user-info-container > .logo-container {
            grid-column: 1;
            grid-row: 1 / span 2;
            margin-left: 6px !important;
            width: 40px !important;
            height: 40px !important;
            border-radius: 50% !important;
            background: linear-gradient(135deg, #5351FB 0%, #342484 100%) !important;
            box-shadow: 0 0 0 2px #FFFFFF, 0 0 0 3.5px var(--f-brand-100) !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
        }

        html.ed6-railmode .account-main .logo-container[data-ed6-initials] .xaf-image { display: none !important; }

        html.ed6-railmode .account-main .logo-container[data-ed6-initials]::after {
            content: attr(data-ed6-initials);
            font: 700 14px/1 "Geist", system-ui, sans-serif;
            color: #FFFFFF;
            letter-spacing: .03em;
        }

        html.ed6-railmode .account-main .user-info-inner-container { display: contents !important; }
        html.ed6-railmode .account-main .user-name-container { grid-column: 2; grid-row: 1; align-self: end; min-width: 0; }

        html.ed6-railmode .account-main .user-name {
            font: 600 14px/1.25 "Geist", system-ui, sans-serif !important;
            color: var(--f-ink-0) !important;
            margin: 0 !important;
        }

        html.ed6-railmode .account-main .user-info-inner-container[data-ed6-school]::after {
            content: attr(data-ed6-school);
            grid-column: 2;
            grid-row: 2;
            align-self: start;
            margin-top: 2px;
            font: 400 12px/1.3 "Geist", system-ui, sans-serif;
            color: var(--f-ink-3);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        html.ed6-railmode .account-main .user-info-container .dxbl-btn.xaf-btn.my-details { grid-column: 1 / -1; grid-row: 3; margin-top: 10px !important; }

    html.ed6-railmode .account-main .dxbl-btn.xaf-btn.my-details,
    html.ed6-railmode .account-main .dxbl-btn.xaf-btn.log-off {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        height: 36px !important;
        padding: 0 10px !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        font: 500 13px/1 "Geist", system-ui, sans-serif !important;
        text-decoration: none !important;
        justify-content: flex-start !important;
        color: var(--f-ink-1) !important;
        box-shadow: none !important;
    }

        html.ed6-railmode .account-main .dxbl-btn.xaf-btn .dxbl-btn-caption { text-decoration: none !important; }

        html.ed6-railmode .account-main .dxbl-btn.xaf-btn.my-details::before,
        html.ed6-railmode .account-main .dxbl-btn.xaf-btn.log-off::before {
            content: "";
            width: 16px;
            height: 16px;
            flex: none;
            background-color: currentColor;
        }

        html.ed6-railmode .account-main .dxbl-btn.xaf-btn.my-details::before {
            -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 3.6-7 8-7s8 3 8 7'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 3.6-7 8-7s8 3 8 7'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
            color: var(--f-brand);
        }

        html.ed6-railmode .account-main .dxbl-btn.xaf-btn.log-off::before {
            -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
        }

        html.ed6-railmode .account-main .dxbl-btn.xaf-btn.my-details:hover { background: var(--f-brand-50) !important; color: var(--f-brand-dk) !important; }
        html.ed6-railmode .account-main .dxbl-btn.xaf-btn.log-off { color: #B4233B !important; }
        html.ed6-railmode .account-main .dxbl-btn.xaf-btn.log-off:hover { background: #FCEBEE !important; }

    html.ed6-railmode .account-main .account-separator { margin: 4px 6px !important; background: var(--f-line) !important; }

/* Réglages : bouton rond, engrenage au trait */
html.ed6-railmode .header .theme-settings { margin: 0 !important; }

    html.ed6-railmode .header .theme-settings .theme-button,
    html.ed6-railmode .header .theme-settings .theme-button:hover {
        width: var(--tb-ctl-h) !important;
        height: var(--tb-ctl-h) !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        box-shadow: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        transition: background-color 120ms !important;
    }

        html.ed6-railmode .header .theme-settings .theme-button:hover { background: var(--f-soft) !important; }

        html.ed6-railmode .header .theme-settings .theme-button .xaf-image {
            width: 18px !important;
            height: 18px !important;
            background-image: none !important;
            background-color: var(--f-ink-2) !important;
            -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / 18px 18px no-repeat !important;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / 18px 18px no-repeat !important;
            transition: background-color 120ms, transform 300ms ease !important;
        }

        html.ed6-railmode .header .theme-settings .theme-button:hover .xaf-image { background-color: var(--f-brand) !important; transform: rotate(45deg); }

html.ed6-railmode body.xaf-size-s .header .theme-settings .theme-button .xaf-image {
    width: 16px !important;
    height: 16px !important;
    -webkit-mask-size: 16px 16px !important;
    mask-size: 16px 16px !important;
}


/* ════════════════════════════════════════════════════════════════════════════
   3. ONGLETS DES ÉCRANS OUVERTS (MDI) — maquette : onglet actif filet bleu en haut
   ════════════════════════════════════════════════════════════════════════════ */

html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist {
    display: flex !important;
    align-items: flex-end !important;
    min-height: calc(var(--mdi-tab-h) + var(--mdi-pad-top)) !important;
    height: auto !important;
    /* 16 px : le premier onglet s'aligne sur le bouton ≡ du ruban, « Nouveau » et la carte de la liste */
    padding: var(--mdi-pad-top) 16px 0 16px !important;
    margin: 0 !important;
    background: #FFFFFF !important;
    border: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 2 !important;
}

    /* Filet du bas dessiné sous les onglets : l'onglet actif le recouvre et se
       fond dans le ruban. Pas de débordement vertical : sinon DevExpress fait
       défiler la bande d'onglets vers le haut en montrant l'onglet actif. */
    html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 1px;
        background: var(--f-line);
        z-index: 0;
        pointer-events: none;
    }

    html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist ul {
        display: flex !important;
        align-items: flex-end !important;
        gap: 2px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist .dxbl-scroll-viewer,
    html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist .dxbl-scroll-viewer-content {
        align-self: stretch !important;
        display: flex !important;
        align-items: flex-end !important;
        height: var(--mdi-tab-h) !important;
        min-height: 0 !important;
        margin: 0 !important;
        overflow-y: hidden !important;
    }

    html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist ul,
    html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist li { height: var(--mdi-tab-h) !important; }

html.ed6-railmode .xaf-tabbed-mdi .dxbl-tabs-item:has(.xaf-tab-header-template) {
    padding: 0 !important;
    margin: 0 !important;
    height: var(--mdi-tab-h) !important;
    background: transparent !important;
    border: 0 !important;
    display: flex !important;
    align-items: flex-end !important;
}

    html.ed6-railmode .xaf-tabbed-mdi .dxbl-tabs-item:has(.xaf-tab-header-template) .dxbl-text { padding: 0 !important; }
    html.ed6-railmode .xaf-tabbed-mdi .dxbl-tabs-item:has(.xaf-tab-header-template) .dxbl-tabs-text-container { position: relative !important; height: 100% !important; }

    /* Copie invisible de DevExpress (réserve la largeur du titre en gras) : superposée, pas en dessous */
    html.ed6-railmode .xaf-tabbed-mdi .dxbl-tabs-space-reservation { position: absolute !important; top: 0 !important; left: 0 !important; height: 0 !important; overflow: hidden !important; }

html.ed6-railmode .xaf-tabbed-mdi .xaf-tab-header-template {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    height: var(--mdi-tab-h) !important;
    max-width: 220px !important;
    min-width: 0 !important;
    padding: 0 6px 0 12px !important;
    margin: 0 !important;
    border: 1px solid transparent !important;
    border-bottom: 0 !important;
    border-radius: 8px 8px 0 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--f-ink-2) !important;
    font: 500 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: background 100ms ease, color 100ms ease !important;
}

    html.ed6-railmode .xaf-tabbed-mdi .xaf-tab-header-template > span.d-flex { min-width: 0 !important; flex: 1 1 auto !important; margin: 0 !important; overflow: hidden !important; }

    html.ed6-railmode .xaf-tabbed-mdi .xaf-tab-header-template .dxbl-tabs-text-overflow {
        font: inherit !important;
        color: inherit !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    html.ed6-railmode .xaf-tabbed-mdi .xaf-tab-header-template::after,
    html.ed6-railmode .xaf-tabbed-mdi .dxbl-tabs-item.dxbl-active .dxbl-text:not(.dxbl-tabs-space-reservation) .xaf-tab-header-template::after { display: none !important; content: none !important; }

html.ed6-railmode .xaf-tabbed-mdi .dxbl-tabs-item:not(.dxbl-active):hover .xaf-tab-header-template {
    background: var(--f-soft) !important;
    color: var(--f-ink-0) !important;
    border-color: transparent !important;
}

/* Onglet actif : fond de l'écran (ruban blanc), filet bleu en haut, bords fins */
html.ed6-railmode .xaf-tabbed-mdi .dxbl-tabs-item.dxbl-active .xaf-tab-header-template {
    background: #FFFFFF !important;
    color: var(--f-ink-0) !important;
    font-weight: 600 !important;
    border-color: var(--f-line) !important;
    box-shadow: inset 0 2px 0 var(--f-brand) !important;
    position: relative !important;
    z-index: 1 !important;
}

/* Accueil et tableaux de bord Razor : pas de ruban, l'onglet actif se fond dans la page */
html.ed6-railmode.ed6-home .xaf-tabbed-mdi .dxbl-tabs-item.dxbl-active .xaf-tab-header-template { background: var(--f-page) !important; }

/* Fermer ✕ : discret, visible au survol et sur l'onglet actif */
html.ed6-railmode .xaf-tabbed-mdi .xaf-close-tab-button {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: none !important;
    width: 18px !important;
    height: 18px !important;
    border-radius: 5px !important;
    color: var(--f-ink-3) !important;
    opacity: 0 !important;
    cursor: pointer !important;
    transition: opacity 100ms ease, background 100ms ease !important;
}

    html.ed6-railmode .xaf-tabbed-mdi .xaf-close-tab-button svg { width: 10px !important; height: 10px !important; }
    html.ed6-railmode .xaf-tabbed-mdi .dxbl-tabs-item:hover .xaf-close-tab-button,
    html.ed6-railmode .xaf-tabbed-mdi .dxbl-tabs-item.dxbl-active .xaf-close-tab-button,
    html.ed6-railmode .xaf-tabbed-mdi .xaf-close-tab-button:focus-visible { opacity: 1 !important; }
    html.ed6-railmode .xaf-tabbed-mdi .xaf-close-tab-button:hover { background: var(--f-brand-50) !important; color: var(--f-brand-dk) !important; }

/* Flèches de défilement des onglets */
html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist .dxbl-tabs-scroll-btn-prev,
html.ed6-railmode dxbl-tabs.xaf-tabbed-mdi > .dxbl-tabs-tablist .dxbl-tabs-scroll-btn-next {
    align-self: center !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 6px !important;
    color: var(--f-ink-3) !important;
    background: transparent !important;
}


/* ════════════════════════════════════════════════════════════════════════════
   4. RUBAN : onglets Accueil / Vue + barre d'actions
   Règle d'or : ne pas contrarier l'adaptativité DevExpress. Quand la barre est
   étroite, DevExpress passe les boutons en « sans libellé » (icône seule) puis
   les replie dans « … ». Les styles ci-dessous suivent ces états au lieu de les
   forcer (sinon des boutons disparaissent jusqu'au prochain redimensionnement).
   ════════════════════════════════════════════════════════════════════════════ */

html.ed6-railmode .main-ribbon {
    background: #FFFFFF !important;
    border-bottom: 1px solid var(--f-line) !important;
    position: relative !important;
    z-index: 1 !important;
}

html.ed6-railmode .main-ribbon .xaf-ribbon,
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs,
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-content-panel,
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-content,
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-toolbar,
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-adaptive-container,
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-adaptive-container-content {
    background: #FFFFFF !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* ── Onglets du ruban ───────────────────────────────────────────────────── */

html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-tablist {
    min-height: var(--rb-tabs-h) !important;
    height: var(--rb-tabs-h) !important;
    padding: 0 8px !important;
    background: #FFFFFF !important;
    border: 0 !important;
    display: flex !important;
    align-items: stretch !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-tablist .dxbl-scroll-viewer,
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-tablist .dxbl-scroll-viewer-content,
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-tablist ul { height: 100% !important; display: flex !important; align-items: stretch !important; }

html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-item:not(:has(.xaf-tab-header-template)) {
    height: var(--rb-tabs-h) !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    font: 500 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important;
    color: var(--f-ink-2) !important;
    background: transparent !important;
    border: 0 !important;
    position: relative !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-item:not(:has(.xaf-tab-header-template)):hover { color: var(--f-ink-0) !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-item.dxbl-active:not(:has(.xaf-tab-header-template)) { color: var(--f-brand-dk) !important; font-weight: 600 !important; }

        html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-tabs-item.dxbl-active:not(:has(.xaf-tab-header-template))::after {
            content: "" !important;
            display: block !important;
            position: absolute !important;
            left: 10px !important;
            right: 10px !important;
            bottom: 0 !important;
            height: 2px !important;
            background: var(--f-brand) !important;
            border-radius: 2px 2px 0 0 !important;
        }

/* Bouton « ≡ » (menu) */
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-application-tab {
    height: calc(var(--rb-tabs-h) - 6px) !important;
    width: calc(var(--rb-tabs-h) - 6px) !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 3px 4px 3px 0 !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: var(--f-ink-2) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-application-tab:hover { background: var(--f-soft) !important; color: var(--f-ink-0) !important; }

/* ── Barre d'actions ────────────────────────────────────────────────────── */

html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-toolbar {
    height: var(--rb-bar-h) !important;
    min-height: var(--rb-bar-h) !important;
    /* 11 px + les 5 px du conteneur adaptatif DevExpress = 16 px, comme la carte de la liste */
    padding: 0 11px !important;
    margin: 0 !important;
    border-top: 1px solid var(--f-line-2) !important;
    display: flex !important;
    align-items: center !important;
}

html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-item,
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-button {
    height: var(--rb-btn-h) !important;
    min-height: var(--rb-btn-h) !important;
    font: 500 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important;
    color: var(--f-ink-1) !important;
    border-radius: 7px !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-button span { font-size: var(--rb-fs) !important; }

html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-button,
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-button > .dxbl-btn,
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-btn-split > .dxbl-btn {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon button.dxbl-ribbon-button:not(.dxbl-disabled):hover,
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-btn-split.dxbl-ribbon-button > .dxbl-btn:not(.dxbl-disabled):hover {
        background: var(--f-soft) !important;
        color: var(--f-ink-0) !important;
    }

    /* Boutons avec libellé : icône + libellé ; icône seule : carré */
    html.ed6-railmode .main-ribbon .xaf-ribbon button.dxbl-ribbon-button,
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-btn-split.dxbl-ribbon-button > .dxbl-btn {
        padding: 0 9px !important;
        gap: 6px !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    html.ed6-railmode .main-ribbon .xaf-ribbon button.dxbl-ribbon-button.btn-icon,
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-adaptive-item-state-no-text button.dxbl-ribbon-button:has(img),
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-adaptive-item-state-no-text .dxbl-btn-split > .dxbl-btn:first-child:has(img) {
        min-width: var(--rb-btn-h) !important;
        padding: 0 7px !important;
        justify-content: center !important;
    }

    /* Désactivé : lisible mais en retrait */
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-button.dxbl-disabled,
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-button:disabled,
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-btn-split.dxbl-ribbon-button > .dxbl-btn.dxbl-disabled { opacity: .42 !important; color: var(--f-ink-2) !important; }

/* Barre étroite : DevExpress passe en « sans libellé » → icône seule (libellé en info-bulle) */
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-adaptive-item-state-no-text .dxbl-ribbon-button > .dxbl-image ~ span:not(.educated-ribbon-ico),
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-adaptive-item-state-no-text .dxbl-ribbon-button.dxbl-ribbon-item-split > .dxbl-btn > .dxbl-image ~ span:not(.educated-ribbon-ico) { display: none !important; }

/* Icônes : silhouettes à l'encre, bleu au survol, 16 px */
html.ed6-railmode .main-ribbon .xaf-ribbon img.xaf-toolbar-item-icon,
html.ed6-railmode .main-ribbon .xaf-ribbon img.image {
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    flex: none !important;
    margin: 0 !important;
    filter: var(--rb-ico) !important;
    opacity: 1 !important;
    transition: filter 120ms ease !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-btn:not(.dxbl-disabled):hover img.xaf-toolbar-item-icon { filter: var(--rb-ico-hover) !important; }

/* Pastilles colorées de l'ancien ruban (ribbon-icons.js, non chargé en V6) */
html.ed6-railmode .main-ribbon .educated-ribbon-ico { display: none !important; }

/* Chevron des menus déroulants */
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-btn .dxbl-image:not(img),
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-btn-split-dropdown svg { width: 12px !important; height: 12px !important; color: var(--f-ink-3) !important; }

html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-btn-split-dropdown {
    min-width: 0 !important;
    width: 18px !important;
    padding: 0 3px !important;
    border-left: 0 !important;
}

/* « … » (actions repliées) */
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-toolbar-btn-ellipsis > .dxbl-btn {
    height: var(--rb-btn-h) !important;
    min-width: var(--rb-btn-h) !important;
    padding: 0 7px !important;
    border-radius: 7px !important;
    background: transparent !important;
    border: 0 !important;
    color: var(--f-ink-2) !important;
    font: 500 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-toolbar-btn-ellipsis > .dxbl-btn:hover { background: var(--f-soft) !important; color: var(--f-ink-0) !important; }

/* Séparateurs de groupes */
html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-toolbar-group-separator {
    width: 1px !important;
    height: calc(var(--rb-btn-h) - 10px) !important;
    margin: 0 5px !important;
    background: var(--f-line) !important;
    border: 0 !important;
    align-self: center !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-adaptive-group-first-visible > .dxbl-toolbar-group-separator,
    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-adaptive-container-content > .dxbl-toolbar-layout-block-group:first-child > .dxbl-toolbar-group-separator { display: none !important; }

/* Action principale « Nouveau » : bouton plein, bleu Educated */
html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Nouveau"],
html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="New"] {
    background: var(--f-brand) !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    box-shadow: 0 6px 14px -9px rgba(52, 36, 132, .8) !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon button[data-action-name="Nouveau"],
    html.ed6-railmode .main-ribbon .xaf-ribbon button[data-action-name="New"] { padding: 0 12px !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Nouveau"] > .dxbl-btn,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="New"] > .dxbl-btn { color: #FFFFFF !important; font-weight: 600 !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Nouveau"] span,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="New"] span { color: #FFFFFF !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Nouveau"] img.xaf-toolbar-item-icon,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="New"] img.xaf-toolbar-item-icon,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Nouveau"] .dxbl-btn:hover img.xaf-toolbar-item-icon { filter: var(--rb-ico-white) !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Nouveau"] svg,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="New"] svg { color: rgba(255, 255, 255, .85) !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon button[data-action-name="Nouveau"]:hover,
    html.ed6-railmode .main-ribbon .xaf-ribbon button[data-action-name="New"]:hover,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Nouveau"] > .dxbl-btn:hover,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="New"] > .dxbl-btn:hover { background: var(--f-brand-dk) !important; color: #FFFFFF !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Nouveau"] > .dxbl-btn-split-dropdown,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="New"] > .dxbl-btn-split-dropdown { border-left: 1px solid rgba(255, 255, 255, .28) !important; border-radius: 0 8px 8px 0 !important; }

/* Enregistrer : même traitement quand l'action est disponible */
html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Enregistrer"]:not(.dxbl-disabled):not([disabled]),
html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Save"]:not(.dxbl-disabled):not([disabled]) {
    background: var(--f-brand) !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    box-shadow: 0 6px 14px -9px rgba(52, 36, 132, .8) !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Enregistrer"]:not(.dxbl-disabled):not([disabled]) span,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Save"]:not(.dxbl-disabled):not([disabled]) span { color: #FFFFFF !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Enregistrer"]:not(.dxbl-disabled):not([disabled]) img.xaf-toolbar-item-icon,
    html.ed6-railmode .main-ribbon .xaf-ribbon [data-action-name="Save"]:not(.dxbl-disabled):not([disabled]) img.xaf-toolbar-item-icon { filter: var(--rb-ico-white) !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon button[data-action-name="Enregistrer"]:not(.dxbl-disabled):not([disabled]):hover,
    html.ed6-railmode .main-ribbon .xaf-ribbon button[data-action-name="Save"]:not(.dxbl-disabled):not([disabled]):hover { background: var(--f-brand-dk) !important; color: #FFFFFF !important; }

/* Recherche plein texte de la liste */
html.ed6-railmode .main-ribbon .xaf-ribbon .xaf-action-fulltextsearch.dxbl-text-edit {
    width: var(--rb-search-w) !important;
    height: var(--rb-btn-h) !important;
    min-height: var(--rb-btn-h) !important;
    background: var(--f-soft) !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    --dxbl-text-edit-border-color: transparent;
    transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon .xaf-action-fulltextsearch.dxbl-text-edit:hover { border-color: #DEDBEC !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon .xaf-action-fulltextsearch.dxbl-text-edit:focus-within {
        background: #FFFFFF !important;
        border-color: var(--f-brand) !important;
        box-shadow: 0 0 0 3px var(--f-ring) !important;
    }

    html.ed6-railmode .main-ribbon .xaf-ribbon .xaf-action-fulltextsearch .dxbl-text-edit-input {
        font: 400 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important;
        color: var(--f-ink-0) !important;
        padding-left: 10px !important;
        background: transparent !important;
    }

        html.ed6-railmode .main-ribbon .xaf-ribbon .xaf-action-fulltextsearch .dxbl-text-edit-input::placeholder { color: var(--f-ink-3) !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon .xaf-action-fulltextsearch .dxbl-text-edit-btn {
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        height: 100% !important;
        width: calc(var(--rb-btn-h) - 2px) !important;
        padding: 0 !important;
        border-radius: 0 8px 8px 0 !important;
    }

        html.ed6-railmode .main-ribbon .xaf-ribbon .xaf-action-fulltextsearch .dxbl-text-edit-btn img { width: 14px !important; height: 14px !important; filter: var(--rb-ico) !important; }

/* Menus déroulants du ruban (Exporter, Opérations, « … ») */
html.ed6-railmode .dxbl-dropdown-dialog:has(.dxbl-menu, .dxbl-toolbar-dropdown-item),
html.ed6-railmode .dxbl-toolbar-dropdown .dxbl-dropdown-dialog {
    border: 1px solid var(--f-line) !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 40px -12px rgba(20, 15, 62, .25), 0 2px 6px rgba(20, 15, 62, .06) !important;
    overflow: hidden !important;
}

html.ed6-railmode .dxbl-toolbar-dropdown .dxbl-menu-item-text,
html.ed6-railmode .dxbl-toolbar-dropdown .dxbl-btn,
html.ed6-railmode .dxbl-toolbar-dropdown .dxbl-btn span { font: 500 12.5px/1.2 "Geist", system-ui, sans-serif !important; color: var(--f-ink-1) !important; }

html.ed6-railmode .dxbl-toolbar-dropdown img.xaf-toolbar-item-icon { filter: var(--rb-ico) !important; width: 16px !important; height: 16px !important; }


/* ════════════════════════════════════════════════════════════════════════════
   5. LISTES (grille DevExpress) — même dessin que le ruban
   Carte blanche sur le fond de page ; tout ce qui est cliquable reprend les
   boutons du ruban (Geist, --rb-fs, encre, survol --f-soft, actif bleu) :
   zone de regroupement, en-têtes, ligne de filtre, panneau de filtre, pager.
   Densité : Standard (lignes 38 px) et Compact (34 px), comme le cadre.
   Les couleurs posées par les règles d'apparence XAF ([style], xaf-dynamic-*)
   ne sont jamais écrasées.
   ════════════════════════════════════════════════════════════════════════════ */

html.ed6-railmode body {
    --gr-head-h: 36px;
    --gr-row-h: 38px;
    --gr-filter-h: 40px;
    --gr-edit-h: 28px;
    --gr-px: 12px;
    --gr-fs: var(--rb-fs);
    --gr-hover: #F7F7FD;
    --gr-group: #FAFAFE;
}

html.ed6-railmode body.xaf-size-s {
    --gr-head-h: 32px;
    --gr-row-h: 34px;
    --gr-filter-h: 36px;
    --gr-edit-h: 26px;
    --gr-px: 10px;
}

/* ── Carte ──────────────────────────────────────────────────────────────── */
html.ed6-railmode .main-content .dxbl-grid {
    background: #FFFFFF !important;
    border: 1px solid var(--f-line) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 1px 2px rgba(20, 15, 62, .04) !important;
}

/* Peu de colonnes : la table occupe toute la carte (la colonne vide de DevExpress
   prend le reste), l'en-tête et les filets vont jusqu'au bord droit */
html.ed6-railmode .dxbl-grid .dxbl-grid-table { min-width: 100% !important; }

/* Typographie : Geist partout, chiffres alignés (sans la police à chasse fixe de grid.css) */
html.ed6-railmode .dxbl-grid .dxbl-grid-table,
html.ed6-railmode .dxbl-grid .dxbl-grid-table td,
html.ed6-railmode .dxbl-grid .dxbl-grid-table td * {
    font-family: "Geist", system-ui, sans-serif !important;
    font-size: var(--gr-fs) !important;
    font-variant-numeric: tabular-nums !important;
}

html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody td.dxbl-align-right,
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody td.dxbl-align-right * { color: var(--f-ink-0) !important; }

/* Aucune bordure verticale, filets horizontaux fins */
html.ed6-railmode .dxbl-grid .dxbl-grid-table td,
html.ed6-railmode .dxbl-grid .dxbl-grid-table th { border-left: 0 !important; border-right: 0 !important; }

/* ── Zone de regroupement : des « puces » comme les boutons du ruban ───── */
html.ed6-railmode .dxbl-grid .dxbl-grid-top-panel,
html.ed6-railmode .dxbl-grid .dxbl-grid-group-panel-container {
    background: #FFFFFF !important;
    border-bottom: 1px solid var(--f-line-2) !important;
}

html.ed6-railmode .dxbl-grid .dxbl-grid-group-panel-container {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    min-height: calc(var(--rb-btn-h) + 16px) !important;
    padding: 8px var(--gr-px) !important;
    color: var(--f-ink-3) !important;
    font: 400 12px/1.2 "Geist", system-ui, sans-serif !important;
}

    html.ed6-railmode .dxbl-grid .dxbl-grid-group-panel-container > .dxbl-grid-header {
        height: calc(var(--rb-btn-h) - 2px) !important;
        min-height: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        padding: 0 6px 0 10px !important;
        margin: 0 !important;
        background: #FFFFFF !important;
        border: 1px solid var(--f-line) !important;
        border-radius: 7px !important;
        box-shadow: none !important;
        color: var(--f-ink-1) !important;
        cursor: pointer !important;
        transition: background 120ms, border-color 120ms !important;
    }

        html.ed6-railmode .dxbl-grid .dxbl-grid-group-panel-container > .dxbl-grid-header:hover { background: var(--f-soft) !important; border-color: #DEDBEC !important; }

        html.ed6-railmode .dxbl-grid .dxbl-grid-group-panel-container > .dxbl-grid-header span[role="presentation"] {
            font: 500 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important;
            color: var(--f-ink-1) !important;
            text-transform: none !important;
            letter-spacing: 0 !important;
        }

/* ── En-têtes de colonnes ───────────────────────────────────────────────── */
html.ed6-railmode .dxbl-grid .dxbl-grid-header-row,
html.ed6-railmode .dxbl-grid .dxbl-grid-table th.dxbl-grid-header {
    background: var(--f-head) !important;
}

html.ed6-railmode .dxbl-grid .dxbl-grid-table th.dxbl-grid-header {
    height: var(--gr-head-h) !important;
    padding: 0 var(--gr-px) !important;
    border-top: 0 !important;
    border-bottom: 1px solid var(--f-line) !important;
    vertical-align: middle !important;
    transition: background 120ms !important;
}

    html.ed6-railmode .dxbl-grid .dxbl-grid-table th.dxbl-grid-header.dxbl-grid-header-sortable:hover { background: var(--f-soft) !important; }

    html.ed6-railmode .dxbl-grid .dxbl-grid-table th.dxbl-grid-header,
    html.ed6-railmode .dxbl-grid .dxbl-grid-table th.dxbl-grid-header span[role="presentation"],
    html.ed6-railmode .dxbl-grid .dxbl-grid-table th.dxbl-grid-header .grid-column-header-container span {
        font: 600 12px/1.25 "Geist", system-ui, sans-serif !important;
        color: var(--f-ink-2) !important;
        text-transform: none !important;
        letter-spacing: 0 !important;
    }

    html.ed6-railmode .dxbl-grid .dxbl-grid-table th.dxbl-grid-header.dxbl-grid-selection-cell { padding: 0 !important; text-align: center !important; }

    /* Tri : flèche bleue ; entonnoir discret, bleu quand un filtre est posé */
    html.ed6-railmode .dxbl-grid .dxbl-grid-sort-asc,
    html.ed6-railmode .dxbl-grid .dxbl-grid-sort-desc { color: var(--f-brand) !important; margin-left: 4px !important; }

    html.ed6-railmode .dxbl-grid .dxbl-grid-filter-menu-funnel-btn {
        width: 22px !important;
        height: 22px !important;
        min-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 6px !important;
        background: transparent !important;
        box-shadow: none !important;
        color: var(--f-ink-3) !important;
        opacity: .45 !important;
        transition: opacity 120ms, background 120ms !important;
    }

        html.ed6-railmode .dxbl-grid .dxbl-grid-header:hover .dxbl-grid-filter-menu-funnel-btn { opacity: .85 !important; }
        html.ed6-railmode .dxbl-grid .dxbl-grid-filter-menu-funnel-btn:hover { opacity: 1 !important; background: var(--f-brand-50) !important; color: var(--f-brand) !important; }
        html.ed6-railmode .dxbl-grid .dxbl-grid-filter-menu-funnel-btn-filled { opacity: 1 !important; color: var(--f-brand) !important; }
        html.ed6-railmode .dxbl-grid .dxbl-grid-filter-menu-funnel-btn svg { width: 12px !important; height: 12px !important; }

/* ── Ligne de filtre : champs comme la recherche du ruban ──────────────── */
html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row > td {
    height: var(--gr-filter-h) !important;
    padding: 0 6px !important;
    background: #FFFFFF !important;
    border-top: 0 !important;
    border-bottom: 1px solid var(--f-line) !important;
    vertical-align: middle !important;
}

    html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row .dxbl-text-edit {
        /* DevExpress étire l'éditeur sur toute la cellule (marges négatives) : les champs se touchaient */
        width: 100% !important;
        margin: 0 !important;
        height: var(--gr-edit-h) !important;
        min-height: var(--gr-edit-h) !important;
        background: var(--f-soft) !important;
        border: 1px solid transparent !important;
        border-radius: 7px !important;
        box-shadow: none !important;
        --dxbl-text-edit-border-color: transparent;
        transition: background 120ms, border-color 120ms, box-shadow 120ms !important;
    }

        html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row .dxbl-text-edit::before,
        html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row .dxbl-text-edit::after { display: none !important; }

        html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row .dxbl-text-edit:hover { border-color: #DEDBEC !important; }

        html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row .dxbl-text-edit:focus-within {
            background: #FFFFFF !important;
            border-color: var(--f-brand) !important;
            box-shadow: 0 0 0 3px var(--f-ring) !important;
        }

    html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row input.dxbl-text-edit-input {
        height: 100% !important;
        min-height: 0 !important;
        padding: 0 8px !important;
        background: transparent !important;
        border: 0 !important;
        font: 400 var(--gr-fs)/1 "Geist", system-ui, sans-serif !important;
        color: var(--f-ink-0) !important;
    }

        html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row input.dxbl-text-edit-input::placeholder { color: var(--f-ink-3) !important; }

    html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row .dxbl-text-edit .dxbl-btn {
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: var(--f-ink-3) !important;
    }

        html.ed6-railmode .dxbl-grid .dxbl-grid-filter-row .dxbl-text-edit .dxbl-btn:hover { color: var(--f-ink-0) !important; }

/* ── Lignes ─────────────────────────────────────────────────────────────── */
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr[data-visible-index]:not(.dxbl-grid-group-row) { height: var(--gr-row-h) !important; }

html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr[data-visible-index] > td {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-top: 0 !important;
    border-bottom: 1px solid var(--f-line-2) !important;
    color: var(--f-ink-0);
    vertical-align: middle !important;
}

html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr[data-visible-index]:not(.dxbl-grid-group-row) > td[role="gridcell"],
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr[data-visible-index]:not(.dxbl-grid-group-row) > td.xaf-action { padding-left: var(--gr-px) !important; padding-right: var(--gr-px) !important; }

html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr[data-visible-index]:not([style]):not([class*="xaf-dynamic-"]):not(.dxbl-grid-group-row) { background: #FFFFFF !important; }

    html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr[data-visible-index]:not([style]):not([class*="xaf-dynamic-"]):not(.dxbl-grid-group-row):hover { background: var(--gr-hover) !important; }

    /* Sélection : fond bleu pâle et repère bleu à gauche, comme l'onglet actif */
    html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr[data-visible-index]:not([style]):not([class*="xaf-dynamic-"])[aria-selected="true"] { background: var(--f-brand-50) !important; }

    html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr[data-visible-index][aria-selected="true"] > td:first-child { box-shadow: inset 2px 0 0 var(--f-brand) !important; }

/* Cellule active au clavier : anneau bleu, pas le cadre noir DevExpress */
html.ed6-railmode .dxbl-grid .dxbl-grid-table td.dxbl-grid-focused-cell,
html.ed6-railmode .dxbl-grid .dxbl-grid-table td:focus-visible { outline: 0 !important; box-shadow: inset 0 0 0 2px var(--f-ring) !important; }

/* Liens vers une fiche */
/* Liens vers un objet (classe, matière, niveau…) : couleur du texte, pas un mur de bleu quand
   plusieurs colonnes sont des liens. Survol de la ligne : soulignement discret qui montre qu'on
   peut cliquer ; survol du lien : couleur de la marque. */
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody td a.grid-cell-object-link {
    color: var(--f-ink-1) !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    text-underline-offset: 3px;
    transition: color .1s;
}
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr:hover td a.grid-cell-object-link {
    text-decoration: underline dotted #B9B5D0 !important;
}
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody td a.grid-cell-object-link:hover {
    color: var(--f-brand) !important;
    text-decoration: underline solid var(--f-brand) !important;
}

/* Cases à cocher : carrées arrondies, bleu Educated */
html.ed6-railmode .dxbl-grid .dxbl-grid-selection-cell { width: 40px !important; padding: 0 !important; text-align: center !important; }

html.ed6-railmode .dxbl-grid .dxbl-checkbox .dxbl-checkbox-check-element {
    width: 16px !important;
    height: 16px !important;
    border-radius: 4px !important;
    border: 1.5px solid #CFCCE0 !important;
    background: #FFFFFF !important;
    box-shadow: none !important;
}

    html.ed6-railmode .dxbl-grid .dxbl-checkbox:hover .dxbl-checkbox-check-element { border-color: var(--f-brand) !important; }

    html.ed6-railmode .dxbl-grid .dxbl-checkbox.dxbl-checkbox-checked .dxbl-checkbox-check-element,
    html.ed6-railmode .dxbl-grid .dxbl-checkbox.dxbl-checkbox-indeterminate .dxbl-checkbox-check-element {
        background: var(--f-brand) !important;
        border-color: var(--f-brand) !important;
        color: #FFFFFF !important;
    }

/* Booléens affichés (lecture seule) */
html.ed6-railmode .dxbl-grid .dxbl-checkbox-display-view-checked,
html.ed6-railmode .dxbl-grid .dxbl-checkbox-display-view-checked svg { color: var(--f-brand) !important; }

/* ── Lignes de regroupement ─────────────────────────────────────────────── */
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr.dxbl-grid-group-row { height: calc(var(--gr-row-h) - 4px) !important; }

html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr.dxbl-grid-group-row > td {
    background: var(--gr-group) !important;
    border-bottom: 1px solid var(--f-line) !important;
    font-weight: 600 !important;
    color: var(--f-ink-0) !important;
}

html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr.dxbl-grid-group-row > td:not(.dxbl-grid-expand-button-cell) { padding-left: 4px !important; }

html.ed6-railmode .dxbl-grid .dxbl-grid-indent-cell { background: var(--gr-group) !important; }

html.ed6-railmode .dxbl-grid .dxbl-grid-expand-button {
    width: 22px !important;
    height: 22px !important;
    padding: 0 !important;
    border-radius: 6px !important;
    color: var(--f-ink-3) !important;
}

    html.ed6-railmode .dxbl-grid .dxbl-grid-expand-button:hover { background: var(--f-brand-50) !important; color: var(--f-brand) !important; }

/* ── Totaux (pied de groupe et pied de liste) ───────────────────────────── */
html.ed6-railmode .dxbl-grid .dxbl-grid-footer-row > td,
html.ed6-railmode .dxbl-grid .dxbl-grid-group-footer-row > td {
    height: calc(var(--gr-row-h) - 6px) !important;
    padding: 0 var(--gr-px) !important;
    background: var(--f-head) !important;
    border-top: 1px solid var(--f-line) !important;
    border-bottom: 0 !important;
    vertical-align: middle !important;
}

    html.ed6-railmode .dxbl-grid .dxbl-grid-footer-row [dxbl-grid-summary-item],
    html.ed6-railmode .dxbl-grid .dxbl-grid-group-footer-row [dxbl-grid-summary-item] { font: 600 12px/1.2 "Geist", system-ui, sans-serif !important; color: var(--f-ink-2) !important; }

/* ── Aucune donnée ──────────────────────────────────────────────────────── */
html.ed6-railmode .dxbl-grid .dxbl-grid-empty-data-area,
html.ed6-railmode .dxbl-grid .dxbl-grid-empty-row td { color: var(--f-ink-3) !important; font: 400 12.5px/1.4 "Geist", system-ui, sans-serif !important; background: #FFFFFF !important; }

/* ── Panneau de filtre (bas de liste) : une puce comme les boutons du ruban ── */
html.ed6-railmode .dxbl-grid td:has(> .dxbl-grid-filter-panel),
html.ed6-railmode .dxbl-grid div:has(> .dxbl-grid-filter-panel) {
    padding: 8px var(--gr-px) !important;
    background: #FFFFFF !important;
    border-top: 1px solid var(--f-line-2) !important;
}

html.ed6-railmode .dxbl-grid .dxbl-grid-filter-panel {
    height: calc(var(--rb-btn-h) - 2px) !important;
    margin: 0 !important;
    padding: 0 4px 0 8px !important;
    border: 1px solid var(--f-line) !important;
    border-radius: 7px !important;
    background: #FFFFFF !important;
    font: 500 12px/1 "Geist", system-ui, sans-serif !important;
}

    html.ed6-railmode .dxbl-grid .dxbl-grid-filter-panel .dxbl-grid-filter-panel-filter,
    html.ed6-railmode .dxbl-grid .dxbl-grid-filter-panel .dxbl-grid-filter-panel-filter * { color: var(--f-brand-dk) !important; text-decoration: none !important; font-weight: 500 !important; }

    html.ed6-railmode .dxbl-grid .dxbl-grid-filter-panel .dxbl-grid-filter-panel-filter:hover { background: var(--f-brand-50) !important; }

/* ── Pager ──────────────────────────────────────────────────────────────── */
html.ed6-railmode .dxbl-grid .dxbl-grid-pager,
html.ed6-railmode .dxbl-grid .dxbl-pager-container {
    background: #FFFFFF !important;
    border-top: 1px solid var(--f-line-2) !important;
    padding: 8px var(--gr-px) !important;
    font: 400 12px/1 "Geist", system-ui, sans-serif !important;
    color: var(--f-ink-2) !important;
}

    html.ed6-railmode .dxbl-grid .dxbl-pager .dxbl-btn {
        height: calc(var(--rb-btn-h) - 2px) !important;
        min-width: calc(var(--rb-btn-h) - 2px) !important;
        padding: 0 8px !important;
        border: 0 !important;
        border-radius: 7px !important;
        background: transparent !important;
        box-shadow: none !important;
        color: var(--f-ink-1) !important;
        font: 500 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important;
    }

        html.ed6-railmode .dxbl-grid .dxbl-pager .dxbl-btn:not(.dxbl-disabled):hover { background: var(--f-soft) !important; color: var(--f-ink-0) !important; }

        html.ed6-railmode .dxbl-grid .dxbl-pager .dxbl-btn.dxbl-active,
        html.ed6-railmode .dxbl-grid .dxbl-pager .dxbl-pager-page.dxbl-active { background: var(--f-brand-50) !important; color: var(--f-brand-dk) !important; font-weight: 600 !important; }

/* ── Barres de défilement fines ─────────────────────────────────────────── */
html.ed6-railmode .dxbl-grid .dxbl-scroll-viewer-scroll-thumb { background: #D5D2E4 !important; border-radius: 99px !important; }
html.ed6-railmode .dxbl-grid .dxbl-scroll-viewer-scroll-thumb:hover { background: #B5B1CC !important; }

/* ── Barre d'outils d'une liste dans une fiche (Lier, Supprimer…) ──────── */
html.ed6-railmode .main-content .dxbl-grid .dxbl-grid-toolbar-container {
    padding: 6px var(--gr-px) !important;
    background: #FFFFFF !important;
    border-bottom: 1px solid var(--f-line-2) !important;
}

/* ════════════════════════════════════════════════════════════════════════════
   6. LISTES DANS UNE FICHE (onglets Responsables, Stages, Paiements…)
   La barre d'actions de la liste reprend les boutons du ruban : boutons texte
   sans cadre, icônes en silhouette, « Nouveau » plein bleu, recherche en champ
   clair. Les états d'adaptativité de DevExpress (icône seule, « … ») sont suivis.
   ════════════════════════════════════════════════════════════════════════════ */

html.ed6-railmode .main-content .nested-frame { display: flex !important; flex-direction: column !important; gap: 8px !important; }

html.ed6-railmode .main-content .nested-toolbar .dxbl-toolbar {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

html.ed6-railmode .main-content .nested-toolbar .dxbl-btn-toolbar { gap: 2px !important; align-items: center !important; }

html.ed6-railmode .main-content .nested-toolbar .dxbl-toolbar-group { gap: 2px !important; }

html.ed6-railmode .main-content .nested-toolbar .dxbl-btn {
    height: var(--rb-btn-h) !important;
    min-height: var(--rb-btn-h) !important;
    padding: 0 9px !important;
    gap: 6px !important;
    display: inline-flex !important;
    align-items: center !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 7px !important;
    box-shadow: none !important;
    color: var(--f-ink-1) !important;
    font: 500 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important;
}

    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn span { font: 500 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important; color: inherit !important; }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn:not(.dxbl-disabled):not(:disabled):hover { background: var(--f-soft) !important; color: var(--f-ink-0) !important; }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn.dxbl-disabled,
    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn:disabled { opacity: .42 !important; color: var(--f-ink-2) !important; }

    /* Icône seule : bouton carré */
    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn:has(img.xaf-toolbar-item-icon):not(:has(span:not(:empty))),
    html.ed6-railmode .main-content .nested-toolbar .dxbl-adaptive-item-state-no-text .dxbl-btn:has(img) { min-width: var(--rb-btn-h) !important; padding: 0 7px !important; justify-content: center !important; }

    html.ed6-railmode .main-content .nested-toolbar img.xaf-toolbar-item-icon {
        width: 16px !important;
        height: 16px !important;
        margin: 0 !important;
        filter: var(--rb-ico) !important;
        opacity: 1 !important;
        transition: filter 120ms ease !important;
    }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn:not(.dxbl-disabled):hover img.xaf-toolbar-item-icon { filter: var(--rb-ico-hover) !important; }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn .dxbl-image:not(img) { width: 12px !important; height: 12px !important; color: var(--f-ink-3) !important; }

    /* Séparateurs entre groupes */
    html.ed6-railmode .main-content .nested-toolbar .dxbl-toolbar-group + .dxbl-toolbar-group::before {
        content: "";
        width: 1px;
        height: calc(var(--rb-btn-h) - 12px);
        margin: 0 4px;
        background: var(--f-line);
        align-self: center;
    }

/* « Nouveau » de la liste : plein bleu, comme dans le ruban */
html.ed6-railmode .main-content .nested-toolbar .dxbl-btn[data-action-name="Nouveau"],
html.ed6-railmode .main-content .nested-toolbar .dxbl-btn[data-action-name="New"] {
    background: var(--f-brand) !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    padding: 0 12px !important;
    box-shadow: 0 6px 14px -9px rgba(52, 36, 132, .8) !important;
}

    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn[data-action-name="Nouveau"] span,
    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn[data-action-name="New"] span { color: #FFFFFF !important; font-weight: 600 !important; }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn[data-action-name="Nouveau"] img.xaf-toolbar-item-icon,
    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn[data-action-name="New"] img.xaf-toolbar-item-icon { filter: var(--rb-ico-white) !important; }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn[data-action-name="Nouveau"]:hover,
    html.ed6-railmode .main-content .nested-toolbar .dxbl-btn[data-action-name="New"]:hover { background: var(--f-brand-dk) !important; color: #FFFFFF !important; }

/* Recherche de la liste : champ clair, comme celle du ruban */
html.ed6-railmode .main-content .nested-toolbar .xaf-action-fulltextsearch.dxbl-text-edit,
html.ed6-railmode .main-content .nested-toolbar .dxbl-text-edit {
    height: var(--rb-btn-h) !important;
    min-height: var(--rb-btn-h) !important;
    background: var(--f-soft) !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    --dxbl-text-edit-border-color: transparent;
    transition: background 120ms, border-color 120ms, box-shadow 120ms !important;
}

    html.ed6-railmode .main-content .nested-toolbar .dxbl-text-edit::before,
    html.ed6-railmode .main-content .nested-toolbar .dxbl-text-edit::after { display: none !important; }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-text-edit:hover { border-color: #DEDBEC !important; }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-text-edit:focus-within { background: #FFFFFF !important; border-color: var(--f-brand) !important; box-shadow: 0 0 0 3px var(--f-ring) !important; }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-text-edit .dxbl-text-edit-input {
        font: 400 var(--rb-fs)/1 "Geist", system-ui, sans-serif !important;
        color: var(--f-ink-0) !important;
        padding-left: 10px !important;
        background: transparent !important;
    }

        html.ed6-railmode .main-content .nested-toolbar .dxbl-text-edit .dxbl-text-edit-input::placeholder { color: var(--f-ink-3) !important; }

    html.ed6-railmode .main-content .nested-toolbar .dxbl-text-edit .dxbl-btn { height: 100% !important; min-height: 0 !important; width: calc(var(--rb-btn-h) - 2px) !important; padding: 0 !important; justify-content: center !important; border-radius: 0 8px 8px 0 !important; }

        html.ed6-railmode .main-content .nested-toolbar .dxbl-text-edit .dxbl-btn img { width: 14px !important; height: 14px !important; filter: var(--rb-ico) !important; }

/* ════════════════════════════════════════════════════════════════════════════
   7. GRILLE V6 : ruban sur une ligne, en-tête de liste, puces, sélection
   (GridV6Controller + EducatedGridHeader.razor, maquette « Grille moderne Educated »)
   ════════════════════════════════════════════════════════════════════════════ */

/* Ruban sur une ligne : actions à gauche, « ≡ Accueil | Vue » en sélecteur à droite.
   La barre d'actions garde toute la place restante : l'adaptativité DevExpress la mesure. */
html.ed6-railmode .main-ribbon .xaf-ribbon > dxbl-tabs {
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    min-height: var(--rb-bar-h) !important;
}

    html.ed6-railmode .main-ribbon .xaf-ribbon > dxbl-tabs > .dxbl-tabs-tablist {
        flex: none !important;
        width: auto !important;
        height: calc(var(--rb-btn-h) - 2px) !important;
        min-height: 0 !important;
        margin: 0 12px 0 8px !important;
        padding: 2px !important;
        border-radius: 8px !important;
        background: var(--f-soft) !important;
    }

        html.ed6-railmode .main-ribbon .xaf-ribbon > dxbl-tabs > .dxbl-tabs-tablist .dxbl-scroll-viewer { width: auto !important; flex: none !important; }

        html.ed6-railmode .main-ribbon .xaf-ribbon > dxbl-tabs > .dxbl-tabs-tablist .dxbl-tabs-item:not(:has(.xaf-tab-header-template)) {
            height: 100% !important;
            padding: 0 10px !important;
            border-radius: 6px !important;
            font-size: 12px !important;
        }

        html.ed6-railmode .main-ribbon .xaf-ribbon > dxbl-tabs > .dxbl-tabs-tablist .dxbl-tabs-item.dxbl-active:not(:has(.xaf-tab-header-template)) { background: #FFFFFF !important; box-shadow: 0 1px 2px rgba(20, 15, 62, .1) !important; }

        html.ed6-railmode .main-ribbon .xaf-ribbon > dxbl-tabs > .dxbl-tabs-tablist .dxbl-tabs-item.dxbl-active:not(:has(.xaf-tab-header-template))::after { display: none !important; }

        html.ed6-railmode .main-ribbon .xaf-ribbon > dxbl-tabs > .dxbl-tabs-tablist .dxbl-ribbon-application-tab { height: 100% !important; width: calc(var(--rb-btn-h) - 6px) !important; margin: 0 2px 0 0 !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon > dxbl-tabs > .dxbl-tabs-content-panel { flex: 1 1 auto !important; min-width: 0 !important; }

    html.ed6-railmode .main-ribbon .xaf-ribbon .dxbl-ribbon-toolbar { border-top: 0 !important; }

/* La recherche passe dans l'en-tête de la liste : plus dans le ruban de cet écran */
html.ed6-railmode.ed6-list-head .main-ribbon dxbl-bar-item:has(.xaf-action-fulltextsearch) { display: none !important; }

/* Densité compacte (bouton de l'en-tête, retenue par le navigateur) */
html.ed6-railmode.ed6-dense body {
    --gr-head-h: 32px;
    --gr-row-h: 32px;
    --gr-filter-h: 34px;
    --gr-edit-h: 26px;
    --gr-px: 10px;
}

/* ── En-tête de la liste (zone d'outils de la grille) ──────────────────── */
html.ed6-railmode .main-content .dxbl-grid { position: relative !important; }

html.ed6-railmode .dxbl-grid .dxbl-grid-toolbar-container:has(> .ed6g) {
    padding: 0 !important;
    border: 0 !important;
    background: #FFFFFF !important;
    display: block !important;
}

.ed6g { font-family: "Geist", system-ui, sans-serif; color: var(--f-ink-0); }

.ed6g-head { display: flex; align-items: center; gap: 12px; padding: 10px 12px 8px 16px; flex-wrap: wrap; }

.ed6g-title { display: flex; align-items: center; gap: 8px; min-width: 0; }

    .ed6g-title h2 { margin: 0; font: 700 15px/1.2 "Sora", sans-serif; letter-spacing: -.01em; color: var(--f-ink-0); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.ed6g-count { padding: 1px 8px; border-radius: 99px; background: var(--f-brand-50); color: var(--f-brand-dk); font: 600 11.5px/1.5 "Geist", sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; }

.ed6g-tools { margin-left: auto; display: flex; align-items: center; gap: 2px; flex-wrap: nowrap; min-width: 0; }

/* Écran étroit : la recherche se réduit avant que les boutons passent à la ligne */
.ed6g-search {
    width: 240px;
    flex: 0 1 240px;
    min-width: 130px;
    height: var(--rb-btn-h);
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 10px;
    margin: 0 4px 0 0;
    border-radius: 8px;
    border: 1px solid transparent;
    background: var(--f-soft);
    color: var(--f-ink-3);
    transition: background 120ms, border-color 120ms, box-shadow 120ms;
}

    .ed6g-search:hover { border-color: #DEDBEC; }
    .ed6g-search:focus-within { background: #FFFFFF; border-color: var(--f-brand); box-shadow: 0 0 0 3px var(--f-ring); }

    .ed6g-search input { flex: 1; min-width: 0; height: 100%; border: 0; outline: none; background: transparent; font: 400 var(--rb-fs)/1 "Geist", sans-serif; color: var(--f-ink-0); }
    .ed6g-search input::placeholder { color: var(--f-ink-3); }
    .ed6g-search input::-webkit-search-cancel-button { cursor: pointer; }

.ed6g-btn, .ed6g-ico {
    height: var(--rb-btn-h);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--f-ink-1);
    font: 500 var(--rb-fs)/1 "Geist", sans-serif;
    cursor: pointer;
    transition: background 120ms, color 120ms;
}

.ed6g-btn { padding: 0 10px; }
.ed6g-ico { width: var(--rb-btn-h); padding: 0; color: var(--f-ink-2); }

    .ed6g-btn:hover, .ed6g-ico:hover { background: var(--f-soft); color: var(--f-ink-0); }
    .ed6g-btn.is-on, .ed6g-ico.is-on { background: var(--f-brand-50); color: var(--f-brand-dk); }
    .ed6g-btn:focus-visible, .ed6g-ico:focus-visible { outline: 2px solid var(--f-brand); outline-offset: 1px; }

.ed6g-badge { min-width: 16px; padding: 0 5px; border-radius: 99px; background: var(--f-brand); color: #FFFFFF; font: 600 11px/16px "Geist", sans-serif; text-align: center; }

/* Vues enregistrées : onglets soulignés */
.ed6g-views { display: flex; align-items: stretch; min-height: 34px; padding: 0 8px; border-top: 1px solid var(--f-line-2); overflow-x: auto; scrollbar-width: none; }

.ed6g-view { padding: 0 10px; border: 0; background: transparent; color: var(--f-ink-2); font: 500 var(--rb-fs)/1 "Geist", sans-serif; white-space: nowrap; cursor: pointer; }

    .ed6g-view:hover { color: var(--f-ink-0); }
    .ed6g-view.is-on { color: var(--f-brand-dk); font-weight: 600; box-shadow: inset 0 -2px 0 var(--f-brand); }

/* Puces « Filtré par… » */
.ed6g-chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-height: 36px; padding: 5px 16px; background: #F7F6FC; border-top: 1px solid var(--f-line); box-sizing: border-box; }

.ed6g-chips-lbl { color: var(--f-ink-3); font-size: 12px; margin-right: 2px; }

.ed6g-chip {
    height: 24px;
    max-width: 420px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 2px 0 8px;
    border-radius: 6px;
    border: 1px solid #CBCAFE;
    background: var(--f-brand-50);
    color: var(--f-brand-dk);
    font: 500 12px/1 "Geist", sans-serif;
    white-space: nowrap;
}

    .ed6g-chip b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
    .ed6g-chip button { width: 18px; height: 18px; flex: none; border: 0; border-radius: 4px; background: transparent; color: var(--f-brand); font-size: 14px; line-height: 1; cursor: pointer; }
    .ed6g-chip button:hover { background: rgba(83, 81, 251, .12); }
    .ed6g-chip-group { border-color: var(--f-line); background: #FFFFFF; color: var(--f-ink-2); }
    .ed6g-chip-group b { color: var(--f-ink-0); }

.ed6g-clear { margin-left: auto; height: 24px; padding: 0 4px; border: 0; background: transparent; color: var(--f-brand); font: 600 12px/1 "Geist", sans-serif; cursor: pointer; }

    .ed6g-clear:hover { text-decoration: underline; }

/* Barre d'actions de la sélection : flottante en bas de la liste */
.ed6g-bulk {
    position: absolute;
    z-index: 5;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 2px;
    /* Largeur du contenu (sinon, placée à 50 %, la barre se réduit et coupe les libellés) */
    width: max-content;
    max-width: calc(100% - 32px);
    padding: 6px 6px 6px 14px;
    border-radius: 12px;
    background: #14122B;
    color: #FFFFFF;
    box-shadow: 0 18px 40px -16px rgba(20, 15, 62, .6);
    white-space: nowrap;
    /* Visible : le menu « Plus » s'ouvre au-dessus de la barre */
    overflow: visible;
    animation: ed6g-up 160ms ease-out;
}

@keyframes ed6g-up { from { opacity: 0; transform: translate(-50%, 6px); } to { opacity: 1; transform: translate(-50%, 0); } }

    .ed6g-bulk b { margin-right: 8px; font: 600 12.5px/1 "Geist", sans-serif; }

    .ed6g-bulk button { height: 30px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: #FFFFFF; font: 500 12.5px/1 "Geist", sans-serif; cursor: pointer; }
    .ed6g-bulk button:hover { background: rgba(255, 255, 255, .12); }
    .ed6g-bulk button.is-danger { color: #FFB4C0; }
    .ed6g-bulk .ed6g-bulk-x { width: 30px; padding: 0; font-size: 16px; }

.ed6g-bulk-sep { width: 1px; height: 18px; margin: 0 4px; background: rgba(255, 255, 255, .2); }

/* Zone de regroupement affichée par le bouton : sous l'en-tête */
html.ed6-railmode.ed6-list-head .xaf-tabbed-mdi .dxbl-grid .dxbl-grid-group-panel-container { border-top: 1px solid var(--f-line-2) !important; }

.ed6g-add { height: 24px; padding: 0 8px; border: 1px dashed #CFCCE0; border-radius: 6px; background: #FFFFFF; color: var(--f-ink-2); font: 500 12px/1 "Geist", sans-serif; cursor: pointer; }
    .ed6g-add:hover { border-color: var(--f-brand); color: var(--f-brand-dk); }

/* Le panneau de filtre DevExpress (bas de liste) fait double emploi avec les puces */
html.ed6-railmode.ed6-list-head .xaf-tabbed-mdi .dxbl-grid td:has(> .dxbl-grid-filter-panel),
html.ed6-railmode.ed6-list-head .xaf-tabbed-mdi .dxbl-grid div:has(> .dxbl-grid-filter-panel),
html.ed6-railmode.ed6-list-head .xaf-tabbed-mdi .dxbl-grid .dxbl-grid-filter-panel { display: none !important; }

/* ════════════════════════════════════════════════════════════════════════════
   8. CELLULES AUTOMATIQUES ET ÉTATS (GridCells.cs, EducatedGridEmpty.razor)
   ════════════════════════════════════════════════════════════════════════════ */

/* Liste de valeurs : pastille colorée ; le contenu XAF (image, libellé) reste dedans */
.ed6k-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    height: 22px;
    padding: 0 9px 0 7px;
    border-radius: 99px;
    font-size: 12px !important;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

/* La pastille porte la couleur : le fond posé par une règle d'apparence XAF sur la cellule s'efface */
html.ed6-railmode .dxbl-grid td:has(> .ed6k-pill) { background-color: transparent !important; }

    .ed6k-pill::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .85; }
    .ed6k-pill * { font-size: 12px !important; font-weight: 600 !important; color: inherit !important; overflow: hidden; text-overflow: ellipsis; }
    .ed6k-pill img { display: none !important; }

.ed6k-green { background: #E8F6EF; color: #0E6B45; }
.ed6k-blue { background: #EEEEFF; color: #342484; }
.ed6k-orange { background: #FFEDE5; color: #9A3412; }
.ed6k-red { background: #FCEBEE; color: #9A1C31; }
.ed6k-gray { background: #F3F2F9; color: #4A4766; }

/* Propriété principale : en gras ; avatar à initiales pour les personnes */
.ed6k-ident, .ed6k-ident * { font-weight: 600 !important; color: var(--f-ink-0); }

.ed6k-person { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; vertical-align: middle; }
.ed6k-ident-t { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.ed6k-av {
    flex: none;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF !important;
    font: 700 10px/1 "Geist", sans-serif !important;
    letter-spacing: .02em;
}

html.ed6-railmode.ed6-dense .ed6k-av, html.ed6-railmode body.xaf-size-s .ed6k-av { width: 20px; height: 20px; font-size: 9px !important; }

.ed6k-av0 { background: #5351FB; }
.ed6k-av1 { background: #0E7C86; }
.ed6k-av2 { background: #9A3412; }
.ed6k-av3 { background: #7C3AED; }
.ed6k-av4 { background: #0E6B45; }
.ed6k-av5 { background: #B4233B; }

/* Chiffres : alignés et lisibles (les colonnes numériques sont déjà à droite) */
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody td.dxbl-align-right { font-variant-numeric: tabular-nums !important; }

/* Oui / Non affichés : une coche verte, rien pour « non » */
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody .dxbl-checkbox-display-view-unchecked { opacity: 0 !important; }

html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody .dxbl-checkbox-display-view-checked,
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody .dxbl-checkbox-display-view-checked * { color: #1E9E63 !important; border-color: transparent !important; background: transparent !important; }

/* Liste vide */
html.ed6-railmode .dxbl-grid .dxbl-grid-empty-data-area:has(.ed6e) { padding: 0 !important; background: #FFFFFF !important; }

.ed6e { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 36px 16px 40px; text-align: center; font-family: "Geist", sans-serif; color: var(--f-ink-0); }

    .ed6e b { font: 600 13.5px/1.3 "Geist", sans-serif; }

.ed6e-ico { width: 44px; height: 44px; border-radius: 12px; background: var(--f-brand-50); color: var(--f-brand); display: inline-flex; align-items: center; justify-content: center; }

.ed6e-sub { color: var(--f-ink-2); font-size: 12.5px; max-width: 520px; }

.ed6e-btn { margin-top: 4px; height: 30px; padding: 0 12px; border: 1px solid var(--f-brand-100); border-radius: 8px; background: #FFFFFF; color: var(--f-brand-dk); font: 600 12.5px/1 "Geist", sans-serif; cursor: pointer; }

    .ed6e-btn:hover { background: var(--f-brand-50); }

/* ════════════════════════════════════════════════════════════════════════════
   9. SÉLECTEUR DE MODULE (EducatedModuleSwitcher.razor, en haut à gauche)
   Remplace le nom du module du fil d'Ariane : pastille cliquable + menu rapide.
   ════════════════════════════════════════════════════════════════════════════ */

/* L'ancien nom de module du fil d'Ariane laisse la place au sélecteur */
html.ed6-railmode .header .ed6ms ~ [role="heading"] .acur-breadcrumb-group { display: none !important; }
html.ed6-railmode .header .ed6ms ~ [role="heading"] .xaf-view-caption-lg::before {
    content: "›";
    margin: 0 8px 0 2px;
    color: #A9A5C0;
    font-weight: 400;
}

.ed6ms { position: relative; flex: none; display: flex; align-items: center; margin-right: 4px; }

.ed6ms-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: var(--tb-ctl-h, 34px);
    padding: 0 8px 0 4px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: var(--f-ink-0);
    font: 600 13px/1 var(--f-font, inherit);
    cursor: pointer;
    white-space: nowrap;
    transition: background .12s, border-color .12s;
}
    .ed6ms-btn:hover { background: var(--f-soft); }
    .ed6ms.is-open .ed6ms-btn { background: var(--f-brand-50); border-color: var(--f-brand-100); }
    .ed6ms-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--f-ring); }

.ed6ms-ico, .ed6ms-head-ico, .ed6ms-mod-ico {
    flex: none;
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    background: var(--f-brand-50);
    color: var(--f-brand-dk);
}
.ed6ms-chev { color: var(--f-ink-3); transition: transform .15s; }
.ed6ms.is-open .ed6ms-chev { transform: rotate(180deg); }

.ed6ms-veil { position: fixed; inset: 0; z-index: 1049; background: transparent; }

.ed6ms-pop {
    position: fixed;
    z-index: 1050;
    width: 330px;
    max-height: calc(100vh - 80px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 6px;
    background: #fff;
    border: 1px solid var(--f-line);
    border-radius: 14px;
    box-shadow: 0 18px 48px rgba(20, 18, 43, .16), 0 2px 6px rgba(20, 18, 43, .06);
    font-size: 13px;
    color: var(--f-ink-1);
    outline: none;
    animation: ed6ms-in .12s ease-out;
}
@keyframes ed6ms-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

.ed6ms-head { display: flex; align-items: center; gap: 10px; padding: 8px 8px 6px; }
    .ed6ms-head b { font-size: 14px; font-weight: 700; color: var(--f-ink-0); }

.ed6ms-sec {
    margin: 8px 8px 2px;
    padding-top: 8px;
    border-top: 1px solid var(--f-line-2);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--f-ink-3);
}

.ed6ms-pop *, .ed6ms-pop *::before { box-sizing: border-box; }

.ed6ms-item, .ed6ms-mod {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 34px;
    padding: 6px 8px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--f-ink-1);
    font: inherit;
    text-align: left;
    cursor: pointer;
}
    .ed6ms-item:hover, .ed6ms-mod:hover, .ed6ms-item:focus-visible, .ed6ms-mod:focus-visible { background: var(--f-soft); outline: none; }
    .ed6ms-item.is-on, .ed6ms-mod.is-on { background: var(--f-brand-50); color: var(--f-brand-dk); font-weight: 600; }
    .ed6ms-item > svg { flex: none; color: var(--f-ink-3); }
    .ed6ms-item.is-on > svg { color: var(--f-brand); }
    .ed6ms-item small { flex: none; max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; color: var(--f-ink-3); font-weight: 400; }

.ed6ms-it { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ed6ms-bullet { flex: none; width: 15px; display: inline-grid; place-items: center; }
    .ed6ms-bullet::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #C9C6DC; }
.ed6ms-item.is-on .ed6ms-bullet::before { background: var(--f-brand); }

.ed6ms-dash { font-weight: 600; color: var(--f-ink-0); }
.ed6ms-pts { flex: none; height: 20px; padding: 0 8px; border-radius: 99px; display: inline-flex; align-items: center; font-size: 11.5px; font-weight: 600; }
    .ed6ms-pts.is-crit { background: #FCEBEE; color: #9A1C31; }
    .ed6ms-pts.is-warn { background: #FFEDE5; color: #A8380F; }
    .ed6ms-pts.is-ok { background: #E8F6EF; color: #0E6B45; }

.ed6ms-mods { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.ed6ms-mod { gap: 8px; padding: 5px 6px; font-size: 12.5px; }
    .ed6ms-mod .ed6ms-mod-ico { width: 24px; height: 24px; border-radius: 7px; }
    .ed6ms-mod.is-on .ed6ms-mod-ico { background: var(--f-brand); color: #fff; }
.ed6ms-dot { flex: none; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; display: inline-grid; place-items: center; font-size: 10.5px; font-weight: 700; color: #fff; }
    .ed6ms-dot.is-crit { background: #B4233B; }
    .ed6ms-dot.is-warn { background: #FF5D25; }

.ed6ms-foot {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin-top: 8px;
    padding: 9px 10px;
    border: 0;
    border-top: 1px solid var(--f-line-2);
    border-radius: 0 0 9px 9px;
    background: transparent;
    color: var(--f-ink-3);
    font: inherit;
    font-size: 12.5px;
    text-align: left;
    cursor: pointer;
}
    .ed6ms-foot:hover { color: var(--f-ink-1); background: var(--f-soft); }
    .ed6ms-foot span { flex: 1; }
    .ed6ms-foot kbd { padding: 2px 6px; border: 1px solid var(--f-line); border-radius: 6px; background: var(--f-head); font: 600 10.5px/1.2 inherit; color: var(--f-ink-2); }

/* Barre de sélection : 2 actions visibles, les autres sous « Plus » (menu au-dessus de la barre) */
/* Barre visible : la bulle des discussions remonte au-dessus d'elle au lieu de la cacher */
html.ed6-bulk-on .ed6c-bubble-host { bottom: 78px; transition: bottom .16s ease-out; }
.ed6g-bulk > button:not(.ed6g-bulk-x) { max-width: 260px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ed6g-bulk-more { position: relative; display: inline-flex; }
    .ed6g-bulk-more > button { display: inline-flex; align-items: center; gap: 6px; }
    .ed6g-bulk-more > button.is-on { background: rgba(255, 255, 255, .14); }
    .ed6g-bulk-more > button i { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: rgba(255, 255, 255, .18); font: 600 11px/18px "Geist", sans-serif; font-style: normal; text-align: center; }
.ed6g-bulk-menu {
    position: absolute;
    bottom: calc(100% + 10px);
    left: 0;
    min-width: 240px;
    max-width: 340px;
    max-height: 320px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    padding: 6px;
    background: #1F1C3A;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 12px;
    box-shadow: 0 14px 36px rgba(20, 18, 43, .3);
}
    .ed6g-bulk .ed6g-bulk-menu button { width: 100%; height: auto; min-height: 32px; padding: 7px 10px; text-align: left; white-space: normal; line-height: 1.3; }

/* ════════════════════════════════════════════════════════════════════════════
   10. APERÇU LATÉRAL (EducatedStudentPreview.razor) — clic sur une ligne d'apprenant
   Le panneau est dans la zone d'outils de la grille, placé à droite de la grille :
   la grille se décale pour lui laisser la place. Il suit l'onglet (pas de position fixe).
   ════════════════════════════════════════════════════════════════════════════ */
/* Largeur : --ed6p-w (posée par frame-v6.js, ED6Preview, quand on tire la poignée ; mémorisée) */
:root { --ed6p-w: 440px; --ed6p-gap: 12px; }
html.ed6-railmode.ed6-preview-on .xaf-tabbed-mdi .dxbl-grid { overflow: visible !important; width: calc(100% - var(--ed6p-w) - var(--ed6p-gap)) !important; }
/* overflow visible (le panneau sort de la grille) : la grille ne rogne plus ses coins → on arrondit ses deux bouts */
html.ed6-railmode.ed6-preview-on .xaf-tabbed-mdi .dxbl-grid > .dxbl-grid-toolbar-container,
html.ed6-railmode.ed6-preview-on .xaf-tabbed-mdi .dxbl-grid > .dxbl-grid-toolbar-container > * { border-top-left-radius: 11px; border-top-right-radius: 11px; }
html.ed6-railmode.ed6-preview-on .xaf-tabbed-mdi .dxbl-grid > .dxbl-scroll-viewer { border-bottom-left-radius: 11px; border-bottom-right-radius: 11px; }
html.ed6p-resizing, html.ed6p-resizing * { cursor: col-resize !important; user-select: none !important; }

/* Ligne de l'aperçu (ligne active de la grille) */
html.ed6-railmode.ed6-preview-on .xaf-tabbed-mdi .dxbl-grid .dxbl-grid-table tbody tr.dxbl-grid-focused-row { background: var(--f-brand-50) !important; }
html.ed6-railmode.ed6-preview-on .xaf-tabbed-mdi .dxbl-grid .dxbl-grid-table tbody tr.dxbl-grid-focused-row > td:first-child { box-shadow: inset 3px 0 0 var(--f-brand) !important; }
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr.dxbl-grid-focused-row,
html.ed6-railmode .dxbl-grid .dxbl-grid-table tbody tr.dxbl-grid-focused-row > td { color: var(--f-ink-0) !important; }

.ed6p {
    position: absolute;
    top: 0;
    right: calc(-1 * (var(--ed6p-w) + var(--ed6p-gap)));
    z-index: 6;
    width: var(--ed6p-w);
    height: var(--ed6p-h, 100%);   /* frame-v6.js : hauteur visible, même si la grille est courte */
    min-height: 420px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
    /* Même cadre que la grille voisine (bordure, arrondi, sans ombre flottante) */
    border: 1px solid var(--f-line);
    border-radius: 12px;
    box-shadow: none;
    font: 400 13px/1.45 "Geist", system-ui, sans-serif;
    color: var(--f-ink-0);
    overflow: hidden;
    white-space: normal;
    animation: ed6p-in .14s ease-out;
}
@keyframes ed6p-in { from { opacity: 0; transform: translateX(8px); } to { opacity: 1; transform: none; } }
.ed6p *, .ed6p *::before { box-sizing: border-box; }

.ed6p-top { flex: none; display: flex; align-items: center; gap: 8px; padding: 10px 12px 0 16px; }
.ed6p-kicker { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--f-ink-3); }
.ed6p-open { margin-left: auto; height: 28px; display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: var(--f-brand); font: 600 12.5px "Geist", sans-serif; cursor: pointer; }
    .ed6p-open:hover { background: var(--f-brand-50); color: var(--f-brand-dk); }
.ed6p-x { width: 28px; height: 28px; border: 0; border-radius: 7px; background: var(--f-soft); color: var(--f-ink-2); font-size: 16px; cursor: pointer; }
    .ed6p-x:hover { background: #E9E7F3; }
.ed6p-top .ed6p-x:first-of-type:last-child { margin-left: auto; }

/* Corps : défilement fin ; fondu en bas tant qu'il reste du contenu ; marge basse pour passer sous la bulle des discussions */
.ed6p-body {
    flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
    padding: 10px 16px 40px; display: flex; flex-direction: column; gap: 14px;
    scrollbar-width: thin; scrollbar-color: #D9D7E6 transparent;
    -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 28px), transparent);
            mask-image: linear-gradient(to bottom, #000 calc(100% - 28px), transparent);
}
    .ed6p-body.is-end { -webkit-mask-image: none; mask-image: none; }
    .ed6p-body::-webkit-scrollbar { width: 6px; }
    .ed6p-body::-webkit-scrollbar-thumb { background: #D9D7E6; border-radius: 99px; }
    .ed6p-body::-webkit-scrollbar-track { background: transparent; }

/* Pied : aligné sur le pied de la grille (« Nombre : … ») — même hauteur, fond et filet ; à droite, la place de la bulle */
.ed6p::after {
    content: "Double-clic : ouvrir la fiche · Échap : fermer";
    flex: none;
    display: flex; align-items: center;
    height: calc(var(--gr-row-h, 34px) - 6px);
    padding: 0 72px 0 16px;
    background: var(--f-head);
    border-top: 1px solid var(--f-line);
    font: 500 11.5px/1.2 "Geist", system-ui, sans-serif;
    color: var(--f-ink-3);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Poignée : bord gauche du panneau */
.ed6p-grip { position: absolute; top: 0; bottom: 0; left: 0; z-index: 2; width: 8px; cursor: col-resize; outline: none; touch-action: none; }
    .ed6p-grip::after { content: ""; position: absolute; top: 50%; left: 2px; width: 4px; height: 36px; margin-top: -18px; border-radius: 99px; background: #D9D7E6; opacity: 0; transition: opacity .12s, background .12s; }
    .ed6p:hover .ed6p-grip::after { opacity: 1; }
    .ed6p-grip:hover::after, .ed6p-grip:focus-visible::after, html.ed6p-resizing .ed6p-grip::after { opacity: 1; background: var(--f-brand); }
    .ed6p-grip:focus-visible { box-shadow: inset 2px 0 0 var(--f-brand); }

/* Panneau large : sections côte à côte */
.ed6p { container-type: inline-size; container-name: ed6p; }
@container ed6p (max-width: 420px) {
    .ed6p-card-h { flex-direction: column; gap: 0; }
}
@container ed6p (min-width: 620px) {
    .ed6p-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ed6p-wide { grid-column: span 1; }
    .ed6p-msg { grid-template-columns: 1fr; gap: 6px; }
}

.ed6p-id { display: flex; gap: 14px; align-items: center; }
.ed6p-photo { flex: none; width: 72px; height: 72px; border-radius: 18px; background: linear-gradient(160deg, #DDDDFE, #EEEEFF); display: grid; place-items: center; color: var(--f-brand-dk); font: 700 22px "Sora", sans-serif; object-fit: cover; }
.ed6p-id-t { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
    .ed6p-id-t h3 { margin: 0; font: 700 17px/1.25 "Sora", sans-serif; letter-spacing: -.01em; color: var(--f-ink-0); }
.ed6p-sub { font-size: 12.5px; color: var(--f-ink-2); }
.ed6p-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 2px; }
.ed6p-chip { padding: 2px 8px; border-radius: 99px; font-size: 11.5px; font-weight: 600; }
    .ed6p-chip.is-green { background: #E8F6EF; color: #0E6B45; }
    .ed6p-chip.is-blue { background: var(--f-brand-50); color: var(--f-brand-dk); }
    .ed6p-chip.is-gray { background: var(--f-soft); color: var(--f-ink-2); }

.ed6p-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
    .ed6p-actions button { height: 56px; border: 1px solid var(--f-line); border-radius: 10px; background: #FFFFFF; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font: 500 11.5px "Geist", sans-serif; color: var(--f-ink-1); cursor: pointer; }
    .ed6p-actions button svg { color: var(--f-brand); }
    .ed6p-actions button:hover { border-color: var(--f-brand-100); background: var(--f-brand-50); }
    .ed6p-actions button.is-primary { border-color: var(--f-brand); background: var(--f-brand); color: #FFFFFF; }
    .ed6p-actions button.is-primary svg { color: #FFFFFF; }
    .ed6p-actions button.is-primary:hover { background: var(--f-brand-dk); border-color: var(--f-brand-dk); }

.ed6p-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ed6p-card { padding: 10px 12px; border: 1px solid var(--f-line-2); border-radius: 11px; background: var(--f-head); display: flex; flex-direction: column; gap: 5px; min-width: 0; }
    .ed6p-card > b { font: 700 19px/1.2 "Sora", sans-serif; color: var(--f-ink-0); }
    .ed6p-card.is-bad { border-color: #F6D5DB; background: #FFF8F9; }
    .ed6p-card.is-warn { border-color: #FBD9C9; background: #FFF8F4; }
.ed6p-wide { grid-column: span 2; }
.ed6p-card-h { display: flex; justify-content: space-between; gap: 6px; font-size: 11.5px; font-weight: 600; color: var(--f-ink-3); }
    .ed6p-card-h em { font-style: normal; color: var(--f-ink-3); }
    .ed6p-card.is-ok .ed6p-card-h em { color: #0E6B45; }
    .ed6p-card.is-warn .ed6p-card-h em { color: #9A3412; }
    .ed6p-card.is-bad .ed6p-card-h em { color: #9A1C31; }
.ed6p-card-s { font-size: 11.5px; color: var(--f-ink-2); }
.ed6p-bar { position: relative; height: 5px; border-radius: 99px; background: #EFEEF6; overflow: hidden; }
    .ed6p-bar.has-mark { overflow: visible; margin: 2px 0; }
    .ed6p-bar.has-mark i { border-radius: 99px; }
    .ed6p-bar s { position: absolute; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; border-radius: 1px; background: var(--f-ink-1); opacity: .55; }
    .ed6p-bar i { display: block; height: 100%; background: #1E9E63; }
    .ed6p-card.is-warn .ed6p-bar i { background: #FF5D25; }
    .ed6p-card.is-bad .ed6p-bar i { background: #B4233B; }
    .ed6p-bar.is-brand i, .ed6p-card .ed6p-bar.is-brand i { background: var(--f-brand); }

.ed6p-msg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .ed6p-msg > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ed6p-msg-n { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; font-size: 12px; color: var(--f-ink-2); }
    .ed6p-msg-n b { font: 700 19px "Sora", sans-serif; color: var(--f-ink-0); }
.ed6p-tag { padding: 0 7px; border-radius: 99px; font-size: 11px; font-weight: 600; }
    .ed6p-tag.is-warn { background: #FFEDE5; color: #9A3412; }
    .ed6p-tag.is-ok { background: #E8F6EF; color: #0E6B45; }
.ed6p-last { display: flex; gap: 8px; align-items: center; padding-top: 8px; border-top: 1px solid var(--f-line-2); font-size: 12px; }
    .ed6p-last i { flex: none; width: 7px; height: 7px; border-radius: 50%; background: #FF5D25; }
    .ed6p-last span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .ed6p-last small { flex: none; color: var(--f-ink-3); font-size: 11.5px; }

.ed6p-sec { display: flex; flex-direction: column; gap: 7px; }
.ed6p-sec-h { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--f-ink-3); }
.ed6p-contacts { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; font-size: 12.5px; }
    .ed6p-contacts > span:nth-child(even) { color: var(--f-ink-2); text-align: right; }
.ed6p-ev { display: flex; gap: 8px; align-items: center; font-size: 12.5px; }
    .ed6p-ev i { flex: none; width: 7px; height: 7px; border-radius: 50%; background: #A9A5C0; }
    .ed6p-ev i.is-absence { background: #FF5D25; }
    .ed6p-ev i.is-message-in { background: #5351FB; }
    .ed6p-ev i.is-message-out { background: #1E9E63; }
    .ed6p-ev span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .ed6p-ev small { flex: none; color: var(--f-ink-3); font-size: 11.5px; }
.ed6p-muted { color: var(--f-ink-3); font-size: 12px; }

@keyframes ed6p-sk { 0% { opacity: .55; } 50% { opacity: 1; } 100% { opacity: .55; } }
.ed6p-sk { display: block; border-radius: 8px; background: #EFEEF6; animation: ed6p-sk 1.3s ease-in-out infinite; }
span.ed6p-photo.ed6p-sk { background: #EFEEF6; }

/* Aperçu enseignant (EducatedTeacherPreview) : séances du jour, matières, liens des messages */
.ed6p-of { font: 500 12.5px "Geist", sans-serif; color: var(--f-ink-3); }
.ed6p-sec-k { margin-left: 6px; font-weight: 500; letter-spacing: 0; text-transform: none; font-size: 11.5px; }
.ed6p-tt { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 6px 8px; border-radius: 8px; background: var(--f-head); font-size: 12.5px; border-left: 3px solid var(--f-brand-100); }
    .ed6p-tt b { font: 700 12.5px "Sora", sans-serif; color: var(--f-ink-0); }
    .ed6p-tt > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .ed6p-tt small { color: var(--f-ink-3); font-size: 11.5px; }
    .ed6p-tt.is-done { border-left-color: #1E9E63; }
    .ed6p-tt.is-done small { color: #0E6B45; }
    .ed6p-tt.is-late { border-left-color: #FF5D25; }
    .ed6p-tt.is-late small { color: #9A3412; font-weight: 600; }
    .ed6p-tt.is-absent { border-left-color: #B4233B; opacity: .8; }
    .ed6p-tt.is-absent small { color: #9A1C31; }
.ed6p-subj { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; font-size: 12.5px; }
    .ed6p-subj > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .ed6p-subj small { color: var(--f-ink-2); font-size: 11.5px; }
.ed6p-subj-bar { grid-column: 1 / -1; display: block; min-width: 8px; height: 5px; border-radius: 99px; background: #E5E4FF; overflow: hidden; }
    .ed6p-subj-bar i { display: block; height: 100%; background: var(--f-brand); border-radius: 99px; }
.ed6p-msg > .is-link { cursor: pointer; border-radius: 8px; margin: -4px; padding: 4px; }
    .ed6p-msg > .is-link:hover { background: var(--f-brand-50); }
    .ed6p-msg > .is-link:focus-visible { outline: 2px solid var(--f-brand); outline-offset: -2px; }

/* ════════════════════════════════════════════════════════════════════════════
   11. FICHES (DetailView dans un onglet) — affinage visuel seulement
   Le layout des fiches est dynamique (modèle par établissement / utilisateur) :
   aucune règle ici ne change largeurs, colonnes, ordre ou visibilité des éléments.
   On ne restyle que : cadre, libellés, éditeurs, onglets, photo.
   Portée : fiches des onglets MDI (pas les fenêtres popup, pas les tableaux de bord).
   ════════════════════════════════════════════════════════════════════════════ */

/* Pages Razor V6 (.edh) dans une vue XAF : pas de carte blanche de fiche autour (detailview.css) */
html.ed6-railmode .detail-view-content .dxbl-fl:has(.edh) { background: transparent !important; box-shadow: none !important; border: 0 !important; }

/* Cadre : la fiche est une carte, comme la grille des listes */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content { background: transparent !important; }
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content > .dxbl-fl:not(:has(.xaf-dashboard-container)):not(:has(.edh)) {
    background: #FFFFFF !important;
    border: 1px solid var(--f-line) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

/* Libellés : casse normale, lisibles (l'ancien gris clair majuscule passait sous le contraste AA) */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content label.dxbl-fl-cpt {
    color: var(--f-ink-2) !important;
    font: 500 12.5px/1.3 "Geist", system-ui, sans-serif !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* Éditeurs une ligne : un peu plus hauts, bordure lisible, rayon et focus de la charte */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl dxbl-input-editor.dxbl-text-edit,
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl dxbl-combo-box.dxbl-text-edit,
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl dxbl-date-edit.dxbl-text-edit,
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl dxbl-spinedit.dxbl-text-edit {
    min-height: 32px !important;
    border: 1px solid #DEDCEB !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
}
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl .dxbl-text-edit:hover { border-color: #CBC8DE !important; }
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl .dxbl-text-edit:focus-within {
    border-color: var(--f-brand) !important;
    box-shadow: 0 0 0 3px var(--f-ring) !important;
}
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl .dxbl-text-edit input.dxbl-text-edit-input {
    color: var(--f-ink-0) !important;
    font: 500 13px/1.3 "Geist", system-ui, sans-serif !important;
    padding-left: 10px !important;
}
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl dxbl-spinedit .dxbl-text-edit-input,
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl input[inputmode="decimal"] { font-family: "Geist", system-ui, sans-serif !important; font-variant-numeric: tabular-nums; }

/* Champ texte en lecture seule (calculé, verrouillé) : fond doux, sans bordure de saisie.
   Pas les listes déroulantes : leur zone de texte est aussi en lecture seule quand on ne peut pas y taper. */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl dxbl-input-editor.dxbl-text-edit:has(input[readonly]),
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl dxbl-spinedit.dxbl-text-edit:has(input[readonly]),
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl .dxbl-text-edit.dxbl-disabled {
    background: var(--f-soft) !important;
    border-color: transparent !important;
    box-shadow: none !important;
}
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl dxbl-input-editor.dxbl-text-edit:has(input[readonly]) input.dxbl-text-edit-input { color: var(--f-ink-1) !important; }

/* Bouton « effacer » : caché au repos, visible au survol ou pendant la saisie */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl .dxbl-edit-btn-clear { opacity: 0 !important; transition: opacity .12s; }
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl .dxbl-text-edit:hover .dxbl-edit-btn-clear,
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl .dxbl-text-edit:focus-within .dxbl-edit-btn-clear { opacity: .7 !important; }
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl .dxbl-edit-btn-dropdown,
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-ctrl .dxbl-text-edit-btn { color: var(--f-ink-3) !important; }

/* Onglets des fiches : même dessin que le ruban (texte, filet bleu sous l'onglet actif) */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid var(--f-line) !important;
    padding: 0 8px !important;
    border-radius: 12px 12px 0 0;
}
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist dxbl-tab-item.dxbl-tabs-item {
    height: 40px !important;
    padding: 0 12px !important;
    color: var(--f-ink-2) !important;
    font-weight: 500 !important;
}
    html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist dxbl-tab-item .dxbl-tabs-text-overflow { font: inherit !important; font-size: 13px !important; }
    html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist dxbl-tab-item.dxbl-tabs-item::after {
        height: 2px !important; left: 12px !important; right: 12px !important; width: auto !important;
        border-radius: 2px 2px 0 0; background: transparent !important;
    }
    html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist dxbl-tab-item.dxbl-tabs-item:hover { color: var(--f-ink-0) !important; }
    html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist dxbl-tab-item.dxbl-tabs-item:hover::after { background: var(--f-line) !important; }
    html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist dxbl-tab-item.dxbl-tabs-item.dxbl-active { color: var(--f-brand) !important; font-weight: 600 !important; }
    html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist dxbl-tab-item.dxbl-tabs-item.dxbl-active::after { background: var(--f-brand) !important; }
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist .dxbl-tabs-scroll-btn-prev,
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist .dxbl-tabs-scroll-btn-next {
    width: 28px !important; height: 28px !important; align-self: center; border-radius: 7px !important; color: var(--f-ink-3) !important;
}
    html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist .dxbl-tabs-scroll-btn-prev:hover,
    html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist .dxbl-tabs-scroll-btn-next:hover { background: var(--f-brand-50) !important; color: var(--f-brand) !important; }

/* Onglets du bas (dossier : listes liées) : bande de section sur toute la largeur de la carte.
   Repère : un groupe à onglets qui n'est pas le premier élément de sa rangée. */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-row > .dxbl-fl-gt:not(:first-child) { margin-top: 10px !important; }
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-row > .dxbl-fl-gt:not(:first-child) > dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist {
    background: var(--f-head) !important;
    border-top: 1px solid var(--f-line) !important;
    border-radius: 0;
}
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-row > .dxbl-fl-gt:not(:first-child) > dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-tablist dxbl-tab-item.dxbl-tabs-item { height: 38px !important; }

/* Contenu d'un onglet : respiration homogène */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content dxbl-tabs.dxbl-tabs-top > .dxbl-tabs-content-panel { padding-top: 10px !important; }

/* Libellé à gauche du champ : centré sur la hauteur du champ (32 px) ; les libellés au-dessus ne bougent pas */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .dxbl-fl-item-horizontal > label.dxbl-fl-cpt { padding-top: 8px !important; }

/* Photo : cadre doux (vide : zone de dépôt) */
html.ed6-railmode .xaf-tabbed-mdi .detail-view-content .xaf-image-editor .img-thumbnail {
    border: 1px solid var(--f-line) !important;
    border-radius: 14px !important;
    background: var(--f-head) !important;
}


/* ════════════════════════════════════════════════════════════════════════════
   12. BANDEAU DE FICHE (EducatedRecordHeader.razor) — au-dessus de la fiche apprenant
   Rendu par le gabarit de l'onglet (DXItem1Component), avant la fiche XAF : défile avec elle.
   Barres de progression : celles de l'aperçu (ed6p-bar, section 10).
   ════════════════════════════════════════════════════════════════════════════ */
.ed6r { display: flex; flex-direction: column; gap: 12px; margin: 0 0 12px; font: 400 13px/1.45 "Geist", system-ui, sans-serif; color: var(--f-ink-0); }
.ed6r *, .ed6r *::before { box-sizing: border-box; }

.ed6r-id {
    display: flex; flex-wrap: wrap; align-items: center; gap: 16px 18px;
    padding: 16px 20px;
    background: #FFFFFF; border: 1px solid var(--f-line); border-radius: 12px;
}
.ed6r-photo { flex: none; width: 76px; height: 76px; border-radius: 18px; background: linear-gradient(160deg, #DDDDFE, #EEEEFF); display: grid; place-items: center; color: var(--f-brand-dk); font: 700 24px "Sora", sans-serif; object-fit: cover; }
.ed6r-t { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.ed6r-name { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; }
    .ed6r-name h2 { margin: 0; font: 700 20px/1.25 "Sora", sans-serif; letter-spacing: -.01em; color: var(--f-ink-0); }
    .ed6r-name [lang="ar"] { font-size: 15px; color: var(--f-ink-3); }
.ed6r-sub { color: var(--f-ink-2); font-size: 13px; }
.ed6r-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.ed6r-chip { padding: 2px 9px; border-radius: 99px; font-size: 12px; font-weight: 600; white-space: nowrap; }
    .ed6r-chip.is-green { background: #E8F6EF; color: #0E6B45; }
    .ed6r-chip.is-blue { background: var(--f-brand-50); color: var(--f-brand-dk); }
    .ed6r-chip.is-gray { background: var(--f-soft); color: var(--f-ink-2); }
    .ed6r-chip.is-warn { background: #FFEDE5; color: #9A3412; }
    .ed6r-chip.is-bad { background: #FCEBEE; color: #9A1C31; }

.ed6r-actions { flex: 0 1 auto; display: flex; flex-wrap: wrap; gap: 8px; }
    .ed6r-actions button {
        height: 36px; padding: 0 14px; display: inline-flex; align-items: center; gap: 7px;
        border: 1px solid #E1DEEE; border-radius: 9px; background: #FFFFFF;
        font: 600 12.5px "Geist", system-ui, sans-serif; color: var(--f-ink-1); cursor: pointer; white-space: nowrap;
    }
    .ed6r-actions button svg { color: var(--f-ink-2); }
    .ed6r-actions button:hover { border-color: var(--f-brand-100); background: var(--f-brand-50); color: var(--f-brand-dk); }
    .ed6r-actions button:hover svg { color: var(--f-brand); }
    .ed6r-actions button.is-primary { border-color: var(--f-brand); background: var(--f-brand); color: #FFFFFF; }
    .ed6r-actions button.is-primary svg { color: #FFFFFF; }
    .ed6r-actions button.is-primary:hover { background: var(--f-brand-dk); border-color: var(--f-brand-dk); }
    .ed6r-actions button:focus-visible { outline: 2px solid var(--f-brand); outline-offset: 2px; }

.ed6r-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.ed6r-card { min-height: 104px; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; min-width: 0; background: #FFFFFF; border: 1px solid var(--f-line); border-radius: 12px; }
    .ed6r-card > b { font: 700 22px/1.2 "Sora", sans-serif; color: var(--f-ink-0); }
    .ed6r-card > b small { font: 600 13px "Geist", system-ui, sans-serif; color: var(--f-ink-3); }
    .ed6r-card.is-bad { border-color: #F6D5DB; }
    .ed6r-card.is-warn { border-color: #FBD9C9; }
    .ed6r-card .ed6p-bar i { background: #1E9E63; }
    .ed6r-card.is-warn .ed6p-bar i { background: #FF5D25; }
    .ed6r-card.is-bad .ed6p-bar i { background: #B4233B; }
    .ed6r-card .ed6p-bar.is-brand i { background: var(--f-brand); }
.ed6r-card-h { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; font-weight: 600; color: var(--f-ink-3); }
    .ed6r-card-h em { font-style: normal; color: var(--f-ink-3); text-align: right; }
    .ed6r-card.is-ok .ed6r-card-h em, .ed6r-card-h em.is-ok { color: #0E6B45; }
    .ed6r-card.is-warn .ed6r-card-h em, .ed6r-card-h em.is-warn { color: #9A3412; }
    .ed6r-card.is-bad .ed6r-card-h em { color: #9A1C31; }
.ed6r-card-s { font-size: 12px; color: var(--f-ink-2); }
.ed6r-sk { display: block; background: #F3F2F9; border-color: transparent; animation: ed6p-sk 1.3s ease-in-out infinite; }

/* ── Bandeau compact : une seule carte, ~150 px quelle que soit la largeur ─────────────
   Identité sur une ligne (photo 52 px), chiffres en bande de 4 colonnes sous un filet.
   Fenêtre étroite : actions secondaires en icônes (libellé en infobulle), chiffres 2 × 2. */
.ed6r { container-type: inline-size; gap: 0; background: #FFFFFF; border: 1px solid var(--f-line); border-radius: 12px; overflow: hidden; }
.ed6r-id { padding: 12px 16px; border: 0; border-radius: 0; gap: 10px 14px; flex-wrap: nowrap; }
.ed6r-photo { width: 52px; height: 52px; border-radius: 14px; font-size: 18px; }
.ed6r-t { flex: 1 1 auto; gap: 3px; }
.ed6r-name h2 { font-size: 17px; }
.ed6r-name [lang="ar"] { font-size: 14px; }
.ed6r-sub { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ed6r-chips { margin-top: 1px; gap: 5px; }
.ed6r-chip { padding: 1px 8px; font-size: 11.5px; }
.ed6r-actions { flex: none; flex-wrap: nowrap; gap: 6px; }
    .ed6r-actions button { height: 34px; padding: 0 12px; }

.ed6r-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--f-line); }
.ed6r-card { min-height: 0; padding: 9px 14px 10px; gap: 1px; border: 0; border-radius: 0; border-left: 1px solid var(--f-line-2); background: transparent; }
    .ed6r-card:first-child { border-left: 0; }
    .ed6r-card > b { font-size: 18px; line-height: 1.25; }
    .ed6r-card.is-bad { background: #FFF8F9; }
    .ed6r-card.is-warn { background: #FFF8F4; }
    .ed6r-card .ed6p-bar { display: none; }
.ed6r-card-h { font-size: 11.5px; flex-wrap: nowrap; white-space: nowrap; }
    .ed6r-card-h em { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.ed6r-card-s { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ed6r-sk { height: 64px; border-left: 1px solid var(--f-line-2); }

@container (max-width: 980px) {
    .ed6r-actions button:not(.is-primary) { width: 34px; padding: 0; justify-content: center; font-size: 0; gap: 0; }
    .ed6r-actions button:not(.is-primary) svg { width: 16px; height: 16px; }
    .ed6r-card-h em.is-year { display: none; }
}
@container (max-width: 640px) {
    .ed6r-id { flex-wrap: wrap; }
    .ed6r-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ed6r-card:nth-child(3) { border-left: 0; }
    .ed6r-card:nth-child(n+3) { border-top: 1px solid var(--f-line-2); }
}

/* Cartes cliquables : ouvrent l'écran filtré qui détaille le chiffre (RecordCardLinks) */
.ed6r-card.is-link { position: relative; cursor: pointer; transition: background .12s; }
    .ed6r-card.is-link:hover { background: var(--f-brand-50); }
    .ed6r-card.is-link:hover .ed6r-card-h { color: var(--f-brand-dk); }
    .ed6r-card.is-link::after {
        content: ""; position: absolute; right: 10px; bottom: 11px; width: 7px; height: 7px;
        border-top: 1.6px solid currentColor; border-right: 1.6px solid currentColor; transform: rotate(45deg);
        color: var(--f-ink-3); opacity: 0; transition: opacity .12s;
    }
    .ed6r-card.is-link:hover::after, .ed6r-card.is-link:focus-visible::after { opacity: 1; color: var(--f-brand); }
    .ed6r-card.is-link:focus-visible { outline: 2px solid var(--f-brand); outline-offset: -2px; }
    .ed6r-card.is-link .ed6r-card-s { padding-right: 14px; }

/* Carte clé « Assiduité » (bandeau et aperçu) : ouvre le récapitulatif d'assiduité — flèche toujours visible */
.ed6r-card.is-link.is-key::after { opacity: .7; }
.ed6r-card.is-link.is-key:hover::after { opacity: 1; }
.ed6p-card.is-link { position: relative; cursor: pointer; transition: background .12s, border-color .12s; }
    .ed6p-card.is-link:hover { border-color: var(--f-brand-100); background: var(--f-brand-50); }
    .ed6p-card.is-link::after {
        content: ""; position: absolute; right: 11px; bottom: 12px; width: 7px; height: 7px;
        border-top: 1.6px solid var(--f-brand); border-right: 1.6px solid var(--f-brand); transform: rotate(45deg); opacity: .7;
    }
    .ed6p-card.is-link:focus-visible { outline: 2px solid var(--f-brand); outline-offset: 2px; }
    .ed6p-card.is-link .ed6p-card-s { padding-right: 14px; }


/* ══════════════════════════════════════════════════════════════
   MODULES DU PROFIL (fiche d'un rôle, EducatedRoleModules) — préfixe edrm-
   ══════════════════════════════════════════════════════════════ */
.edrm { display: flex; flex-direction: column; gap: 12px; margin: 0 0 12px; padding: 16px 18px 14px; background: #FFFFFF; border: 1px solid var(--f-line); border-radius: 12px; font: 400 13px/1.45 "Geist", system-ui, sans-serif; color: var(--f-ink-0); container-type: inline-size; }
.edrm *, .edrm *::before { box-sizing: border-box; }
.edrm-h { display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.edrm-ico { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--f-brand-50); color: var(--f-brand); }
.edrm-t { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.edrm-t b { font: 700 15px/1.3 "Sora", sans-serif; color: var(--f-ink-0); }
.edrm-t > span { font-size: 12.5px; color: var(--f-ink-2); }
.edrm-presets { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.edrm-lbl { font-size: 12px; color: var(--f-ink-3); margin-right: 2px; }
.edrm-presets button { height: 30px; padding: 0 12px; border: 1px solid var(--f-line); border-radius: 999px; background: #FFFFFF; font: 500 12.5px "Geist", sans-serif; color: var(--f-ink-1); cursor: pointer; white-space: nowrap; }
.edrm-presets button:hover:not(:disabled) { border-color: var(--f-brand-100); background: var(--f-brand-50); }
.edrm-presets button.on, .edrm-presets button.on:hover:not(:disabled) { border-color: var(--f-brand); background: var(--f-brand); color: #FFFFFF; font-weight: 600; }
.edrm-presets button:disabled { opacity: .55; cursor: default; }
.edrm-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
@container (max-width: 980px) { .edrm-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@container (max-width: 640px) { .edrm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.edrm-m { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-width: 0; padding: 10px 10px 10px 12px; border: 1px solid var(--f-line); border-radius: 11px; background: #FAFAFD; font: inherit; color: var(--f-ink-0); text-align: left; cursor: pointer; transition: border-color .12s, background .12s; }
.edrm-m:hover:not(:disabled) { border-color: var(--f-brand-100); }
.edrm-m.on { background: #FFFFFF; border-color: #CBCAFE; box-shadow: 0 1px 2px rgba(20, 18, 43, .05); }
.edrm-m.on.is-all { border-color: var(--f-line); box-shadow: none; }
.edrm-m:disabled { cursor: default; }
.edrm-m:focus-visible { outline: 2px solid var(--f-brand); outline-offset: 2px; }
.edrm-mi { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; background: #F1F0F7; color: var(--f-ink-3); }
.edrm-m.on .edrm-mi { background: var(--f-brand-50); color: var(--f-brand); }
.edrm-mt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.edrm-mt b { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.edrm-mt span { font-size: 12px; color: var(--f-ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.edrm-m:not(.on) .edrm-mt b { color: var(--f-ink-3); }
.edrm-sw { flex: none; width: 30px; height: 18px; border-radius: 99px; background: #D9D7E6; position: relative; transition: background .15s; }
.edrm-sw i { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #FFFFFF; box-shadow: 0 1px 2px rgba(20, 18, 43, .2); transition: left .15s; }
.edrm-m.on .edrm-sw { background: var(--f-brand); }
.edrm-m.on .edrm-sw i { left: 14px; }
.edrm-m.on.is-all .edrm-sw { background: #A5A4F7; }
.edrm-grid.is-off .edrm-m { opacity: .75; }
.edrm-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12.5px; color: var(--f-ink-3); }
.edrm-foot b { color: var(--f-ink-1); }
.edrm-ok { margin-left: auto; color: #0E6B45; font-weight: 600; }
.edrm-link { margin-left: auto; border: 0; background: transparent; color: var(--f-brand); font: 600 12.5px "Geist", sans-serif; cursor: pointer; }
.edrm-msg { padding: 10px 12px; border-radius: 10px; font-size: 13px; }
.edrm-msg.is-warn { background: #FFF6F1; border: 1px solid #FBD9C9; color: #7A2E0E; }
