/* ==========================================================================
   EduGest — thème Bootstrap
   Une couleur de marque (bleu du logo), des neutres « slate », des surfaces
   blanches. Les couleurs vives sont réservées aux statuts.
   Bootstrap est chargé en CSS précompilé : on redéfinit ses variables CSS et,
   pour les composants dont la couleur est figée à la compilation, leurs
   variables locales (--bs-btn-*, --bs-nav-*...).
   ========================================================================== */

:root {
    /* Marque et neutres */
    --eg-navy-950: #070d1c;
    --eg-navy-900: #0f172a;
    --eg-navy-800: #1e293b;
    --eg-brand: #1d4ed8;
    --eg-brand-rgb: 29, 78, 216;
    --eg-brand-hover: #1e40af;
    --eg-brand-active: #1e3a8a;
    --eg-brand-soft: #eef3ff;
    --eg-brand-ring: rgba(29, 78, 216, 0.18);
    --eg-bg: #f4f6fa;
    --eg-surface: #ffffff;
    --eg-surface-muted: #f8fafc;
    --eg-border: #e4e8ef;
    --eg-border-strong: #d2d9e3;
    --eg-text: #0f172a;
    --eg-text-soft: #334155;
    --eg-muted: #64748b;

    --eg-radius: 0.875rem;
    --eg-radius-sm: 0.5rem;
    --eg-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
    --eg-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 2px 6px -1px rgba(15, 23, 42, 0.06);
    --eg-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 10px 28px -8px rgba(15, 23, 42, 0.14);
    --eg-shadow-lg: 0 24px 48px -12px rgba(15, 23, 42, 0.22);
    --eg-sidebar-width: 264px;
    --eg-topbar-height: 64px;

    /* Bootstrap : typographie */
    --bs-font-sans-serif: "Inter Variable", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --bs-body-font-size: 0.9375rem;
    --bs-body-line-height: 1.55;
    --bs-body-color: var(--eg-text);
    --bs-body-color-rgb: 15, 23, 42;
    /* Fond des surfaces Bootstrap (champs, tableaux, menus) : blanc ; le fond de page est posé sur body */
    --bs-body-bg: var(--eg-surface);
    --bs-body-bg-rgb: 255, 255, 255;
    --bs-emphasis-color: var(--eg-navy-900);
    --bs-emphasis-color-rgb: 15, 23, 42;
    --bs-heading-color: var(--eg-navy-900);
    --bs-secondary-color: var(--eg-muted);
    --bs-secondary-color-rgb: 100, 116, 139;
    --bs-secondary-bg: #eef1f6;
    --bs-secondary-bg-rgb: 238, 241, 246;
    --bs-tertiary-color: #94a3b8;
    --bs-tertiary-bg: var(--eg-surface-muted);
    --bs-tertiary-bg-rgb: 248, 250, 252;

    /* Bootstrap : liens, bordures, ombres */
    --bs-link-color: var(--eg-brand);
    --bs-link-color-rgb: var(--eg-brand-rgb);
    --bs-link-hover-color: var(--eg-brand-hover);
    --bs-link-hover-color-rgb: 30, 64, 175;
    --bs-border-color: var(--eg-border);
    --bs-border-color-translucent: rgba(15, 23, 42, 0.09);
    --bs-border-radius: 0.5rem;
    --bs-border-radius-sm: 0.375rem;
    --bs-border-radius-lg: 0.75rem;
    --bs-border-radius-xl: 1rem;
    --bs-box-shadow-sm: var(--eg-shadow-sm);
    --bs-box-shadow: var(--eg-shadow);
    --bs-box-shadow-lg: var(--eg-shadow-lg);
    --bs-focus-ring-color: var(--eg-brand-ring);

    /* Bootstrap : palette */
    --bs-primary: var(--eg-brand);
    --bs-primary-rgb: var(--eg-brand-rgb);
    --bs-primary-text-emphasis: #1e3a8a;
    --bs-primary-bg-subtle: var(--eg-brand-soft);
    --bs-primary-border-subtle: #c9d7fb;
    --bs-secondary: #475569;
    --bs-secondary-rgb: 71, 85, 105;
    --bs-secondary-text-emphasis: #334155;
    --bs-secondary-bg-subtle: #f1f4f8;
    --bs-secondary-border-subtle: #dbe1ea;
    --bs-success: #059669;
    --bs-success-rgb: 5, 150, 105;
    --bs-success-text-emphasis: #065f46;
    --bs-success-bg-subtle: #ecf8f3;
    --bs-success-border-subtle: #b9e5d3;
    --bs-info: #0891b2;
    --bs-info-rgb: 8, 145, 178;
    --bs-info-text-emphasis: #155e75;
    --bs-info-bg-subtle: #ecf7fa;
    --bs-info-border-subtle: #b6e1ec;
    --bs-warning: #f59e0b;
    --bs-warning-rgb: 245, 158, 11;
    --bs-warning-text-emphasis: #92400e;
    --bs-warning-bg-subtle: #fff8eb;
    --bs-warning-border-subtle: #fcdc9f;
    --bs-danger: #dc2626;
    --bs-danger-rgb: 220, 38, 38;
    --bs-danger-text-emphasis: #991b1b;
    --bs-danger-bg-subtle: #fef1f1;
    --bs-danger-border-subtle: #f7c6c6;
    --bs-light: #f1f5f9;
    --bs-light-rgb: 241, 245, 249;
    --bs-light-text-emphasis: #334155;
    --bs-light-bg-subtle: #f8fafc;
    --bs-light-border-subtle: #e4e8ef;
    --bs-dark: var(--eg-navy-900);
    --bs-dark-rgb: 15, 23, 42;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

body {
    background: var(--eg-bg);
    font-feature-settings: "cv11", "ss01";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 650;
    letter-spacing: -0.015em;
}

.h3, h1.h3 {
    font-size: 1.5rem;
}

.display-6 {
    font-weight: 650;
    letter-spacing: -0.025em;
    font-variant-numeric: tabular-nums;
}

::selection {
    background: rgba(var(--eg-brand-rgb), 0.16);
}

/* --------------------------------------------------------------------------
   Boutons
   -------------------------------------------------------------------------- */

.btn {
    --bs-btn-font-size: 0.9375rem;
    --bs-btn-font-weight: 550;
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem var(--eg-brand-ring);
    letter-spacing: -0.005em;
}

.btn-sm {
    --bs-btn-font-size: 0.8125rem;
    --bs-btn-padding-x: 0.7rem;
    --bs-btn-border-radius: 0.4rem;
}

.btn-lg {
    --bs-btn-padding-y: 0.7rem;
    --bs-btn-font-size: 1rem;
    --bs-btn-border-radius: 0.625rem;
}

.btn-primary {
    --bs-btn-bg: var(--eg-brand);
    --bs-btn-border-color: var(--eg-brand);
    --bs-btn-hover-bg: var(--eg-brand-hover);
    --bs-btn-hover-border-color: var(--eg-brand-hover);
    --bs-btn-active-bg: var(--eg-brand-active);
    --bs-btn-active-border-color: var(--eg-brand-active);
    --bs-btn-disabled-bg: var(--eg-brand);
    --bs-btn-disabled-border-color: var(--eg-brand);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.btn-outline-primary {
    --bs-btn-color: var(--eg-brand);
    --bs-btn-border-color: #bccdf7;
    --bs-btn-bg: var(--eg-surface);
    --bs-btn-hover-color: var(--eg-brand-hover);
    --bs-btn-hover-bg: var(--eg-brand-soft);
    --bs-btn-hover-border-color: #9db5f3;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--eg-brand);
    --bs-btn-active-border-color: var(--eg-brand);
    --bs-btn-disabled-color: var(--eg-brand);
    --bs-btn-disabled-border-color: #bccdf7;
}

.btn-secondary {
    --bs-btn-bg: #475569;
    --bs-btn-border-color: #475569;
    --bs-btn-hover-bg: #334155;
    --bs-btn-hover-border-color: #334155;
    --bs-btn-active-bg: #1e293b;
    --bs-btn-active-border-color: #1e293b;
}

/* Bouton neutre : fond blanc, bordure grise */
.btn-outline-secondary {
    --bs-btn-color: var(--eg-text-soft);
    --bs-btn-bg: var(--eg-surface);
    --bs-btn-border-color: var(--eg-border-strong);
    --bs-btn-hover-color: var(--eg-text);
    --bs-btn-hover-bg: #f1f4f8;
    --bs-btn-hover-border-color: #c3ccd8;
    --bs-btn-active-color: var(--eg-brand);
    --bs-btn-active-bg: var(--eg-brand-soft);
    --bs-btn-active-border-color: #9db5f3;
    --bs-btn-disabled-color: var(--eg-muted);
    --bs-btn-disabled-border-color: var(--eg-border);
    box-shadow: var(--eg-shadow-xs);
}

.btn-success {
    --bs-btn-bg: #059669;
    --bs-btn-border-color: #059669;
    --bs-btn-hover-bg: #047857;
    --bs-btn-hover-border-color: #047857;
    --bs-btn-active-bg: #065f46;
    --bs-btn-active-border-color: #065f46;
    --bs-btn-disabled-bg: #059669;
    --bs-btn-disabled-border-color: #059669;
}

.btn-outline-success {
    --bs-btn-color: #047857;
    --bs-btn-border-color: #9fd9c2;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #059669;
    --bs-btn-hover-border-color: #059669;
    --bs-btn-active-bg: #047857;
    --bs-btn-active-border-color: #047857;
}

.btn-danger {
    --bs-btn-bg: #dc2626;
    --bs-btn-border-color: #dc2626;
    --bs-btn-hover-bg: #b91c1c;
    --bs-btn-hover-border-color: #b91c1c;
    --bs-btn-active-bg: #991b1b;
    --bs-btn-active-border-color: #991b1b;
}

.btn-outline-danger {
    --bs-btn-color: #b91c1c;
    --bs-btn-bg: var(--eg-surface);
    --bs-btn-border-color: #f1c0c0;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #dc2626;
    --bs-btn-hover-border-color: #dc2626;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #b91c1c;
    --bs-btn-active-border-color: #b91c1c;
}

.btn-link {
    --bs-btn-color: var(--eg-brand);
    --bs-btn-hover-color: var(--eg-brand-hover);
    --bs-btn-active-color: var(--eg-brand-active);
}

/* --------------------------------------------------------------------------
   Formulaires
   -------------------------------------------------------------------------- */

.form-label {
    font-weight: 550;
    font-size: 0.875rem;
    color: var(--eg-text-soft);
    margin-bottom: 0.375rem;
}

.form-control,
.form-select {
    font-size: 0.9375rem;
    border-color: var(--eg-border-strong);
    box-shadow: var(--eg-shadow-xs);
}

.form-control-sm,
.form-select-sm {
    font-size: 0.8125rem;
}

.form-control::placeholder {
    color: #a0abbb;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: #7f9ef0;
    box-shadow: 0 0 0 0.25rem var(--eg-brand-ring);
}

.form-control-lg,
.form-select-lg {
    font-size: 1rem;
    padding: 0.7rem 0.9rem;
    border-radius: 0.625rem;
}

.form-check-input:checked {
    background-color: var(--eg-brand);
    border-color: var(--eg-brand);
}

.form-text {
    color: var(--eg-muted);
    font-size: 0.8125rem;
}

/* Champ avec icône à gauche (et bouton optionnel à droite) */
.eg-input-icon {
    position: relative;
}

.eg-input-icon > .bi {
    position: absolute;
    left: 0.95rem;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    pointer-events: none;
    font-size: 1.05rem;
}

.eg-input-icon > .form-control {
    padding-left: 2.75rem;
}

.eg-input-icon > .form-control:has(~ .eg-password-toggle) {
    padding-right: 3rem;
}

.eg-password-toggle {
    position: absolute;
    right: 0.4rem;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: #94a3b8;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.5rem;
    display: grid;
    place-items: center;
}

.eg-password-toggle:hover {
    color: var(--eg-text-soft);
    background: var(--eg-surface-muted);
}

.eg-password-toggle:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--eg-brand-ring);
}

/* --------------------------------------------------------------------------
   Cartes
   -------------------------------------------------------------------------- */

.card {
    --bs-card-border-color: var(--eg-border);
    --bs-card-border-radius: var(--eg-radius);
    --bs-card-inner-border-radius: calc(var(--eg-radius) - 1px);
    --bs-card-cap-bg: var(--eg-surface);
    --bs-card-cap-padding-y: 0.85rem;
    --bs-card-cap-padding-x: 1.25rem;
    --bs-card-spacer-x: 1.25rem;
    --bs-card-spacer-y: 1.25rem;
    --bs-card-bg: var(--eg-surface);
    box-shadow: var(--eg-shadow-sm);
}

/* Toutes les cartes ont le même contour, même celles marquées border-0 */
.card.border-0 {
    border: 1px solid var(--eg-border) !important;
}

.card-header {
    font-weight: 600;
    color: var(--eg-navy-900);
}

/* En-têtes de carte toujours blancs, séparés du contenu par un filet */
.card-header.bg-body-tertiary,
.card-header.bg-transparent {
    background-color: var(--eg-surface) !important;
}

.card-title {
    font-weight: 650;
}

/* --------------------------------------------------------------------------
   Tableaux
   -------------------------------------------------------------------------- */

.table {
    --bs-table-border-color: var(--eg-border);
    --bs-table-striped-bg: rgba(15, 23, 42, 0.022);
    --bs-table-hover-bg: rgba(var(--eg-brand-rgb), 0.04);
    --bs-table-active-bg: rgba(var(--eg-brand-rgb), 0.06);
    font-variant-numeric: tabular-nums;
}

.table > :not(caption) > * > * {
    padding: 0.7rem 0.85rem;
}

.table-sm > :not(caption) > * > * {
    padding: 0.4rem 0.55rem;
}

.table:not(.table-bordered) > thead > tr > th {
    background-color: var(--eg-surface-muted);
    color: var(--eg-muted);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
    border-bottom-color: var(--eg-border);
}

.table-light {
    --bs-table-bg: var(--eg-surface-muted);
    --bs-table-color: var(--eg-muted);
    --bs-table-border-color: var(--eg-border);
}

.table > tbody > tr:last-child > * {
    border-bottom-width: 0;
}

/* Tableau collé au bord d'une carte : le conteneur reprend l'arrondi et découpe les lignes */
.card > .table-responsive:first-child,
.card > .card-body.p-0:first-child > .table-responsive:first-child {
    border-top-left-radius: calc(var(--eg-radius) - 1px);
    border-top-right-radius: calc(var(--eg-radius) - 1px);
}

.card > .table-responsive:last-child,
.card > .card-body.p-0:last-child > .table-responsive:last-child {
    border-bottom-left-radius: calc(var(--eg-radius) - 1px);
    border-bottom-right-radius: calc(var(--eg-radius) - 1px);
}

/* --------------------------------------------------------------------------
   Badges, alertes, listes, onglets, menus
   -------------------------------------------------------------------------- */

.badge {
    --bs-badge-font-weight: 600;
    --bs-badge-padding-x: 0.6em;
    --bs-badge-padding-y: 0.38em;
    --bs-badge-border-radius: 999px;
    letter-spacing: 0.01em;
}

.alert {
    --bs-alert-border-radius: 0.75rem;
    --bs-alert-padding-x: 1.1rem;
    --bs-alert-padding-y: 0.9rem;
    font-size: 0.9rem;
}

.alert-primary,
.alert-secondary,
.alert-success,
.alert-info,
.alert-warning,
.alert-danger {
    border-left-width: 3px;
}

.alert-primary { border-left-color: var(--bs-primary); }
.alert-secondary { border-left-color: var(--bs-secondary); }
.alert-success { border-left-color: var(--bs-success); }
.alert-warning { border-left-color: var(--bs-warning); }
.alert-danger { border-left-color: var(--bs-danger); }

/* Information : encadré blanc plutôt qu'un aplat pastel */
.alert-info {
    --bs-alert-bg: var(--eg-surface);
    --bs-alert-color: var(--eg-text-soft);
    --bs-alert-border-color: var(--eg-border);
    border-left-color: var(--eg-brand);
    box-shadow: var(--eg-shadow-sm);
}

.alert-info .alert-heading,
.alert-info strong {
    color: var(--eg-navy-900);
}

.alert-light {
    --bs-alert-bg: var(--eg-surface);
    --bs-alert-border-color: var(--eg-border);
    --bs-alert-color: var(--eg-text-soft);
    box-shadow: var(--eg-shadow-xs);
}

.list-group {
    --bs-list-group-color: var(--eg-text);
    --bs-list-group-action-color: var(--eg-text);
    --bs-list-group-action-hover-color: var(--eg-navy-900);
    --bs-list-group-border-color: var(--eg-border);
    --bs-list-group-action-hover-bg: var(--eg-surface-muted);
    --bs-list-group-action-active-bg: var(--eg-brand-soft);
    --bs-list-group-active-bg: var(--eg-brand);
    --bs-list-group-active-border-color: var(--eg-brand);
}

.nav-pills {
    --bs-nav-pills-link-active-bg: var(--eg-brand);
    --bs-nav-pills-border-radius: 0.5rem;
    --bs-nav-link-color: var(--eg-text-soft);
    --bs-nav-link-hover-color: var(--eg-brand);
}

/* Onglets soulignés */
.nav-tabs {
    --bs-nav-tabs-border-color: var(--eg-border);
    --bs-nav-link-color: var(--eg-muted);
    --bs-nav-link-hover-color: var(--eg-text);
    gap: 0.25rem;
}

.nav-tabs .nav-link {
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    font-weight: 550;
    padding: 0.65rem 0.9rem;
    margin-bottom: -1px;
}

.nav-tabs .nav-link:hover {
    border-bottom-color: var(--eg-border-strong);
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: var(--eg-brand);
    background: transparent;
    border-bottom-color: var(--eg-brand);
}

.dropdown-menu {
    --bs-dropdown-border-color: var(--eg-border);
    --bs-dropdown-border-radius: 0.75rem;
    --bs-dropdown-box-shadow: var(--eg-shadow);
    --bs-dropdown-padding-x: 0.375rem;
    --bs-dropdown-padding-y: 0.375rem;
    --bs-dropdown-item-padding-x: 0.75rem;
    --bs-dropdown-item-padding-y: 0.5rem;
    --bs-dropdown-item-border-radius: 0.5rem;
    --bs-dropdown-link-active-bg: var(--eg-brand);
    --bs-dropdown-link-hover-bg: var(--eg-surface-muted);
    --bs-dropdown-font-size: 0.875rem;
    --bs-dropdown-header-padding-x: 0.75rem;
    min-width: 13rem;
    box-shadow: var(--bs-dropdown-box-shadow);
}

.dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.dropdown-item .bi {
    color: var(--eg-muted);
}

.dropdown-item.text-danger .bi {
    color: inherit;
}

.dropdown-header {
    font-size: 0.875rem;
    line-height: 1.35;
}

/* --------------------------------------------------------------------------
   Coque applicative : barre latérale + barre supérieure
   -------------------------------------------------------------------------- */

.eg-shell {
    display: flex;
    min-height: 100vh;
}

.eg-sidebar {
    --bs-offcanvas-width: var(--eg-sidebar-width);
    --bs-offcanvas-bg: var(--eg-navy-900);
    --bs-offcanvas-color: #cbd5e1;
    --bs-offcanvas-border-width: 0;
}

@media (min-width: 992px) {
    .eg-sidebar {
        flex: 0 0 var(--eg-sidebar-width);
        width: var(--eg-sidebar-width);
        position: sticky;
        top: 0;
        height: 100vh;
    }
}

.eg-sidebar-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    overflow-y: auto;
    color: #cbd5e1;
    background:
        radial-gradient(120% 60% at 0% 0%, rgba(59, 130, 246, 0.16) 0%, transparent 55%),
        linear-gradient(180deg, var(--eg-navy-900) 0%, var(--eg-navy-950) 100%);
    scrollbar-width: thin;
    scrollbar-color: rgba(148, 163, 184, 0.25) transparent;
}

.eg-sidebar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.25rem 1rem;
}

.eg-brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #fff;
    text-decoration: none;
}

.eg-brand img {
    border-radius: 0.6rem;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1), 0 6px 16px -4px rgba(29, 78, 216, 0.55);
}

.eg-brand-name {
    display: block;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.eg-brand-space {
    display: block;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #7c8ba1;
}

.eg-nav {
    flex: 1;
    padding: 0.5rem 0.75rem 1.25rem;
}

.eg-nav-section {
    margin: 1.25rem 0 0.4rem;
    padding: 0 0.75rem;
    font-size: 0.67rem;
    font-weight: 600;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: #5f6f86;
}

.eg-nav .nav-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 2px;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    color: #b6c2d3;
    font-size: 0.875rem;
    font-weight: 500;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.eg-nav .nav-link .bi {
    width: 1.1rem;
    font-size: 1.05rem;
    text-align: center;
    color: #7c8ba1;
    transition: color 0.15s ease;
}

.eg-nav .nav-link:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.05);
}

.eg-nav .nav-link:hover .bi {
    color: #cbd5e1;
}

.eg-nav .nav-link.active {
    color: #fff;
    background: linear-gradient(90deg, rgba(59, 130, 246, 0.24) 0%, rgba(59, 130, 246, 0.08) 100%);
    box-shadow: inset 0 0 0 1px rgba(96, 165, 250, 0.14);
}

.eg-nav .nav-link.active::before {
    content: "";
    position: absolute;
    left: -0.75rem;
    top: 0.45rem;
    bottom: 0.45rem;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: #60a5fa;
}

.eg-nav .nav-link.active .bi {
    color: #93c5fd;
}

.eg-nav .nav-link:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 2px rgba(96, 165, 250, 0.5);
}

.eg-sidebar-foot {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.75rem;
    color: #5f6f86;
}

.eg-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.eg-topbar {
    position: sticky;
    top: 0;
    z-index: 1020;
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: var(--eg-topbar-height);
    padding: 0.5rem 1.25rem;
    background: rgba(255, 255, 255, 0.86);
    backdrop-filter: saturate(180%) blur(10px);
    -webkit-backdrop-filter: saturate(180%) blur(10px);
    border-bottom: 1px solid var(--eg-border);
}

@media (min-width: 992px) {
    .eg-topbar {
        padding: 0.5rem 2rem;
    }
}

.eg-topbar-brand {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: var(--eg-navy-900);
    font-weight: 700;
    letter-spacing: -0.02em;
    text-decoration: none;
}

.eg-topbar-brand img {
    border-radius: 0.5rem;
}

.eg-topbar-sep {
    width: 1px;
    height: 1.75rem;
    background: var(--eg-border);
}

.eg-icon-btn {
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid var(--eg-border);
    border-radius: 0.625rem;
    background: var(--eg-surface);
    color: var(--eg-text-soft);
    font-size: 1.35rem;
}

.eg-icon-btn:hover {
    background: var(--eg-surface-muted);
}

.eg-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.3rem 0.75rem;
    border: 1px solid var(--eg-border);
    border-radius: 999px;
    background: var(--eg-surface);
    color: var(--eg-text-soft);
    font-size: 0.8rem;
    font-weight: 550;
    white-space: nowrap;
    box-shadow: var(--eg-shadow-xs);
}

.eg-chip-dot {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: #10b981;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.18);
}

.eg-chip--warning {
    border-color: var(--bs-warning-border-subtle);
    background: var(--bs-warning-bg-subtle);
    color: var(--bs-warning-text-emphasis);
}

.eg-chip--warning .eg-chip-dot {
    background: #f59e0b;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.2);
}

.eg-user-btn {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.25rem 0.5rem 0.25rem 0.25rem;
    border: 0;
    border-radius: 0.75rem;
    background: transparent;
    color: var(--eg-text);
    text-align: left;
}

.eg-user-btn:hover,
.eg-user-btn[aria-expanded="true"] {
    background: rgba(15, 23, 42, 0.04);
}

.eg-user-btn:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem var(--eg-brand-ring);
}

.eg-avatar {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 50%;
    background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 650;
    letter-spacing: 0.02em;
    box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--eg-border);
}

.eg-user-meta {
    flex-direction: column;
    line-height: 1.2;
}

.eg-user-name {
    font-size: 0.85rem;
    font-weight: 600;
}

.eg-user-role {
    font-size: 0.72rem;
    color: var(--eg-muted);
}

.eg-user-caret {
    font-size: 0.7rem;
    color: var(--eg-muted);
}

.eg-content {
    flex: 1;
    width: 100%;
    max-width: 1600px;
    padding: 1.75rem 1.25rem 3rem;
}

@media (min-width: 992px) {
    .eg-content {
        padding: 2rem 2rem 3.5rem;
    }
}

/* --------------------------------------------------------------------------
   Éléments de page : en-tête, indicateurs, accès rapides
   -------------------------------------------------------------------------- */

.eg-page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.75rem;
}

.eg-eyebrow {
    margin-bottom: 0.35rem;
    font-size: 0.72rem;
    font-weight: 650;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--eg-brand);
}

.eg-page-title {
    margin-bottom: 0.35rem;
    font-size: 1.65rem;
    font-weight: 700;
    letter-spacing: -0.025em;
}

.eg-page-lead {
    margin-bottom: 0;
    color: var(--eg-muted);
}

.eg-section-title {
    margin-bottom: 1rem;
    font-size: 1rem;
    font-weight: 650;
}

.eg-stat {
    height: 100%;
}

.eg-stat .card-body {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.eg-stat-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.eg-stat-label {
    font-size: 0.8125rem;
    font-weight: 550;
    color: var(--eg-muted);
}

.eg-stat-value {
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: var(--eg-navy-900);
    font-variant-numeric: tabular-nums;
}

.eg-stat-hint {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--eg-muted);
}

.eg-icon-tile {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.7rem;
    background: var(--eg-brand-soft);
    color: var(--eg-brand);
    font-size: 1.15rem;
    box-shadow: inset 0 0 0 1px rgba(var(--eg-brand-rgb), 0.1);
}

.eg-icon-tile--success { background: #ecf8f3; color: #047857; box-shadow: inset 0 0 0 1px rgba(5, 150, 105, 0.12); }
.eg-icon-tile--info { background: #ecf7fa; color: #0e7490; box-shadow: inset 0 0 0 1px rgba(8, 145, 178, 0.12); }
.eg-icon-tile--warning { background: #fff8eb; color: #b45309; box-shadow: inset 0 0 0 1px rgba(245, 158, 11, 0.16); }
.eg-icon-tile--violet { background: #f3f0ff; color: #6d28d9; box-shadow: inset 0 0 0 1px rgba(109, 40, 217, 0.1); }

.eg-feature {
    height: 100%;
    padding: 1.15rem 1.2rem 1.25rem;
    color: inherit;
    text-decoration: none;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.eg-feature-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.9rem;
}

.eg-feature:hover {
    color: inherit;
    transform: translateY(-2px);
    border-color: #c9d6ef !important;
    box-shadow: var(--eg-shadow);
}

.eg-feature-title {
    display: block;
    margin-bottom: 0.15rem;
    font-size: 0.9375rem;
    font-weight: 650;
    color: var(--eg-navy-900);
}

.eg-feature-text {
    display: block;
    font-size: 0.8125rem;
    color: var(--eg-muted);
}

.eg-feature-arrow {
    color: #b6c0ce;
    transition: transform 0.18s ease, color 0.18s ease;
}

.eg-feature:hover .eg-feature-arrow {
    color: var(--eg-brand);
    transform: translate(2px, -2px);
}

.eg-feature:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.25rem var(--eg-brand-ring);
}

/* Encadré d'information neutre (remplace les alert-info pastel) */
.eg-note {
    display: flex;
    gap: 0.9rem;
    padding: 1.1rem 1.25rem;
    border: 1px solid var(--eg-border);
    border-radius: var(--eg-radius);
    background: var(--eg-surface);
    box-shadow: var(--eg-shadow-sm);
}

.eg-note-title {
    margin-bottom: 0.5rem;
    font-size: 0.9375rem;
    font-weight: 650;
}

.eg-note ul {
    margin: 0;
    padding-left: 1.1rem;
    color: var(--eg-text-soft);
    font-size: 0.875rem;
}

.eg-note li + li {
    margin-top: 0.3rem;
}

/* Messages flash */
.eg-flash {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
}

.eg-flash > .bi {
    margin-top: 0.1rem;
    font-size: 1rem;
}

.eg-flash.alert-dismissible .btn-close {
    padding: 1.05rem 1rem;
    font-size: 0.7rem;
}

/* Panneau latéral de formulaire (création / modification) : corps défilant, boutons toujours visibles */
.eg-form-panel {
    --bs-offcanvas-width: 34rem;
    max-width: 100%;
}

.eg-form-panel .offcanvas-header {
    align-items: flex-start;
    gap: 1rem;
    border-bottom: 1px solid var(--eg-border);
}

.eg-form-panel-form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.eg-form-panel-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.9rem var(--bs-offcanvas-padding-x);
    border-top: 1px solid var(--eg-border);
    background: var(--eg-surface-muted);
}

/* Lien de retour au-dessus du titre des pages de détail */
.eg-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.9rem;
    font-size: 0.875rem;
    font-weight: 550;
    color: var(--eg-muted);
    text-decoration: none;
}

.eg-back-link:hover {
    color: var(--eg-brand);
}

.eg-back-link .bi {
    transition: transform 0.15s ease;
}

.eg-back-link:hover .bi {
    transform: translateX(-2px);
}

/* État vide */
.eg-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    padding: 2.25rem 1.5rem;
    border: 1px dashed var(--eg-border-strong);
    border-radius: var(--eg-radius);
    background: var(--eg-surface);
    color: var(--eg-muted);
    font-size: 0.9rem;
    text-align: center;
}

.eg-empty > .bi {
    margin-bottom: 0.25rem;
    font-size: 1.6rem;
    color: #a0abbb;
}

.eg-empty--compact {
    padding: 1.25rem 1rem;
    font-size: 0.85rem;
}

/* Petites valeurs clés (récapitulatifs, statistiques) */
.eg-kv-label {
    display: block;
    margin-bottom: 0.15rem;
    font-size: 0.75rem;
    font-weight: 550;
    color: var(--eg-muted);
}

.eg-kv-value {
    font-weight: 650;
    color: var(--eg-navy-900);
    font-variant-numeric: tabular-nums;
}

.eg-stats-panel {
    padding: 1.1rem 1.15rem;
    border: 1px solid var(--eg-border);
    border-radius: var(--eg-radius);
    background: var(--eg-surface-muted);
}

.eg-stats-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.eg-stats-grid > div {
    padding: 0.55rem 0.7rem;
    border: 1px solid var(--eg-border);
    border-radius: 0.5rem;
    background: var(--eg-surface);
}

.eg-min-h-list {
    min-height: 120px;
}

.eg-col-note {
    width: 10rem;
    white-space: nowrap;
}

/* Enregistrement automatique : largeur fixe pour éviter les sauts de mise en page */
.eg-autosave-indicator {
    flex: 0 0 1rem;
    width: 1rem;
    text-align: center;
    font-size: 0.875rem;
}

.eg-scroll-panel {
    max-height: 70vh;
    overflow: auto;
}

/* Plan de salle */
.eg-room-front {
    margin-bottom: 0.75rem;
    padding: 0.4rem;
    border-radius: 0.5rem;
    background: var(--eg-navy-800);
    color: #cbd5e1;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-align: center;
    text-transform: uppercase;
}

.eg-seat-grid {
    border-collapse: separate;
    border-spacing: 0.35rem;
}

.eg-seat-grid > :not(caption) > * > * {
    padding: 0.4rem 0.3rem;
    border: 0;
    border-radius: 0.5rem;
    text-align: center;
    vertical-align: middle;
    box-shadow: none;
}

.eg-seat-grid thead th {
    padding: 0 0.3rem;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--eg-muted);
}

.eg-seat-row-label {
    width: 2.25rem;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--eg-muted);
}

.eg-seat {
    border: 1px solid var(--eg-border) !important;
    background: var(--eg-surface);
    box-shadow: var(--eg-shadow-xs) !important;
}

.eg-seat--tt {
    border-color: var(--bs-warning-border-subtle) !important;
    background: var(--bs-warning-bg-subtle);
}

.eg-seat--credit {
    border-color: #f7cfa8 !important;
    background: #fff4ea;
}

.eg-seat-name {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.2;
    color: var(--eg-navy-900);
}

.eg-seat-firstname {
    display: block;
    font-size: 0.72rem;
    color: var(--eg-muted);
}

.eg-seat-empty {
    border: 1px dashed var(--eg-border) !important;
    background: transparent;
    color: #c3ccd8;
    font-size: 0.7rem;
}

.eg-legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 1.1rem;
    font-size: 0.8rem;
    color: var(--eg-muted);
}

.eg-legend-swatch {
    display: inline-block;
    width: 0.8rem;
    height: 0.8rem;
    margin-right: 0.35rem;
    border: 1px solid var(--eg-border);
    border-radius: 0.2rem;
    vertical-align: -0.1rem;
}

/* --------------------------------------------------------------------------
   Page de connexion
   -------------------------------------------------------------------------- */

.eg-auth-page {
    background: var(--eg-surface);
}

.eg-auth {
    display: grid;
    min-height: 100vh;
}

@media (min-width: 992px) {
    .eg-auth {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    }
}

.eg-auth-aside {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    flex-direction: column;
    justify-content: space-between;
    padding: 2.75rem 3.5rem;
    color: #cbd5e1;
    background:
        radial-gradient(60% 50% at 15% 10%, rgba(59, 130, 246, 0.35) 0%, transparent 70%),
        radial-gradient(55% 45% at 90% 95%, rgba(99, 102, 241, 0.28) 0%, transparent 70%),
        linear-gradient(160deg, #0b1224 0%, var(--eg-navy-900) 45%, #14224f 100%);
}

/* Quadrillage discret, estompé vers les bords */
.eg-auth-aside::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 44px 44px;
    -webkit-mask-image: radial-gradient(ellipse 70% 60% at 35% 45%, #000 10%, transparent 80%);
    mask-image: radial-gradient(ellipse 70% 60% at 35% 45%, #000 10%, transparent 80%);
}

/* Halo lumineux */
.eg-auth-aside::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: -12rem;
    top: 18%;
    width: 30rem;
    height: 30rem;
    border-radius: 50%;
    border: 1px solid rgba(147, 197, 253, 0.12);
    box-shadow: 0 0 0 5rem rgba(147, 197, 253, 0.025), 0 0 0 10rem rgba(147, 197, 253, 0.02);
}

.eg-auth-brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #fff;
}

.eg-auth-brand img {
    border-radius: 0.7rem;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12), 0 10px 24px -6px rgba(37, 99, 235, 0.6);
}

.eg-auth-brand--compact {
    margin-bottom: 2.5rem;
    color: var(--eg-navy-900);
}

.eg-auth-brand--compact img {
    box-shadow: 0 8px 18px -6px rgba(29, 78, 216, 0.45);
}

.eg-auth-pitch {
    max-width: 30rem;
}

.eg-auth-kicker {
    display: inline-flex;
    margin-bottom: 1.25rem;
    padding: 0.3rem 0.75rem;
    border: 1px solid rgba(147, 197, 253, 0.22);
    border-radius: 999px;
    background: rgba(59, 130, 246, 0.1);
    color: #bfdbfe;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.eg-auth-headline {
    margin-bottom: 2.25rem;
    color: #fff;
    font-size: clamp(1.9rem, 2.6vw, 2.5rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.035em;
}

.eg-auth-features {
    display: grid;
    gap: 1.25rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.eg-auth-features li {
    display: flex;
    gap: 0.9rem;
    font-size: 0.875rem;
    line-height: 1.45;
    color: #94a3b8;
}

.eg-auth-features strong {
    display: block;
    margin-bottom: 0.1rem;
    font-weight: 600;
    color: #e2e8f0;
}

.eg-auth-feature-icon {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 2.4rem;
    height: 2.4rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.65rem;
    background: rgba(255, 255, 255, 0.05);
    color: #93c5fd;
    font-size: 1.05rem;
}

.eg-auth-legal {
    margin: 0;
    font-size: 0.75rem;
    color: #64748b;
}

.eg-auth-main {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.25rem;
    background: var(--eg-surface);
}

.eg-auth-form {
    width: 100%;
    max-width: 24rem;
}

.eg-auth-title {
    margin-bottom: 0.4rem;
    font-size: 1.85rem;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.eg-auth-subtitle {
    margin-bottom: 2rem;
    color: var(--eg-muted);
}

.eg-auth-form .form-control-lg {
    height: 3rem;
}

.eg-auth-submit {
    height: 3rem;
}

.eg-auth-help {
    display: flex;
    gap: 0.5rem;
    margin: 2rem 0 0;
    padding-top: 1.25rem;
    border-top: 1px solid var(--eg-border);
    font-size: 0.8125rem;
    color: var(--eg-muted);
}

.eg-auth-help .bi {
    margin-top: 0.1rem;
}