/* ArabicSchool v26 - fenêtres, formulaires et blocs harmonisés */
:root{
  --as-v26-bg:#071f16;
  --as-v26-panel:#0b2d20;
  --as-v26-panel-2:#103828;
  --as-v26-gold:#f3d27a;
  --as-v26-gold-2:#ffe6a3;
  --as-v26-text:#fffaf0;
  --as-v26-muted:#eadfbd;
  --as-v26-border:rgba(243,210,122,.32);
  --as-v26-input:rgba(255,255,255,.10);
  --as-v26-focus:#ffe6a3;
  --as-v26-danger:#ef7777;
  --as-v26-ok:#2fb46c;
}

/* Cartes / fenêtres principales */
.as-db-card,
.as-card,
.as-modal,
.as-panel,
.as-box,
.as-section,
.as-course-card,
.as-dict-card,
.as-tajwid-card,
.as-quran-card,
.as-badge-card,
.as-certificate-card,
.as-daily-card,
.as-error-card,
.as-route-card,
.as-admin-card,
.as-ai-panel,
.as-ai-window,
.as-chat-widget,
dialog,
[role="dialog"],
[aria-modal="true"]{
  color:var(--as-v26-text) !important;
  border-color:var(--as-v26-border) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.34) !important;
}

/* Les blocs clairs deviennent lisibles */
.as-db-card,
.as-modal,
.as-panel,
.as-box,
.as-recovery,
.as-db-recovery,
.as-ai-panel,
.as-ai-window,
.as-chat-widget,
dialog,
[role="dialog"],
[aria-modal="true"]{
  background:linear-gradient(180deg, rgba(7,31,22,.96), rgba(16,56,40,.94)) !important;
}

/* Titres et textes */
.as-db-card h1,.as-db-card h2,.as-db-card h3,.as-db-card h4,
.as-modal h1,.as-modal h2,.as-modal h3,
.as-panel h1,.as-panel h2,.as-panel h3,
.as-ai-panel h1,.as-ai-panel h2,.as-ai-panel h3,
.as-chat-widget h1,.as-chat-widget h2,.as-chat-widget h3,
dialog h1,dialog h2,dialog h3,
[role="dialog"] h1,[role="dialog"] h2,[role="dialog"] h3{
  color:var(--as-v26-gold) !important;
}

.as-db-card p,.as-db-card li,.as-db-card span,
.as-modal p,.as-modal li,.as-modal span,
.as-panel p,.as-panel li,.as-panel span,
.as-ai-panel p,.as-ai-panel li,.as-ai-panel span,
.as-chat-widget p,.as-chat-widget li,.as-chat-widget span,
dialog p,dialog li,dialog span,
[role="dialog"] p,[role="dialog"] li,[role="dialog"] span{
  color:var(--as-v26-muted);
}

.as-db-small,
.as-muted,
.as-help,
.as-hint,
.as-note,
.as-desc{
  color:var(--as-v26-muted) !important;
}

/* Formulaires */
.as-db-form label,
.as-form label,
form label{
  color:var(--as-v26-gold-2) !important;
  font-weight:850 !important;
}

.as-db-form input,.as-db-form select,.as-db-form textarea,
.as-form input,.as-form select,.as-form textarea,
.as-ai-panel input,.as-ai-panel select,.as-ai-panel textarea,
.as-chat-widget input,.as-chat-widget select,.as-chat-widget textarea,
dialog input,dialog select,dialog textarea,
[role="dialog"] input,[role="dialog"] select,[role="dialog"] textarea{
  background:var(--as-v26-input) !important;
  color:var(--as-v26-text) !important;
  border:1px solid var(--as-v26-border) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.as-db-form input::placeholder,.as-db-form textarea::placeholder,
.as-form input::placeholder,.as-form textarea::placeholder,
.as-ai-panel input::placeholder,.as-ai-panel textarea::placeholder,
.as-chat-widget input::placeholder,.as-chat-widget textarea::placeholder,
dialog input::placeholder,dialog textarea::placeholder,
[role="dialog"] input::placeholder,[role="dialog"] textarea::placeholder{
  color:#d8ccb0 !important;
  opacity:1 !important;
}

.as-db-form input:focus,.as-db-form select:focus,.as-db-form textarea:focus,
.as-form input:focus,.as-form select:focus,.as-form textarea:focus,
.as-ai-panel input:focus,.as-ai-panel select:focus,.as-ai-panel textarea:focus,
.as-chat-widget input:focus,.as-chat-widget select:focus,.as-chat-widget textarea:focus,
dialog input:focus,dialog select:focus,dialog textarea:focus,
[role="dialog"] input:focus,[role="dialog"] select:focus,[role="dialog"] textarea:focus{
  outline:3px solid rgba(243,210,122,.28) !important;
  border-color:var(--as-v26-focus) !important;
}

/* Boutons */
.as-db-btn,
.as-btn,
.as-button,
button[type="submit"],
button.as-action,
.as-ai-btn{
  border-radius:14px !important;
  font-weight:950 !important;
}

.as-db-btn.secondary,
.as-btn.secondary,
.as-button.secondary,
button.secondary{
  background:rgba(255,255,255,.11) !important;
  color:var(--as-v26-text) !important;
  border:1px solid var(--as-v26-border) !important;
}

.as-db-btn.danger,.as-btn.danger,.as-button.danger{background:var(--as-v26-danger) !important;color:#230505 !important;}
.as-db-btn.ok,.as-btn.ok,.as-button.ok{background:var(--as-v26-ok) !important;color:white !important;}

/* Messages */
.as-db-msg,
.as-alert,
.as-message,
.as-toast,
.as-result-box{
  color:var(--as-v26-text) !important;
  border:1px solid var(--as-v26-border) !important;
}
.as-db-msg.ok,.as-alert.ok,.as-message.ok,.as-toast.ok{background:#123d2c !important;color:#d8ffe9 !important;border-color:#4cc486 !important;}
.as-db-msg.err,.as-alert.err,.as-message.err,.as-toast.err{background:#3d1212 !important;color:#ffd8d8 !important;border-color:#ef7777 !important;}

/* Sections de récupération / connexion */
.as-db-recovery,
.as-recovery,
.as-login-box,
.as-auth-box{
  background:linear-gradient(180deg, rgba(7,31,22,.96), rgba(16,56,40,.94)) !important;
  color:var(--as-v26-text) !important;
  border:1px solid var(--as-v26-border) !important;
}
.as-db-recovery *,.as-recovery *,.as-login-box *,.as-auth-box *{text-shadow:none !important;}

/* Tables dans les fenêtres */
.as-db-table th,
.as-table th{
  color:var(--as-v26-gold) !important;
  background:rgba(0,0,0,.22) !important;
}
.as-db-table td,
.as-table td{
  color:var(--as-v26-text) !important;
}

/* Mobile : éviter les fenêtres trop étroites */
@media(max-width:760px){
  .as-db-card,.as-modal,.as-panel,.as-box,dialog,[role="dialog"]{border-radius:18px !important;padding:16px !important;}
  .as-db-main{padding-left:14px !important;padding-right:14px !important;}
}


/* v40 - bouton Accueil toujours visible et sans superposition */
.as-home-button,
.as-db-home,
.as-admin-home,
a[data-as-home-link]{
  position:fixed !important;
  top:12px !important;
  left:12px !important;
  right:auto !important;
  z-index:100000 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  max-width:calc(100vw - 24px) !important;
  min-width:0 !important;
  min-height:44px !important;
  padding:10px 16px !important;
  border-radius:999px !important;
  border:1px solid rgba(243,210,122,.55) !important;
  background:linear-gradient(135deg,#0b2d20,#164b35) !important;
  color:#fffaf0 !important;
  font-weight:950 !important;
  line-height:1.05 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  box-shadow:0 10px 26px rgba(0,0,0,.32) !important;
  transform:none !important;
}
.as-home-button::before,.as-home-button::after,
.as-db-home::before,.as-db-home::after,
.as-admin-home::before,.as-admin-home::after,
a[data-as-home-link]::before,a[data-as-home-link]::after{
  content:none !important;
  display:none !important;
}
@media(max-width:640px){
  .as-home-button,
  .as-db-home,
  .as-admin-home,
  a[data-as-home-link]{
    top:10px !important;
    left:10px !important;
    max-width:min(250px, calc(100vw - 20px)) !important;
    min-height:40px !important;
    padding:9px 13px !important;
    font-size:15px !important;
  }
  .as-db-main,.as-admin-main{padding-top:76px !important;}
}


/* v41 - meilleur contraste pour le bloc de signature/footer et autres blocs pâles */
.as-page-footer{
  background: linear-gradient(180deg, rgba(7,31,22,.98), rgba(16,56,40,.95)) !important;
  color: #f6edd6 !important;
  border: 1px solid rgba(243,210,122,.32) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.22) !important;
}
.as-page-footer strong,
.as-page-footer .brand,
.as-page-footer b{
  color: #f3d27a !important;
}
.as-page-footer,
.as-page-footer *{
  text-shadow: none !important;
}
.as-page-footer p,
.as-page-footer span,
.as-page-footer div,
.as-page-footer br + *{
  color: #f1e7cb !important;
}

/* bloc résultat et libellés clairs : renforcer la lisibilité si une teinte trop pâle apparaît */
.as-page-ai-result,
.as-page-ai-result-card,
.as-page-ai-result-body,
.as-page-ai-result-text,
.as-page-ai-result-empty{
  color: #fffaf0 !important;
}
.as-page-ai-result-kicker,
.as-page-ai-result-title,
.as-page-ai-result strong{
  color: #f3d27a !important;
}


/* v44 - indication sauvegardes quotidiennes */
.as-backup-notice,
.as-backup-card{
  box-sizing:border-box;
  border:1px solid rgba(243,210,122,.30) !important;
  background:linear-gradient(135deg, rgba(7,31,22,.96), rgba(18,74,52,.92)) !important;
  color:#fffaf0 !important;
  border-radius:22px;
  padding:18px;
  box-shadow:0 18px 45px rgba(0,0,0,.22);
}
.as-backup-notice{width:min(1120px, calc(100% - 24px)); margin:18px auto;}
.as-backup-notice h2,.as-backup-card h2,.as-backup-card h3{color:#f3d27a !important;margin-top:0;}
.as-backup-notice p,.as-backup-card p,.as-backup-notice li,.as-backup-card li{color:#f1e7cb !important;line-height:1.6;}
.as-backup-badge{
  display:inline-flex;align-items:center;gap:8px;margin-top:10px;
  border:1px solid rgba(47,180,108,.42);background:rgba(47,180,108,.16);
  color:#caffdf !important;border-radius:999px;padding:8px 11px;font-weight:900;
}
@media(max-width:760px){.as-backup-notice,.as-backup-card{border-radius:18px;padding:15px;}}


/* v45 - sauvegardes/restaurations établissement */
.as-backup-card .as-db-actions{margin-top:14px;}
.as-backup-card code{white-space:normal;overflow-wrap:anywhere;color:#ffe6a3;}
.as-backup-card .as-db-note{background:rgba(243,210,122,.10) !important;border-left:4px solid #f3d27a !important;}
#establishmentBackupsList .as-db-table-wrap{margin-top:8px;}
@media(max-width:760px){#establishmentBackupsList .as-db-table{min-width:640px;}}

/* v79 - correction globale des menus déroulants
   Force le rendu sombre natif des contrôles de formulaire. */
html,
body,
.as-db-page,
.as-admin-page{
  color-scheme: dark !important;
}

/* v79 - correction globale des menus déroulants
   Empêche les listes d'options d'apparaître en fond clair avec texte pâle
   sur Chrome/Edge/Windows et autres navigateurs. */
select,
select option,
select optgroup{
  color-scheme: dark !important;
}

select{
  background-color:#0b2d20 !important;
  color:#fffaf0 !important;
  border-color:rgba(243,210,122,.36) !important;
  caret-color:#fffaf0 !important;
}

select option,
select optgroup{
  background-color:#082317 !important;
  color:#fffaf0 !important;
}

select option:checked,
select option:hover,
select option:focus{
  background-color:#f3d27a !important;
  color:#071f16 !important;
}

select option[disabled],
select option:disabled{
  background-color:#102c20 !important;
  color:#eadfbd !important;
  opacity:1 !important;
}

select:focus,
select:focus-visible{
  outline:3px solid rgba(243,210,122,.32) !important;
  outline-offset:2px !important;
}



/* v81 - pages pédagogiques plus compactes et plus lisibles */
.as-compact-page {
  --as81-gap: 14px;
  --as81-radius: 18px;
}
.as-compact-page .container,
.as-compact-page #container {
  width: min(1180px, calc(100% - 28px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.as-compact-page .header,
.as-compact-page #header {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
  margin-bottom: 1rem !important;
}
.as-compact-page h1 {
  font-size: clamp(1.95rem, 4.6vw, 3.25rem) !important;
  line-height: 1.05 !important;
  margin-bottom: .55rem !important;
}
.as-compact-page h2 {
  font-size: clamp(1.45rem, 3vw, 2.05rem) !important;
  margin-bottom: .75rem !important;
}
.as-compact-page h3 {
  font-size: clamp(1.15rem, 2.2vw, 1.55rem) !important;
  margin-bottom: .65rem !important;
}
.as-compact-page .boutons,
.as-compact-page .menu,
.as-compact-page .controls,
.as-compact-page .action-buttons {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
  gap: 10px !important;
  max-width: 100% !important;
  margin-bottom: 1rem !important;
}
.as-compact-page button,
.as-compact-page .menu-btn,
.as-compact-page .audio-button,
.as-compact-page .audio-btn {
  padding: .62rem .9rem !important;
  min-height: 42px !important;
}
.as-compact-page .niveau {
  padding: 1rem !important;
  margin-bottom: 1rem !important;
  border-radius: var(--as81-radius) !important;
}
.as-compact-page .niveau::before {
  inset: 8px !important;
}
.as-compact-page .niveau > ul {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)) !important;
  gap: 12px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
.as-compact-page .encadrement,
.as-compact-page .card,
.as-compact-page .quiz-container,
.as-compact-page #welcome-screen,
.as-compact-page #grammar-table,
.as-compact-page .conjugaison-card {
  border-radius: var(--as81-radius) !important;
  padding: 1rem !important;
  margin: 0 0 12px !important;
}
.as-compact-page .encadrement .arabe,
.as-compact-page .arabe {
  line-height: 1.55 !important;
}
.as-compact-page table {
  font-size: .94rem !important;
}
.as-compact-page th,
.as-compact-page td {
  padding: .55rem .5rem !important;
}
.as-compact-page table button,
.as-compact-page td button {
  padding: .42rem .65rem !important;
  min-height: 34px !important;
  font-size: .9rem !important;
}
.as-compact-page .progress,
.as-compact-page .progress-bar {
  margin-bottom: 12px !important;
}

/* v81 - page écriture : outils regroupés, modèle et canvas plus proches */
.as-compact-writing #levelSelector {
  display: grid !important;
  grid-template-columns: minmax(220px, 360px) auto !important;
  gap: 10px !important;
  justify-content: center !important;
  align-items: end !important;
  margin: 0 auto 12px !important;
}
.as-compact-writing #levelSelector small {
  grid-column: 1 / -1 !important;
  text-align: center !important;
}
.as-compact-writing #toolbar {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)) !important;
  gap: 10px !important;
  align-items: end !important;
  padding: 12px !important;
  margin: 12px 0 !important;
}
.as-compact-writing #toolbar label {
  margin-bottom: 2px !important;
}
.as-compact-writing #toolbar select,
.as-compact-writing #toolbar input[type="range"],
.as-compact-writing #toolbar input[type="color"],
.as-compact-writing #toolbar button {
  width: 100% !important;
}
.as-compact-writing .as-writing-target-card,
.as-compact-writing #canvasContainer,
.as-compact-writing #arabicKeyboard {
  margin-top: 12px !important;
}
.as-compact-writing #canvasContainer {
  max-height: 72vh !important;
}
.as-compact-writing #canvasActionButtons,
.as-compact-writing #zoomControls {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  justify-content: center !important;
}

/* v81 - grammaire : cartes de règles en colonnes sur grand écran */
.as-compact-grammaire .niveau > ul > li.encadrement {
  min-height: 100% !important;
}
.as-compact-grammaire .niveau > ul > li.encadrement .audio-button {
  margin-top: 8px !important;
}

/* v81 - conjugaison : tableaux rapprochés et navigation compacte */
.as-compact-conjugaison .conjugaison-section {
  max-width: 1240px !important;
  margin: 0 auto 18px !important;
  padding: 1rem !important;
}
.as-compact-conjugaison .tense-quick-nav {
  padding: 12px !important;
  margin-bottom: 14px !important;
}
.as-compact-conjugaison .tense-nav-buttons {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)) !important;
  gap: 8px !important;
}
.as-compact-conjugaison .conjugaison-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(520px, 1fr)) !important;
  gap: 14px !important;
  align-items: start !important;
}
.as-compact-conjugaison .conjugaison-card {
  overflow-x: auto !important;
}
.as-compact-conjugaison .conjugaison-card h3 {
  position: sticky !important;
  top: 0 !important;
  z-index: 1 !important;
}
.as-compact-conjugaison .explication {
  margin: 10px 0 0 !important;
  line-height: 1.5 !important;
}

/* v81 - quiz : écran d'accueil et choix plus directs */
.as-compact-quiz .container {
  max-width: 1040px !important;
}
.as-compact-quiz #welcome-screen,
.as-compact-quiz #quiz-container,
.as-compact-quiz #grammar-table,
.as-compact-quiz .quiz-container {
  max-width: 1040px !important;
  width: 100% !important;
}
.as-compact-quiz .options,
.as-compact-quiz #options,
.as-compact-quiz .answer-options,
.as-compact-quiz .choices {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)) !important;
  gap: 10px !important;
}
.as-compact-quiz .question,
.as-compact-quiz #question,
.as-compact-quiz .question-arabic {
  margin-bottom: 12px !important;
  line-height: 1.55 !important;
}
.as-compact-mots-manquants {
  align-items: flex-start !important;
  padding-top: 18px !important;
}
.as-compact-mots-manquants .quiz-container {
  max-width: 980px !important;
  padding: 1rem !important;
}

@media (max-width: 720px) {
  .as-compact-page .container,
  .as-compact-page #container { width: min(100% - 18px, 1180px) !important; }
  .as-compact-page .niveau > ul { grid-template-columns: 1fr !important; }
  .as-compact-writing #levelSelector { grid-template-columns: 1fr !important; }
  .as-compact-writing #toolbar { grid-template-columns: 1fr !important; }
  .as-compact-conjugaison .conjugaison-grid { grid-template-columns: 1fr !important; }
  .as-compact-page table { font-size: .86rem !important; }
}


/* v82 - grammaire : audio tactile fiable et suppression des grands espaces sur mobile */
.as-compact-grammaire .niveau:not(.active){
  display:none !important;
}
.as-compact-grammaire .niveau.active{
  display:block !important;
  min-height:0 !important;
  height:auto !important;
  padding-bottom:1rem !important;
}
.as-compact-grammaire .niveau > ul{
  align-items:start !important;
  grid-auto-rows:auto !important;
}
.as-compact-grammaire .niveau > ul > li.encadrement{
  min-height:0 !important;
  height:auto !important;
  align-self:start !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  gap:.55rem !important;
  overflow:visible !important;
}
.as-compact-grammaire .niveau > ul > li.encadrement::before,
.as-compact-grammaire button::before{
  pointer-events:none !important;
}
.as-compact-grammaire .niveau > ul > li.encadrement .arabe{
  margin:.35rem 0 0 !important;
  padding:.75rem !important;
}
.as-compact-grammaire .audio-button{
  width:100% !important;
  max-width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:.45rem !important;
  min-height:48px !important;
  padding:.72rem 1rem !important;
  margin:.35rem 0 0 !important;
  line-height:1.1 !important;
  text-align:center !important;
  position:relative !important;
  z-index:5 !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:rgba(184,157,90,.35) !important;
  user-select:none !important;
}
.as-compact-grammaire .audio-button::before{
  content:"🔊" !important;
  position:static !important;
  inset:auto !important;
  display:inline-block !important;
  width:auto !important;
  height:auto !important;
  margin:0 .35rem 0 0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  opacity:1 !important;
  background:none !important;
  box-shadow:none !important;
  transform:none !important;
  transition:none !important;
  pointer-events:none !important;
}
.as-compact-grammaire .audio-button.is-speaking{
  filter:brightness(1.06) !important;
  box-shadow:0 0 0 3px rgba(184,157,90,.25), 0 10px 18px rgba(69,48,8,.18) !important;
}
.as-compact-grammaire .audio-button.is-speaking::after{
  content:"Lecture...";
  font-size:.9em;
  opacity:.85;
  margin-left:.35rem;
}
@media (max-width:720px){
  .as-compact-grammaire .container{
    width:min(100% - 14px, 1180px) !important;
  }
  .as-compact-grammaire .niveau.active{
    padding:.78rem !important;
    margin-bottom:.8rem !important;
  }
  .as-compact-grammaire .niveau > ul{
    gap:10px !important;
  }
  .as-compact-grammaire .niveau > ul > li.encadrement{
    padding:.85rem !important;
    margin:0 !important;
  }
  .as-compact-grammaire .niveau > ul > li.encadrement .arabe{
    font-size:clamp(1.25rem, 5.4vw, 1.65rem) !important;
    line-height:1.6 !important;
  }
}

/* v88 - audio global plus fiable et plus facile à cliquer */
[data-audio], [data-speak], .as-audio-btn{
  touch-action:manipulation;
  min-height:42px;
  cursor:pointer;
}
[data-audio].as-audio-playing, [data-speak].as-audio-playing, .as-audio-btn.as-audio-playing{
  filter:brightness(1.08);
  box-shadow:0 0 0 3px rgba(184,157,90,.24),0 10px 18px rgba(69,48,8,.18);
}
[data-audio].as-audio-error, [data-speak].as-audio-error, .as-audio-btn.as-audio-error{
  animation:as-audio-shake .28s linear 2;
}
@keyframes as-audio-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-2px)}75%{transform:translateX(2px)}}
@media(max-width:720px){[data-audio], [data-speak], .as-audio-btn{min-height:46px;padding:.72rem 1rem}}