/* =====================================================================
   theme.css : couche commune des pages publiques de prepare-toi.com
   Chargée APRÈS la feuille propre à chaque page. Elle ne remplace pas
   les anciens styles : elle ajoute les composants communs (boutons,
   cartes, filtres, barre de lecture, formulaire de connexion) et
   corrige la lisibilité, le focus clavier et l'affichage mobile.
   ===================================================================== */

:root {
    --pt-primary: #1565C0;
    --pt-primary-hover: #0D47A1;
    --pt-primary-soft: #E3EEFB;
    --pt-nav: #0950BF;
    --pt-bg: #F3F5FA;
    --pt-surface: #FFFFFF;
    --pt-surface-2: #F7F8FC;
    --pt-text: #1F2433;
    --pt-muted: #5B6275;
    --pt-border: #DCE1EC;
    --pt-success: #1B7A3D;
    --pt-success-soft: #E3F4E8;
    --pt-danger: #C62828;
    --pt-warning-soft: #FFF4D6;
    --pt-radius: 14px;
    --pt-radius-sm: 10px;
    --pt-shadow: 0 6px 20px rgba(16, 24, 40, .07);
    --pt-focus: 0 0 0 3px rgba(21, 101, 192, .35);
}

body.dark {
    --pt-primary: #6AA8F0;
    --pt-primary-hover: #8FBDF4;
    --pt-primary-soft: #1E2B40;
    --pt-bg: #18191A;
    --pt-surface: #242526;
    --pt-surface-2: #2C2D2F;
    --pt-text: #E6E8EE;
    --pt-muted: #A8AEBB;
    --pt-border: #3A3B3D;
    --pt-success: #6FCF8E;
    --pt-success-soft: #1F3326;
    --pt-warning-soft: #3A3220;
}

/* ---------- Accessibilité ---------- */
.skip-link {
    position: absolute;
    left: 12px;
    top: -60px;
    z-index: 1000;
    background: var(--pt-surface);
    color: var(--pt-text);
    padding: .5rem .9rem;
    border-radius: var(--pt-radius-sm);
    box-shadow: var(--pt-shadow);
    text-decoration: none;
}
.skip-link:focus { top: 12px; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
.row-link:focus-visible {
    outline: 3px solid var(--pt-primary);
    outline-offset: 2px;
}

/* ---------- Navigation ---------- */
.nav-links li a.active { font-weight: 600; }
.nav-links li a.active::before { opacity: 1 !important; }

@media (max-width: 790px) {
    nav .nav-bar .logo a,
    nav .nav-bar .navLogo a { font-size: 20px; white-space: nowrap; }
    nav .nav-bar { padding: 0 16px; }
}

/* ---------- Boutons ---------- */
.pt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: .7rem 1.2rem;
    border-radius: 999px;
    border: 2px solid var(--pt-primary);
    background: var(--pt-primary);
    color: #fff !important;
    font-weight: 600;
    font-size: .98rem;
    line-height: 1.2;
    text-decoration: none !important;
    cursor: pointer;
}
.pt-btn:hover { background: var(--pt-primary-hover); border-color: var(--pt-primary-hover); }
.pt-btn--ghost { background: transparent; color: var(--pt-primary) !important; }
.pt-btn--ghost:hover { background: var(--pt-primary-soft); color: var(--pt-primary) !important; }
.pt-btn--success { background: var(--pt-success); border-color: var(--pt-success); }
.pt-btn--success:hover { filter: brightness(.92); background: var(--pt-success); border-color: var(--pt-success); }
.pt-btn--small { padding: .45rem .9rem; font-size: .9rem; }
.pt-btn[disabled] { opacity: .55; cursor: not-allowed; }
.pt-btn i { font-size: 1.15em; }

.pt-link {
    background: none;
    border: 0;
    padding: 0;
    color: var(--pt-primary);
    font: inherit;
    text-decoration: underline;
    cursor: pointer;
}

/* ---------- Accueil ---------- */
.pt-hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.25rem; }
.pt-stats {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.5rem;
    margin-top: 1rem;
    padding: 0;
    list-style: none;
    color: var(--pt-muted);
    font-size: .95rem;
}
.pt-stats strong { color: var(--pt-text); font-size: 1.15rem; margin-right: .25rem; }
.content main .header .left .breadcrumb li { color: var(--pt-muted); }

.content main#contenu { padding-top: 96px; }
.row-link { cursor: pointer; }
.row-link a { color: inherit; font-weight: 600; text-decoration: none; }
.row-link:hover a { color: var(--pt-primary); text-decoration: underline; }
.pt-hero-actions .pt-btn--ghost { background: transparent; }
@media (max-width: 790px) {
    .content main#contenu { padding-top: 84px; }
    .pt-hero-actions .pt-btn { flex: 1 1 100%; }
}
.row-link:hover td { background: var(--pt-primary-soft); }
.pt-voir-tout { text-align: center; margin-top: 1rem; }
.pt-voir-tout a { color: var(--pt-primary); font-weight: 600; text-decoration: none; }
.pt-voir-tout a:hover { text-decoration: underline; }

/* Le texte « À propos » justifié créait de grands trous sur mobile */
.content main .reminders .lead { text-align: left !important; }

/* ---------- Page Épreuves ---------- */
.pt-page {
    max-width: 1180px;
    margin: 0 auto;
    padding: 100px 20px 48px;
    color: var(--pt-text);
}
.pt-page-head h1 { font-size: 1.9rem; font-weight: 600; margin: 0 0 .35rem; }
.pt-page-head p { color: var(--pt-muted); margin: 0 0 1.5rem; }

.pt-epreuves {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.pt-card {
    background: var(--pt-surface);
    border: 1px solid var(--pt-border);
    border-radius: var(--pt-radius);
    box-shadow: var(--pt-shadow);
}

.pt-filtres { padding: 18px; position: sticky; top: 90px; }
.pt-filtres-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .75rem; }
.pt-filtres-head h2 { font-size: 1.15rem; font-weight: 600; margin: 0; display: flex; align-items: center; gap: .4rem; }

.pt-filtre { border-top: 1px solid var(--pt-border); }
.pt-filtre summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .8rem .2rem;
    font-weight: 600;
    cursor: pointer;
}
.pt-filtre summary > span:first-child { display: inline-flex; align-items: center; gap: .45rem; }
.pt-filtre summary > span:first-child .bx { font-size: 1.2rem; color: var(--pt-primary); }
.pt-filtre summary::-webkit-details-marker { display: none; }
.pt-filtre summary .bx-chevron-down { transition: transform .15s ease; font-size: 1.3rem; color: var(--pt-muted); }
.pt-filtre[open] summary .bx-chevron-down { transform: rotate(180deg); }
.pt-filtre .pt-nb {
    margin-left: auto;
    background: var(--pt-primary);
    color: #fff;
    border-radius: 999px;
    font-size: .75rem;
    padding: .05rem .5rem;
}
.pt-filtre .pt-nb:empty { display: none; }
.pt-filtre-liste { max-height: 290px; overflow-y: auto; padding: 0 .2rem .8rem; }
.pt-filtre-liste label {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .35rem .25rem;
    border-radius: 8px;
    cursor: pointer;
    font-size: .95rem;
}
.pt-filtre-liste label:hover { background: var(--pt-surface-2); }
.pt-filtre-liste input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--pt-primary); flex: none; }
.pt-filtre-recherche {
    width: 100%;
    margin: 0 0 .5rem;
    padding: .45rem .7rem;
    border: 1px solid var(--pt-border);
    border-radius: 8px;
    background: var(--pt-surface);
    color: var(--pt-text);
}

.pt-resultats { padding: 18px 18px 10px; min-width: 0; }
.pt-resultats-head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-bottom: .5rem; }
.pt-count { font-weight: 600; font-size: 1.05rem; margin: 0; }
.pt-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chip {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    border: 1px solid var(--pt-border);
    background: var(--pt-primary-soft);
    color: var(--pt-text);
    border-radius: 999px;
    padding: .2rem .7rem;
    font-size: .88rem;
    cursor: pointer;
}
.chip:hover { border-color: var(--pt-primary); }
.chip .bx { font-size: 1rem; }

.is-loading { opacity: .45; pointer-events: none; transition: opacity .15s ease; }

/* Accès invité terminé : bouton puis lien « J'ai déjà un compte » en dessous, centrés */
.pt-vide-actions { display: flex; flex-direction: column; align-items: center; gap: .9rem; margin-top: 1.4rem; }
.pt-vide .pt-vide-actions .pt-btn { min-width: 240px; margin: 0; }
.pt-vide-actions .pt-link { white-space: nowrap; }
@media (max-width: 640px) { .pt-vide .pt-vide-actions .pt-btn { width: 100%; min-width: 0; } }

/* Résultats en cartes (une ligne DataTables = une carte, comme sur l'accueil) */
#resultat { width: 100% !important; color: var(--pt-text); border: 0 !important; }
#resultat thead { display: none; }
#resultat tbody { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; padding: 6px 0 12px; }
#resultat tbody tr, #resultat tbody td { display: block; height: auto !important; margin: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; box-shadow: none !important; }
#resultat tbody td { height: 100% !important; text-align: left !important; white-space: normal !important; }
#resultat .pt-ecarte { display: flex !important; width: 100%; margin: 0 !important; text-align: left; }
#resultat tbody td.dataTables_empty { grid-column: 1 / -1; text-align: center; color: var(--pt-muted) !important; padding: 2rem 0 !important; }
.pt-ecarte {
    display: flex; flex-direction: column; gap: 5px; height: 100%;
    padding: 16px 18px;
    border-radius: var(--pt-radius);
    border: 1px solid var(--pt-border);
    background: var(--pt-surface);
    color: var(--pt-text) !important;
    text-decoration: none;
    transition: border-color .15s, box-shadow .15s, transform .15s;
}
.pt-ecarte:hover { border-color: var(--pt-primary); box-shadow: var(--pt-shadow); transform: translateY(-2px); }
.pt-ecarte-haut { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 4px; }
.pt-ecarte-niveau { font-size: .78rem; font-weight: 600; padding: .15rem .65rem; border-radius: 999px; color: #fff; white-space: nowrap; }
.pt-ecarte-corrige { display: inline-flex; align-items: center; gap: 2px; font-size: .78rem; font-weight: 600; padding: .15rem .6rem; border-radius: 999px; background: var(--pt-success-soft); color: var(--pt-success); }
.pt-ecarte-titre { font-weight: 600; font-size: 1.05rem; }
.pt-ecarte-meta { color: var(--pt-muted); font-size: .9rem; }
.pt-ecarte-lecons {
    font-size: .74rem; line-height: 1.45; color: var(--pt-muted);
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.pt-ecarte-etab { display: flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 8px; border-top: 1px dashed var(--pt-border); color: var(--pt-muted); font-size: .88rem; }
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    border: 1px solid var(--pt-border);
    border-radius: 8px;
    padding: .35rem .6rem;
    background: var(--pt-surface);
    color: var(--pt-text);
}
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_paginate { color: var(--pt-muted) !important; }

/* Bouton d'ouverture des filtres : seulement sur mobile */
.pt-toggle-filtres { display: none; }

@media (max-width: 900px) {
    .pt-page { padding-top: 90px; }
    .pt-epreuves { grid-template-columns: 1fr; gap: 14px; }
    .pt-toggle-filtres { display: inline-flex; width: 100%; }
    .pt-filtres { position: static; display: none; }
    .pt-filtres.is-open { display: block; }
    .pt-page-head h1 { font-size: 1.5rem; }
    .dataTables_wrapper .dataTables_filter label { display: flex; flex-direction: column; align-items: stretch; gap: .3rem; width: 100%; }
    #resultat tbody { grid-template-columns: minmax(0, 1fr); }
    .dataTables_wrapper .dataTables_filter { text-align: left !important; }
    .dataTables_wrapper .dataTables_filter input { width: 100%; margin-left: 0 !important; }
}

/* ---------- Lecture d'une épreuve ---------- */
.pt-lecture { max-width: 1100px; }
.pt-back {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    color: var(--pt-primary);
    text-decoration: none;
    font-weight: 600;
    margin: .25rem 0 .75rem;
}
.pt-back:hover { text-decoration: underline; }
.pt-lecture-bar {
    position: sticky;
    top: 70px;
    z-index: 50;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1rem;
    padding: 14px 18px;
    margin-bottom: 16px;
}
.pt-lecture-titre { flex: 1 1 320px; min-width: 0; }
.pt-lecture-titre h1 { font-size: 1.25rem; font-weight: 600; margin: 0 0 .25rem; color: var(--pt-text); }
.pt-meta { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; padding: 0; list-style: none; }
.pt-meta li {
    background: var(--pt-surface-2);
    border: 1px solid var(--pt-border);
    border-radius: 999px;
    padding: .1rem .6rem;
    font-size: .85rem;
    color: var(--pt-muted);
}
.pt-badge-traitee {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    background: var(--pt-success-soft);
    color: var(--pt-success);
    border-radius: 999px;
    padding: .3rem .8rem;
    font-weight: 600;
    font-size: .9rem;
}
.pt-lecture-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.pt-invite {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem 1.25rem;
    background: var(--pt-warning-soft);
    border-radius: var(--pt-radius-sm);
    padding: .7rem 1rem;
    margin-bottom: 14px;
    color: var(--pt-text);
}
.pt-invite .pt-btn { margin-left: auto; }
.pt-invite .bx { color: var(--pt-muted); vertical-align: -2px; }
.pt-sans-corrige { color: var(--pt-muted); font-size: .9rem; }
#pdfjsViewer.pt-card { background: var(--pt-surface-2); padding: 10px; overflow: auto; }
#pdfPages canvas { display: block; max-width: 100%; height: auto !important; margin: 0 auto 10px; box-shadow: var(--pt-shadow); border-radius: 4px; }
.pt-vide { max-width: 560px; margin: 40px auto; padding: 32px 28px; text-align: center; color: var(--pt-text); }
.pt-vide h1 { font-size: 1.4rem; font-weight: 600; }
.pt-vide p { color: var(--pt-muted); }
.pt-vide .pt-btn { margin: .5rem .5rem 0; }

@media (max-width: 700px) {
    .pt-lecture-bar { top: 60px; padding: 12px; gap: .6rem; }
    .pt-lecture-titre h1 { font-size: 1.05rem; }
    .pt-lecture-actions { width: 100%; }
    .pt-lecture-actions .pt-btn { flex: 1 1 auto; }
    #pdfjsViewer { height: auto !important; max-height: none !important; padding: 0 !important; }
}

/* ---------- Connexion ---------- */
.pt-auth {
    min-height: calc(100vh - 70px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 100px 16px 40px;
}
.pt-auth-card {
    width: 100%;
    max-width: 420px;
    padding: 28px 26px;
    color: var(--pt-text);
}
.pt-auth-card h1 { font-size: 1.5rem; font-weight: 600; margin: 0 0 .3rem; }
.pt-auth-card .pt-sous-titre { color: var(--pt-muted); margin: 0 0 1.25rem; }
.pt-field { margin-bottom: 1rem; }
.pt-field label { display: block; font-weight: 600; font-size: .92rem; margin-bottom: .35rem; color: var(--pt-text); }
.pt-field input {
    width: 100%;
    padding: .75rem .9rem;
    border: 1px solid var(--pt-border);
    border-radius: var(--pt-radius-sm);
    background: var(--pt-surface);
    color: var(--pt-text);
    font-size: 1rem;
}
.pt-field input, .pt-field select, .pt-field button { font-family: inherit; }
.pt-field input:focus { border-color: var(--pt-primary); box-shadow: var(--pt-focus); outline: none; }
.pt-pwd { position: relative; }
.pt-pwd input { padding-right: 3rem; }
.pt-pwd-toggle {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: var(--pt-muted);
    font-size: 1.35rem;
    padding: .3rem .45rem;
    cursor: pointer;
    border-radius: 8px;
}
.pt-pwd-toggle:hover { color: var(--pt-text); }
.pt-auth-card .pt-btn { width: 100%; margin-top: .25rem; }
.pt-auth-liens { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin-top: 1.1rem; font-size: .93rem; }
.pt-auth-liens a { color: var(--pt-primary); text-decoration: none; font-weight: 500; }
.pt-auth-liens a:hover { text-decoration: underline; }
.pt-alert {
    border-radius: var(--pt-radius-sm);
    padding: .7rem .9rem;
    margin-bottom: 1rem;
    font-size: .95rem;
}
.pt-alert--erreur { background: #FDECEC; color: #9B1C1C; border: 1px solid #F6C9C9; }
body.dark .pt-alert--erreur { background: #3A1F1F; color: #F5B5B5; border-color: #5A2C2C; }

/* L'image de fond de la connexion était étirée (100% 100%) : on la cadre sans déformation */
body.pt-auth-page {
    background-color: var(--pt-bg);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}
body.pt-auth-page .pt-auth-card { box-shadow: 0 12px 40px rgba(16, 24, 40, .18); }

/* Accueil sur mobile : les 3 atouts deviennent une liste compacte (image + texte) */
@media (max-width: 790px) {
    .content main .insights { gap: 14px; margin-top: 24px; padding: 0; }
    .content main .insights > ul { display: flex; align-items: center; gap: 14px; padding: 0; }
    .content main .insights > ul > br { display: none; }
    .content main .insights .img-border-radius { width: 72px; height: 72px; margin: 0; flex: none; object-fit: cover; }
    .content main .insights .smallText { text-align: left; font-size: .92rem; }
    .content main .insights .smallText strong { display: block; }
    .content main .reminders .lead { font-size: 1rem; }
    .content main .reminders h1 { font-size: 1.5rem; }
    .content main .header .left h1 { font-size: 1.7rem; }
    .content main .bottom-data .header,
    .content main .bottom-data .orders table { min-width: 0 !important; }
    .content main .bottom-data .header h3 { font-size: 1.25rem; }
}

/* Mode sombre : fond de page et contraste des boutons pleins */
body.dark { background-color: var(--pt-bg); }
body.dark .pt-page, body.dark .pt-page-head h1 { color: var(--pt-text); }
body.dark .pt-btn:not(.pt-btn--ghost),
body.dark #resultat .btnCons { color: #0B1B33 !important; }
body.dark .pt-ecarte-niveau { color: #fff !important; }
body.dark .pt-filtre .pt-nb { color: #0B1B33; }

/* =====================================================================
   Espace élève : tableau de bord et profil
   (ces pages n'utilisent plus espace.css ni la barre latérale)
   ===================================================================== */
body.pt-espace-page {
    margin: 0;
    font-family: 'Poppins', sans-serif;
    background: var(--pt-bg);
    color: var(--pt-text);
}
body.pt-espace-page *, body.pt-espace-page *::before, body.pt-espace-page *::after { box-sizing: border-box; }
.pt-espace p { margin: 0; }
.pt-espace h1, .pt-espace h2 { margin: 0; color: var(--pt-text); }

.pt-espace-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}
.pt-espace-head h1 { font-size: 1.9rem; font-weight: 600; }
.pt-espace-head p { color: var(--pt-muted); margin-top: .2rem; }
.pt-espace-head p a { color: var(--pt-primary); }
.pt-onglets {
    display: flex;
    gap: .25rem;
    background: var(--pt-surface);
    border: 1px solid var(--pt-border);
    border-radius: 999px;
    padding: .25rem;
}
.pt-onglets a {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .5rem 1rem;
    border-radius: 999px;
    color: var(--pt-muted);
    text-decoration: none;
    font-weight: 500;
    font-size: .95rem;
}
.pt-onglets a:hover { color: var(--pt-text); background: var(--pt-surface-2); }
.pt-onglets a.active { background: var(--pt-primary); color: #fff; }
body.dark .pt-onglets a.active { color: #0B1B33; }
.pt-onglets .bx { font-size: 1.15rem; }

/* Chiffres clés */
.pt-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.pt-kpi { padding: 18px; display: flex; flex-direction: column; gap: .35rem; }
.pt-kpi-titre { color: var(--pt-muted); font-weight: 500; font-size: .92rem; display: flex; align-items: center; gap: .4rem; }
.pt-kpi-titre .bx { font-size: 1.2rem; color: var(--pt-primary); }
.pt-kpi-valeur { font-size: 2rem; font-weight: 700; line-height: 1.1; }
.pt-kpi-detail { color: var(--pt-muted); font-size: .85rem; margin-top: auto !important; }
.pt-tendance { font-weight: 600; margin-left: .25rem; }
.pt-tendance.up { color: var(--pt-success); }
.pt-tendance.down { color: var(--pt-danger); }
.pt-progress { height: 8px; border-radius: 999px; background: var(--pt-surface-2); border: 1px solid var(--pt-border); overflow: hidden; }
.pt-progress span { display: block; height: 100%; background: var(--pt-primary); border-radius: 999px; }

/* Suggestion */
.pt-suggestion {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 16px 18px;
    margin-bottom: 16px;
    background: var(--pt-primary-soft);
    border-color: transparent;
}
.pt-suggestion > .bx { font-size: 1.8rem; color: var(--pt-primary); flex: none; }
.pt-suggestion p { flex: 1; }
.pt-suggestion .pt-btn { flex: none; }

/* Listes */
.pt-espace-grille { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px; }
.pt-bloc { padding: 18px; }
.pt-bloc h2 { font-size: 1.1rem; font-weight: 600; display: flex; align-items: center; gap: .45rem; margin-bottom: .75rem; }
.pt-bloc h2 .bx { color: var(--pt-primary); font-size: 1.3rem; }
.pt-vide-texte { color: var(--pt-muted); margin-bottom: .75rem !important; }
.pt-liste-epreuves, .pt-liste-evenements { list-style: none; margin: 0; padding: 0; }
.pt-liste-epreuves li + li, .pt-liste-evenements li + li { border-top: 1px solid var(--pt-border); }
.pt-liste-epreuves a, .pt-liste-evenements a {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .7rem .4rem;
    color: var(--pt-text);
    text-decoration: none;
    border-radius: 8px;
}
.pt-liste-epreuves a:hover, .pt-liste-evenements a:hover { background: var(--pt-surface-2); }
.pt-liste-epreuves .niveautable {
    flex: none;
    min-width: 58px;
    text-align: center;
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    padding: .25rem .5rem;
    border-radius: 999px;
}
.pt-liste-texte { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.pt-liste-texte span { color: var(--pt-muted); font-size: .88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-liste-epreuves time { color: var(--pt-muted); font-size: .85rem; white-space: nowrap; }
.pt-liste-evenements img { width: 48px; height: 48px; border-radius: 10px; object-fit: cover; flex: none; background: var(--pt-surface-2); }
.pt-liste-evenements .bx { color: var(--pt-muted); font-size: 1.4rem; }

/* Profil */
.pt-profil { padding: 24px; max-width: 860px; }
.pt-profil h2 { font-size: 1.2rem; font-weight: 600; }
.pt-profil .pt-sous-titre { color: var(--pt-muted); margin: .2rem 0 1.25rem; }
.pt-form-grille { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.pt-field select {
    width: 100%;
    padding: .75rem .9rem;
    border: 1px solid var(--pt-border);
    border-radius: var(--pt-radius-sm);
    background: var(--pt-surface);
    color: var(--pt-text);
    font: inherit;
}
.pt-field input:disabled { background: var(--pt-surface-2); color: var(--pt-muted); cursor: not-allowed; }
.pt-field small { display: block; color: var(--pt-muted); font-size: .82rem; margin-top: .3rem; }
.pt-form-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: .5rem; }
.pt-alert--succes { background: var(--pt-success-soft); color: var(--pt-success); border: 1px solid transparent; display: flex; align-items: center; gap: .4rem; }

@media (max-width: 1000px) {
    .pt-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pt-espace-grille { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
    .pt-espace-head h1 { font-size: 1.5rem; }
    .pt-onglets { width: 100%; }
    .pt-onglets a { flex: 1; justify-content: center; padding: .5rem .5rem; font-size: .88rem; white-space: nowrap; }
    .pt-liste-epreuves a { flex-wrap: wrap; }
    .pt-liste-epreuves time { width: 100%; padding-left: calc(58px + .8rem); margin-top: -.35rem; }
    .pt-kpis { gap: 10px; }
    .pt-kpi { padding: 14px; }
    .pt-kpi-valeur { font-size: 1.6rem; }
    .pt-suggestion { flex-wrap: wrap; }
    .pt-suggestion .pt-btn { width: 100%; }
    .pt-form-grille { grid-template-columns: 1fr; }
    .pt-profil { padding: 18px; }
    .pt-form-actions .pt-btn { width: 100%; }
}
/* Variables attendues par footer.css et nav.css sur les pages de l'espace élève */
body.pt-espace-page { --nav-color: #0950BF; --side-nav: #010718; --text-color: #FFF; }
body.pt-espace-page.dark { --nav-color: #242526; --side-nav: #242526; --text-color: #CCC; }