/* Extrait de teacher-dashboard.html. Ordre historique : 20. */
#snt-teacher-body table.sntt{width:100%;border-collapse:collapse;font-size:.92rem}
#snt-teacher-body table.sntt th,#snt-teacher-body table.sntt td{padding:9px 10px;border-bottom:1px solid #eef0f7;text-align:left}
#snt-teacher-body table.sntt th{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:#64748b}
#snt-teacher-body tr.sntgrp td{background:#eef0fb;font-weight:700;color:#3b3f63;border-top:2px solid #d9dcf0;font-size:.9rem}
#snt-teacher-body tr.sntgrp .gstat{font-weight:500;color:#5b628a;font-size:.82rem;margin-left:10px}
#snt-teacher-body .sntbar{height:8px;background:#eef0f7;border-radius:999px;overflow:hidden;width:110px;display:inline-block;vertical-align:middle}
#snt-teacher-body .sntbar>span{display:block;height:100%;background:linear-gradient(90deg,#5b54e8,#c026d3)}
#snt-teacher-body .sntbtn{background:#5b54e8;color:#fff;border:none;padding:6px 12px;border-radius:8px;cursor:pointer;font-weight:600}
#snt-teacher-body .sntoff{color:#94a3b8;font-size:.85rem}
#sntModal{position:fixed;inset:0;background:rgba(15,17,32,.55);display:none;align-items:center;justify-content:center;z-index:99999;padding:20px}
#sntModal .box{background:#fff;border-radius:16px;max-width:680px;width:100%;max-height:85vh;overflow:auto;padding:22px}
#sntModal h3{margin:.2em 0}
#sntModal .ans{background:#f7f8fc;border-left:3px solid #5b54e8;border-radius:8px;padding:8px 11px;margin:6px 0;font-size:.9rem;white-space:pre-wrap}
#sntModal .cls{float:right;cursor:pointer;font-size:1.5rem;color:#64748b;border:none;background:none;line-height:1}
#sntModal .box, #sntModal .box *{color:#1e293b}
#sntModal .box .cls{color:#475569;font-size:1.6rem}
#sntModal .box h3{color:#0f172a}
#sntModal .box .ansl{display:block;font-weight:700;color:#5b54e8;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:3px}

    /* ══════════════════════════════════════════════════════════════════
       Onglet Professeur principal

       ⚠️ Aucune couleur figée ici : le dashboard applique des thèmes
       sombres comme clairs. Des valeurs en dur (noir sur blanc) rendaient
       les titres illisibles sur fond sombre. On s'appuie donc sur les
       variables de thème, avec un repli neutre.
       ══════════════════════════════════════════════════════════════════ */
    /* ⚠️ Une règle GLOBALE impose « .tab-content p, li, span { color:#2d3748
       !important } » — gris foncé — à tout contenu d'onglet. Nos cartes étant
       sombres, le texte devenait invisible. On la neutralise ICI seulement,
       avec une spécificité supérieure (html body + id) et !important. */
    html body #content-pp,
    html body #content-pp h1, html body #content-pp h2, html body #content-pp h3,
    html body #content-pp h4, html body #content-pp p,  html body #content-pp li,
    html body #content-pp span, html body #content-pp strong,
    html body #content-pp label, html body #content-pp div,
    html body #content-pp small, html body #content-pp b {
      color: var(--text-primary, #e2e8f0) !important;
    }
    /* Les nuances de gris restent lisibles : on les exprime en opacité,
       jamais en couleur figée. */
    html body #content-pp [style*="opacity"] { color: var(--text-primary, #e2e8f0) !important; }
    /* Exceptions : éléments dont la couleur est volontaire */
    html body #content-pp .ppa-chip.actif,
    html body #content-pp .pp-btn,
    html body #content-pp .chat-badge,
    html body #content-pp button[style*="background:#6366f1"],
    html body #content-pp button[style*="linear-gradient"],
    html body #content-pp span[style*="border-radius:999px"] {
      color: #ffffff !important;
    }
    #content-pp .card {
      background: var(--bg-card, rgba(255,255,255,.06));
      border: 1px solid var(--border, rgba(255,255,255,.14));
      border-radius: 14px; padding: 18px;
    }
    .pp-ctl {
      padding: 9px 12px; border-radius: 10px; font: inherit; font-size: 13.5px;
      min-height: 40px;
      color: var(--text-primary, #e2e8f0);
      background: var(--bg-card, rgba(255,255,255,.08));
      border: 1px solid var(--border, rgba(255,255,255,.18));
    }
    /* ══════════════════════════════════════════════════════════════════
       Sous-navigation Professeur principal (FIX-18) — remplace l'empilement
       de 6 blocs par une seule section affichée à la fois.
       ══════════════════════════════════════════════════════════════════ */
    .pp-nav {
      display: flex; gap: 8px; flex-wrap: wrap;
      padding-bottom: 14px; margin-bottom: 16px;
      border-bottom: 1px solid var(--border, rgba(255,255,255,.14));
    }
    .pp-navpill {
      padding: 9px 16px; border-radius: 10px; cursor: pointer;
      font: inherit; font-size: 13.5px; font-weight: 600;
      color: var(--text-primary, #e2e8f0);
      background: var(--bg-card, rgba(255,255,255,.06));
      border: 1px solid var(--border, rgba(255,255,255,.14));
      transition: background .15s, border-color .15s;
    }
    .pp-navpill:hover { border-color: var(--border-strong, rgba(255,255,255,.3)); }
    .pp-navpill.active {
      background: #6366f1; border-color: #6366f1; color: #ffffff !important;
    }
    .pp-panel { animation: ppPanelIn .15s ease; }
    @keyframes ppPanelIn { from { opacity: 0; } to { opacity: 1; } }
    /* La liste déroulante native est dessinée par le système : ses options
       doivent recevoir des couleurs explicites, sinon texte blanc sur blanc. */
    select.pp-ctl { color-scheme: dark; }
    select.pp-ctl option {
      background-color: var(--bg-card, #1e1b2e);
      color: var(--text-primary, #ffffff);
    }
    #content-pp textarea {
      color: var(--text-primary, #e2e8f0) !important;
      background: var(--bg-card, rgba(255,255,255,.08)) !important;
      border: 1px solid var(--border, rgba(255,255,255,.18)) !important;
    }
    #content-pp textarea::placeholder,
    #content-pp input::placeholder { color: var(--text-secondary, #94a3b8); opacity: .8; }
    .pp-btn {
      padding: 9px 16px; min-height: 40px; border: 0; border-radius: 10px; cursor: pointer;
      font: inherit; font-size: 13.5px; font-weight: 700; color: #fff;
      background: linear-gradient(135deg, #6366f1, #8b5cf6);
    }
    .pp-btn:hover { filter: brightness(1.06); }
    /* Filtres du planificateur annuel */
    .ppa-chip {
      padding: 6px 14px; border-radius: 999px; cursor: pointer; min-height: 34px;
      font: inherit; font-size: 12.5px; font-weight: 600;
      color: var(--text-primary, #e2e8f0);
      background: transparent;
      border: 1px solid var(--border, rgba(255,255,255,.20));
    }
    .ppa-chip:hover { background: rgba(255,255,255,.08); }
    #content-pp details summary::-webkit-details-marker { display: none; }
    #content-pp details summary::marker { content: ''; }
    #content-pp details summary:hover { background: rgba(255,255,255,.05); }
    #content-pp details[open] summary { border-bottom: 1px solid var(--border, rgba(255,255,255,.12)); }
    .ppa-chip.actif {
      background: #6366f1; border-color: #6366f1; color: #fff; font-weight: 700;
    }
    #pp-liste button:hover { background: rgba(99,102,241,.07) !important; }
    @media (max-width: 860px) {
      #content-pp > div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
    }