:root{
  --bg:#f7f3ea;
  --card:#fffdf8;
  --text:#172033;
  --muted:#6b7280;
  --line:#e8dcc8;
  --green:#0f7f70;
  --green2:#e7fbf5;
  --blue:#2563eb;
  --violet:#7c3aed;
  --orange:#d97706;
  --red:#b91c1c;
  --shadow:0 18px 50px rgba(15,23,42,.08);
}

*{box-sizing:border-box}

body{
  margin:0;
  background:linear-gradient(135deg,#f8f4ea 0%,#ffffff 45%,#eefaf7 100%);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

.topbar{
  max-width:1200px;
  margin:22px auto 0;
  padding:16px 20px;
  background:rgba(255,255,255,.78);
  border:1px solid var(--line);
  border-radius:26px;
  box-shadow:var(--shadow);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.logo{
  width:54px;
  height:54px;
  border-radius:18px;
  background:linear-gradient(135deg,#0f7f70,#2563eb);
  color:white;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
}

.brand-title{
  font-weight:900;
  font-size:20px;
}

.brand-subtitle{
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}

.nav{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}

.nav a{
  text-decoration:none;
  color:#4b3419;
  background:#fff7e8;
  border:1px solid #ead7b8;
  padding:9px 13px;
  border-radius:999px;
  font-weight:850;
  font-size:14px;
}

.nav a:nth-child(1){background:#dcfce7;color:#166534}
.nav a:nth-child(2){background:#dbeafe;color:#1d4ed8}
.nav a:nth-child(3){background:#f3e8ff;color:#7e22ce}
.nav a:nth-child(4){background:#ede9fe;color:#6d28d9}
.nav a:nth-child(5){background:#ffedd5;color:#c2410c}
.nav .danger{background:#fee2e2;color:#991b1b;border-color:#fecaca}

.page{
  max-width:1120px;
  margin:28px auto;
  padding:0 18px 50px;
}

.card,.auth-card{
  background:rgba(255,253,248,.92);
  border:1px solid var(--line);
  border-radius:28px;
  box-shadow:var(--shadow);
  padding:34px;
}

.auth-card{
  max-width:660px;
  margin:40px auto;
}

h1{
  margin:0 0 20px;
  font-size:40px;
  line-height:1.05;
}

h2{
  margin-top:28px;
  font-size:22px;
}

.muted{
  color:var(--muted);
  font-weight:650;
}

label{
  display:block;
  margin:18px 0 8px;
  font-weight:900;
}

input,select,textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px 16px;
  font-size:16px;
  background:white;
}

button{
  width:auto;
  margin-top:18px;
  border:0;
  border-radius:18px;
  padding:13px 18px;
  background:var(--green);
  color:white;
  font-weight:900;
  font-size:16px;
  cursor:pointer;
}

.alert{
  background:#fff1f2;
  color:#9f1239;
  border:1px solid #fecdd3;
  padding:14px 16px;
  border-radius:18px;
  font-weight:800;
}

.notice{
  background:var(--green2);
  color:#0f766e;
  border:1px solid #99f6e4;
  padding:14px 16px;
  border-radius:18px;
  font-weight:800;
  margin:20px 0;
}

.forgot{
  display:inline-block;
  margin-top:18px;
  color:var(--green);
  font-weight:900;
}

.install-box{
  margin-top:28px;
  border:1px solid var(--line);
  border-radius:22px;
  padding:22px;
  background:#fffaf0;
}

.stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin:22px 0;
}

.stats div{
  background:white;
  border:1px solid var(--line);
  border-radius:22px;
  padding:18px;
}

.stats strong{
  display:block;
  font-size:30px;
  color:var(--green);
}

.stats span{
  color:var(--muted);
  font-weight:800;
}

.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:16px;
}

.school-card{
  display:flex;
  gap:14px;
  padding:18px;
  border:1px solid var(--line);
  background:white;
  border-radius:22px;
}

.school-logo{
  width:56px;
  height:56px;
  border-radius:18px;
  background:#e0f2fe;
  color:#0369a1;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
}

table{
  width:100%;
  border-collapse:collapse;
  background:white;
  border-radius:18px;
  overflow:hidden;
}

th,td{
  text-align:left;
  padding:12px;
  border-bottom:1px solid var(--line);
}

@media(max-width:720px){
  .topbar{
    margin:0;
    border-radius:0 0 24px 24px;
    flex-direction:column;
    align-items:flex-start;
  }

  .nav{
    justify-content:flex-start;
  }

  .page{
    padding:0 12px 40px;
  }

  .card,.auth-card{
    padding:24px;
    border-radius:24px;
  }

  h1{
    font-size:34px;
  }

  .stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

.school-form{
  margin-top:22px;
  padding:22px;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fffaf0;
}

.form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}

.school-list{
  display:flex;
  flex-direction:column;
  gap:16px;
  margin-top:18px;
}

.school-row{
  display:grid;
  grid-template-columns:90px 1fr 160px;
  gap:18px;
  align-items:start;
  padding:18px;
  border:1px solid var(--line);
  border-radius:24px;
  background:white;
}

.school-logo-big{
  width:78px;
  height:78px;
  border-radius:22px;
  background:linear-gradient(135deg,#0f7f70,#2563eb);
  color:white;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.school-logo-big img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.school-info h3{
  margin:0 0 8px;
  font-size:24px;
}

.mini-line{
  color:var(--muted);
  font-weight:800;
  margin:4px 0;
}

.admin-box{
  margin-top:12px;
  padding:12px;
  background:#f8fafc;
  border:1px solid #e5e7eb;
  border-radius:18px;
  line-height:1.55;
}

.username{
  color:var(--violet);
  font-weight:900;
}

.badge{
  display:inline-block;
  padding:5px 9px;
  border-radius:999px;
  font-weight:900;
  font-size:13px;
}

.badge.green{
  background:#dcfce7;
  color:#166534;
}

.badge.red{
  background:#fee2e2;
  color:#991b1b;
}

.school-actions{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.small-btn{
  width:100%;
  margin:0;
  padding:10px 12px;
  border-radius:14px;
  font-size:14px;
}

.danger-btn{
  background:#fee2e2;
  color:#991b1b;
  border:1px solid #fecaca;
}

.alert.success{
  background:#dcfce7;
  color:#166534;
  border-color:#86efac;
}

.alert.error{
  background:#fee2e2;
  color:#991b1b;
  border-color:#fecaca;
}

@media(max-width:720px){
  .form-grid{
    grid-template-columns:1fr;
  }

  .school-row{
    grid-template-columns:1fr;
  }

  .school-actions{
    flex-direction:row;
  }
}

.settings-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:16px;
  margin-top:24px;
}

.settings-card{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:150px;
  padding:20px;
  border-radius:24px;
  border:1px solid var(--line);
  text-decoration:none;
  color:var(--text);
  box-shadow:0 10px 30px rgba(15,23,42,.05);
}

.settings-card span{
  font-size:30px;
}

.settings-card strong{
  font-size:20px;
  font-weight:950;
}

.settings-card small{
  color:var(--muted);
  font-weight:750;
  line-height:1.4;
}

.green-card{background:#ecfdf5;border-color:#a7f3d0}
.blue-card{background:#eff6ff;border-color:#bfdbfe}
.violet-card{background:#f5f3ff;border-color:#ddd6fe}
.orange-card{background:#fff7ed;border-color:#fed7aa}
.teal-card{background:#f0fdfa;border-color:#99f6e4}
.mail-card{background:#fdf2f8;border-color:#fbcfe8}
.backup-card{background:#f8fafc;border-color:#cbd5e1}

@media(max-width:720px){
  .settings-grid{
    grid-template-columns:1fr;
  }
}

.contacts-card{
  background:#eefdf8;
  border-color:#99f6e4;
}

.table-wrap{
  width:100%;
  overflow-x:auto;
  margin-top:22px;
  border:1px solid var(--line);
  border-radius:20px;
  background:white;
}

.contact-table{
  min-width:860px;
}

.contact-table th{
  background:#fffaf0;
  color:#7a4f19;
  font-size:13px;
  white-space:nowrap;
}

.contact-table td{
  white-space:nowrap;
}

.contact-table .username{
  color:var(--violet);
  font-weight:900;
}

.compact-form{
  margin-top:22px;
  padding:20px;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fffaf0;
}

.clean-table{
  min-width:900px;
}

.clean-table th{
  background:#fffaf0;
  color:#7a4f19;
  font-size:13px;
  white-space:nowrap;
}

.clean-table td{
  vertical-align:middle;
}

.inline-form{
  display:contents;
}

.actions-cell{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.actions-cell form{
  margin:0;
}

.mini-btn{
  margin:0;
  border-radius:13px;
  padding:8px 11px;
  font-size:13px;
  font-weight:900;
  background:#0f7f70;
}

.mini-btn.soft{
  background:#fff7e8;
  color:#7a4f19;
  border:1px solid #ead7b8;
}

.danger-mini{
  background:#fee2e2;
  color:#991b1b;
  border:1px solid #fecaca;
}

.clean-table input,
.clean-table select{
  min-width:210px;
  padding:9px 11px;
  border-radius:13px;
}

@media(max-width:720px){
  .clean-table{
    min-width:760px;
  }
}

.users-table{
  min-width:1250px;
}

.badge.blue{
  background:#dbeafe;
  color:#1d4ed8;
}

.badge.violet{
  background:#ede9fe;
  color:#6d28d9;
}

.reset-details{
  position:relative;
  min-width:120px;
}

.reset-details summary{
  cursor:pointer;
  list-style:none;
  background:#f8fafc;
  border:1px solid #cbd5e1;
  border-radius:13px;
  padding:8px 11px;
  font-size:13px;
  font-weight:900;
  color:#334155;
}

.reset-details form{
  margin-top:8px;
  display:flex;
  gap:6px;
  align-items:center;
}

.reset-details input{
  min-width:150px;
  padding:8px 10px;
  border-radius:12px;
}

.users-table td{
  white-space:nowrap;
}

.users-table-compact{
  min-width:980px;
  font-size:13px;
}

.users-table-compact th,
.users-table-compact td{
  padding:9px 8px;
  vertical-align:middle;
}

.users-table-compact .col-id{
  width:50px;
  color:#64748b;
  font-weight:900;
}

.compact-input,
.compact-select{
  min-width:0 !important;
  width:100%;
  padding:7px 9px !important;
  border-radius:11px !important;
  font-size:13px !important;
}

.name-input{
  max-width:170px;
}

.contact-input{
  max-width:210px;
  display:block;
  margin-bottom:6px;
}

.phone-compact{
  max-width:150px;
  margin-bottom:0;
}

.compact-username{
  max-width:110px;
  white-space:normal;
  word-break:break-word;
}

.compact-actions{
  min-width:230px;
  gap:6px;
}

.compact-actions .mini-btn{
  padding:7px 9px;
  font-size:12px;
  border-radius:11px;
}

.small-muted{
  margin-top:5px;
  color:#64748b;
  font-size:11px;
  font-weight:700;
  white-space:normal;
  max-width:130px;
}

.compact-reset summary{
  padding:7px 9px;
  font-size:12px;
  border-radius:11px;
}

.compact-reset form{
  position:absolute;
  z-index:20;
  background:white;
  border:1px solid var(--line);
  border-radius:16px;
  padding:10px;
  box-shadow:0 15px 35px rgba(15,23,42,.12);
}

.compact-reset input{
  width:170px;
  min-width:170px;
}

@media(max-width:720px){
  .users-table-compact{
    min-width:900px;
    font-size:12px;
  }

  .users-table-compact th,
  .users-table-compact td{
    padding:7px 6px;
  }

  .compact-actions{
    min-width:210px;
  }
}

.contact-cell{
  min-width:230px;
  max-width:260px;
}

.contact-view{
  line-height:1.35;
}

.email-line{
  color:#075985;
  font-weight:850;
  white-space:normal;
  word-break:break-word;
  max-width:240px;
}

.phone-line{
  color:#4b3419;
  font-weight:850;
  margin-top:4px;
}

.edit-contact-details,
.edit-class-details{
  margin-top:6px;
}

.edit-contact-details summary,
.edit-class-details summary{
  cursor:pointer;
  display:inline-block;
  padding:5px 9px;
  border-radius:999px;
  background:#f8fafc;
  border:1px solid #cbd5e1;
  color:#334155;
  font-size:12px;
  font-weight:900;
}

.edit-contact-box{
  margin-top:7px;
  padding:8px;
  border:1px solid var(--line);
  border-radius:14px;
  background:white;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.edit-contact-box .contact-input{
  max-width:240px;
  margin:0;
}

.class-pill{
  display:inline-block;
  max-width:190px;
  white-space:normal;
  word-break:break-word;
  padding:7px 10px;
  border-radius:999px;
  background:#ecfdf5;
  color:#0f766e;
  border:1px solid #99f6e4;
  font-size:12px;
  font-weight:900;
}

.edit-class-details select{
  margin-top:7px;
  min-width:190px !important;
  max-width:220px;
}

.users-table-compact{
  min-width:1050px;
}

.users-table-simple{
  min-width:1050px;
  font-size:13px;
}

.users-table-simple th,
.users-table-simple td{
  padding:11px 10px;
  vertical-align:middle;
}

.users-table-simple tr{
  height:64px;
}

.id-cell{
  width:55px;
  color:#64748b;
  font-weight:900;
}

.name-cell{
  min-width:150px;
  max-width:190px;
}

.contact-cell-read{
  min-width:230px;
  max-width:270px;
  line-height:1.35;
}

.email-line{
  color:#075985;
  font-weight:850;
  white-space:normal;
  word-break:break-word;
}

.phone-line{
  color:#4b3419;
  font-weight:850;
  margin-top:4px;
}

.compact-username{
  max-width:110px;
  white-space:normal;
  word-break:break-word;
}

.class-pill{
  display:inline-block;
  max-width:190px;
  white-space:normal;
  word-break:break-word;
  padding:7px 10px;
  border-radius:999px;
  background:#ecfdf5;
  color:#0f766e;
  border:1px solid #99f6e4;
  font-size:12px;
  font-weight:900;
}

.login-cell{
  min-width:130px;
  color:#64748b;
  font-size:12px;
  font-weight:750;
}

.user-actions-clean{
  min-width:230px;
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  align-items:center;
}

.user-actions-clean form{
  margin:0;
}

.link-mini{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color:white;
}

.small-note{
  margin-top:14px;
  font-size:13px;
}

@media(max-width:720px){
  .users-table-simple{
    min-width:980px;
  }

  .users-table-simple th,
  .users-table-simple td{
    padding:9px 8px;
  }

  .user-actions-clean{
    min-width:210px;
  }
}

/* Fix affichage classe dans tableau utilisateurs */
.users-table-simple .class-pill{
  max-width:220px !important;
  min-width:90px !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:break-word !important;
  line-height:1.25 !important;
  text-align:center;
}

.users-table-simple td:nth-child(6){
  min-width:130px !important;
  max-width:230px !important;
}

.users-table-simple td:nth-child(5){
  min-width:95px !important;
}

.users-table-simple td:nth-child(7){
  min-width:80px !important;
}

.users-table-simple td:nth-child(8){
  min-width:125px !important;
}

.users-table-simple td:nth-child(9){
  min-width:210px !important;
}

/* Actions utilisateurs en icônes uniquement */
.users-table-simple .user-actions-icons{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  min-width:130px !important;
  white-space:nowrap !important;
}

.users-table-simple .user-actions-icons form{
  margin:0 !important;
  display:inline-flex !important;
}

.icon-btn{
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
  max-width:36px !important;
  padding:0 !important;
  margin:0 !important;
  border-radius:50% !important;
  border:1px solid #e5d7c4 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  font-size:16px !important;
  line-height:1 !important;
  cursor:pointer !important;
  box-shadow:0 4px 12px rgba(15,23,42,.06);
}

.edit-icon{
  background:#fff7e8 !important;
  color:#4b3419 !important;
}

.block-icon{
  background:#eef2ff !important;
  color:#3730a3 !important;
}

.delete-icon{
  background:#fee2e2 !important;
  color:#991b1b !important;
  border-color:#fecaca !important;
}

.icon-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(15,23,42,.10);
}

.users-table-simple td:nth-child(9){
  min-width:150px !important;
}

@media(max-width:720px){
  .users-table-simple .user-actions-icons{
    min-width:125px !important;
    gap:6px !important;
  }

  .icon-btn{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    max-width:34px !important;
    font-size:15px !important;
  }
}

/* Actions utilisateurs : icônes seules, sans rond */
.users-table-simple .user-actions-icons{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:14px !important;
  min-width:110px !important;
  white-space:nowrap !important;
}

.users-table-simple .user-actions-icons form{
  margin:0 !important;
  display:inline-flex !important;
}

.users-table-simple .icon-btn{
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  max-width:none !important;
  padding:0 !important;
  margin:0 !important;
  border:none !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  font-size:20px !important;
  line-height:1 !important;
  cursor:pointer !important;
}

.users-table-simple .icon-btn:hover{
  transform:scale(1.15) !important;
  box-shadow:none !important;
}

.users-table-simple .edit-icon,
.users-table-simple .block-icon,
.users-table-simple .delete-icon{
  background:transparent !important;
  border:none !important;
  color:inherit !important;
}

.users-table-simple td:nth-child(9){
  min-width:120px !important;
}

/* Alignement final tableau utilisateurs */
.users-table-simple{
  table-layout:fixed !important;
  width:100% !important;
  min-width:980px !important;
}

.users-table-simple th,
.users-table-simple td{
  vertical-align:middle !important;
  padding:10px 8px !important;
}

/* Largeurs propres */
.users-table-simple th:nth-child(1),
.users-table-simple td:nth-child(1){
  width:50px !important;
}

.users-table-simple th:nth-child(2),
.users-table-simple td:nth-child(2){
  width:90px !important;
}

.users-table-simple th:nth-child(3),
.users-table-simple td:nth-child(3){
  width:150px !important;
}

.users-table-simple th:nth-child(4),
.users-table-simple td:nth-child(4){
  width:250px !important;
}

.users-table-simple th:nth-child(5),
.users-table-simple td:nth-child(5){
  width:110px !important;
}

.users-table-simple th:nth-child(6),
.users-table-simple td:nth-child(6){
  width:130px !important;
}

.users-table-simple th:nth-child(7),
.users-table-simple td:nth-child(7){
  width:90px !important;
}

.users-table-simple th:nth-child(8),
.users-table-simple td:nth-child(8){
  width:145px !important;
}

.users-table-simple th:nth-child(9),
.users-table-simple td:nth-child(9){
  width:120px !important;
  min-width:120px !important;
}

/* Colonne actions : tout sur une seule ligne */
.users-table-simple .user-actions-icons,
.users-table-simple td.actions-cell{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:14px !important;
  min-width:110px !important;
  width:110px !important;
  white-space:nowrap !important;
}

.users-table-simple .user-actions-icons form,
.users-table-simple td.actions-cell form{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
  padding:0 !important;
}

/* Icônes propres sans rond */
.users-table-simple .icon-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:0 !important;
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  max-width:22px !important;
  border-radius:0 !important;
  font-size:18px !important;
  line-height:22px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  cursor:pointer !important;
}

.users-table-simple .icon-btn:hover{
  transform:scale(1.12) !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Classe lisible */
.users-table-simple .class-pill{
  max-width:115px !important;
  min-width:70px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  text-align:center !important;
}

/* Dernière connexion propre */
.users-table-simple .login-cell{
  width:145px !important;
  white-space:nowrap !important;
  font-size:12px !important;
}

/* Contact propre */
.users-table-simple .contact-cell-read{
  width:250px !important;
  max-width:250px !important;
}

.users-table-simple .email-line{
  max-width:235px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.users-table-simple .phone-line{
  white-space:nowrap !important;
}

/* Nettoyage anciens styles qui créaient des hauteurs bizarres */
.users-table-simple tr{
  height:58px !important;
}

.users-table-simple .mini-btn,
.users-table-simple .link-mini{
  margin:0 !important;
}

/* Correction finale : la cellule Actions doit rester une vraie cellule de tableau */
.users-table-simple td.user-actions-icons,
.users-table-simple td.actions-cell.user-actions-icons{
  display:table-cell !important;
  vertical-align:middle !important;
  text-align:center !important;
  width:120px !important;
  min-width:120px !important;
  white-space:nowrap !important;
  padding:10px 8px !important;
}

/* Les éléments à l'intérieur restent alignés horizontalement */
.users-table-simple td.user-actions-icons > a,
.users-table-simple td.user-actions-icons > form,
.users-table-simple td.actions-cell.user-actions-icons > a,
.users-table-simple td.actions-cell.user-actions-icons > form{
  display:inline-flex !important;
  vertical-align:middle !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 6px 0 0 !important;
  padding:0 !important;
}

/* Dernier élément sans marge inutile */
.users-table-simple td.user-actions-icons > *:last-child,
.users-table-simple td.actions-cell.user-actions-icons > *:last-child{
  margin-right:0 !important;
}

/* Icônes simples, sans rond, centrées */
.users-table-simple td.user-actions-icons .icon-btn,
.users-table-simple td.actions-cell.user-actions-icons .icon-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:0 !important;
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  max-width:22px !important;
  font-size:18px !important;
  line-height:22px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  cursor:pointer !important;
}

/* Toutes les cellules de la ligne au milieu */
.users-table-simple tbody td{
  vertical-align:middle !important;
}

/* Hauteur stable des lignes */
.users-table-simple tbody tr{
  height:58px !important;
}

.publish-form textarea{
  resize:vertical;
  line-height:1.5;
}

.posts-list{
  display:flex;
  flex-direction:column;
  gap:18px;
  margin-top:22px;
}

.post-card{
  background:white;
  border:1px solid var(--line);
  border-radius:24px;
  padding:22px;
  box-shadow:0 8px 25px rgba(15,23,42,.04);
}

.post-top{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin-bottom:12px;
}

.type-pill,
.target-pill{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:7px 11px;
  font-size:13px;
  font-weight:900;
}

.note-pill{
  background:#e7fbf5;
  color:#0f766e;
}

.event-pill{
  background:#dbeafe;
  color:#1d4ed8;
}

.sortie-pill{
  background:#ffedd5;
  color:#c2410c;
}

.reunion-pill{
  background:#f3e8ff;
  color:#7e22ce;
}

.target-pill{
  background:#f8fafc;
  color:#475569;
  border:1px solid #e2e8f0;
}

.post-card h2{
  margin:0 0 14px;
  font-size:28px;
}

.post-body{
  font-size:17px;
  line-height:1.55;
  color:#1f2937;
}

.post-footer{
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid var(--line);
  color:#6b7280;
  font-weight:750;
}

.help-text{
  margin-top:8px;
  color:#64748b;
  font-size:13px;
  font-weight:700;
}

.media-grid{
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:18px;
}

.media-card{
  background:white;
  border:1px solid var(--line);
  border-radius:22px;
  padding:14px;
  box-shadow:0 8px 24px rgba(15,23,42,.04);
}

.media-card img,
.media-card video{
  width:100%;
  max-height:260px;
  object-fit:cover;
  border-radius:18px;
  background:#f8fafc;
}

.media-info{
  display:flex;
  flex-direction:column;
  gap:5px;
  margin-top:10px;
}

.media-info strong{
  font-size:16px;
}

.media-info span{
  color:#0f766e;
  font-weight:850;
}

.media-info small{
  color:#64748b;
  font-weight:700;
}

.photo-publications{
  display:flex;
  flex-direction:column;
  gap:26px;
  margin-top:24px;
}

.photo-publication-card{
  background:white;
  border:1px solid var(--line);
  border-radius:28px;
  padding:22px;
  box-shadow:0 10px 28px rgba(15,23,42,.05);
}

.photo-publication-head h2{
  margin:14px 0 8px;
  font-size:28px;
  line-height:1.15;
}

.photo-caption{
  color:#334155;
  font-size:16px;
  line-height:1.45;
  margin:0 0 18px;
}

.photo-album-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
  gap:14px;
  margin-top:16px;
}

.photo-album-item{
  display:block;
  border-radius:20px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#f8fafc;
  aspect-ratio:1 / 1;
}

.photo-album-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.photo-publication-footer{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--line);
}

.author-avatar{
  width:48px;
  height:48px;
  border-radius:50%;
  overflow:hidden;
  background:linear-gradient(135deg,#0f766e,#2563eb);
  color:white;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  font-weight:950;
  flex:0 0 auto;
}

.author-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

@media(max-width:720px){
  .photo-publication-card{
    padding:16px;
    border-radius:22px;
  }

  .photo-publication-head h2{
    font-size:22px;
  }

  .photo-album-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .author-avatar{
    width:42px;
    height:42px;
  }
}

.photo-publication-card{
  position:relative;
}

.photo-card-actions{
  position:absolute;
  top:18px;
  right:18px;
  display:flex;
  align-items:center;
  gap:10px;
  z-index:5;
}

.photo-card-actions form{
  margin:0;
  display:inline-flex;
}

.photo-action-icon{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  font-size:17px;
  line-height:1;
  text-decoration:none;
  cursor:pointer;
}

.photo-action-icon:hover{
  transform:scale(1.12);
}

.photo-thumb-wrap{
  position:relative;
}

.photo-delete-one-form{
  position:absolute;
  top:7px;
  right:7px;
  margin:0;
  z-index:4;
}

.photo-delete-one-form button{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  width:23px;
  height:23px;
  border-radius:50%;
  background:rgba(15,23,42,.82);
  color:white;
  font-size:18px;
  line-height:20px;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}

.photo-delete-one-form button:hover{
  background:#991b1b;
}

.form-actions-row{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:14px;
}

.secondary-link-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:11px 18px;
  border-radius:14px;
  background:#f8fafc;
  border:1px solid #cbd5e1;
  color:#334155;
  text-decoration:none;
  font-weight:900;
}

@media(max-width:720px){
  .photo-card-actions{
    top:14px;
    right:14px;
  }

  .photo-action-icon{
    font-size:16px;
  }
}

.video-publications{
  display:flex;
  flex-direction:column;
  gap:26px;
  margin-top:24px;
}

.video-publication-card{
  position:relative;
  background:white;
  border:1px solid var(--line);
  border-radius:28px;
  padding:22px;
  box-shadow:0 10px 28px rgba(15,23,42,.05);
}

.video-album-list{
  display:flex;
  flex-direction:column;
  gap:16px;
  margin-top:16px;
}

.video-item video{
  width:100%;
  max-height:520px;
  background:#0f172a;
  border-radius:22px;
  border:1px solid var(--line);
}

@media(max-width:720px){
  .video-publication-card{
    padding:16px;
    border-radius:22px;
  }

  .video-item video{
    max-height:380px;
    border-radius:18px;
  }
}

.video-save-link{
  display:inline-flex;
  margin-top:10px;
  color:#0f766e;
  font-weight:900;
  text-decoration:none;
  font-size:15px;
}

.video-save-link:hover{
  text-decoration:underline;
}

.video-item video{
  object-fit:cover;
}

.video-download-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:10px;
  font-size:20px;
  line-height:1;
  text-decoration:none;
  background:transparent;
  border:0;
  width:auto;
  height:auto;
  padding:0;
  cursor:pointer;
}

.video-download-icon:hover{
  transform:scale(1.15);
}

.video-save-link{
  display:none !important;
}

/* Photos non coupées */
.photo-full-item,
.photo-album-item.photo-full-item{
  aspect-ratio:auto !important;
  min-height:160px;
  background:#f8fafc;
  display:flex;
  align-items:center;
  justify-content:center;
}

.photo-full-item img,
.photo-album-item.photo-full-item img{
  width:100% !important;
  height:auto !important;
  max-height:260px !important;
  object-fit:contain !important;
  display:block;
  background:#f8fafc;
}

/* Petites réactions médias */
.media-social-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin-top:9px;
}

.media-social-row form{
  margin:0;
  display:inline-flex;
}

.media-emoji-btn,
.media-comment-details summary{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  font-size:13px;
  line-height:1;
  cursor:pointer;
  font-weight:800;
  color:#334155;
  list-style:none;
  display:inline-flex;
  align-items:center;
  gap:2px;
}

.media-comment-details summary::-webkit-details-marker{
  display:none;
}

.media-emoji-btn span,
.media-comment-details summary span{
  font-size:11px;
  color:#64748b;
  font-weight:900;
}

.media-emoji-btn:hover,
.media-comment-details summary:hover{
  transform:scale(1.08);
}

.media-comment-details{
  position:relative;
}

.media-comments-box{
  position:absolute;
  left:0;
  top:24px;
  z-index:20;
  width:260px;
  background:white;
  border:1px solid var(--line);
  border-radius:16px;
  padding:10px;
  box-shadow:0 16px 35px rgba(15,23,42,.14);
}

.media-comment-item{
  border-bottom:1px solid #f1f5f9;
  padding:7px 0;
}

.media-comment-item:last-child{
  border-bottom:0;
}

.media-comment-item strong{
  font-size:12px;
  color:#0f766e;
}

.media-comment-item p{
  margin:3px 0 0;
  font-size:13px;
  line-height:1.35;
  color:#1f2937;
}

.media-comments-box form{
  margin-top:8px;
  display:flex;
  gap:6px;
}

.media-comments-box input{
  flex:1;
  min-width:0;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid var(--line);
  font-size:13px;
}

.media-comments-box button{
  width:34px;
  height:34px;
  border-radius:12px;
  border:0;
  background:#0f766e;
  color:white;
  font-weight:900;
}

.tiny-muted{
  font-size:12px;
  margin:0;
}

.video-under-actions{
  display:flex;
  justify-content:flex-start;
  margin-top:8px;
}

@media(max-width:720px){
  .photo-full-item img,
  .photo-album-item.photo-full-item img{
    max-height:220px !important;
  }

  .media-comments-box{
    left:auto;
    right:0;
    width:240px;
  }

  .media-social-row{
    gap:6px;
  }

  .media-emoji-btn,
  .media-comment-details summary{
    font-size:12px;
  }
}

.media-reactions-details{
  position:relative;
}

.media-reactions-details summary{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  font-size:13px;
  line-height:1;
  cursor:pointer;
  font-weight:800;
  color:#334155;
  list-style:none;
  display:inline-flex;
  align-items:center;
  gap:2px;
}

.media-reactions-details summary::-webkit-details-marker{
  display:none;
}

.media-reactions-details summary span{
  font-size:11px;
  color:#64748b;
  font-weight:900;
}

.media-reactions-details summary:hover{
  transform:scale(1.08);
}

.media-reactions-box{
  position:absolute;
  left:0;
  top:24px;
  z-index:25;
  width:245px;
  background:white;
  border:1px solid var(--line);
  border-radius:16px;
  padding:10px;
  box-shadow:0 16px 35px rgba(15,23,42,.14);
}

.media-reaction-person{
  display:flex;
  align-items:center;
  gap:9px;
  padding:7px 0;
  border-bottom:1px solid #f1f5f9;
}

.media-reaction-person:last-child{
  border-bottom:0;
}

.reaction-emoji{
  width:24px;
  height:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
}

.media-reaction-person strong{
  display:block;
  color:#0f766e;
  font-size:13px;
  line-height:1.2;
}

.media-reaction-person small{
  display:block;
  color:#64748b;
  font-size:11px;
  font-weight:800;
  margin-top:2px;
}

@media(max-width:720px){
  .media-reactions-box{
    left:auto;
    right:0;
    width:230px;
  }

  .media-reactions-details summary{
    font-size:12px;
  }
}

.publication-social-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--line);
}

.publication-social-row form{
  margin:0;
  display:inline-flex;
}

.only-parent-reactions{
  border-top:1px solid var(--line);
  margin-top:14px;
  padding-top:10px;
}

.only-parent-reactions .media-reactions-details summary{
  font-size:13px;
}

/* Réactions parents + commentaires côte à côte au niveau publication */
.only-parent-reactions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:14px !important;
  flex-wrap:wrap !important;
  border-top:1px solid var(--line);
  margin-top:14px;
  padding-top:10px;
}

.only-parent-reactions .media-reactions-details,
.only-parent-reactions .media-comment-details{
  position:relative;
  display:inline-flex;
}

.only-parent-reactions .media-reactions-details summary,
.only-parent-reactions .media-comment-details summary{
  font-size:14px !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:3px !important;
}

.only-parent-reactions .media-comments-box,
.only-parent-reactions .media-reactions-box{
  top:26px !important;
}

.video-action-line{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
  padding-top:8px;
  border-top:1px solid var(--line);
}

.video-action-line form{
  margin:0;
  display:inline-flex;
}

.video-action-line .video-download-icon{
  margin-top:0 !important;
  margin-right:4px;
}

.video-action-line .media-reactions-details,
.video-action-line .media-comment-details{
  position:relative;
  display:inline-flex;
}

.video-action-line .media-reactions-details summary,
.video-action-line .media-comment-details summary{
  font-size:13px !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:3px !important;
}

.video-action-line .media-comments-box,
.video-action-line .media-reactions-box{
  top:24px !important;
}

@media(max-width:720px){
  .video-action-line{
    gap:7px;
  }

  .video-action-line .media-comments-box,
  .video-action-line .media-reactions-box{
    right:0;
    left:auto;
  }
}

.video-emoji-line{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:9px;
}

.video-emoji-line form{
  margin:0;
  display:inline-flex;
}

.video-bottom-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:16px;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid var(--line);
}

.video-bottom-actions .media-reactions-details,
.video-bottom-actions .media-comment-details{
  position:relative;
  display:inline-flex;
}

.video-mini-action{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  font-size:15px !important;
  line-height:1;
  font-weight:900;
  color:#334155;
  text-decoration:none;
  display:inline-flex !important;
  align-items:center;
  gap:4px;
  cursor:pointer;
  list-style:none;
}

.video-mini-action::-webkit-details-marker{
  display:none;
}

.video-mini-action span{
  font-size:11px;
  color:#64748b;
  font-weight:900;
}

.video-mini-action:hover{
  transform:scale(1.08);
}

.video-bottom-actions .media-comments-box,
.video-bottom-actions .media-reactions-box{
  top:26px !important;
  left:0;
}

@media(max-width:720px){
  .video-bottom-actions{
    gap:14px;
  }

  .video-bottom-actions .media-comments-box,
  .video-bottom-actions .media-reactions-box{
    left:auto;
    right:0;
  }
}

/* Commentaires plus propres */
.media-comments-box{
  width:310px !important;
  max-width:calc(100vw - 34px);
  padding:12px !important;
  border-radius:18px !important;
}

.pretty-comment-item{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:10px !important;
  padding:10px 0 !important;
  border-bottom:1px solid #eef2f7 !important;
}

.pretty-comment-main{
  flex:1;
  min-width:0;
}

.pretty-comment-main strong{
  display:block;
  color:#0f766e !important;
  font-size:13px !important;
  font-weight:900 !important;
  margin-bottom:3px;
}

.pretty-comment-main p{
  margin:0 !important;
  color:#1f2937 !important;
  font-size:14px !important;
  line-height:1.35 !important;
  overflow-wrap:anywhere;
}

.comment-delete-form{
  margin:0 !important;
  flex:0 0 auto;
}

.comment-delete-form button{
  appearance:none;
  -webkit-appearance:none;
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#fee2e2 !important;
  color:#991b1b !important;
  font-size:16px !important;
  line-height:20px !important;
  font-weight:900 !important;
  padding:0 !important;
  cursor:pointer;
}

.comment-delete-form button:hover{
  background:#fecaca !important;
  transform:scale(1.05);
}

.media-comments-box input[name="body"]{
  height:44px;
  border-radius:14px !important;
  font-size:14px !important;
}

.media-comments-box form button[type="submit"]:not(.comment-delete-form button){
  height:44px;
  border-radius:14px !important;
}

@media(max-width:720px){
  .media-comments-box{
    width:285px !important;
  }

  .pretty-comment-main p{
    font-size:13px !important;
  }
}

/* Fix téléphone : panneau commentaires jamais coupé */
@media(max-width:720px){
  .media-comment-details{
    position:static !important;
  }

  .media-comments-box{
    position:fixed !important;
    left:50% !important;
    right:auto !important;
    top:50% !important;
    transform:translate(-50%, -50%) !important;
    width:calc(100vw - 28px) !important;
    max-width:360px !important;
    max-height:70vh !important;
    overflow-y:auto !important;
    z-index:9999 !important;
    background:#fff !important;
    border:1px solid #e5e7eb !important;
    border-radius:20px !important;
    box-shadow:0 24px 70px rgba(15,23,42,.28) !important;
    padding:14px !important;
  }

  .media-comments-box::before{
    content:"Commentaires";
    display:block;
    font-weight:900;
    color:#0f172a;
    font-size:16px;
    margin-bottom:10px;
  }

  .pretty-comment-item{
    padding:9px 0 !important;
  }

  .pretty-comment-main strong{
    font-size:13px !important;
  }

  .pretty-comment-main p{
    font-size:13px !important;
    line-height:1.35 !important;
  }

  .ajax-publication-comment-form,
  .media-comments-box form:not(.comment-delete-form){
    position:sticky;
    bottom:0;
    background:#fff;
    padding-top:10px;
    margin-top:10px !important;
  }

  .media-comments-box input[name="body"]{
    height:46px !important;
    font-size:15px !important;
  }

  .media-comments-box button[type="submit"]{
    height:46px !important;
    min-width:48px !important;
  }

  .comment-delete-form button{
    width:24px !important;
    height:24px !important;
    min-width:24px !important;
  }
}

/* Fix téléphone : panneau réactions parents jamais coupé */
@media(max-width:720px){
  .media-reactions-details{
    position:static !important;
  }

  .media-reactions-box{
    position:fixed !important;
    left:50% !important;
    right:auto !important;
    top:50% !important;
    transform:translate(-50%, -50%) !important;
    width:calc(100vw - 28px) !important;
    max-width:360px !important;
    max-height:70vh !important;
    overflow-y:auto !important;
    z-index:9999 !important;
    background:#fff !important;
    border:1px solid #e5e7eb !important;
    border-radius:20px !important;
    box-shadow:0 24px 70px rgba(15,23,42,.28) !important;
    padding:14px !important;
  }

  .media-reactions-box::before{
    content:"Réactions des parents";
    display:block;
    font-weight:900;
    color:#0f172a;
    font-size:16px;
    margin-bottom:10px;
  }

  .media-reaction-person{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    padding:9px 0 !important;
    border-bottom:1px solid #eef2f7 !important;
  }

  .media-reaction-person strong{
    display:block;
    color:#0f766e !important;
    font-size:13px !important;
    font-weight:900 !important;
  }

  .media-reaction-person small{
    display:block;
    color:#64748b !important;
    font-size:12px !important;
  }

  .reaction-emoji{
    font-size:20px !important;
    width:30px;
    text-align:center;
  }
}

/* FINAL mobile : force les réactions parents au centre de l'écran */
@media(max-width:720px){
  details.media-reactions-details[open] > .media-reactions-box{
    position:fixed !important;
    top:50% !important;
    left:50% !important;
    right:auto !important;
    bottom:auto !important;
    transform:translate(-50%, -50%) !important;
    width:calc(100vw - 34px) !important;
    max-width:360px !important;
    min-width:0 !important;
    max-height:68vh !important;
    overflow-y:auto !important;
    z-index:999999 !important;
    background:#ffffff !important;
    border:1px solid #e5e7eb !important;
    border-radius:22px !important;
    box-shadow:0 28px 80px rgba(15,23,42,.32) !important;
    padding:16px !important;
  }

  details.media-reactions-details[open] > .media-reactions-box::before{
    content:"Réactions des parents";
    display:block;
    font-weight:900;
    color:#0f172a;
    font-size:16px;
    margin-bottom:12px;
  }

  details.media-reactions-details[open] > .media-reactions-box .media-reaction-person{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    padding:10px 0 !important;
    border-bottom:1px solid #eef2f7 !important;
  }

  details.media-reactions-details[open] > .media-reactions-box .reaction-emoji{
    font-size:24px !important;
    width:34px !important;
    text-align:center !important;
    flex:0 0 34px !important;
  }

  details.media-reactions-details[open] > .media-reactions-box strong{
    color:#0f766e !important;
    font-size:14px !important;
    font-weight:900 !important;
  }

  details.media-reactions-details[open] > .media-reactions-box small{
    color:#64748b !important;
    font-size:12px !important;
    font-weight:800 !important;
  }
}

/* FINAL mobile : force tous les commentaires au centre de l'écran */
@media(max-width:720px){
  details.media-comment-details[open] > .media-comments-box{
    position:fixed !important;
    top:50% !important;
    left:50% !important;
    right:auto !important;
    bottom:auto !important;
    transform:translate(-50%, -50%) !important;
    width:calc(100vw - 34px) !important;
    max-width:360px !important;
    min-width:0 !important;
    max-height:68vh !important;
    overflow-y:auto !important;
    z-index:999999 !important;
    background:#ffffff !important;
    border:1px solid #e5e7eb !important;
    border-radius:22px !important;
    box-shadow:0 28px 80px rgba(15,23,42,.32) !important;
    padding:16px !important;
  }

  details.media-comment-details[open] > .media-comments-box::before{
    content:"Commentaires";
    display:block;
    font-weight:900;
    color:#0f172a;
    font-size:16px;
    margin-bottom:12px;
  }

  details.media-comment-details[open] > .media-comments-box .pretty-comment-item,
  details.media-comment-details[open] > .media-comments-box .media-comment-item{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:10px !important;
    padding:10px 0 !important;
    border-bottom:1px solid #eef2f7 !important;
  }

  details.media-comment-details[open] > .media-comments-box .pretty-comment-main{
    flex:1 !important;
    min-width:0 !important;
  }

  details.media-comment-details[open] > .media-comments-box strong{
    color:#0f766e !important;
    font-size:14px !important;
    font-weight:900 !important;
  }

  details.media-comment-details[open] > .media-comments-box p{
    margin:3px 0 0 0 !important;
    color:#1f2937 !important;
    font-size:13px !important;
    line-height:1.35 !important;
    overflow-wrap:anywhere !important;
  }

  details.media-comment-details[open] > .media-comments-box form:not(.comment-delete-form){
    display:flex !important;
    gap:8px !important;
    position:sticky !important;
    bottom:0 !important;
    background:#fff !important;
    padding-top:10px !important;
    margin-top:10px !important;
  }

  details.media-comment-details[open] > .media-comments-box input[name="body"]{
    height:46px !important;
    border-radius:15px !important;
    font-size:15px !important;
  }

  details.media-comment-details[open] > .media-comments-box button[type="submit"]{
    height:46px !important;
    min-width:48px !important;
    border-radius:15px !important;
  }
}

/* Participations événements / sorties / réunions */
.participation-box-step1{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--line);
}

.participation-box-step1 form{
  margin:0;
}

.participation-btn{
  border:1px solid #e5e7eb;
  border-radius:999px;
  padding:9px 13px;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
  background:#fff;
}

.participation-btn.yes{
  color:#166534;
  background:#ecfdf5;
  border-color:#bbf7d0;
}

.participation-btn.no{
  color:#991b1b;
  background:#fff1f2;
  border-color:#fecdd3;
}

.participation-counts{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}

.part-count{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:8px 11px;
  font-size:13px;
  font-weight:900;
}

.part-count.yes{
  color:#166534;
  background:#dcfce7;
}

.part-count.no{
  color:#991b1b;
  background:#fee2e2;
}

@media(max-width:720px){
  .participation-box-step1{
    gap:8px;
  }

  .participation-btn,
  .part-count{
    font-size:12px;
    padding:8px 10px;
  }
}

/* Participation publications : événement / sortie / réunion */
.participation-clean-post-box{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--line);
}

.participation-clean-post-box form{
  margin:0;
}

.participation-btn{
  border:1px solid #e5e7eb;
  border-radius:999px;
  padding:9px 13px;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
  background:#fff;
}

.participation-btn.yes{
  color:#166534;
  background:#ecfdf5;
  border-color:#bbf7d0;
}

.participation-btn.no{
  color:#991b1b;
  background:#fff1f2;
  border-color:#fecdd3;
}

.participation-counts{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}

.part-count{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:8px 11px;
  font-size:13px;
  font-weight:900;
}

.part-count.yes{
  color:#166534;
  background:#dcfce7;
}

.part-count.no{
  color:#991b1b;
  background:#fee2e2;
}

@media(max-width:720px){
  .participation-clean-post-box{
    gap:8px;
  }

  .participation-btn,
  .part-count{
    font-size:12px;
    padding:8px 10px;
  }
}

/* Icônes modifier/supprimer sur publications */
.post-card{
  position:relative;
}

.publication-admin-actions{
  position:absolute;
  top:16px;
  right:16px;
  display:flex;
  align-items:center;
  gap:12px;
  z-index:5;
}

.publication-admin-actions form{
  margin:0;
  padding:0;
  display:inline-flex;
}

.pub-action-icon{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  text-decoration:none;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.pub-action-icon:hover{
  transform:scale(1.12);
}

.pub-action-icon.delete{
  color:#991b1b;
}

.premium-form{
  display:grid;
  gap:12px;
}

.premium-form label{
  font-weight:900;
  color:#0f172a;
}

.premium-form input,
.premium-form select,
.premium-form textarea{
  width:100%;
  border:1px solid #e5e7eb;
  border-radius:16px;
  padding:13px 15px;
  font-size:15px;
  background:#fff;
}

.form-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:8px;
}

@media(max-width:720px){
  .publication-admin-actions{
    top:14px;
    right:14px;
    gap:10px;
  }

  .pub-action-icon{
    font-size:17px;
  }

  .post-card .post-top{
    padding-right:58px;
  }
}

/* Avatar auteur dans les publications */
.post-footer-with-avatar{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
}

.post-author-avatar{
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  border-radius:999px !important;
  object-fit:cover !important;
  border:2px solid #e5e7eb !important;
  background:#f8fafc !important;
}

.fallback-avatar{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:linear-gradient(135deg,#0ea5e9,#2563eb) !important;
  color:white !important;
  font-weight:900 !important;
  font-size:20px !important;
}

.post-author-meta{
  display:flex !important;
  flex-direction:column !important;
  gap:2px !important;
  min-width:0 !important;
}

.post-author-meta strong{
  font-size:15px !important;
  color:#0f172a !important;
  font-weight:900 !important;
}

.post-author-meta span{
  font-size:14px !important;
  color:#64748b !important;
  font-weight:800 !important;
}

@media(max-width:720px){
  .post-author-avatar{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
  }

  .post-author-meta strong{
    font-size:14px !important;
  }

  .post-author-meta span{
    font-size:13px !important;
  }
}

/* Oeil liste participations */
.participation-eye-details{
  position:relative;
  display:inline-flex;
}

.participation-eye-details summary{
  list-style:none;
  cursor:pointer;
  font-size:18px;
  line-height:1;
  padding:6px 8px;
  border-radius:999px;
  background:#f8fafc;
  border:1px solid #e5e7eb;
}

.participation-eye-details summary::-webkit-details-marker{
  display:none;
}

.participation-eye-box{
  position:absolute;
  right:0;
  top:38px;
  width:320px;
  max-width:calc(100vw - 32px);
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  box-shadow:0 22px 60px rgba(15,23,42,.18);
  padding:14px;
  z-index:1000;
  display:grid;
  gap:14px;
}

.part-list-col h4{
  margin:0 0 8px 0;
  font-size:14px;
  color:#0f172a;
}

.part-person{
  padding:8px 0;
  border-bottom:1px solid #eef2f7;
}

.part-person strong{
  display:block;
  font-size:13px;
  color:#0f766e;
  font-weight:900;
}

.part-person small{
  display:block;
  font-size:12px;
  color:#64748b;
}

@media(max-width:720px){
  .participation-eye-details{
    position:static !important;
  }

  details.participation-eye-details[open] > .participation-eye-box{
    position:fixed !important;
    top:50% !important;
    left:50% !important;
    right:auto !important;
    transform:translate(-50%, -50%) !important;
    width:calc(100vw - 34px) !important;
    max-width:360px !important;
    max-height:68vh !important;
    overflow-y:auto !important;
    z-index:999999 !important;
    border-radius:22px !important;
    box-shadow:0 28px 80px rgba(15,23,42,.32) !important;
  }

  details.participation-eye-details[open] > .participation-eye-box::before{
    content:"Parents participants";
    display:block;
    font-weight:900;
    color:#0f172a;
    font-size:16px;
    margin-bottom:4px;
  }
}

/* Alignement propre participation côté parent */
.participation-parent-row{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  width:100% !important;
}

.participation-parent-row form{
  margin:0 !important;
  display:inline-flex !important;
}

.participation-parent-row .participation-btn{
  white-space:nowrap !important;
}

.participation-parent-row .participation-eye-details{
  margin-left:2px !important;
}

.participation-clean-post-box{
  align-items:center !important;
}

.participation-eye-details summary{
  list-style:none !important;
  cursor:pointer !important;
  font-size:18px !important;
  line-height:1 !important;
  padding:7px 9px !important;
  border-radius:999px !important;
  background:#f8fafc !important;
  border:1px solid #e5e7eb !important;
}

.participation-eye-details summary::-webkit-details-marker{
  display:none !important;
}

@media(max-width:720px){
  .participation-parent-row{
    gap:7px !important;
  }

  .participation-parent-row .participation-btn{
    font-size:12px !important;
    padding:8px 10px !important;
  }

  .participation-parent-row .participation-eye-details summary{
    font-size:17px !important;
    padding:7px 8px !important;
  }
}

@media(max-width:430px){
  .participation-parent-row{
    display:grid !important;
    grid-template-columns:1fr 1fr auto !important;
    gap:8px !important;
  }

  .participation-parent-row form{
    width:100% !important;
  }

  .participation-parent-row .participation-btn{
    width:100% !important;
    justify-content:center !important;
    padding:8px 7px !important;
    font-size:11.5px !important;
  }

  .participation-parent-row .participation-eye-details{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
}

/* Popup oeil participations propre sur téléphone */
@media(max-width:720px){
  .participation-eye-details{
    position:static !important;
  }

  details.participation-eye-details[open] > .participation-eye-box{
    position:fixed !important;
    top:50% !important;
    left:50% !important;
    right:auto !important;
    bottom:auto !important;
    transform:translate(-50%, -50%) !important;
    width:calc(100vw - 34px) !important;
    max-width:370px !important;
    max-height:70vh !important;
    overflow-y:auto !important;
    z-index:999999 !important;
    background:#ffffff !important;
    border:1px solid #e5e7eb !important;
    border-radius:24px !important;
    box-shadow:0 28px 80px rgba(15,23,42,.32) !important;
    padding:18px !important;
  }

  details.participation-eye-details[open] > .participation-eye-box::before{
    content:"Parents participants";
    display:block;
    font-size:18px;
    font-weight:900;
    color:#0f172a;
    margin-bottom:14px;
  }

  .participation-eye-box .part-list-col{
    margin-bottom:14px !important;
  }

  .participation-eye-box .part-list-col h4{
    font-size:17px !important;
    margin:0 0 8px 0 !important;
    color:#0f172a !important;
  }

  .participation-eye-box .part-person{
    padding:9px 0 !important;
    border-bottom:1px solid #eef2f7 !important;
  }

  .participation-eye-box .part-person strong{
    font-size:15px !important;
    color:#0f766e !important;
    font-weight:900 !important;
  }

  .participation-eye-box .part-person small,
  .participation-eye-box .tiny-muted{
    font-size:14px !important;
    color:#64748b !important;
  }
}

/* Profil premium */
.profile-card-premium{
  overflow:hidden;
}

.profile-edit-form{
  display:grid;
  gap:22px;
  margin-top:18px;
}

.profile-avatar-zone{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
  padding:18px;
  border:1px solid #e5e7eb;
  border-radius:24px;
  background:linear-gradient(135deg,#f8fafc,#eff6ff);
}

.profile-big-avatar{
  width:96px;
  height:96px;
  min-width:96px;
  border-radius:28px;
  object-fit:cover;
  border:3px solid #ffffff;
  box-shadow:0 14px 36px rgba(15,23,42,.14);
}

.profile-big-avatar-fallback{
  display:flex;
  align-items:center;
  justify-content:center;
  color:white;
  font-size:42px;
  font-weight:900;
  background:linear-gradient(135deg,#0ea5e9,#2563eb);
}

.profile-upload-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:12px 16px;
  background:#ffffff;
  border:1px solid #dbeafe;
  color:#0f172a;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(15,23,42,.08);
}

.profile-upload-btn input{
  display:none;
}

.profile-fields-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.profile-fields-grid label{
  display:grid;
  gap:7px;
  font-weight:900;
  color:#0f172a;
}

.profile-fields-grid input{
  width:100%;
  border:1px solid #e5e7eb;
  border-radius:17px;
  padding:13px 15px;
  font-size:15px;
  background:#fff;
}

.profile-fields-grid input:disabled{
  background:#f8fafc;
  color:#64748b;
}

.profile-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

@media(max-width:720px){
  .profile-avatar-zone{
    justify-content:center;
    text-align:center;
  }

  .profile-fields-grid{
    grid-template-columns:1fr;
  }

  .profile-big-avatar{
    width:88px;
    height:88px;
    min-width:88px;
    border-radius:24px;
  }

  .profile-upload-btn{
    width:100%;
  }
}

/* Fix bouton photo profil iPhone/Android */
.profile-upload-wrap{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:8px;
  flex:1;
  min-width:220px;
}

.profile-file-input{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
}

.profile-upload-wrap .profile-upload-btn{
  width:100%;
  text-align:center;
  user-select:none;
  -webkit-user-select:none;
  cursor:pointer;
}

.profile-file-name{
  font-size:13px;
  font-weight:800;
  color:#0f766e;
  text-align:center;
  min-height:18px;
}

@media(max-width:720px){
  .profile-upload-wrap{
    width:100%;
    min-width:0;
  }
}

/* Header : logo école à gauche, photo profil à droite */
.brand-logo,
.school-logo,
.app-logo{
  flex-shrink:0 !important;
}

.top-profile-link{
  margin-left:auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  flex-shrink:0 !important;
}

.top-profile-photo{
  width:54px !important;
  height:54px !important;
  min-width:54px !important;
  border-radius:18px !important;
  object-fit:cover !important;
  border:3px solid #ffffff !important;
  box-shadow:0 12px 28px rgba(15,23,42,.16) !important;
  background:#f8fafc !important;
}

.top-profile-fallback{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:white !important;
  font-size:22px !important;
  font-weight:900 !important;
  background:linear-gradient(135deg,#0ea5e9,#2563eb) !important;
}

.header-profile-link{
  display:none !important;
}

@media(max-width:720px){
  .top-profile-photo{
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
    border-radius:16px !important;
  }

  .top-profile-link{
    position:absolute !important;
    top:22px !important;
    right:22px !important;
  }
}

/* Photos de profil auteur partout */
.profile-mini-avatar,
.published-profile-photo{
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  border-radius:50% !important;
  object-fit:cover !important;
  border:3px solid #ffffff !important;
  box-shadow:0 8px 18px rgba(15,23,42,.14) !important;
  background:#f8fafc !important;
}

.published-profile-fallback{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:white !important;
  font-size:18px !important;
  font-weight:900 !important;
  background:linear-gradient(135deg,#0ea5e9,#2563eb) !important;
}

.media-author,
.media-footer,
.photo-footer,
.video-footer,
.published-by,
.post-footer{
  display:flex;
  align-items:center;
  gap:12px;
}

@media(max-width:720px){
  .profile-mini-avatar,
  .published-profile-photo{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
  }
}

/* Avatar photo de profil dans commentaires Photos/Vidéos */
.pretty-comment-item{
  display:flex !important;
  align-items:flex-start !important;
  gap:10px !important;
}

.comment-profile-avatar{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  border-radius:50% !important;
  object-fit:cover !important;
  border:2px solid #ffffff !important;
  box-shadow:0 6px 14px rgba(15,23,42,.12) !important;
  background:#f8fafc !important;
}

.comment-profile-fallback{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:white !important;
  font-size:14px !important;
  font-weight:900 !important;
  background:linear-gradient(135deg,#0ea5e9,#2563eb) !important;
}

.author-avatar img{
  object-fit:cover !important;
}

@media(max-width:720px){
  .comment-profile-avatar{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
  }
}

/* Pastilles rouges nouveautés menu */
.menu-badge{
  position:absolute !important;
  top:-9px !important;
  right:-9px !important;
  min-width:20px !important;
  height:20px !important;
  padding:0 6px !important;
  border-radius:999px !important;
  background:#ef4444 !important;
  color:#fff !important;
  border:2px solid #fff !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:11px !important;
  font-weight:900 !important;
  line-height:1 !important;
  box-shadow:0 8px 18px rgba(239,68,68,.35) !important;
  z-index:50 !important;
}

nav a,
.nav a,
.menu a,
.header-nav a,
.top-nav a{
  position:relative !important;
}

/* Changer mot de passe */
.password-card-premium{
  max-width:760px;
}

.password-form-premium{
  display:grid;
  gap:16px;
  margin-top:18px;
}

.password-form-premium label{
  display:grid;
  gap:8px;
  font-weight:900;
  color:#0f172a;
}

.password-form-premium input{
  width:100%;
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:14px 16px;
  font-size:16px;
  background:#ffffff;
}

.password-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:8px;
}

.alert.error{
  background:#fee2e2;
  color:#991b1b;
  border:1px solid #fecaca;
  border-radius:16px;
  padding:12px 14px;
  font-weight:900;
  margin-top:12px;
}

.alert.success{
  background:#dcfce7;
  color:#166534;
  border:1px solid #bbf7d0;
  border-radius:16px;
  padding:12px 14px;
  font-weight:900;
  margin-top:12px;
}

@media(max-width:720px){
  .password-actions .btn{
    width:100%;
    justify-content:center;
  }
}

/* Mot de passe oublié */
.forgot-card-premium{
  max-width:760px;
}

.forgot-form-premium{
  display:grid;
  gap:16px;
  margin-top:18px;
}

.forgot-form-premium label{
  display:grid;
  gap:8px;
  font-weight:900;
  color:#0f172a;
}

.forgot-form-premium input{
  width:100%;
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:14px 16px;
  font-size:16px;
  background:#ffffff;
}

.forgot-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:8px;
}

.forgot-login-link{
  margin-top:16px;
  text-align:center;
}

.forgot-login-link a{
  font-weight:900;
  color:#2563eb;
  text-decoration:none;
}

.temp-password-box{
  margin-top:16px;
  padding:16px;
  border-radius:20px;
  background:#f0fdf4;
  border:1px solid #bbf7d0;
}

.temp-password-label{
  font-weight:900;
  color:#166534;
  margin-bottom:8px;
}

.temp-password-value{
  display:inline-flex;
  padding:12px 16px;
  border-radius:14px;
  background:#ffffff;
  border:1px solid #bbf7d0;
  font-size:22px;
  font-weight:900;
  letter-spacing:1px;
  color:#0f172a;
}

.temp-password-box p{
  margin:10px 0 0;
  color:#475569;
  font-weight:800;
}

@media(max-width:720px){
  .forgot-actions .btn{
    width:100%;
    justify-content:center;
  }

  .temp-password-value{
    width:100%;
    justify-content:center;
    font-size:20px;
  }
}

/* Lien mot de passe oublié sur login */
.forgot-password-green{
  display:inline-block !important;
  margin-top:10px !important;
  color:#047857 !important;
  font-weight:900 !important;
  text-decoration:none !important;
  border-bottom:2px solid rgba(4,120,87,.35) !important;
}

.forgot-password-green:hover{
  color:#065f46 !important;
  border-bottom-color:#065f46 !important;
}

/* Page connexion : cacher le header/menu au-dessus */
body:has(.login-page-clean) header,
body:has(.login-page-clean) .app-header,
body:has(.login-page-clean) .top-header,
body:has(.login-page-clean) .school-header,
body:has(.login-page-clean) .brand-header,
body:has(.login-page-clean) .main-header,
body:has(.login-page-clean) nav,
body:has(.login-page-clean) .top-nav,
body:has(.login-page-clean) .header-nav{
  display:none !important;
}

.login-page-clean{
  margin-top:0 !important;
}

/* Page Emails envoyés */
.emails-page-card{
  max-width:980px;
}

.email-stats-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin:24px 0;
}

.email-stat{
  border-radius:22px;
  padding:18px;
  border:1px solid #e5e7eb;
  background:#fff;
}

.email-stat strong{
  display:block;
  font-size:34px;
  line-height:1;
  color:#0f172a;
  font-weight:900;
}

.email-stat span{
  display:block;
  margin-top:8px;
  color:#64748b;
  font-weight:900;
}

.email-stat.pending{
  background:#fff7ed;
  border-color:#fed7aa;
}

.email-stat.sent{
  background:#ecfdf5;
  border-color:#bbf7d0;
}

.email-stat.failed{
  background:#fef2f2;
  border-color:#fecaca;
}

.email-stat.total{
  background:#eff6ff;
  border-color:#bfdbfe;
}

.email-list{
  display:grid;
  gap:14px;
}

.email-row{
  border:1px solid #e5e7eb;
  border-radius:22px;
  background:#fff;
  padding:18px;
}

.email-row-top{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-bottom:10px;
}

.email-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 12px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
}

.email-badge.pending{
  background:#ffedd5;
  color:#9a3412;
}

.email-badge.sent{
  background:#dcfce7;
  color:#166534;
}

.email-badge.failed{
  background:#fee2e2;
  color:#991b1b;
}

.email-date{
  color:#64748b;
  font-weight:800;
  font-size:14px;
}

.email-row h2{
  margin:0 0 14px;
  font-size:20px;
  color:#0f172a;
}

.email-meta{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.email-meta div{
  background:#f8fafc;
  border:1px solid #eef2f7;
  border-radius:16px;
  padding:12px;
}

.email-meta span{
  display:block;
  color:#64748b;
  font-size:13px;
  font-weight:800;
  margin-bottom:4px;
}

.email-meta strong{
  color:#0f172a;
  font-weight:900;
  word-break:break-word;
}

.email-error{
  margin-top:12px;
  padding:12px;
  border-radius:16px;
  background:#fef2f2;
  color:#991b1b;
  font-weight:800;
  border:1px solid #fecaca;
  word-break:break-word;
}

.empty-email-box{
  margin-top:18px;
  padding:22px;
  border-radius:20px;
  background:#f8fafc;
  border:1px dashed #cbd5e1;
  color:#64748b;
  font-weight:900;
}

@media(max-width:720px){
  .email-stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .email-meta{
    grid-template-columns:1fr;
  }

  .email-row-top{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* Interrupteur activation emails */
.email-toggle-card{
  margin:22px 0;
  padding:18px;
  border-radius:24px;
  background:linear-gradient(135deg,#f8fafc,#ffffff);
  border:1px solid #e5e7eb;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  box-shadow:0 12px 30px rgba(15,23,42,.06);
}

.email-toggle-card h2{
  margin:0;
  font-size:22px;
  color:#0f172a;
}

.email-toggle-card p{
  margin:6px 0 0;
  color:#64748b;
  font-weight:800;
}

.email-toggle-form{
  margin:0;
}

.email-toggle-btn{
  border:none;
  border-radius:999px;
  padding:13px 18px;
  font-size:16px;
  font-weight:900;
  cursor:pointer;
  white-space:nowrap;
}

.email-toggle-btn.enabled{
  background:#dcfce7;
  color:#166534;
  border:1px solid #86efac;
}

.email-toggle-btn.disabled{
  background:#fee2e2;
  color:#991b1b;
  border:1px solid #fecaca;
}

@media(max-width:720px){
  .email-toggle-card{
    flex-direction:column;
    align-items:stretch;
  }

  .email-toggle-btn{
    width:100%;
  }
}

/* Page sauvegardes */
.backups-page-card{
  max-width:980px;
}

.backup-action-card{
  margin-top:22px;
  padding:20px;
  border-radius:26px;
  border:1px solid #dbeafe;
  background:linear-gradient(135deg,#eff6ff,#ffffff);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.backup-action-card h2{
  margin:0;
  color:#0f172a;
  font-size:24px;
}

.backup-action-card p{
  margin:8px 0 0;
  color:#64748b;
  font-weight:800;
}

.backup-create-btn{
  border:none;
  border-radius:999px;
  padding:14px 20px;
  background:#2563eb;
  color:#fff;
  font-weight:900;
  font-size:16px;
  cursor:pointer;
  box-shadow:0 12px 25px rgba(37,99,235,.22);
  white-space:nowrap;
}

.backup-section-title{
  margin:28px 0 14px;
  color:#0f172a;
}

.backup-list{
  display:grid;
  gap:14px;
}

.backup-row{
  padding:16px;
  border-radius:22px;
  border:1px solid #e5e7eb;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.backup-row strong{
  display:block;
  color:#0f172a;
  font-weight:900;
  word-break:break-word;
}

.backup-row span{
  display:block;
  margin-top:5px;
  color:#64748b;
  font-weight:800;
}

.backup-row-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.backup-download-btn,
.backup-delete-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  text-decoration:none;
  border:none;
  cursor:pointer;
  white-space:nowrap;
}

.backup-download-btn{
  background:#dcfce7;
  color:#166534;
}

.backup-delete-btn{
  background:#fee2e2;
  color:#991b1b;
}

.backup-settings-card{
  background:#eff6ff !important;
  border-color:#bfdbfe !important;
}

@media(max-width:720px){
  .backup-action-card,
  .backup-row{
    flex-direction:column;
    align-items:stretch;
  }

  .backup-create-btn,
  .backup-download-btn,
  .backup-delete-btn{
    width:100%;
  }

  .backup-row-actions{
    flex-direction:column;
    align-items:stretch;
  }
}

.backup-restore-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  text-decoration:none;
  border:none;
  cursor:pointer;
  white-space:nowrap;
  background:#dbeafe;
  color:#1d4ed8;
}

.backup-restore-btn:hover{
  background:#bfdbfe;
}

@media(max-width:720px){
  .backup-restore-btn{
    width:100%;
  }
}

/* ===== MENU MOBILE PREMIUM COMPACT ===== */
@media (max-width: 760px) {

  /* Bloc haut */
  header,
  .topbar,
  .site-header,
  .app-header,
  .main-header,
  .school-header,
  .header-card {
    margin: 0 0 14px 0 !important;
    padding: 18px 18px 16px 18px !important;
    border-radius: 0 0 26px 26px !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08) !important;
  }

  /* Ligne logo + titre */
  .brand,
  .brand-row,
  .school-brand,
  .header-brand {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding-right: 76px !important;
  }

  .brand h1,
  .brand-title,
  .school-title,
  header h1,
  .topbar h1,
  .app-header h1 {
    font-size: 26px !important;
    line-height: 1.05 !important;
    margin: 0 !important;
    letter-spacing: -0.5px !important;
  }

  .brand small,
  .brand-subtitle,
  .school-subtitle,
  header small,
  .topbar small,
  .app-header small {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #6b7280 !important;
  }

  /* Avatar utilisateur en haut droite */
  .user-avatar,
  .profile-avatar,
  .header-avatar,
  .top-avatar,
  .avatar-top,
  .current-user-avatar {
    position: absolute !important;
    top: 18px !important;
    right: 18px !important;
    width: 58px !important;
    height: 58px !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 22px rgba(37, 99, 235, 0.22) !important;
  }

  /* Menu boutons */
  nav,
  .nav,
  .menu,
  .main-menu,
  .top-menu,
  .header-menu,
  .nav-pills {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 18px !important;
    width: 100% !important;
  }

  nav a,
  .nav a,
  .menu a,
  .main-menu a,
  .top-menu a,
  .header-menu a,
  .nav-pills a,
  nav button,
  .nav button,
  .menu button,
  .main-menu button {
    min-width: 0 !important;
    width: 100% !important;
    height: 44px !important;
    padding: 0 10px !important;
    border-radius: 18px !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06) !important;
  }

  /* Bouton déconnexion un peu plus large si dernier seul */
  nav a[href*="logout"],
  .nav a[href*="logout"],
  .menu a[href*="logout"],
  .main-menu a[href*="logout"],
  .top-menu a[href*="logout"],
  .header-menu a[href*="logout"] {
    grid-column: span 2 !important;
  }

  /* Supprime les gros espaces vides dans le header */
  header::after,
  .topbar::after,
  .site-header::after,
  .app-header::after,
  .main-header::after,
  .school-header::after,
  .header-card::after {
    display: none !important;
  }
}

/* Très petit téléphone */
@media (max-width: 390px) {
  nav,
  .nav,
  .menu,
  .main-menu,
  .top-menu,
  .header-menu,
  .nav-pills {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  nav a,
  .nav a,
  .menu a,
  .main-menu a,
  .top-menu a,
  .header-menu a,
  .nav-pills a {
    font-size: 17px !important;
  }
}
/* ===== FIN MENU MOBILE PREMIUM COMPACT ===== */


/* ===== MASQUER EXPLICATIONS PAGES ===== */

/* Supprime les textes descriptifs sous les grands titres de pages */
.card > h1 + p,
.card > h2 + p,
.page-card > h1 + p,
.page-card > h2 + p,
.content-card > h1 + p,
.content-card > h2 + p,
section.card > h1 + p,
section.card > h2 + p {
  display: none !important;
}

/* Classes souvent utilisées pour les explications */
.page-description,
.page-subtitle,
.page-help,
.help-text,
.intro-text,
.explain-text,
.description-text,
.muted.page-description,
.muted.page-subtitle,
p.muted.tiny-muted {
  display: none !important;
}

/* Textes explicatifs spécifiques */
p:has(+ .publication-card),
p:has(+ .media-card),
p:has(+ .backup-list),
p:has(+ .email-stats),
p:has(+ .settings-grid) {
  display: none !important;
}

/* Evite un grand vide après suppression */
.card > h1,
.page-card > h1,
.content-card > h1,
section.card > h1 {
  margin-bottom: 22px !important;
}

/* ===== FIN MASQUER EXPLICATIONS PAGES ===== */