
:root{--blue:#2368df;--blue2:#1b57c4;--ink:#10213f;--muted:#6f7c92;--line:#dce7f4;--green:#21a66a;--violet:#7c4ce5;--orange:#f5a623;--pink:#e64d87;--red:#dc3e46}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Segoe UI,Arial,sans-serif;color:var(--ink)}
body{background:#f7fbff url("dashboard_background.svg") center top/cover fixed no-repeat}
a{text-decoration:none;color:var(--blue)}button{font:inherit}
.topbar{height:82px;background:rgba(255,255,255,.98);display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:14px}.brand img{width:58px;height:58px;object-fit:contain}.brand b{font-size:24px;color:#1f5fcf}.brand small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.top-actions,.identity{display:flex;align-items:center;gap:12px}.identity-text b{display:block}.identity-text small{display:block;color:var(--muted)}.avatar-mini{width:46px;height:46px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:18px}
.role-admin{background:#2d68dc}.role-teacher{background:#21a66a}.role-student{background:#7d4de5}.role-parent{background:#ef8d2d}.bell{position:relative}.bell-icon{font-size:25px}.bell-count{position:absolute;right:-7px;top:-8px;background:var(--red);color:#fff;border-radius:20px;min-width:19px;height:19px;display:grid;place-items:center;font-size:11px}.logout{color:#47576f}
.app-shell{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:calc(100vh - 82px)}.sidebar{background:rgba(255,255,255,.97);border-right:1px solid var(--line);padding:20px 14px}.sidebar nav{position:sticky;top:102px}.sidebar a,.sidebar button{width:100%;border:0;display:flex;align-items:center;gap:15px;padding:13px 16px;margin:4px 0;border-radius:9px;color:#263856;background:transparent;text-align:left;cursor:pointer}.sidebar a:hover,.sidebar button:hover{background:#edf4ff}.sidebar .nav-main{background:linear-gradient(135deg,#3479eb,#1e5ecc);color:#fff;font-weight:700;box-shadow:0 5px 14px rgba(43,105,220,.24)}.nav-icon{font-size:21px;min-width:26px;text-align:center}.nav-title{font-size:11px;color:#79869b;font-weight:800;letter-spacing:.6px;margin:27px 13px 9px}.sidebar em{margin-left:auto;background:#ed4245;color:#fff;border-radius:20px;padding:2px 7px;font-size:11px;font-style:normal}
.content{padding:28px 38px 42px;min-width:0}.guest-content{min-height:100vh;display:grid;place-items:center;padding:30px}
.hero{padding:10px 0 20px}.hero h1{font-size:34px;margin:0 0 8px}.hero p{margin:0;color:var(--muted);font-size:15px}
.stats-grid{display:grid;gap:16px;margin:8px 0 20px}.stats-grid.five{grid-template-columns:repeat(5,minmax(0,1fr))}.stats-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.stats-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.stat-card{background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;align-items:center;gap:17px;box-shadow:0 7px 20px rgba(47,83,126,.08)}.stat-card b{display:block;font-size:28px}.stat-card span:not(.stat-icon){display:block;font-weight:700}.stat-card small{display:block;color:var(--muted);margin-top:4px}.stat-icon{width:58px;height:58px;border-radius:13px;display:grid;place-items:center;font-size:29px}.stat-icon.blue{background:#e9f2ff}.stat-icon.green{background:#e7f8f0}.stat-icon.violet{background:#f0eaff}.stat-icon.orange{background:#fff3df}.stat-icon.pink{background:#ffeaf2}
.dashboard-grid{display:grid;gap:18px;margin-top:18px}.dashboard-grid.top{grid-template-columns:1.5fr 1fr}.dashboard-grid.bottom{grid-template-columns:1.1fr .9fr 1fr}
.panel{background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:15px;padding:22px;box-shadow:0 8px 25px rgba(47,83,126,.08);min-width:0}.panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.panel h2{margin:0;font-size:18px}
.activity-item,.message-item,.soft-row{display:flex;align-items:center;gap:13px;padding:14px 0;border-bottom:1px solid #e8eef6}.activity-item:last-child,.message-item:last-child,.soft-row:last-child{border-bottom:0}.activity-item>span:nth-child(2),.message-item>span:nth-child(2),.soft-row>div{flex:1;min-width:0}.activity-item b,.message-item b,.soft-row b{display:block;color:var(--ink)}.activity-item small,.message-item small,.soft-row small{display:block;color:var(--muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.activity-item em,.message-item em{font-style:normal;color:var(--muted);font-size:12px}.mini-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-weight:800}.mini-icon.blue{background:#e8f2ff;color:var(--blue)}.mini-icon.green{background:#e5f8ef;color:var(--green)}.mini-icon.violet{background:#f0eaff;color:var(--violet)}.message-avatar{width:42px;height:42px;border-radius:50%;background:#2f6cda;color:#fff;display:grid;place-items:center;font-weight:800}.pill{padding:6px 10px;border-radius:20px;font-size:12px;font-weight:700}.pill.blue{background:#e8f2ff;color:var(--blue)}.pill.green{background:#e5f8ef;color:var(--green)}.pill.violet{background:#f0eaff;color:var(--violet)}
.donut-wrap{display:flex;align-items:center;justify-content:center;gap:24px;padding:16px 0}.donut{width:150px;height:150px;border-radius:50%;background:conic-gradient(#2867dd 0 24%,#4ec47b 24% 46%,#8d5cea 46% 67%,#f2a43a 67% 82%,#e675aa 82% 100%);position:relative;display:grid;place-items:center}.donut:after{content:"";position:absolute;width:92px;height:92px;background:#fff;border-radius:50%}.donut span,.donut small{position:absolute;z-index:2}.donut span{font-size:28px;font-weight:800;transform:translateY(-8px)}.donut small{color:var(--muted);transform:translateY(20px)}.legend{list-style:none;padding:0;margin:0}.legend li{margin:11px 0;color:#53627a}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px}.dot.blue{background:#2867dd}.dot.green{background:#4ec47b}.dot.violet{background:#8d5cea}
.quick-links{display:grid;gap:11px}.quick{padding:14px 15px;border-radius:9px;border:1px solid var(--line);font-weight:650}.quick.blue{background:#f5f9ff}.quick.violet{background:#faf6ff;color:var(--violet)}.quick.green{background:#f4fff8;color:var(--green)}.quick.orange{background:#fffaf1;color:#d98200}
.card{background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:15px;padding:22px;margin:16px 0;box-shadow:0 8px 25px rgba(47,83,126,.08)}label{display:block;font-weight:650;margin:9px 0}input,select,textarea{width:100%;padding:11px;border:1px solid #cbd9ec;border-radius:8px;background:#fff;margin-top:6px;font:inherit}.formgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}.wide{grid-column:1/-1}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid #e5edf7}.flash{padding:12px 15px;border-radius:9px;margin-bottom:12px}.flash.success{background:#dcfce7}.flash.danger{background:#fee2e2}.empty-state{color:var(--muted);padding:20px;text-align:center}
@media(max-width:1200px){.stats-grid.five{grid-template-columns:repeat(3,1fr)}.dashboard-grid.bottom{grid-template-columns:1fr 1fr}.dashboard-grid.bottom .panel:last-child{grid-column:1/-1}}
@media(max-width:900px){.app-shell{grid-template-columns:1fr}.sidebar{position:static}.sidebar nav{position:static}.content{padding:20px}.dashboard-grid.top,.dashboard-grid.bottom,.stats-grid.five,.stats-grid.four,.stats-grid.three{grid-template-columns:1fr}.topbar{height:auto;padding:12px;flex-wrap:wrap}.brand img{width:50px;height:50px}.formgrid{grid-template-columns:1fr}.wide{grid-column:auto}}
@media print{.topbar,.sidebar,button{display:none!important}.app-shell{display:block}.content{padding:0}.panel,.card,.stat-card{box-shadow:none;background:#fff}}


/* CHARTE GRAPHIQUE FINALE
   La structure de l'interface ne change plus.
   Toutes les pages utilisent le même décor principal que le tableau de bord.
   Les différences par rôle sont très légères et n'affectent jamais la lisibilité. */
body,
body.role-admin,
body.role-teacher,
body.role-student,
body.role-parent,
body.role-guest{
  background-color:#f7fbff !important;
  background-image:
    linear-gradient(rgba(248,252,255,.78),rgba(248,252,255,.78)),
    url("dashboard_background.svg") !important;
  background-position:center top !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
}
body.role-admin{--role-accent:#2368df}
body.role-teacher{--role-accent:#21a66a}
body.role-student{--role-accent:#7c4ce5}
body.role-parent{--role-accent:#ef8d2d}

/* Les couleurs de rôle restent uniquement dans les petits repères, pas dans le fond. */
body.role-teacher .content,
body.role-student .content,
body.role-parent .content,
body.role-admin .content{background:transparent !important}

/* Logo et grandes icônes légèrement augmentés, sans déplacer l'interface. */
.brand img{width:64px !important;height:64px !important}
.brand b{font-size:25px !important}
.avatar-mini{width:49px !important;height:49px !important;font-size:19px !important}
.nav-icon{font-size:23px !important;min-width:29px !important}
.stat-icon{width:62px !important;height:62px !important;font-size:31px !important}

/* Photo de profil dans le bandeau lorsqu'elle sera utilisée ultérieurement. */
.profile-photo-top{width:49px;height:49px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 2px 8px rgba(30,70,120,.18)}

/* Import collectif des élèves et alertes individuelles */
.section-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}.section-title-row h2{margin:0 0 5px}.section-title-row p{margin:0;color:var(--muted)}
.import-help,.password-auto{padding:12px 14px;background:#f4f8ff;border:1px solid #d9e7fb;border-radius:9px;color:#53647d}.password-auto{align-self:end;margin-bottom:9px}
.notification-list{display:grid;gap:10px}.notification-item{display:flex;gap:14px;padding:14px;border:1px solid #e2eaf5;border-radius:11px;background:#fff}.notification-item.unread{border-left:5px solid var(--blue);background:#f7faff}.notification-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:10px;background:#eaf2ff;font-size:21px}.notification-item p{margin:5px 0;color:#53647d}.notification-item small{color:#7d8899}
@media(max-width:760px){.section-title-row{display:block}.section-title-row .btn-small{display:inline-block;margin-top:12px}}

/* Suivi des présences */
.attendance-filters .formgrid{align-items:end}.attendance-table-wrap{padding:0}.attendance-table th{background:#f5f9ff}.student-cell{display:flex;align-items:center;gap:12px;min-width:220px}.attendance-photo,.attendance-avatar{width:52px;height:52px;border-radius:50%;object-fit:cover}.attendance-avatar{display:grid;place-items:center;background:#e9f2ff;color:#2368df;font-weight:800}.student-cell small{display:block;color:var(--muted);margin-top:3px}.presence-dot{display:inline-block;width:17px;height:17px;border-radius:50%;margin-right:7px;vertical-align:middle}.presence-dot.present{background:#19d64b}.presence-dot.absent{background:#ef1640}.attendance-edit{display:grid;grid-template-columns:220px minmax(260px,1fr) auto;gap:10px;align-items:center}.attendance-edit select,.attendance-edit textarea{margin:0}.attendance-history{display:grid;gap:10px}.attendance-history-row{display:flex;gap:14px;align-items:flex-start;padding:14px;border:1px solid #e3ebf5;border-radius:11px;background:#fff}.attendance-history-row p{margin:7px 0}.status-symbol{width:24px;height:24px;border-radius:50%;display:inline-block;flex:0 0 auto;margin-top:2px;background:#9ca3af}.status-present{background:#17d743}.status-absent,.status-excused_absence,.status-exclusion{background:#ef1640}.status-late,.status-excused_late{background:#f4aa1c}.privacy-note{padding:13px 15px;background:#f3f7fc;border-left:5px solid #2368df;border-radius:9px;color:#53647d}.attendance-summary .status-symbol{margin-right:8px;vertical-align:middle}@media(max-width:950px){.attendance-edit{grid-template-columns:1fr}.attendance-table{min-width:820px}}

/* Colonne sécurisée des mots de passe générés */
.password-cell{min-width:290px}.password-row{display:flex;align-items:center;gap:5px;margin-bottom:6px}.password-row input{width:130px;margin:0;padding:7px;font-family:Consolas,monospace}.mini-action,.regenerate-btn{padding:6px 8px;font-size:12px}.regenerate-btn{background:#7254d8}.password-missing{display:inline-block;padding:6px 9px;border-radius:7px;background:#fff3cd;color:#775c00;margin-bottom:6px}
@media(max-width:900px){.password-cell{min-width:250px}.password-row{flex-wrap:wrap}}

/* Bibliothèque et quiz intégrés */.quiz-builder{background:#f5f9ff;border:1px solid #dce9fb;border-radius:12px;padding:18px}.check-label{display:flex;align-items:center;gap:8px}.check-label input{width:auto;margin:0}.quiz-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.quiz-tag{display:inline-block;background:#eaf2ff;color:#245fc8;padding:6px 10px;border-radius:20px;font-weight:700}.quiz-shell{max-width:1050px;margin:auto}.quiz-head{display:flex;justify-content:space-between;align-items:center}.quiz-progress{height:14px;background:#e5edf7;border-radius:20px;overflow:hidden}.quiz-progress div{height:100%;background:#25a66a}.quiz-stage{text-align:center}.quiz-answers{display:grid;grid-template-columns:1fr 1fr;gap:14px}.quiz-answer{padding:16px;border:3px solid transparent;border-radius:14px;background:#f0f5ff;color:#173b74;font-size:18px;font-weight:700}.quiz-answer.correct{background:#dcfce7;border-color:#22a563}.quiz-answer.wrong{background:#fee2e2;border-color:#dc3e46}.listen-btn{background:#6d4bd6;color:white;border:0;border-radius:12px;padding:12px 18px}@media(max-width:900px){.quiz-cards,.quiz-answers{grid-template-columns:1fr}}

/* Projets enrichis : fichiers, activités et sites externes */
.activity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.activity-option{display:grid;grid-template-columns:42px 1fr;align-items:center;gap:4px 10px;border:1px solid var(--line);border-radius:12px;padding:13px;background:#fff;cursor:pointer}.activity-option input{width:auto;margin:0;grid-row:1/3}.activity-option .activity-icon{font-size:27px}.activity-option b{font-size:14px}.activity-option small{grid-column:2/3;color:var(--muted);font-weight:400}.activity-option:has(input:checked){border-color:var(--blue);box-shadow:0 0 0 2px #dbeafe;background:#f7fbff}.source-builder,.external-builder,.quiz-builder,.activity-choice{border-top:1px solid var(--line);padding-top:16px}.integration-note,.activity-instructions{background:#eef6ff;border-left:5px solid var(--blue);padding:12px;border-radius:8px;color:#465b78}.external-frame-wrap{width:100%;height:68vh;min-height:480px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:white}.external-frame-wrap iframe{width:100%;height:100%;border:0}.activity-status{padding:9px 12px;background:#ecfdf5;border-radius:8px;color:#166534}@media(max-width:950px){.activity-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.activity-grid{grid-template-columns:1fr}.external-frame-wrap{height:60vh;min-height:380px}}
/* Abonnements, classes, archivage annuel et collaboration parentale */
.subscription-badge{padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;background:#eef3fb;color:#53647d}.subscription-badge.active{background:#dcfce7;color:#166534}.subscription-badge.trialing{background:#fff3cd;color:#775c00}.plans-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.plan-card>p>b{font-size:28px;color:var(--blue)}.pay-buttons{display:flex;gap:8px}.subscription-state{padding:16px;border-radius:12px}.subscription-state.active{background:#dcfce7}.subscription-state.trialing{background:#fff8db}.subscription-state.pending,.subscription-state.expired{background:#fee2e2}.register-card{width:min(760px,96vw)}.permission-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border:1px solid var(--line);padding:10px;border-radius:9px;margin:8px 0}.permission-row span{min-width:160px;flex:1}.permission-row input{width:auto;margin:0}@media(max-width:800px){.plans-grid{grid-template-columns:1fr}.pay-buttons{display:grid}}/* Alertes universelles, domaines académiques et invitations parentales */
.invite-card{max-width:760px}.invite-code{font:800 34px/1.2 Consolas,monospace;letter-spacing:5px;text-align:center;padding:20px;background:#eef5ff;border:2px dashed var(--blue);border-radius:12px;margin:18px 0}code{white-space:pre-wrap;word-break:break-all}.sidebar em{margin-left:auto}.bell{display:inline-flex!important;align-items:center!important}@media(max-width:700px){.invite-code{font-size:24px;letter-spacing:2px}}/* Alertes universelles, domaines académiques et invitations parentales */
.invite-card{max-width:760px}.invite-code{font:800 34px/1.2 Consolas,monospace;letter-spacing:5px;text-align:center;padding:20px;background:#eef5ff;border:2px dashed var(--blue);border-radius:12px;margin:18px 0}code{white-space:pre-wrap;word-break:break-all}.sidebar em{margin-left:auto}.bell{display:inline-flex!important;align-items:center!important}@media(max-width:700px){.invite-code{font-size:24px;letter-spacing:2px}}
/* Import Excel robuste et vérification par code */
.verify-card{max-width:520px}.verified-email{font-weight:800;color:var(--blue);word-break:break-all}.verify-card input{text-align:center;font:800 28px/1.2 Consolas,monospace;letter-spacing:8px}.resend-form{margin-top:12px}.secondary-button{background:#66758a}.small-note{color:var(--muted);font-size:12px}
/* Alertes universelles, domaines académiques et invitations parentales */
.invite-card{max-width:760px}.invite-code{font:800 34px/1.2 Consolas,monospace;letter-spacing:5px;text-align:center;padding:20px;background:#eef5ff;border:2px dashed var(--blue);border-radius:12px;margin:18px 0}code{white-space:pre-wrap;word-break:break-all}.sidebar em{margin-left:auto}.bell{display:inline-flex!important;align-items:center!important}@media(max-width:700px){.invite-code{font-size:24px;letter-spacing:2px}}
/* Import Excel robuste et vérification par code */
.verify-card{max-width:520px}.verified-email{font-weight:800;color:var(--blue);word-break:break-all}.verify-card input{text-align:center;font:800 28px/1.2 Consolas,monospace;letter-spacing:8px}.resend-form{margin-top:12px}.secondary-button{background:#66758a}.small-note{color:var(--muted);font-size:12px}
/* Alertes universelles, domaines académiques et invitations parentales */
.invite-card{max-width:760px}.invite-code{font:800 34px/1.2 Consolas,monospace;letter-spacing:5px;text-align:center;padding:20px;background:#eef5ff;border:2px dashed var(--blue);border-radius:12px;margin:18px 0}code{white-space:pre-wrap;word-break:break-all}.sidebar em{margin-left:auto}.bell{display:inline-flex!important;align-items:center!important}@media(max-width:700px){.invite-code{font-size:24px;letter-spacing:2px}}
/* Import Excel robuste et vérification par code */
.verify-card{max-width:520px}.verified-email{font-weight:800;color:var(--blue);word-break:break-all}.verify-card input{text-align:center;font:800 28px/1.2 Consolas,monospace;letter-spacing:8px}.resend-form{margin-top:12px}.secondary-button{background:#66758a}.small-note{color:var(--muted);font-size:12px}
/* Alertes universelles, domaines académiques et invitations parentales */
.invite-card{max-width:760px}.invite-code{font:800 34px/1.2 Consolas,monospace;letter-spacing:5px;text-align:center;padding:20px;background:#eef5ff;border:2px dashed var(--blue);border-radius:12px;margin:18px 0}code{white-space:pre-wrap;word-break:break-all}.sidebar em{margin-left:auto}.bell{display:inline-flex!important;align-items:center!important}@media(max-width:700px){.invite-code{font-size:24px;letter-spacing:2px}}
/* Import Excel robuste et vérification par code */
.verify-card{max-width:520px}.verified-email{font-weight:800;color:var(--blue);word-break:break-all}.verify-card input{text-align:center;font:800 28px/1.2 Consolas,monospace;letter-spacing:8px}.resend-form{margin-top:12px}.secondary-button{background:#66758a}.small-note{color:var(--muted);font-size:12px}
