/*
Theme Name: DevenirTaxiVTC
Theme URI: https://app.devenirtaxivtc.fr
Description: Thème enfant de Twenty Twenty-Five pour la plateforme du Manuel (examen T3P, taxi et VTC). Reprend la charte de devenirtaxivtc.fr : nuit, ambre, Archivo et Inter.
Author: Walid Joudi Guerraa
Author URI: https://devenirtaxivtc.fr
Template: twentytwentyfive
Version: 1.0.0
Text Domain: devenirtaxivtc
*/

/* ===================================================================
   DEVENIRTAXIVTC — PLATEFORME DU MANUEL
   Créé le 13 septembre 2026 sur le modèle du thème enfant de
   app.deveniragentfoot.fr, dont il reprend la structure et TOUTES les
   corrections éprouvées en production (contrastes RGAA, modes sombres
   forcés, palette de Tutor). Seule la charte change : celle du site
   devenirtaxivtc.fr, pour que l'élève ne change pas de monde en passant
   du site à la plateforme.

   Contrastes mesurés (WCAG 2.x) le 13 septembre 2026 :
     texte #241800 sur ambre #FFB020 ........ 9,52:1
     ambre foncé #966000 sur blanc .......... 5,29:1 (4,98 sur papier)
     blanc sur #966000 (boutons Tutor) ...... 5,29:1
     gris #6B7280 sur blanc ................. 4,83:1 (4,55 sur papier)
     gris #B9C0CC sur nuit #0B0D12 .......... 10,62:1
   L'ambre vif #FFB020 ne sert JAMAIS de texte sur fond clair.
   =================================================================== */

/* -------------------------------------------------------------------
   0. POLICES — hébergées dans le thème, aucune requête vers Google.
   Mêmes fichiers que devenirtaxivtc.fr (SIL Open Font License 1.1).
   ------------------------------------------------------------------- */
/* Dédoublonnage du 4 octobre 2026 (expertise du 04/10) : Archivo et Inter sont
   des polices VARIABLES, les fichiers 400 à 800 sont identiques octet pour
   octet. Neuf déclarations faisaient télécharger le même fichier jusqu'à quatre
   fois ; trois suffisent, avec la plage de graisses. Rendu identique. */
@font-face { font-family: 'Archivo'; font-style: normal; font-weight: 400 800; font-display: swap; src: url('fonts/archivo-400.woff2') format('woff2'); }
@font-face { font-family: 'Archivo Black'; font-style: normal; font-weight: 400; font-display: swap; src: url('fonts/archivo-black-400.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('fonts/inter-400.woff2') format('woff2'); }

/* -------------------------------------------------------------------
   1. VARIABLES — mêmes noms et valeurs que devenirtaxivtc.fr
   ------------------------------------------------------------------- */
:root {
    color-scheme: only light;
    --nuit: #0B0D12;
    --nuit-2: #141821;
    --bord: #252C3A;
    --ambre: #FFB020;
    --ambre-survol: #FFC24D;
    --ambre-f: #966000;
    --ambre-ff: #7A4E00;
    --ambre-pale: #FFF6E6;
    --sur-ambre: #241800;
    --cyan: #3FC8E4;
    --rouge: #D34247;
    --rouge-pale: #FEF1F1;
    --papier: #F7F8FA;
    --blanc: #FFFFFF;
    --encre: #12151C;
    --encre-2: #333B48;
    --gris: #6B7280;
    --gris-nuit: #B9C0CC;
    --filet: #DEE2E8;
    --filet-p: #EAEDF1;
    --display: 'Archivo Black', 'Arial Black', sans-serif;
    --titre: 'Archivo', system-ui, sans-serif;
    --corps: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}

/* -------------------------------------------------------------------
   2. TYPOGRAPHIE
   ------------------------------------------------------------------- */
body {
    background-color: var(--papier);
    color: var(--encre);
    font-family: var(--corps);
}

h1, h2, h3, h4, h5, h6,
.wp-block-heading,
.tutor-course-name,
.tutor-course-title,
.tutor-lesson-title,
.tutor-segment-title,
.tutor-course-details-title,
.tutor-course-content-title,
.tutor-dashboard-title,
.tutor-accordion-item-header {
    font-family: var(--titre);
    color: var(--encre);
    font-weight: 800;
    letter-spacing: -0.01em;
    line-height: 1.2;
}

h1, h1.wp-block-heading { font-size: 2.2rem; margin-bottom: 0.6em; }
h2, h2.wp-block-heading { font-size: 1.6rem; margin-top: 1.6em; margin-bottom: 0.5em; }
h3, h3.wp-block-heading { font-size: 1.25rem; font-weight: 700; margin-top: 1.3em; margin-bottom: 0.4em; }
h4, h5, h6 { font-weight: 700; }

h1.tutor-color-black, h2.tutor-color-black, h3.tutor-color-black, h4.tutor-color-black {
    color: var(--encre);
    font-family: var(--titre);
}

.tutor-course-content-list-item-title { font-family: var(--titre); font-weight: 600; }

p, li,
.tutor-course-content p,
.tutor-lesson-content p {
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--encre);
}

strong, b { color: var(--encre); font-weight: 700; }

.wp-element-caption, figcaption { color: var(--gris); font-size: 0.9rem; }

.tutor-lesson-content, .tutor-course-content { background-color: var(--blanc); }

/* -------------------------------------------------------------------
   3. ENCADRÉS, CITATIONS, TABLEAUX, LIENS, FILETS
   ------------------------------------------------------------------- */
blockquote, .wp-block-quote {
    background-color: var(--ambre-pale);
    border-left: 4px solid var(--ambre);
    margin: 1.6em 0;
    padding: 1.1em 1.4em;
    border-radius: 0 2px 2px 0;
    font-style: normal;
}
blockquote p:first-child, .wp-block-quote p:first-child { margin-top: 0; }
blockquote p:last-child, .wp-block-quote p:last-child { margin-bottom: 0; }

table, .wp-block-table table {
    border-collapse: collapse;
    width: 100%;
    margin: 1.6em 0;
    font-size: 0.98rem;
    background-color: var(--blanc);
}
/* Les tableaux des leçons débordaient à 375 px : ils défilent dans leur
   propre cadre, la page ne défile jamais horizontalement. */
.tutor-lesson-content table, .tutor-course-content table {
    display: block;
    overflow-x: auto;
    max-width: 100%;
}
table thead th, .wp-block-table thead th {
    background-color: var(--nuit);
    color: var(--blanc);
    font-family: var(--titre);
    font-weight: 700;
    text-align: left;
    padding: 0.75em 1em;
    border: 1px solid var(--nuit);
}
table td, table tbody th, .wp-block-table td, .wp-block-table tbody th {
    padding: 0.7em 1em;
    border: 1px solid var(--filet);
    vertical-align: top;
}
table tbody tr:nth-child(even), .wp-block-table tbody tr:nth-child(even) { background-color: var(--papier); }

.tutor-lesson-content a, .tutor-course-content a, .entry-content a, article a {
    color: var(--ambre-f);
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}
.tutor-lesson-content a:hover, .tutor-course-content a:hover, .entry-content a:hover, article a:hover {
    color: var(--ambre-ff);
    text-decoration-thickness: 2px;
}
a:focus-visible, button:focus-visible, input:focus-visible {
    outline: 3px solid var(--cyan);
    outline-offset: 2px;
}

hr, .wp-block-separator {
    border: none;
    border-top: 1px solid var(--filet);
    margin: 2em 0;
    max-width: 100%;
}

/* -------------------------------------------------------------------
   4. EN-TÊTE — gabarit parts/header.html
   ------------------------------------------------------------------- */
header.wp-block-template-part { background: var(--nuit); border-bottom: 1px solid var(--bord); }
.dtv-entete {
    max-width: 1320px;
    margin: 0 auto;
    padding: 14px 24px;
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}
.dtv-logo {
    font-family: var(--display);
    font-size: 1.15rem;
    color: #fff !important;
    letter-spacing: -0.02em;
    text-decoration: none !important;
}
.dtv-logo em { font-style: normal; color: var(--ambre); }
.dtv-etiquette {
    font-family: var(--titre);
    font-weight: 700;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gris-nuit);
    border-left: 1px solid var(--bord);
    padding-left: 18px;
    margin-right: auto;
}
.dtv-entete-liens { display: flex; gap: 12px; align-items: center; }

/* -------------------------------------------------------------------
   5. BOUTONS — ceux du site (.btn-1 / .btn-2), et ceux de Tutor
   ------------------------------------------------------------------- */
.dtv-btn {
    /* border-box : sans lui, min-height s'ajoutait aux marges intérieures
       (44 + 22 + 4 = 70 px, mesuré le 13/09/2026). */
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--titre);
    font-weight: 700;
    font-size: 0.95rem;
    padding: 11px 20px;
    border-radius: 2px;
    text-decoration: none !important;
    border: 2px solid transparent;
    transition: background-color .12s ease;
    white-space: nowrap;
    line-height: 1.3;
}
.dtv-btn-1 { background: var(--ambre); color: var(--sur-ambre) !important; }
.dtv-btn-1:hover { background: var(--ambre-survol); }
.dtv-btn-2 { border-color: var(--ambre-f); color: var(--ambre-f) !important; background: transparent; }
.dtv-btn-2:hover { background: var(--ambre-pale); }
header .dtv-btn-2 { border-color: var(--bord); color: #fff !important; }
header .dtv-btn-2:hover { background: var(--nuit-2); }

/* Bouton selon l'état de connexion (même principe que DAF, bloc 17) */
.dtv-btn-connecte { display: none; }
body.logged-in .dtv-btn-anonyme { display: none; }
body.logged-in .dtv-btn-connecte { display: inline-flex; }

.tutor-btn-primary,
.tutor-course-entry-box .tutor-btn,
.tutor-enroll-course-button,
.tutor-add-to-cart-button,
.tutor-native-add-to-cart,
button.tutor-btn-primary,
a.tutor-btn-primary {
    background-color: var(--ambre) !important;
    border-color: var(--ambre) !important;
    color: var(--sur-ambre) !important;
    font-family: var(--titre) !important;
    font-weight: 700 !important;
    border-radius: 2px !important;
    transition: background-color .12s ease;
}
/* La règle des liens de contenu (section 3) soulignait aussi les boutons
   Tutor — vu sur « Poursuivre la navigation » du panier, le 13/09/2026. */
.tutor-btn, a.tutor-btn, .dtv-btn { text-decoration: none !important; }
.tutor-btn-primary:hover,
.tutor-course-entry-box .tutor-btn:hover,
.tutor-enroll-course-button:hover,
.tutor-add-to-cart-button:hover,
.tutor-native-add-to-cart:hover,
button.tutor-btn-primary:hover,
a.tutor-btn-primary:hover {
    background-color: var(--ambre-survol) !important;
    border-color: var(--ambre-survol) !important;
    color: var(--sur-ambre) !important;
}
.tutor-btn-outline-primary, a.tutor-btn-outline-primary, button.tutor-btn-outline-primary {
    border-color: var(--ambre-f) !important;
    color: var(--ambre-f) !important;
    background-color: transparent !important;
    font-weight: 700 !important;
    border-radius: 2px !important;
}
.tutor-btn-outline-primary:hover, a.tutor-btn-outline-primary:hover, button.tutor-btn-outline-primary:hover {
    background-color: var(--ambre-pale) !important;
    color: var(--ambre-ff) !important;
}

/* -------------------------------------------------------------------
   6. PAGES COURS — cartes, prix, badges, onglets, progression
   ------------------------------------------------------------------- */
.tutor-card.tutor-course-card,
.tutor-single-course-sidebar .tutor-card {
    background-color: var(--blanc);
    border: 1px solid var(--filet);
    border-radius: 4px;
    overflow: hidden;
}
.tutor-card.tutor-course-card { transition: border-color .15s ease, box-shadow .15s ease; }
.tutor-card.tutor-course-card:hover { border-color: var(--ambre); box-shadow: 0 4px 16px rgba(11, 13, 18, 0.08); }

.tutor-course-price, .tutor-course-price span, .list-item-price, .tutor-card-footer .price {
    color: var(--encre) !important;
    font-family: var(--titre);
    font-weight: 800;
}
.tutor-badge-label, .tutor-course-level, .tutor-course-card .tutor-meta-value {
    background-color: var(--ambre-pale);
    color: var(--ambre-ff);
    border-radius: 2px;
}
.tutor-course-details-tab .tutor-nav-item a, .tutor-nav .tutor-nav-link {
    color: var(--gris);
    font-family: var(--titre);
    font-weight: 700;
}
.tutor-course-details-tab .tutor-nav-item a.is-active,
.tutor-nav .tutor-nav-link.is-active,
.tutor-course-details-tab .tutor-nav-item a.active,
.tutor-nav .tutor-nav-link.active {
    color: var(--encre) !important;
    border-bottom: 3px solid var(--ambre) !important;
}
.tutor-progress-bar .tutor-progress-value, .tutor-progress-filled { background-color: var(--ambre) !important; }
.tutor-icon-star-bold, .tutor-ratings-stars i { color: var(--ambre) !important; }
.tutor-single-course-sidebar .tutor-card .tutor-color-black { color: var(--encre); }

/* -------------------------------------------------------------------
   7. TABLEAU DE BORD ÉLÈVE
   ------------------------------------------------------------------- */
.tutor-dashboard-permalinks .tutor-dashboard-menu-item-link {
    color: var(--encre);
    font-family: var(--corps);
    transition: color .15s ease, background-color .15s ease;
}
.tutor-dashboard-permalinks .tutor-dashboard-menu-item:not(.active) .tutor-dashboard-menu-item-link:hover { color: var(--ambre-f); }
.tutor-dashboard .tutor-dashboard-left-menu .tutor-dashboard-permalinks li.active a {
    background-color: var(--nuit);
    color: #fff;
    border-radius: 2px;
}
.tutor-dashboard .tutor-dashboard-left-menu .tutor-dashboard-permalinks li.active a i,
.tutor-dashboard .tutor-dashboard-left-menu .tutor-dashboard-permalinks li.active a [class*="tutor-icon-"] { color: var(--ambre) !important; }
.tutor-dashboard-permalinks .tutor-dashboard-menu-item:not(.active) .tutor-dashboard-menu-item-link i,
.tutor-dashboard-permalinks .tutor-dashboard-menu-item:not(.active) .tutor-dashboard-menu-item-link [class*="tutor-icon-"] { color: var(--ambre-f); }
.tutor-dashboard-content .tutor-card, .tutor-course-progress-item.tutor-card {
    background-color: var(--blanc);
    border: 1px solid var(--filet);
    border-radius: 4px;
}
.tutor-dashboard-content .tutor-card i, .tutor-dashboard-content .tutor-card [class*="tutor-icon-"] { color: var(--ambre-f); }
.tutor-frontend-dashboard-header { background-color: var(--ambre-pale); border-radius: 4px; padding: 1.2em 1.4em; }
.tutor-dashboard-header-avatar img, .tutor-dashboard-header-avatar .tutor-avatar { border: 2px solid var(--ambre); }
.tutor-dashboard-header-avatar .tutor-avatar-text { background-color: var(--nuit); color: var(--ambre); }

/* -------------------------------------------------------------------
   8. PORTAIL D'ACCUEIL — l'élève qui arrive sur app.devenirtaxivtc.fr/
   ------------------------------------------------------------------- */
.dtv-portail {
    max-width: 540px;
    margin: 3.5em auto;
    padding: 2.6em 2.2em;
    background: var(--blanc);
    border: 1px solid var(--filet);
    border-top: 4px solid var(--ambre);
    border-radius: 4px;
    text-align: center;
}
.dtv-portail-surtitre {
    font-family: var(--titre);
    font-weight: 700;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ambre-f);
    margin: 0 0 0.6em;
}
.dtv-portail h1, .dtv-portail h2 { font-size: 1.9rem; margin: 0 0 0.4em; }
.dtv-portail-sous-titre { color: var(--encre-2); font-size: 1.05rem; line-height: 1.5; margin: 0 0 1.8em; }
.dtv-portail-cta { margin: 1.8em 0 0.8em; }
.dtv-portail .dtv-btn { font-size: 1.05rem; padding: 14px 28px; }
.dtv-portail-lien-secondaire { margin-top: 0.4em; font-size: 0.95rem; }
.dtv-portail-lien-secondaire a, .dtv-portail-lien, .dtv-portail-mailto { color: var(--ambre-f); }
.dtv-portail-lien, .dtv-portail-mailto { font-weight: 700; }
.dtv-portail-separateur {
    display: flex;
    align-items: center;
    color: var(--gris);
    margin: 2em 0 1.4em;
    font-size: 0.92rem;
}
.dtv-portail-separateur::before, .dtv-portail-separateur::after { content: ''; flex: 1; border-top: 1px solid var(--filet); }
.dtv-portail-separateur span { padding: 0 1em; }
.dtv-portail p { margin: 0.3em 0; }
.dtv-portail-question { color: var(--gris); }
@media (max-width: 600px) {
    .dtv-portail { margin: 1.5em 1em; padding: 1.9em 1.2em; }
    .dtv-portail h1, .dtv-portail h2 { font-size: 1.55rem; }
}
.home .wp-block-post-title, body.home .wp-block-post-title { display: none; }

/* -------------------------------------------------------------------
   9. PIED DE PAGE — gabarit parts/footer.html
   ------------------------------------------------------------------- */
footer.wp-block-template-part { background: var(--nuit); border-top: 1px solid var(--bord); margin-top: 0; }
.dtv-pied {
    max-width: 1120px;
    margin: 0 auto;
    padding: 36px 24px 40px;
    color: #7C8494;
    font-size: 0.9rem;
    line-height: 1.7;
}
.dtv-pied p { color: #7C8494; font-size: 0.9rem; margin: 0 0 0.9em; }
.dtv-pied b { color: var(--gris-nuit); }
.dtv-pied a { color: var(--gris-nuit); text-decoration: none; }
.dtv-pied a:hover { color: #fff; text-decoration: underline; }
.dtv-pied .dtv-logo { font-size: 1rem; display: inline-block; margin-bottom: 0.6em; }
/* Liens espacés et hauts de 44 px au pouce, comme sur devenirtaxivtc.fr */
.dtv-pied-liens { display: flex; flex-wrap: wrap; gap: 0 22px; margin: 0 0 1em; }
.dtv-pied-liens a { display: inline-block; padding: 10px 0; }

/* -------------------------------------------------------------------
   10. PAGE DE CONNEXION /wp-login.php
   ------------------------------------------------------------------- */
body.login, body.login.wp-core-ui { background-color: var(--nuit); color: #fff; font-family: var(--corps); }
body.login #login { width: 360px; padding: 5% 0 2em; }
body.login h1 a {
    background-image: none !important;
    background: none !important;
    width: auto !important;
    height: auto !important;
    text-indent: 0 !important;
    overflow: visible !important;
    display: block;
    font-family: var(--display) !important;
    font-size: 1.5rem !important;
    font-weight: 400 !important;
    color: #fff !important;
    text-align: center;
    text-decoration: none;
    line-height: 1.3 !important;
    margin-bottom: 1.4em;
}
body.login h1 a:hover { color: var(--ambre) !important; }
body.login form {
    background-color: var(--blanc) !important;
    border: 1px solid var(--filet) !important;
    border-top: 4px solid var(--ambre) !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.35) !important;
    padding: 26px 24px 24px !important;
    margin-top: 0 !important;
}
body.login form label { color: var(--encre) !important; font-family: var(--corps) !important; font-weight: 600 !important; }
body.login input[type="text"], body.login input[type="password"], body.login input[type="email"] {
    background-color: var(--papier) !important;
    border: 1px solid var(--filet) !important;
    color: var(--encre) !important;
    border-radius: 2px !important;
    padding: 8px 10px !important;
    font-size: 1rem !important;
    box-shadow: none !important;
}
body.login input[type="text"]:focus, body.login input[type="password"]:focus, body.login input[type="email"]:focus {
    border-color: var(--ambre-f) !important;
    box-shadow: 0 0 0 2px rgba(255, 176, 32, 0.35) !important;
    outline: none !important;
}
body.login .forgetmenot label, body.login p.forgetmenot { color: var(--encre) !important; font-size: 0.9rem !important; }
body.login .button-primary, body.login input#wp-submit, body.login .wp-core-ui .button-primary {
    background-color: var(--ambre) !important;
    border-color: var(--ambre) !important;
    color: var(--sur-ambre) !important;
    text-shadow: none !important;
    box-shadow: none !important;
    font-weight: 700 !important;
    border-radius: 2px !important;
    padding: 0 18px !important;
    height: 38px !important;
    line-height: 36px !important;
    font-size: 1rem !important;
}
body.login .button-primary:hover, body.login input#wp-submit:hover {
    background-color: var(--ambre-survol) !important;
    border-color: var(--ambre-survol) !important;
}
body.login #nav, body.login #backtoblog { text-align: center; margin-top: 1em; padding: 0; }
body.login #nav a, body.login #backtoblog a, body.login .privacy-policy-page-link a {
    color: var(--gris-nuit) !important;
    text-decoration: none !important;
    font-size: 0.95rem !important;
}
body.login #nav a:hover, body.login #backtoblog a:hover, body.login .privacy-policy-page-link a:hover {
    color: #fff !important;
    text-decoration: underline !important;
}
body.login .message, body.login #login_error, body.login .notice {
    background-color: var(--ambre-pale) !important;
    border-left: 4px solid var(--ambre) !important;
    color: var(--encre) !important;
    box-shadow: none !important;
    border-radius: 0 2px 2px 0 !important;
}
body.login #login_error { background-color: var(--rouge-pale) !important; border-left-color: var(--rouge) !important; }
body.login .privacy-policy-page-link { text-align: center; margin-top: 1em; }

/* -------------------------------------------------------------------
   11. ACCESSIBILITÉ — contrastes hérités de Tutor LMS (repris de DAF)
   Tutor plafonne deux gris à 4,16:1 sur blanc, sous les 4,5:1 du RGAA
   (critère 3.2). `html:root` l'emporte quel que soit l'ordre des feuilles.
   ------------------------------------------------------------------- */
html:root {
    --tutor-color-muted: #6b7183;
    --tutor-color-hints: #6b7183;
}
html:root .tutor-item-price del,
html:root .list-item-price del,
html:root .tutor-course-price del { color: #6b7183; }

/* -------------------------------------------------------------------
   12. MODES SOMBRES FORCÉS — repris de DAF, où deux apprenants ont
   signalé du texte illisible les 10 et 11/08/2026 (Chrome Android,
   Samsung Internet, iPhone/Safari). Fond ET texte déclarés sur les
   conteneurs, pour que toute inversion reste cohérente.
   ------------------------------------------------------------------- */
.tutor-lesson-content,
.tutor-course-topic-single-body,
.tutor-lesson-content-tab { background-color: #ffffff; color: var(--encre); }
.tutor-lesson-content p,
.tutor-lesson-content li,
.tutor-lesson-content td,
.tutor-course-topic-single-body p,
.tutor-course-topic-single-body li { color: var(--encre); }
html[data-tutor-theme="dark"],
html[data-tutor-theme="system"] { background-color: var(--papier) !important; }
.tutor-learning-area { background-color: var(--papier) !important; }
.tutor-lesson-content,
.tutor-lesson-content .tutor-lesson-content-tab,
.tutor-lesson-content .tutor-lesson-content-tab .tutor-tabs-content { background-color: #ffffff !important; }

/* -------------------------------------------------------------------
   13. MOBILE
   ------------------------------------------------------------------- */
@media (max-width: 600px) {
    .dtv-entete { padding: 12px 16px; gap: 10px; }
    .dtv-etiquette { display: none; }
    .dtv-logo { margin-right: auto; }
    /* 44 px de haut au minimum : mesuré à 40 px le 13/09/2026, sous le seuil tactile. */
    .dtv-entete .dtv-btn { padding: 11px 14px; font-size: 0.88rem; min-height: 44px; }
    h1, h1.wp-block-heading { font-size: 1.75rem; }
    h2, h2.wp-block-heading { font-size: 1.35rem; }
}

/* -------------------------------------------------------------------
   14. ESPACE ÉLÈVE, PHOTOS ET COULEURS — 7 octobre 2026
   Demande de Walid : « refaire la même chose sur app devenir taxi que
   DAF, EAS et Métiers en uniforme » (accueils refaits les 6 et 7/10).
   L'accueil (page 46) est rendu par le mu-plugin dtv-espace-eleve.php,
   code court [dtv_espace_eleve] ; son style est ici, préfixé dtv-ee-.
   Photos : celles du site, déjà contrôlées (logo, visage, plaque) dans
   devenirtaxivtc/assets/img/CREDITS.md — aucune image nouvelle.
   Une couleur par famille de modules : ambre pour le tronc commun
   taxi et VTC (modules 1 à 5), cyan pour les modules propres au VTC
   (6 et 7). Contrastes mesurés le 7 octobre 2026 :
     cyan foncé #0A6E82 sur papier #F7F8FA .. 5,5:1
     nuit #0B0D12 sur cyan #3FC8E4 .......... 9,8:1
   ------------------------------------------------------------------- */
:root { --dtv-cyan-f: #0A6E82; --dtv-filet-ambre: linear-gradient(90deg, var(--ambre) 0 70%, var(--cyan) 70%); }

/* 14.1 — un filet ambre et cyan sous l'en-tête et sous la barre des leçons */
header.wp-block-template-part { position: relative; border-bottom: 0; }
header.wp-block-template-part::after,
.tutor-learning-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--dtv-filet-ambre); }
.tutor-learning-header { position: relative; }

/* 14.2 — l'accueil, en pleine largeur (la mise en page « contrainte » de
   Twenty Twenty-Five borne le contenu à la largeur de lecture) */
.home main { margin-top: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; }
.home .wp-block-post-content.is-layout-constrained { overflow-x: clip; margin-top: 0 !important; }
.home main > .wp-block-group:has(.dtv-ee) { padding-top: 0 !important; padding-bottom: 0 !important; }
.is-layout-constrained > .dtv-ee, .dtv-ee { width: 100vw !important; max-width: none !important; margin-left: calc(50% - 50vw) !important; margin-right: 0 !important; margin-top: 0 !important; }
.dtv-ee { font-family: var(--corps); color: var(--encre); background: var(--papier); }
.dtv-ee * { box-sizing: border-box; }
.dtv-ee img { display: block; max-width: 100%; }
.dtv-ee-zone { max-width: 1180px; margin: 0 auto; padding: 0 32px; }
.dtv-ee h1, .dtv-ee h2, .dtv-ee h3 { margin: 0; font-family: var(--display); font-weight: 400; letter-spacing: -0.02em; }
.dtv-ee em { font-style: normal; }
.dtv-ee-btn { font-size: 1rem; padding: 15px 26px; }
.dtv-ee-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.dtv-ee-sur { font-family: var(--titre); font-weight: 700; font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ambre-f); margin: 0 0 12px; display: inline-flex; align-items: center; gap: 12px; }
.dtv-ee-sur::before { content: ""; width: 36px; height: 2px; background: currentColor; }
.dtv-ee h2 { font-size: clamp(2rem, 4.2vw, 3.1rem); line-height: 1.05; color: var(--nuit); }
.dtv-ee h2 em { color: var(--ambre-f); }
.dtv-ee-intro { font-size: 1.1rem; line-height: 1.6; color: var(--encre-2); max-width: 40em; margin: 14px 0 0; }

.dtv-ee-heros { position: relative; isolation: isolate; overflow: hidden; background: var(--nuit); color: #fff; min-height: 520px; display: flex; align-items: center; }
.dtv-ee-fond { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; object-position: 50% 50%; z-index: -2; }
.dtv-ee-heros::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(11,13,18,.96) 0%, rgba(11,13,18,.86) 45%, rgba(11,13,18,.4) 100%); }
.dtv-ee-heros::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 10px; background: var(--ambre); }
.dtv-ee-heros .dtv-ee-zone { width: 100%; padding-top: 72px; padding-bottom: 84px; }
.dtv-ee-badge { display: inline-flex; align-items: center; gap: 10px; font-family: var(--titre); font-weight: 700; font-size: .85rem; letter-spacing: .04em; color: #fff; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.22); padding: 6px 14px 6px 12px; }
.dtv-ee-badge i { width: 8px; height: 8px; border-radius: 50%; background: var(--ambre); box-shadow: 0 0 0 4px rgba(255,176,32,.28); }
.dtv-ee-heros h1 { color: #fff; font-size: clamp(2.5rem, 6vw, 4.5rem); line-height: 1.02; margin: 22px 0 18px; max-width: 12em; }
.dtv-ee-heros h1 em { color: var(--ambre); }
.dtv-ee-chapeau { font-size: 1.15rem; line-height: 1.6; color: var(--gris-nuit); max-width: 32em; margin: 0 0 28px; }
.dtv-ee-btn-trait { display: inline-flex; align-items: center; padding: 13px 24px; border: 2px solid rgba(255,255,255,.7); color: #fff !important; font-family: var(--titre); font-weight: 700; text-decoration: none !important; border-radius: 2px; }
.dtv-ee-btn-trait:hover { background: #fff; color: var(--nuit) !important; }
.dtv-ee-credit { position: absolute; right: 16px; bottom: 10px; font-size: 12px; color: rgba(255,255,255,.7); }

.dtv-ee-reprendre { background: #fff; border-bottom: 1px solid var(--filet); }
.dtv-ee-reprendre .dtv-ee-zone { display: flex; align-items: center; gap: 22px; padding-top: 20px; padding-bottom: 20px; flex-wrap: wrap; }
.dtv-ee-lbl { font-family: var(--titre); font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--ambre-f); }
.dtv-ee-reprendre strong { font-family: var(--titre); font-size: 1.05rem; color: var(--nuit); }
.dtv-ee-barre { flex: 1; min-width: 160px; height: 8px; background: var(--filet-p); overflow: hidden; }
.dtv-ee-barre i { display: block; height: 100%; background: var(--ambre); }
.dtv-ee-pct { font-family: var(--display); font-size: 1.1rem; color: var(--nuit); }
.dtv-ee-reprendre a { background: var(--nuit); color: #fff !important; text-decoration: none !important; font-family: var(--titre); font-weight: 700; font-size: .95rem; padding: 12px 20px; border-radius: 2px; }

.dtv-ee-bloc { padding: 84px 0; }
.dtv-ee-blanc { background: #fff; }
.dtv-ee-manuel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); background: #fff; box-shadow: 0 30px 60px -40px rgba(11,13,18,.55); border-top: 6px solid var(--ambre); padding: 0; }
.dtv-ee-manuel-ph { position: relative; min-height: 360px; }
.dtv-ee-manuel-ph img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; }
.dtv-ee-etat { position: absolute; left: 16px; top: 16px; font-family: var(--titre); font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 6px 11px; background: #fff; color: var(--nuit); }
.dtv-ee-etat.dtv-ee-ok { background: var(--ambre); color: var(--sur-ambre); }
.dtv-ee-manuel-corps { padding: 40px 44px 44px; }
.dtv-ee-manuel ul { list-style: none; padding: 0; margin: 24px 0 26px; display: grid; gap: 10px; }
.dtv-ee-manuel li { position: relative; padding-left: 26px; font-size: 1rem; line-height: 1.45; color: var(--encre-2); margin: 0; }
.dtv-ee-manuel li::before { content: ""; position: absolute; left: 0; top: 6px; width: 12px; height: 12px; background: var(--ambre); transform: rotate(45deg); }
.dtv-ee-prix { font-family: var(--display); font-size: 2rem; margin: 0 0 16px; color: var(--nuit); }
.dtv-ee-prix small { font-family: var(--corps); font-size: .9rem; font-weight: 600; color: var(--gris); margin-left: 10px; }

.dtv-ee-legende { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; font-size: .9rem; color: var(--encre-2); margin: 22px 0 0; }
.dtv-ee-pastille { display: inline-block; width: 14px; height: 14px; background: var(--ambre); }
.dtv-ee-pastille-vtc { background: var(--cyan); margin-left: 14px; }
.dtv-ee-modules { list-style: none; padding: 0; margin: 32px 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.dtv-ee-module { --c: var(--ambre); --c-txt: var(--ambre-f); margin: 0; }
.dtv-ee-module.dtv-ee-vtc { --c: var(--cyan); --c-txt: var(--dtv-cyan-f); }
.dtv-ee-module a { display: flex; flex-direction: column; height: 100%; background: var(--papier); border-top: 5px solid var(--c); padding: 20px 20px 22px; text-decoration: none !important; color: var(--encre) !important; transition: background-color .12s ease, transform .12s ease; }
.dtv-ee-module a:hover { background: var(--nuit); color: #fff !important; transform: translateY(-2px); }
.dtv-ee-num { font-family: var(--display); font-size: 2.4rem; line-height: 1; color: var(--nuit); }
.dtv-ee-module a:hover .dtv-ee-num { color: var(--c); }
.dtv-ee-fam { font-family: var(--titre); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--c-txt); margin: 12px 0 6px; }
.dtv-ee-module a:hover .dtv-ee-fam { color: var(--c); }
.dtv-ee-module strong { font-family: var(--titre); font-size: 1.1rem; line-height: 1.25; margin: 0 0 10px; }
.dtv-ee-det { margin-top: auto; font-size: .88rem; color: var(--gris); }
.dtv-ee-module a:hover .dtv-ee-det { color: var(--gris-nuit); }
.dtv-ee-blanc-ex { --c: var(--nuit); --c-txt: var(--ambre-f); }
.dtv-ee-blanc-ex a { background: var(--ambre-pale); }
.dtv-ee-blanc-ex a:hover .dtv-ee-num, .dtv-ee-blanc-ex a:hover .dtv-ee-fam { color: var(--ambre); }

.dtv-ee-methode { background: var(--nuit); color: #fff; position: relative; }
.dtv-ee-methode::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--dtv-filet-ambre); }
.dtv-ee-methode .dtv-ee-sur { color: var(--ambre); }
.dtv-ee-methode h2 { color: #fff; }
.dtv-ee-methode h2 em { color: var(--ambre); }
.dtv-ee-methode .dtv-ee-intro { color: var(--gris-nuit); }
.dtv-ee-etapes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 44px; border-top: 1px solid var(--bord); }
.dtv-ee-etape { padding: 28px 28px 8px 0; border-right: 1px solid var(--bord); margin-right: 28px; }
.dtv-ee-etape:last-child { border-right: 0; margin-right: 0; }
.dtv-ee-n { font-family: var(--display); font-size: 3rem; line-height: 1; color: var(--ambre); }
.dtv-ee-etape h3 { color: #fff; font-family: var(--titre); font-weight: 800; font-size: 1.3rem; margin: 12px 0 8px; }
.dtv-ee-etape p { color: var(--gris-nuit); font-size: 1rem; line-height: 1.55; margin: 0; }
.dtv-ee-etape a { color: var(--ambre) !important; font-weight: 700; }

.dtv-ee-vie { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 40px; }
.dtv-ee-vie figure { margin: 0; position: relative; height: 340px; overflow: hidden; isolation: isolate; display: flex; align-items: flex-end; }
.dtv-ee-vie img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; z-index: -2; }
.dtv-ee-vie figure::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(11,13,18,0) 35%, rgba(11,13,18,.92) 100%); }
.dtv-ee-vie figure::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--ambre); }
.dtv-ee-vie figure:nth-child(2)::after { background: var(--cyan); }
.dtv-ee-vie figcaption { color: #fff; padding: 18px; font-size: 1rem; line-height: 1.35; }
.dtv-ee-vie figcaption b { color: #fff; display: block; font-family: var(--titre); font-size: 1.35rem; line-height: 1.1; }

.dtv-ee-aide { background: var(--nuit); color: #fff; padding: 34px 36px; display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; border-top: 4px solid var(--ambre); margin: 0 0 20px; }
.dtv-ee-aide h3 { color: #fff; font-size: 1.6rem; margin: 0 0 6px; }
.dtv-ee-aide p { margin: 0; color: var(--gris-nuit); }
.dtv-ee-credits { max-width: 1180px; margin: 0 auto; padding: 0 32px 40px; font-size: 12px; color: var(--gris); }

@media (max-width: 960px) {
    .dtv-ee-manuel { grid-template-columns: minmax(0, 1fr); max-width: 620px; }
    .dtv-ee-manuel-ph { min-height: 240px; }
    .dtv-ee-modules { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dtv-ee-vie { grid-template-columns: minmax(0, 1fr); }
    .dtv-ee-vie figure { height: 240px; }
    .dtv-ee-etapes { grid-template-columns: minmax(0, 1fr); }
    .dtv-ee-etape { border-right: 0; margin-right: 0; border-bottom: 1px solid var(--bord); padding-bottom: 22px; }
    .dtv-ee-heros::before { background: linear-gradient(180deg, rgba(11,13,18,.88), rgba(11,13,18,.94)); }
}
@media (max-width: 600px) {
    .dtv-ee-zone, .dtv-ee-credits { padding-left: 16px; padding-right: 16px; }
    .dtv-ee-heros { min-height: 0; }
    .dtv-ee-heros .dtv-ee-zone { padding: 44px 16px 60px 26px; }
    .dtv-ee-btn, .dtv-ee-btn-trait { width: 100%; justify-content: center; min-height: 48px; }
    .dtv-ee-bloc { padding: 56px 0; }
    .dtv-ee-manuel-corps { padding: 28px 22px 30px; }
    .dtv-ee-modules { grid-template-columns: minmax(0, 1fr); }
    .dtv-ee-aide { padding: 28px 22px; }
    .dtv-ee-aide .dtv-btn { white-space: normal; overflow-wrap: anywhere; }
}

/* 14.3 — la page du Manuel : bandeau nuit, filet, carte d'achat ambre */
.single-courses .tutor-course-details-header { position: relative; background: var(--nuit); color: #fff; padding: 34px 32px 30px 42px; border-radius: 2px; overflow: hidden; }
.single-courses .tutor-course-details-header::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 10px; background: var(--ambre); }
.single-courses .tutor-course-details-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--dtv-filet-ambre); }
body.single-courses .tutor-course-details-header .tutor-course-details-title { color: #fff !important; font-family: var(--display) !important; font-weight: 400 !important; font-size: clamp(1.8rem, 3.6vw, 2.7rem) !important; line-height: 1.08; }
.single-courses .tutor-course-details-header a,
.single-courses .tutor-course-details-header span,
.single-courses .tutor-course-details-header div { color: var(--gris-nuit) !important; }
.single-courses .tutor-course-details-header [class*="tutor-icon-"] { color: #fff !important; }
body.single-courses .tutor-course-details-header .tutor-course-details-title span { color: #fff !important; }
.tutor-single-course-sidebar .tutor-card { border-top: 6px solid var(--ambre); box-shadow: 0 30px 60px -40px rgba(11,13,18,.5); }
.single-courses, .single-course-bundle { overflow-x: clip; }

/* 14.4 — l'espace d'apprentissage : progression ambre, leçon en cours marquée */
.tutor-learning-progress [class*="progress-value"],
.tutor-learning-progress [class*="progress-filled"],
.tutor-learning-progress .tutor-progress-value { background: var(--ambre) !important; }
.tutor-learning-nav-item.active { box-shadow: inset 4px 0 0 var(--ambre); background-color: var(--ambre-pale) !important; }

/* 14.5 — le tableau de bord : en-tête nuit et filet, cartes colorées */
.tutor-dashboard-header { position: relative; background: var(--nuit) !important; color: #fff; border-radius: 2px; overflow: hidden; }
.tutor-dashboard-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--dtv-filet-ambre); }
.tutor-dashboard-header *:not(.tutor-btn):not(.tutor-btn *) { color: #fff; }
.tutor-dashboard-header [class*="avatar"] * { color: var(--nuit); }
.tutor-stat-card { border-top: 5px solid var(--ambre) !important; }
.tutor-stat-card:nth-child(3n+2) { border-top-color: var(--cyan) !important; }
.tutor-stat-card:nth-child(3n) { border-top-color: var(--nuit) !important; }