@font-face{font-family:Doran;src:url('/assets/fonts/Doran-Bold.woff') format('woff');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:Alyamama;src:url('/assets/fonts/Alyamama-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Alyamama;src:url('/assets/fonts/Alyamama-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
body,input,select,textarea,button{font-family:Alyamama,Tahoma,sans-serif!important}h1,.sl-live>h1,.sl-session-head h2,.sl-dialog>header h2,.hero h1{font-family:Doran,Alyamama,sans-serif!important;font-weight:700}h2,h3,h4,.section-head h2{font-family:Alyamama,Tahoma,sans-serif!important}.hero h1{color:#fff}.section-head h2{color:#00808A}

.sl-dialog .sl-checks,.sl-live .sl-checks{display:flex;flex-wrap:wrap;gap:10px 18px;padding:12px}.sl-dialog .sl-checks label,.sl-live .sl-checks label{display:flex;align-items:center;gap:6px}.sl-dialog input[type=checkbox],.sl-live input[type=checkbox]{width:18px;height:18px;min-width:18px;padding:0;accent-color:#00808A}.sl-student-card-preview img{display:block;width:min(100%,420px);height:auto;margin:12px auto}

/* V13.0.11 lesson viewer */
.sl-lesson-frame[open]{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  overflow:hidden!important;
  background:#fff!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  box-sizing:border-box!important;
}
.sl-lesson-frame::backdrop{background:rgba(6,29,24,.78)!important}
.sl-lesson-frame-head{
  min-height:64px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:8px 14px!important;
  background:#fff!important;
  border-bottom:1px solid #dce6e1!important;
  box-sizing:border-box!important;
}
.sl-lesson-frame-head>div{display:grid!important;gap:2px!important;min-width:0!important}
.sl-lesson-frame-head b,.sl-lesson-frame-head small{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.sl-lesson-frame-head b{color:#073c34!important}
.sl-lesson-frame-head small{color:#667a72!important}
.sl-lesson-frame-head .button{flex:0 0 auto!important;min-height:42px!important}
.sl-lesson-frame-body{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
  background:#f8f5ee!important;
}
.sl-lesson-frame iframe{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  border:0!important;
  background:#f8f5ee!important;
}
@media(max-width:760px){
  .sl-lesson-frame-head{min-height:58px!important;padding:6px 8px!important;gap:8px!important}
  .sl-lesson-frame-head b{font-size:14px!important}
  .sl-lesson-frame-head small{font-size:11px!important}
  .sl-lesson-frame-head .button{padding:8px 11px!important;min-height:40px!important;font-size:14px!important}
}

/* V13.0.12 centered lesson preview */
.sl-lesson-overlay{
  position:fixed!important;
  inset:0!important;
  z-index:2147483000!important;
  display:grid!important;
  place-items:center!important;
  padding:14px!important;
  background:rgba(6,29,24,.56)!important;
  backdrop-filter:blur(2px);
  box-sizing:border-box!important;
}
.sl-lesson-panel{
  width:min(920px,calc(100vw - 28px))!important;
  height:min(82dvh,820px)!important;
  max-width:100%!important;
  max-height:100%!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  background:#fff!important;
  border:1px solid #d7e3de!important;
  border-radius:22px!important;
  overflow:hidden!important;
  box-shadow:0 22px 70px rgba(6,29,24,.28)!important;
}
.sl-lesson-toolbar{
  min-height:66px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:10px 14px!important;
  background:#fff!important;
  border-bottom:1px solid #dce6e1!important;
  box-sizing:border-box!important;
}
.sl-lesson-title{display:grid!important;gap:2px!important;min-width:0!important}
.sl-lesson-title b{color:#073c34!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.sl-lesson-title small{color:#667a72!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.sl-lesson-actions{display:flex!important;gap:8px!important;flex:0 0 auto!important}
.sl-lesson-actions .button{min-height:42px!important}
.sl-lesson-frame-body{
  min-width:0!important;
  min-height:0!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
  background:#f8f5ee!important;
}
.sl-lesson-frame-body iframe{
  display:block!important;
  width:100%!important;
  height:100%!important;
  border:0!important;
  background:#f8f5ee!important;
}
.sl-lesson-overlay.is-fullscreen{
  padding:0!important;
  background:#fff!important;
  backdrop-filter:none!important;
}
.sl-lesson-overlay.is-fullscreen .sl-lesson-panel{
  width:100vw!important;
  height:100dvh!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
@media(max-width:760px){
  .sl-lesson-overlay{padding:10px!important}
  .sl-lesson-panel{
    width:calc(100vw - 20px)!important;
    height:min(78dvh,760px)!important;
    border-radius:20px!important;
  }
  .sl-lesson-toolbar{min-height:62px!important;padding:8px 10px!important;gap:8px!important}
  .sl-lesson-title b{font-size:14px!important}
  .sl-lesson-title small{font-size:11px!important}
  .sl-lesson-actions{gap:6px!important}
  .sl-lesson-actions .button{padding:8px 10px!important;min-height:40px!important;font-size:13px!important}
  .sl-lesson-overlay.is-fullscreen .sl-lesson-panel{width:100vw!important;height:100dvh!important;border-radius:0!important}
}


/* سنابل الوحي — عدادات التسميع اللحظية والحفظ الفردي */
.sl-live .sl-metric-bar{
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;
 margin:12px 0 4px;padding:12px;border:1px solid #d8e6e1;
 border-radius:14px;background:#f8fbfa;direction:rtl;
}
.sl-live .sl-metric-counter{display:flex;flex-direction:column;gap:7px;min-width:0}
.sl-live .sl-metric-counter>span{color:#204d44;font-weight:700;font-size:13px;text-align:center}
.sl-live .sl-metric-buttons{display:grid;grid-template-columns:minmax(32px,1fr) minmax(42px,1.3fr) minmax(32px,1fr);gap:4px;align-items:center;direction:ltr}
.sl-live .sl-metric-buttons button{
 touch-action:manipulation;min-height:43px;min-width:32px;
 background:#e4f0ec;color:#075545;border:1px solid #bad7cd;
 border-radius:9px;font-weight:700;font-size:21px;padding:0
}
.sl-live .sl-metric-buttons button:active{background:#bfdcd0}
.sl-live .sl-metric-buttons button:disabled{opacity:.45}
.sl-live .sl-metric-buttons input[type=number]{
 box-sizing:border-box;width:100%;min-width:0;min-height:43px;
 border-radius:9px;border:1px solid #acc9c0;text-align:center;
 direction:ltr;font-weight:700;font-size:17px;padding:0 2px;
 color:#0d3e34;background:#fff;appearance:textfield;-moz-appearance:textfield
}
.sl-live .sl-metric-buttons input::-webkit-outer-spin-button,
.sl-live .sl-metric-buttons input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.sl-live .sl-student-save-status{display:inline-block;align-self:center;min-width:92px;color:#756a48;font-size:12px}
.sl-live .sl-student-save-status[data-saved="saved"]{color:#007c61;font-weight:700}
.sl-live .sl-student-save-status[data-saved="queued"]{color:#896616}
@media(max-width:560px){
 .sl-live .sl-metric-bar{gap:5px;padding:8px}
 .sl-live .sl-metric-counter>span{font-size:11px}
 .sl-live .sl-metric-buttons{grid-template-columns:minmax(28px,1fr) minmax(32px,1.1fr) minmax(28px,1fr);gap:2px}
 .sl-live .sl-metric-buttons button,.sl-live .sl-metric-buttons input[type=number]{min-height:46px;font-size:16px}
}


/* V13.1.1 — إجراءات الحصيلة، التصميم المعتمد */
.sl-live .sl-student-card .sl-card-actions.sl-outcome-actions{
 display:flex!important;flex-direction:column!important;align-items:stretch!important;
 gap:10px!important;width:100%;margin-top:14px;direction:rtl
}
.sl-live .sl-outcome-actions .sl-outcome-action{
 box-sizing:border-box!important;display:flex!important;align-items:center!important;
 justify-content:center!important;flex-direction:row!important;gap:10px!important;
 width:100%!important;min-width:0!important;margin:0!important;padding:12px!important;
 border:1px solid #c9e0d9;border-radius:15px;min-height:54px;
 font-family:inherit!important;font-size:16px!important;font-weight:800!important;
 line-height:1.35!important;white-space:normal;text-align:center;
 cursor:pointer;touch-action:manipulation;
 transition:background .14s ease,box-shadow .14s ease,transform .14s ease
}
.sl-live .sl-outcome-actions .sl-outcome-action svg{
 display:block;flex:none;width:23px;height:23px;pointer-events:none
}
.sl-live .sl-outcome-actions .sl-outcome-primary{
 position:relative;min-height:64px;padding:13px 53px!important;
 background:linear-gradient(110deg,#0b897a,#087767)!important;
 border-color:#087b6c!important;color:white!important;font-size:19px!important;
 box-shadow:0 5px 13px rgba(6,99,83,.17)
}
.sl-live .sl-outcome-actions .sl-outcome-primary svg{
 position:absolute;inset-inline-start:19px;width:27px;height:27px
}
.sl-live .sl-outcome-actions .sl-outcome-primary:active{
 background:#076653!important;transform:translateY(1px)
}
.sl-live .sl-outcome-actions .sl-outcome-secondary-row{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%
}
.sl-live .sl-outcome-actions .sl-outcome-secondary,
.sl-live .sl-outcome-actions .sl-outcome-guardian{
 background:#e4f1ed!important;border-color:#c7ded6!important;color:#0b5447!important
}
.sl-live .sl-outcome-actions .sl-outcome-secondary:active,
.sl-live .sl-outcome-actions .sl-outcome-guardian:active{background:#d1e8de!important}
.sl-live .sl-outcome-actions .sl-outcome-guardian{min-height:58px}
.sl-live .sl-outcome-actions .sl-student-save-status{
 align-self:stretch!important;text-align:center;margin:0;padding:0
}
.sl-live .sl-outcome-actions .sl-student-save-status:empty{display:none}
.sl-live .sl-outcome-actions .sl-student-save-status:not(:empty){
 padding:7px 10px;border-radius:9px;background:#f5faf7;font-size:12px
}
.sl-live .sl-outcome-actions .sl-outcome-action:focus-visible{
 outline:3px solid #d8bd88!important;outline-offset:3px
}
@media(max-width:440px){
 .sl-live .sl-outcome-actions .sl-outcome-action{font-size:14px!important;padding:10px 7px!important;gap:5px!important;min-height:54px}
 .sl-live .sl-outcome-actions .sl-outcome-primary{font-size:18px!important;padding:12px 48px!important;min-height:60px}
 .sl-live .sl-outcome-actions .sl-outcome-action svg{width:20px;height:20px}
 .sl-live .sl-outcome-actions .sl-outcome-primary svg{width:25px;height:25px;inset-inline-start:14px}
 .sl-live .sl-outcome-actions .sl-outcome-secondary-row{gap:8px}
}
@media(prefers-reduced-motion:reduce){
 .sl-live .sl-outcome-actions .sl-outcome-action{transition:none}
}


/* V13.1.3 — النموذج المتجاوب المعتمد لأركان التسميع وحفظ الحصيلة */
/* الحصيلة القرآنية فقط: لا تؤثر هذه القواعد في حلقات التلقين أو النماذج الأخرى */
.sl-live .sl-outcome-session,
.sl-live .sl-outcome-session *,
.sl-live .sl-outcome-session *::before,
.sl-live .sl-outcome-session *::after{box-sizing:border-box}
.sl-live .sl-outcome-session{min-width:0;width:100%;direction:rtl}
.sl-live .sl-outcome-session .sl-student-grid{
 display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important
}
.sl-live .sl-outcome-session .sl-student-card{min-width:0;overflow:hidden}
.sl-live .sl-outcome-session .sl-tracks{
 display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
 gap:13px!important;align-items:start
}
.sl-live .sl-outcome-session .sl-track{
 min-width:0!important;container-type:inline-size;
 padding:clamp(10px,1.1vw,16px)!important;border-radius:16px
}
.sl-live .sl-outcome-session .sl-track-head{flex-wrap:wrap;align-items:flex-start}
.sl-live .sl-outcome-session .sl-track-head>div{min-width:0;flex:1 1 130px}
.sl-live .sl-outcome-session .sl-metric-bar{
 display:grid!important;grid-template-columns:minmax(0,1fr)!important;
 gap:10px!important;padding:0!important;border:none!important;
 background:transparent!important;margin:12px 0 4px!important;
 min-width:0!important;direction:rtl
}
.sl-live .sl-outcome-session .sl-metric-counter{
 display:flex!important;flex-direction:column!important;min-width:0!important;
 padding:10px!important;gap:8px!important;border-radius:12px!important;
 border:1px solid #d8e6e1;background:#f7fbf9
}
.sl-live .sl-outcome-session .sl-metric-errors{border-color:#efd0ca;background:#fff9f8}
.sl-live .sl-outcome-session .sl-metric-doubts{border-color:#ebdfb9;background:#fffdf4}
.sl-live .sl-outcome-session .sl-metric-tajweed{border-color:#cedfe7;background:#f7fbfd}
.sl-live .sl-outcome-session .sl-metric-title{
 display:block!important;text-align:right!important;font-size:clamp(12px,1.35vw,15px)!important;
 font-weight:900!important;line-height:1.4!important;color:#195446
}
.sl-live .sl-outcome-session .sl-metric-errors .sl-metric-title{color:#9e493f}
.sl-live .sl-outcome-session .sl-metric-doubts .sl-metric-title{color:#896716}
.sl-live .sl-outcome-session .sl-metric-tajweed .sl-metric-title{color:#286f90}
.sl-live .sl-outcome-session .sl-metric-buttons{
 display:grid!important;direction:ltr!important;
 grid-template-columns:minmax(44px,1fr) minmax(44px,1.3fr) minmax(44px,1fr)!important;
 gap:8px!important;align-items:stretch!important;min-width:0!important
}
.sl-live .sl-outcome-session .sl-metric-buttons button{
 display:grid!important;place-items:center!important;
 width:100%!important;min-width:44px!important;min-height:48px!important;
 padding:0!important;margin:0!important;
 border:1px solid #c8ded6!important;border-radius:10px!important;
 background:#e1eee9!important;color:#135e4e!important;
 font-size:22px!important;font-weight:900!important;
 cursor:pointer;touch-action:manipulation
}
.sl-live .sl-outcome-session .sl-metric-buttons button:disabled{opacity:.4;cursor:not-allowed}
.sl-live .sl-outcome-session .sl-metric-buttons input[data-metric-count]{
 display:block!important;width:100%!important;min-width:0!important;
 height:48px!important;min-height:48px!important;
 margin:0!important;padding:0 3px!important;
 border:1px solid #b9d1c8!important;border-radius:10px!important;
 background:white!important;color:#174b40!important;text-align:center!important;
 font-size:19px!important;font-weight:900!important;direction:ltr!important
}
.sl-live .sl-outcome-session .sl-metric-buttons :is(button,input):focus-visible{
 outline:3px solid #d8bd88!important;outline-offset:2px
}
.sl-live .sl-outcome-session .sl-outcome-savebar{
 position:relative!important;bottom:auto!important;z-index:1!important;
 display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)!important;
 gap:16px!important;align-items:center!important;
 width:100%!important;min-width:0!important;
 margin-top:18px!important;padding:18px!important;
 background:#fff!important;border:1px solid #d9e6df!important;
 border-radius:19px!important;box-shadow:0 5px 22px #183c3310!important;
 backdrop-filter:none!important
}
.sl-live .sl-outcome-session .sl-savebar-copy{display:grid;gap:5px;min-width:0}
.sl-live .sl-outcome-session .sl-savebar-copy b{font-size:clamp(16px,1.5vw,21px);color:#174a3e}
.sl-live .sl-outcome-session .sl-savebar-copy small{font-size:12px;color:#5e796d;line-height:1.8}
.sl-live .sl-outcome-session .sl-savebar-actions{
 display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
 gap:12px!important;min-width:0!important;width:100%!important
}
.sl-live .sl-outcome-session .sl-savebar-actions .button{
 display:flex!important;align-items:center!important;justify-content:center!important;
 flex-direction:row!important;gap:8px!important;
 width:100%!important;min-width:0!important;max-width:100%!important;
 min-height:62px!important;margin:0!important;padding:12px 14px!important;
 border-radius:14px!important;font-size:clamp(13px,1.2vw,17px)!important;
 font-weight:850!important;line-height:1.6!important;white-space:normal!important;
 overflow-wrap:anywhere!important;text-align:center!important;touch-action:manipulation
}
.sl-live .sl-outcome-session .sl-savebar-actions .sl-savebar-submit{
 background:#087e70!important;color:white!important;border:1px solid #087668!important
}
.sl-live .sl-outcome-session .sl-savebar-actions [data-action="close-outcome-session"]{
 background:#faf5f1!important;color:#8c4a36!important;border:1px solid #ead6cd!important
}
.sl-live .sl-outcome-session .sl-savebar-icon{font-size:22px;line-height:1;flex:none}
.sl-live .sl-outcome-session .sl-savebar-actions .button:focus-visible{
 outline:3px solid #d8bd88!important;outline-offset:2px
}
/* التابلت: بطاقة طالب بعرض الشاشة، أركان التسميع متتابعة وأزرار الجلسة متجاورة */
@media(min-width:701px) and (max-width:1199px){
 .sl-live .sl-outcome-session .sl-tracks{grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
 .sl-live .sl-outcome-session .sl-outcome-savebar{grid-template-columns:minmax(0,1fr)!important}
}
/* الجوال: عداد واضح في كل سطر، حفظ وإغلاق كلٌّ في زر مستقل */
@media(max-width:700px){
 .sl-live .sl-outcome-session .sl-tracks{grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
 .sl-live .sl-outcome-session .sl-student-card{padding:12px!important}
 .sl-live .sl-outcome-session .sl-outcome-savebar{
   grid-template-columns:minmax(0,1fr)!important;gap:12px!important;padding:15px!important
 }
 .sl-live .sl-outcome-session .sl-savebar-actions{grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
 .sl-live .sl-outcome-session .sl-savebar-actions .button{min-height:58px!important;font-size:15px!important}
 .sl-live .sl-outcome-session .sl-metric-counter{padding:9px!important}
 .sl-live .sl-outcome-session .sl-metric-buttons{gap:7px!important}
}
@media(max-width:360px){
 .sl-live .sl-outcome-session .sl-metric-buttons{grid-template-columns:minmax(42px,1fr) minmax(38px,1.2fr) minmax(42px,1fr)!important;gap:5px!important}
 .sl-live .sl-outcome-session .sl-metric-buttons button{min-width:42px!important;min-height:48px!important}
}
@container (min-width:680px){
 .sl-live .sl-outcome-session .sl-metric-bar{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 .sl-live .sl-outcome-session .sl-metric-buttons{grid-template-columns:44px minmax(44px,1fr) 44px!important;gap:4px!important}
}

/* V13.1.4 — استعادة النصوص المحجوبة وتصحيح عرض الأيام دون مقررات */
@media(max-width:430px){
 .sl-live .sl-outcome-session .sl-savebar-actions .sl-savebar-submit > span{
  display:inline-flex!important;visibility:visible!important;opacity:1!important;
  align-items:center;justify-content:center;white-space:normal!important;
 }
}
.sl-live .sl-outcome-info{
 display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:12px 0;
 padding:14px 16px;border:1px solid #cae3d9;background:#f0faf5;
 color:#185c4d;border-radius:14px;
 font-size:clamp(13px,1.4vw,16px);font-weight:700;line-height:1.8;direction:rtl
}
.sl-live .sl-outcome-info .button{min-height:44px;white-space:normal}
.sl-live .sl-outcome-info-empty{background:#f8f7ef;border-color:#e4ddc5;color:#635737}
.sl-live .sl-outcome-readonly{background:#fff9f1;border-color:#ead7bc;color:#7d5428}
.sl-live .sl-outcome-session button:disabled{cursor:not-allowed}

/* سنابل الوحي V13.1.6 — زر التواصل المهني عبر واتساب في صفحة بصمة المعلمين */
.sl-live .sl-teacher-whatsapp{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;
 flex-direction:row!important;gap:7px!important;min-height:44px!important;
 padding:8px 12px!important;white-space:nowrap!important;border-radius:11px!important;
 color:#086b52!important;background:#e4f4ec!important;border:1px solid #b3dec9!important;
 font-weight:800!important;font-size:14px!important;touch-action:manipulation;
}
.sl-live .sl-teacher-whatsapp svg{display:block;flex:none;width:19px;height:19px}
.sl-live .sl-teacher-whatsapp span{display:inline!important}
.sl-live .sl-teacher-whatsapp:disabled{opacity:.55;cursor:not-allowed!important}
.sl-live .sl-teacher-whatsapp:not(:disabled):focus-visible{outline:3px solid #d8bd88;outline-offset:2px}


/* V13.4.0 · dark appearance chosen locally by the teacher */
html[data-sanabil-theme="dark"] body,
html[data-sanabil-theme="dark"] .sl-live{background:#101e1c!important;color:#e3eee9!important}
html[data-sanabil-theme="dark"] .sl-live :is(.sl-student-card,.sl-track,.sl-student-grid,.sl-plan-card,.sl-plan-grid,.sl-tasks,.sl-bulkbar,.sl-session-head,.sl-att-summary,.sl-outcome-student-search,.sl-day-kind-toolbar,.sl-inline-lesson-editor,.sl-metric-bar,.sl-metric-counter,.sl-outcome-savebar,.sl-outcome-session,.stat-card,.sl-quick-action,.sl-outcome-info,.sl-family-excuses,.sl-family-excuse,.sl-trend-card),
html[data-sanabil-theme="dark"] .sl-dialog,
html[data-sanabil-theme="dark"] .sl-dialog .sl-body{background:#18302c!important;color:#e1eee8!important;border-color:#35574c!important;box-shadow:none!important}
html[data-sanabil-theme="dark"] .sl-live :is(h1,h2,h3,h4,b,.sl-lesson-range,.sl-metric-title,.sl-student-day-kind,.sl-lesson-summary),
html[data-sanabil-theme="dark"] .sl-dialog :is(h1,h2,h3,h4,b){color:#e7f6ef!important}
html[data-sanabil-theme="dark"] .sl-live :is(p,small,label,span,legend,.sl-help,.sl-metric-title,.sl-outcome-savebar small),
html[data-sanabil-theme="dark"] .sl-dialog :is(p,small,label,span,legend){color:#b9d1c6}
html[data-sanabil-theme="dark"] .sl-live :is(input,select,textarea),
html[data-sanabil-theme="dark"] .sl-dialog :is(input,select,textarea){background:#203d37!important;color:#f1faf4!important;border-color:#537469!important}
html[data-sanabil-theme="dark"] .sl-live input::placeholder{color:#b0c3b9!important}
html[data-sanabil-theme="dark"] .sl-live :is(.sl-choice,.button-soft,.sl-metric-buttons button){background:#275247!important;color:#e8fff2!important;border-color:#4d786a!important}
html[data-sanabil-theme="dark"] .sl-live :is(.sl-choice.active,.button-primary){background:#007c70!important;color:white!important;border-color:#56ada0!important}
html[data-sanabil-theme="dark"] .sl-live :is(.sl-metric-errors,.sl-metric-doubts,.sl-metric-tajweed,.sl-rule-note){background:#293b33!important;color:#e5e9cf!important;border-color:#5b684f!important}
html[data-sanabil-theme="dark"] .sl-live .sl-absence-note{background:#382e2b!important;color:#ffd3c8!important}
html[data-sanabil-theme="dark"] .sl-live .sl-outcome-student-search{position:sticky}
html[data-sanabil-theme="dark"] .sl-live .sl-student-card [hidden]{display:none!important}
html[data-sanabil-theme="dark"] .sl-dialog::backdrop{background:#0009}
@media print{html[data-sanabil-theme="dark"] body{background:#fff!important;color:#111!important}}
/* Teacher one-screen and management trend indicators */
.sl-dashboard-one-tap{margin:14px 0;padding:14px;border:1px solid #d0e4da;border-radius:18px;background:#f8fbf8}
.sl-dashboard-one-tap>h3{margin:0 0 7px;color:#064b3d}
.sl-dashboard-one-tap>p{margin:0 0 12px;color:#527166}
.sl-trend-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.sl-trend-card{border:1px solid #d9e8df;border-radius:15px;padding:14px;background:#f7faf7;min-width:0}
.sl-trend-bars{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;align-items:end;margin-top:14px}
.sl-trend-col{display:grid;gap:6px;text-align:center;min-width:0}.sl-trend-col strong{font-size:12px;color:#38695b}
.sl-trend-track{display:flex;align-items:end;width:100%;height:104px;background:#e6eee7;border-radius:8px;overflow:hidden}
.sl-trend-track span{display:block;width:100%;background:linear-gradient(180deg,#00a18d,#007b72);border-radius:8px 8px 0 0}
.sl-trend-col small{font-size:11px;white-space:nowrap;color:#617e72}
.sl-family-excuses{margin:12px 0;border:1px solid #e6cb8c;background:#fffcf3;border-radius:16px;padding:13px}
.sl-family-excuses h3{margin:0 0 11px;color:#65511f}
.sl-family-excuse-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}
.sl-family-excuse{display:grid;gap:7px;background:white;border:1px solid #ead9b2;border-radius:12px;padding:12px;color:#28463d}
.sl-family-excuse small{line-height:1.7}
.sl-family-excuse-state{font-size:12px;color:#75602d}
.sl-family-excuse-buttons{display:flex;gap:8px}.sl-family-excuse-buttons button{border:1px solid #bacdc5;background:#eef7f1;color:#075c4d;padding:8px 12px;border-radius:9px;cursor:pointer}
@media(max-width:760px){.sl-trend-grid{grid-template-columns:1fr}.sl-trend-track{height:75px}.sl-dashboard-one-tap{padding:8px}}

.sl-trend-col{font:inherit;border:1px solid transparent;background:transparent;padding:4px 2px;border-radius:9px;cursor:pointer}.sl-trend-col:hover,.sl-trend-col:focus-visible{background:#e7f5eb;border-color:#9dcab6;outline:none}html[data-sanabil-theme="dark"] .sl-trend-col:hover,html[data-sanabil-theme="dark"] .sl-trend-col:focus-visible{background:#275247;border-color:#86baa4}html[data-sanabil-theme="dark"] .sl-trend-col strong{color:#e0f7eb}


/* V13.4.1 - Accessible night-mode tables, mobile readability and report scrolling.
   Scope to platform tables: Quran viewer pages and printed documents retain their colors. */
.sl-live .table-wrap,
.sl-dialog .table-wrap,
.sl-live .sl-day-stats-detail {
  box-sizing:border-box;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  scrollbar-width:thin;
}
.sl-live .table-wrap table,
.sl-dialog .table-wrap table {
  border-spacing:0;
  border-collapse:separate;
  width:100%;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) :is(.table-wrap,.sl-day-stats-detail) {
  background:#172d28!important;
  border:1px solid #355b4e!important;
  border-radius:13px;
  scrollbar-color:#688f7d #172d28;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) :is(.table-wrap,.sl-day-stats-detail) table {
  background:#172d28!important;
  color:#eef8f2!important;
  border-color:#355b4e!important;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table thead,
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table thead tr,
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table thead th {
  background:#20483e!important;
  color:#f6fff9!important;
  border-color:#4e7365!important;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table tbody,
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table tbody tr,
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table tbody td {
  background:#172d28!important;
  color:#edf8f1!important;
  border-color:#35584b!important;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table tbody tr:nth-child(even),
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table tbody tr:nth-child(even) td {
  background:#203b33!important;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table tbody tr:hover,
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table tbody tr:hover td {
  background:#2a5043!important;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table :is(th,td) {
  opacity:1!important;
  text-shadow:none!important;
  line-height:1.7;
  vertical-align:middle;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table :is(td,th) :is(a,small,span,b,strong) {
  color:#ecf8f0!important;
  opacity:1!important;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table a {
  color:#9ce0cb!important;
  text-decoration:underline;
  text-underline-offset:3px;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table :is(button,.button) {
  background:#285749!important;
  color:#f3fff7!important;
  border-color:#628d7c!important;
}
html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table :is(button,.button):focus-visible,
.sl-live .table-wrap:focus-visible,.sl-dialog .table-wrap:focus-visible {
  outline:3px solid #d8bd88!important;
  outline-offset:2px;
}
/* Avoid white table sections with almost-white text on mobile.
   Long tables scroll inside their own region rather than clipping the page. */
@media(max-width:760px) {
  .sl-live .table-wrap,.sl-dialog .table-wrap {width:100%;max-width:100%;overflow-x:auto;}
  .sl-live .table-wrap table,.sl-dialog .table-wrap table {
    width:max-content;
    min-width:100%;
  }
  .sl-live .table-wrap :is(th,td),.sl-dialog .table-wrap :is(th,td) {
    padding:10px 12px;
    min-width:65px;
    white-space:nowrap;
    font-size:clamp(12px,3.2vw,15px);
  }
  .sl-live .table-wrap :is(th:first-child,td:first-child),
  .sl-dialog .table-wrap :is(th:first-child,td:first-child) {
    min-width:155px;
  }
}
/* PDF/printing must always be light, regardless of device appearance. */
@media print {
  html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) :is(.table-wrap,.sl-day-stats-detail),
  html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table,
  html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table :is(thead,tbody,tr,th,td) {
    background:#fff!important;
    color:#183c33!important;
    border-color:#c6d4ce!important;
  }
  html[data-sanabil-theme="dark"] :is(.sl-live,.sl-dialog) table :is(td,th) :is(a,span,small,b,strong) {
    color:#183c33!important;
  }
}

/* Responsive welcome card: do not overflow on long profile names. */
.sl-dashboard-welcome>div{min-width:0;max-width:100%}
.sl-dashboard-welcome h2{font-size:clamp(1.35rem,4.3vw,1.8rem);overflow-wrap:anywhere;word-break:break-word}

/* Fast dashboard: immediate daily actions, lazy metrics with a compact disclosure. */
.sl-dashboard-metrics{margin:12px 0 16px;border:1px solid #dce7e2;background:#f9fcfa;border-radius:16px;overflow:hidden}
.sl-dashboard-metrics>summary{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:13px 15px;cursor:pointer;color:#075447;font-weight:750;list-style:none}
.sl-dashboard-metrics>summary::-webkit-details-marker{display:none}
.sl-dashboard-metrics>summary small{font-weight:400;color:#54756c;font-size:12px}
.sl-dashboard-metrics-content{padding:12px 14px;border-top:1px solid #dce7e2}
.sl-dashboard-metrics-content .stats-grid{margin-top:0}
html[data-sanabil-theme="dark"] .sl-dashboard-metrics{background:#172c27;border-color:#46635a;color:#e7f1ed}
html[data-sanabil-theme="dark"] .sl-dashboard-metrics>summary{color:#e7f1ed}
html[data-sanabil-theme="dark"] .sl-dashboard-metrics>summary small{color:#bdd3c8}
html[data-sanabil-theme="dark"] .sl-dashboard-metrics-content{border-color:#46635a}

/* Immediate feedback during async actions; prevent apparent unresponsive buttons. */
button.sl-action-pending{cursor:progress!important;position:relative;opacity:.85}
button.sl-action-pending::after{content:"";display:inline-block;width:13px;height:13px;vertical-align:-2px;margin-inline-start:9px;border:2px solid currentColor;border-left-color:transparent;border-radius:50%;animation:sl-action-spinner .65s linear infinite}
@keyframes sl-action-spinner{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){button.sl-action-pending::after{animation:none}}