/* SININBE EDU 4.0.2 — responsive controls and language consistency */
:root{--se-control-radius:11px;--se-popover-radius:12px}

/* Native select popovers vary by browser and cannot be reliably sized. The native
   control remains the canonical value, while this accessible trigger/menu supplies
   a stable responsive presentation. */
#m-settings .se-settings-select-shell{
  grid-template-columns:32px minmax(0,1fr) 24px!important;
  width:clamp(220px,44vw,330px)!important;
  max-width:100%!important;
  min-height:46px!important;
  border-radius:var(--se-control-radius)!important;
  overflow:visible!important;
}
#m-settings .se-settings-select-shell:focus-within{
  border-color:var(--border-strong)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset!important;
}
#m-settings .se-settings-select-shell:has(.se-smart-select-trigger:focus-visible){
  border-color:var(--primary)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--primary) 24%,transparent)!important;
}
#m-settings .se-settings-select-shell select.se-enhanced-native{
  position:absolute!important;
  inline-size:1px!important;
  block-size:1px!important;
  opacity:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
  clip-path:inset(50%)!important;
}
.se-smart-select-trigger{
  grid-column:2;display:flex;align-items:center;justify-content:space-between;gap:10px;
  inline-size:100%;min-inline-size:0;min-block-size:44px;padding:0 7px;border:0;
  border-radius:8px;background:transparent;color:var(--text-primary);font:900 .78rem/1.2 var(--se-font-ui);
  text-align:start;cursor:pointer;outline:0;white-space:nowrap;overflow:hidden;
}
.se-smart-select-trigger>span{min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.se-smart-select-trigger:focus-visible{outline:0}
.se-smart-select-menu{
  position:fixed;z-index:2147482000;display:grid;gap:4px;padding:6px;
  min-inline-size:220px;max-inline-size:calc(100vw - 20px);max-block-size:min(360px,calc(100dvh - 24px));
  overflow:auto;overscroll-behavior:contain;border:1px solid var(--border-strong);
  border-radius:var(--se-popover-radius);background:var(--surface,#0e1a2e);color:var(--text-primary);
  box-shadow:0 18px 46px rgba(0,0,0,.34);font-family:var(--se-font-ui);scrollbar-width:thin;
}
.se-smart-select-option{
  display:flex;align-items:center;justify-content:flex-start;inline-size:100%;min-block-size:44px;
  padding:9px 12px;border:1px solid transparent;border-radius:8px;background:transparent;
  color:inherit;font:850 .78rem/1.35 var(--se-font-ui);text-align:start;cursor:pointer;
}
.se-smart-select-option:hover,.se-smart-select-option:focus-visible{background:color-mix(in srgb,var(--primary) 12%,transparent);border-color:color-mix(in srgb,var(--primary) 28%,transparent);outline:0}
.se-smart-select-option[aria-selected="true"]{background:color-mix(in srgb,var(--primary) 20%,transparent);border-color:color-mix(in srgb,var(--primary) 42%,transparent);color:var(--text-primary)}
#app[data-theme="light"] .se-smart-select-menu{background:#fff;color:#0f172a;border-color:#cbd5e1;box-shadow:0 18px 44px rgba(15,23,42,.18)}

/* Neutralize the oversized green rectangular focus ring reported on theme/language controls. */
#app button:focus,#app select:focus,#app input:focus,#app textarea:focus{outline:none}
#app button:focus-visible,#app select:focus-visible,#app input:focus-visible,#app textarea:focus-visible{
  outline:2px solid color-mix(in srgb,var(--primary) 70%,white 10%);outline-offset:2px;
}

/* Direction is a document property, not a one-off component property. */
#app[data-lang="ar"] .se-smart-select-trigger,#app[data-lang="ar"] .se-smart-select-option{direction:rtl;text-align:right}
#app:not([data-lang="ar"]) .se-smart-select-trigger,#app:not([data-lang="ar"]) .se-smart-select-option{direction:ltr;text-align:left}

@media(max-width:620px){
  #m-settings .se-set-row-select{align-items:stretch!important}
  #m-settings .se-settings-select-shell{width:100%!important;max-width:none!important}
  .se-smart-select-menu{min-inline-size:0;inline-size:calc(100vw - 20px);max-inline-size:calc(100vw - 20px);padding:7px}
}
@media(max-width:360px){
  .se-smart-select-trigger,.se-smart-select-option{font-size:.72rem}
  #m-settings .se-settings-select-shell{grid-template-columns:28px minmax(0,1fr) 22px!important}
}

/* Keep document viewers inside every viewport without clipping their toolbars. */
#edu-lesson-viewer,.edu-lsv-viewer,#m-lesson-viewer .m-box{max-inline-size:100%!important;min-inline-size:0!important}
.edu-lsv-stage,.edu-lsv-office-web,.edu-lsv-pdf-reader,.edu-lsv-slide-wrap{min-inline-size:0!important;max-inline-size:100%!important}

/* SININBE EDU 4.0.2 — contrast audit for dark/light cards, fields and status labels. */
:root,[data-theme="dark"]{
  --text-secondary:#a7bfd3;
  --text-muted:#7896ad;
  --input-placeholder:#7896ad;
}
[data-theme="light"]{
  --text-secondary:#475569;
  --text-muted:#5f7185;
  --input-placeholder:#64748b;
}
#app input:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),#app textarea:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),#app select:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)){
  color:var(--text-primary)!important;
  caret-color:var(--primary)!important;
}
#app input:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *))::placeholder,#app textarea:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *))::placeholder{
  color:var(--input-placeholder,var(--text-muted))!important;
  opacity:1!important;
}
#app[data-theme="dark"] input:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),#app[data-theme="dark"] textarea:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),#app[data-theme="dark"] select:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),
html[data-theme="dark"] input:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),html[data-theme="dark"] textarea:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),html[data-theme="dark"] select:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)){
  background-color:var(--input-bg,#061026)!important;
  border-color:var(--input-border,rgba(255,255,255,.16))!important;
}
#app[data-theme="light"] input:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),#app[data-theme="light"] textarea:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),#app[data-theme="light"] select:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),
html[data-theme="light"] input:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),html[data-theme="light"] textarea:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)),html[data-theme="light"] select:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)){
  background-color:#fff!important;
  color:#172033!important;
  border-color:#cbd5e1!important;
}
#app[data-theme="light"] select:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)) option,html[data-theme="light"] select:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)) option{background:#fff!important;color:#172033!important}
#app[data-theme="dark"] select:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)) option,html[data-theme="dark"] select:not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)) option{background:#10232d!important;color:#f8fafc!important}
/* Primary actions always use high-contrast white text on the teal background. */
#app .btn.primary,#app .btn.btn-primary,#app button.primary,#app .se-primary-action,
#app .sv72-btn.primary,#app .se-custom-savebar .btn{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
#app .btn.primary *,#app .btn.btn-primary *,#app button.primary *,#app .se-primary-action *,
#app .sv72-btn.primary *,#app .se-custom-savebar .btn *{
  color:inherit!important;
  -webkit-text-fill-color:inherit!important;
}
/* Avoid pale text disappearing on white cards and black text disappearing on dark cards. */
#app[data-theme="light"] .se-admin-pane,#app[data-theme="light"] .se-admin-pane p:not(:where(.sdoc-page *,.spr-report *)),#app[data-theme="light"] .se-admin-pane small:not(:where(.sdoc-page *,.spr-report *)),
#app[data-theme="light"] .se-gradebook-shell p:not(:where(.sdoc-page *,.spr-report *)),#app[data-theme="light"] .se-gradebook-shell small:not(:where(.sdoc-page *,.spr-report *)){
  color:var(--text-muted)!important;
}
#app[data-theme="light"] .se-admin-pane h1:not(:where(.sdoc-page *,.spr-report *)),#app[data-theme="light"] .se-admin-pane h2:not(:where(.sdoc-page *,.spr-report *)),#app[data-theme="light"] .se-admin-pane h3:not(:where(.sdoc-page *,.spr-report *)),#app[data-theme="light"] .se-admin-pane strong:not(:where(.sdoc-page *,.spr-report *)),
#app[data-theme="light"] .se-gradebook-shell h1:not(:where(.sdoc-page *,.spr-report *)),#app[data-theme="light"] .se-gradebook-shell h2:not(:where(.sdoc-page *,.spr-report *)),#app[data-theme="light"] .se-gradebook-shell h3:not(:where(.sdoc-page *,.spr-report *)),#app[data-theme="light"] .se-gradebook-shell strong:not(:where(.sdoc-page *,.spr-report *)){
  color:var(--text-primary)!important;
}
#app[data-theme="dark"] .se-admin-pane,#app[data-theme="dark"] .se-gradebook-shell{color:var(--text-primary)!important}
#app [disabled],#app [aria-disabled="true"]{opacity:.62!important}

/* SININBE EDU 4.0.2 — final semantic contrast pass. */
#app[data-theme="dark"] .se-id-card-open,
[data-theme="dark"] .se-id-card-open{
  color:#eafffb!important;
  background:rgba(13,148,136,.28)!important;
  border-color:rgba(94,234,212,.62)!important;
}
#app[data-theme="light"] .se-id-card-open,
[data-theme="light"] .se-id-card-open{
  color:#134e4a!important;
  background:#ecfdf5!important;
  border-color:#5eead4!important;
}
#app[data-theme="light"] .se-id-card-open span,
#app[data-theme="light"] .se-id-card-open i,
[data-theme="light"] .se-id-card-open span,
[data-theme="light"] .se-id-card-open i{color:inherit!important;-webkit-text-fill-color:inherit!important}
/* Keep muted copy legible without allowing it to become body-black or near-white. */
#app[data-theme="light"] :is(.muted,.sub,.hint,.desc,[class*="-hint"],[class*="-subtitle"]):not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)){color:#52657a!important}
#app[data-theme="dark"] :is(.muted,.sub,.hint,.desc,[class*="-hint"],[class*="-subtitle"]):not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)){color:#91a9bd!important}
/* Explicit field labels and statuses avoid white-on-white and black-on-black regressions. */
#app[data-theme="light"] :is(label,.field-label,[class*="-label"]):not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)){color:#334155}
#app[data-theme="dark"] :is(label,.field-label,[class*="-label"]):not(:where(.sdoc-page *,.spr-report *,.edu-lsv-text *,.edu-lsv-doc *,.edu-lsv-sheet *,.edu-lsv-word-page *,.edu-lsv-slide *)){color:#c8d8e5}
#app[data-theme="light"] :is(.success,.status-success,[class*="is-success"]){color:#065f46}
#app[data-theme="dark"] :is(.success,.status-success,[class*="is-success"]){color:#a7f3d0}
#app[data-theme="light"] :is(.warning,.status-warning,[class*="is-warning"]){color:#92400e}
#app[data-theme="dark"] :is(.warning,.status-warning,[class*="is-warning"]){color:#fde68a}
#app[data-theme="light"] :is(.error,.status-error,[class*="is-error"]){color:#991b1b}
#app[data-theme="dark"] :is(.error,.status-error,[class*="is-error"]){color:#fecaca}


/* SININBE EDU 4.0.8 — modal geometry, input surfaces and voice controls. */
#app .modal.show{padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))!important;box-sizing:border-box!important}
#app .modal.show>.m-box{max-inline-size:calc(100vw - 28px)!important;max-block-size:calc(100dvh - 28px)!important;box-sizing:border-box!important}
#app .modal .m-box>.m-close{top:13px!important;inset-inline-end:13px!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;padding:0!important;margin:0!important;border-radius:11px!important;display:grid!important;place-items:center!important;line-height:1!important;box-shadow:none!important;z-index:90!important}
#app .modal .m-box>.m-close i{margin:0!important;line-height:1!important}
#app #m-settings .m-box{width:min(470px,calc(100vw - 28px))!important;height:auto!important;min-height:0!important;max-height:calc(100dvh - 28px)!important;padding:20px!important;padding-top:19px!important;overflow-y:auto!important;overflow-x:hidden!important;border-radius:20px!important}
#app #m-settings #settings-title{min-height:40px!important;display:flex!important;align-items:center!important;margin:0 0 14px!important;padding-inline-end:54px!important}
#app #m-settings .se-settings-grid{gap:10px!important;margin-top:0!important}
#app #m-settings .se-set-row{min-width:0!important;padding:11px 12px!important;border-radius:14px!important;gap:12px!important}
#app #m-settings .se-set-row>strong{min-width:82px!important;max-width:45%!important;overflow-wrap:anywhere}
#app #m-settings .se-settings-select-shell{width:min(238px,100%)!important;min-height:42px!important;border-radius:12px!important;box-shadow:none!important}
#app #m-settings .se-settings-select-shell:focus-within{box-shadow:none!important;outline:2px solid color-mix(in srgb,var(--primary) 70%,transparent)!important;outline-offset:2px!important}
#app #m-settings .se-pill-row{min-width:0!important;justify-content:flex-end!important}
#app #m-settings .se-pill{min-width:112px!important;min-height:40px!important;border-radius:11px!important;box-shadow:none!important}
#app :is(input,textarea,select),#app :is(.se-search-row,.se-settings-select-shell,.se-field,.field){box-shadow:none!important;filter:none!important}
#app :is(input,textarea,select):focus,#app :is(input,textarea,select):focus-visible{box-shadow:none!important;outline:2px solid color-mix(in srgb,var(--primary) 72%,transparent)!important;outline-offset:1px!important}
#app .modal :is(button,.btn){max-inline-size:100%;box-sizing:border-box}
#app .modal :is(.se-mini-actions,.se-audit-actions,.se-admin-actions,.sdoc-actions,.se-custom-savebar){min-width:0;flex-wrap:wrap;gap:8px}
#app .modal :is(.se-mini-actions,.se-audit-actions,.se-admin-actions,.sdoc-actions,.se-custom-savebar)>button{min-width:0;white-space:normal;overflow-wrap:anywhere}
#app #vox{min-width:0!important;min-height:50px!important;gap:8px!important;padding:6px 8px!important;border-radius:15px!important;box-shadow:none!important;overflow:hidden!important}
#app #vox .vox-wave{min-width:34px!important;overflow:hidden!important}
#app #vox .vox-cancel,#app #vox .vox-pause{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;border-radius:11px!important;box-shadow:none!important;transform:none!important}
#app #vox.on + #fab,#app #fab.red{width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important;box-shadow:none!important}
#app #m-vdub .m-box{width:min(430px,calc(100vw - 28px))!important;max-height:calc(100dvh - 28px)!important;overflow-y:auto!important;padding:20px!important;border-radius:20px!important}
#app #m-vdub .vdub-lang-grid,#app #vdub-lang-grid>div{min-width:0!important}
#app #m-vdub .vdub-lang-btn{min-width:0!important;min-height:44px!important;padding:9px 10px!important;border-radius:11px!important;box-shadow:none!important;white-space:normal!important;overflow-wrap:anywhere!important}
#app #m-vdub #vdub-custom-inp{box-shadow:none!important}
#app #m-vdub .vdub-send-orig{min-height:44px!important;border-radius:11px!important;box-shadow:none!important}
#app .se-admin-modal.show{padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))!important}
#app .se-admin-modal.show>.m-box{width:min(1540px,calc(100vw - 24px))!important;height:calc(100dvh - 24px)!important;max-height:calc(100dvh - 24px)!important;border-radius:18px!important;padding:clamp(.85rem,1.2vw,1.25rem)!important}
#app .se-admin-modal .se-admin-head{padding-inline-end:52px!important}
@media(max-width:620px){#app .modal.show{padding:6px!important}#app .modal.show>.m-box{max-inline-size:calc(100vw - 12px)!important;max-block-size:calc(100dvh - 12px)!important}#app .modal .m-box>.m-close{top:10px!important;inset-inline-end:10px!important;width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important}#app #m-settings .m-box,#app #m-vdub .m-box{width:calc(100vw - 12px)!important;max-height:calc(100dvh - 12px)!important;padding:16px!important;border-radius:16px!important}#app #m-settings .se-set-row{align-items:stretch!important;flex-direction:column!important}#app #m-settings .se-set-row>strong{min-width:0!important;max-width:none!important}#app #m-settings .se-settings-select-shell,#app #m-settings .se-pill-row,#app #m-settings .se-pill{width:100%!important;max-width:none!important}#app .se-admin-modal.show{padding:6px!important}#app .se-admin-modal.show>.m-box{width:calc(100vw - 12px)!important;height:calc(100dvh - 12px)!important;max-height:calc(100dvh - 12px)!important;border-radius:14px!important}}