/* ===== Nomra theme on top of UIkit 3 =====
   1) tokens + font   2) app shell   3) legacy-markup compatibility   4) print */
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn-Variable.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{--bg:#eef1f7;--card:#fff;--ink:#151a33;--mut:#68718f;--line:#e3e7f2;--brand:#3b3bd6;--brand-soft:#e9e9fc;--ok:#0f9d76;--warn:#e08a00;--bad:#e03a56;--side:#151a33;--r:14px;--head:#2f2fbf;--field:#f8f9fd}
[data-theme=dark]{--bg:#0d1022;--card:#161a33;--ink:#e9ebff;--mut:#98a1c8;--line:#262b4d;--brand:#8b8bff;--brand-soft:#23265a;--side:#0a0c1c;--head:#34377a;--field:#0f1328}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body,button,input,select,textarea,.uk-h1,.uk-h2,.uk-h3,.uk-h4,h1,h2,h3,h4,h5,h6{font-family:"Vazirmatn",Tahoma,sans-serif}
body{background:var(--bg);color:var(--ink);font-size:14px;line-height:1.7;margin:0}
h1,h2,h3,h4{color:var(--ink);font-weight:800}
a{color:var(--brand)}a:hover{color:var(--brand);opacity:.85}
:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
img{max-width:100%;height:auto}
.hidden{display:none}.small{font-size:12px}.large{font-size:16px}.help{font-size:12px;color:var(--mut)}.required,.error{color:var(--bad)}
#fifteenth{position:absolute;left:0;top:0;display:none;z-index:2000;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:8px 12px;box-shadow:0 8px 24px rgba(0,0,0,.18);max-width:calc(100vw - 16px)}

/* ---- app shell ---- */
.nm-app{display:grid;grid-template-columns:262px minmax(0,1fr);min-height:100vh}
.nm-side{background:var(--side);color:#c9cfee;padding:20px 14px;position:sticky;top:0;height:100vh;overflow:auto}
.nm-brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;margin:0 6px 22px}
.nm-brand:hover{color:#fff;opacity:1}
.nm-brand b{display:block;font-size:20px;font-weight:800;line-height:1.2}
.nm-brand small{display:block;font-size:11px;color:#8d96c4;font-weight:400}
.nm-logo{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#6a6aff,#9b6bff);display:grid;place-items:center;font-weight:800;font-size:20px;flex:none}
.nm-menu .uk-nav>li>a{color:#c9cfee;border-radius:10px;padding:10px 12px;display:flex;align-items:center;gap:10px}
.nm-menu .uk-nav>li>a:hover,.nm-menu .uk-nav>li.uk-open>a{background:#222850;color:#fff}
.nm-menu .uk-nav>li.nm-on>a{background:#fff;color:#151a33;font-weight:700}
.nm-menu .uk-nav-sub{padding:2px 12px 6px}
.nm-menu .uk-nav-sub a{color:#aeb6df;padding:7px 12px;border-radius:8px;font-size:13px}
.nm-menu .uk-nav-sub a:hover{color:#fff;background:#1c2145}
.nm-menu .uk-nav-header{color:#7d86b3}
.nm-menu ul.nm-nav{margin:2px 0}
.nm-menu .uk-nav-parent-icon>.uk-parent>a::after,.nm-oc-bar .uk-nav-parent-icon>.uk-parent>a::after{filter:invert(.85);opacity:.8}
.nm-menu .uk-nav>li>a b{font-weight:700}
.nm-content{min-width:0;display:flex;flex-direction:column}
.nm-top{display:flex;align-items:center;gap:10px;padding:14px 28px;position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px)}
.nm-grow{flex:1}
.nm-date{color:var(--mut);font-size:13px}
.nm-ibtn{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer;text-decoration:none;font-size:16px}
.nm-ibtn:hover{border-color:var(--brand);color:var(--brand);opacity:1}
.nm-burger{display:none}
.nm-user{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:3px 12px 3px 4px;height:40px}
.nm-avatar{width:30px;height:30px;border-radius:9px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-weight:800}
.nm-uname{font-weight:700;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nm-main{padding:6px 28px 60px;min-width:0;flex:1}
.nm-oc-bar{background:var(--side);padding:20px 14px}
.nm-oc-bar .nm-brand{margin-bottom:18px}
.nm-guest{background:radial-gradient(900px 500px at 85% -10%,#5b3bd633,transparent),radial-gradient(700px 400px at 0 100%,#3b3bd622,transparent),var(--bg)}
.nm-guest-main{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding:24px 14px}
.nm-guest-theme{position:fixed;top:14px;inset-inline-start:14px}

/* ---- legacy markup -> cards ---- */
.hero-unit,.main-container{position:relative!important;left:auto!important;right:auto!important;top:auto!important;width:auto!important;max-width:1100px!important;height:auto!important;margin:0 auto 18px!important;padding:24px!important;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:18px;box-shadow:0 1px 2px rgba(20,25,60,.04),0 8px 24px rgba(20,25,60,.05);overflow-x:auto;-webkit-overflow-scrolling:touch}
.hero-unit h1,.hero-unit h2,.hero-unit h3{margin-top:0}
.hero-unit[style*="position:absolute"]{position:static!important;max-width:420px!important}
.hero-unit>center:first-child{text-align:start}
hr{border:0;border-top:1px solid var(--line);margin:16px 0}
.shadow{box-shadow:0 1px 2px rgba(20,25,60,.06)}
/* alerts */
.alert{padding:12px 16px;border-radius:12px;margin:0 0 16px;border:1px solid var(--line);background:var(--brand-soft);color:var(--ink)}
.alert-success{background:#dcf5ec;border-color:#b6e8d6;color:#0a6b50}
.alert-error,.alert-danger{background:#fde7ea;border-color:#f7c3cc;color:#a82640}
.alert-info{background:#e3effd;border-color:#bfd8f7;color:#1c4f8f}
[data-theme=dark] .alert-success{background:#12382f;border-color:#1c5a4a;color:#58e0b3}
[data-theme=dark] .alert-error,[data-theme=dark] .alert-danger{background:#3a1a28;border-color:#6a2b43;color:#ff9db0}
[data-theme=dark] .alert-info{background:#14304f;border-color:#244a77;color:#9ccaff}
.alert a{font-weight:700}
/* buttons */
.btn,input[type=submit].btn,button.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 18px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font-weight:700;cursor:pointer;text-decoration:none;line-height:1.2;transition:background .15s,border-color .15s}
.btn:hover{border-color:var(--brand);color:var(--brand);opacity:1}
.btn-primary,input[type=submit].btn-primary,button.btn-primary,button.btn.btn-primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-primary:hover,button.btn-primary:hover{background:var(--head);border-color:var(--head);color:#fff}
.btn-danger{background:var(--bad);border-color:var(--bad);color:#fff}
.btn-large{min-height:46px;padding:0 26px;font-size:15px}
.btn-small{min-height:32px;padding:0 12px;font-size:12px}
form.is-submitting .btn-primary{opacity:.6;cursor:progress}
/* fields */
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=submit]):not([type=button]):not([type=hidden]):not(.uk-input),select,textarea{box-sizing:border-box;max-width:100%;min-height:40px;padding:6px 12px;background:var(--field);color:var(--ink);border:1px solid var(--line);border-radius:10px;font:inherit}
textarea{min-height:90px}
input:focus,select:focus,textarea:focus{border-color:var(--brand);outline:0;box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 22%,transparent)}
input[type=file]{max-width:100%;padding:8px;border:1px dashed var(--brand);border-radius:12px;background:var(--brand-soft);color:var(--ink);width:100%}
input[type=checkbox],input[type=radio]{accent-color:var(--brand);width:16px;height:16px;vertical-align:middle}
/* any plain submit/button of the old pages looks like a UIkit button */
.nm-main input[type=submit],.nm-main input[type=button],.nm-main input[type=reset],.nm-main button:not(.nm-ibtn):not(.btn),.nm-guest input[type=submit]{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 18px;border-radius:12px;border:1px solid var(--brand);background:var(--brand);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.nm-main input[type=submit]:hover,.nm-main input[type=button]:hover,.nm-main button:not(.nm-ibtn):not(.btn):hover{background:var(--head);border-color:var(--head)}
.nm-main input[type=button].btn,.nm-main input[type=submit].btn:not(.btn-primary){background:var(--card);color:var(--ink);border-color:var(--line)}
/* bootstrap-2 horizontal forms */
.control-group{margin-bottom:14px;display:grid;grid-template-columns:minmax(150px,230px) minmax(0,1fr);gap:6px 16px;align-items:start}
.control-label{font-weight:700;padding-top:9px;margin:0}
.controls{margin:0!important;min-width:0}
.form-vertical .control-group{display:block}
.form-vertical .control-label{display:block;padding-top:0;margin-bottom:4px}
.label{display:inline-block;padding:2px 10px;border-radius:99px;font-size:12px;font-weight:700;background:var(--brand-soft);color:var(--brand)}
.label-info{background:#e3effd;color:#1c4f8f}
[data-theme=dark] .label-info{background:#14304f;color:#9ccaff}
/* tables used all over the old pages */
table{border-collapse:separate;border-spacing:0;max-width:100%}
.table_header td,.table_header th{background:var(--head);color:#fff;padding:10px 8px;font-weight:700;text-align:center;border:0;white-space:nowrap}
.table_header td:first-child{border-start-start-radius:10px}.table_header td:last-child{border-start-end-radius:10px}
.table_rows td{padding:9px 8px;border-bottom:1px solid var(--line)}
.table_rows:hover td{background:color-mix(in srgb,var(--brand) 7%,transparent)}
.table_rows_border td{border:1px solid var(--line);padding:6px}
.tr_hover_class{background:transparent}
.table_print_header{background:#e6e8f2;color:#111;border:1px solid #888;text-align:center;padding:4px}
.print_font,.print_font td{font-family:"Vazirmatn",Tahoma,serif;color:#000}
#student-container,#term-container{max-width:100%;overflow-x:auto;border:0}
.img_hover:hover{width:150px}
.hover{text-decoration:underline}
/* popups of the old pages */
.lock{position:fixed;inset:0;background:rgba(10,12,30,.6);z-index:9999}
.popup_form{position:fixed!important;left:50%!important;right:auto!important;top:50%!important;transform:translate(-50%,-50%);margin:0!important;width:380px!important;max-width:calc(100vw - 24px);height:auto!important;max-height:calc(100vh - 24px);overflow:auto;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:18px;padding:22px!important;z-index:100000;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.popup_form input:not([type=submit]){width:100%}
#change_pass{position:fixed!important;inset:0;width:auto!important;margin:0!important;min-height:0!important}
/* tool buttons that pages put in headings */
.nm-tools-inline{display:flex;gap:8px;flex-wrap:wrap}
/* pagination of the old pages */
.pagination ul{display:flex;flex-wrap:wrap;gap:4px;list-style:none;padding:0;margin:12px 0}

/* ---- login ---- */
#login,#st_login,.nm-login{position:relative!important;left:auto!important;right:auto!important;top:auto!important;width:100%!important;max-width:430px;height:auto!important;margin:0 auto!important;padding:30px!important;background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:0 20px 60px rgba(20,25,60,.14)}
#login[style*="width:700px"]{max-width:620px}
#login form>div,#st_login form>div{height:auto!important;margin-bottom:12px}
#login input.input,#st_login input.input{width:100%;float:none!important}
.nm-login-title{margin:0 0 18px;font-size:22px;text-align:center}
.nm-login-logo{display:block;max-height:64px;width:auto;margin:0 auto 12px}
.nm-field{margin-bottom:14px}.nm-field label{display:block;font-weight:700;margin-bottom:5px}.nm-field input{width:100%}
.nm-block{width:100%}
.nm-login-msg{margin-top:10px;color:var(--mut)}
.nm-login-sub{margin:0 0 20px;color:var(--mut)}

/* ---- responsive ---- */
@media (max-width:959px){
 .nm-app{grid-template-columns:minmax(0,1fr)}
 .nm-side{display:none}
 .nm-burger{display:grid}
 .nm-top{padding:10px 14px}.nm-main{padding:4px 14px 50px}
 .nm-uname{display:none}.nm-user{padding:3px 4px}
 .nm-top{gap:6px}.nm-date{display:none}
}
@media (max-width:700px){
 .hero-unit,.main-container{padding:16px!important;border-radius:14px}
 .control-group{display:block}.control-label{display:block;padding-top:0;margin-bottom:4px}
 input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=submit]):not([type=button]):not([type=hidden]),select,textarea{width:100%;font-size:16px}
 .table_header td,.table_rows td{font-size:12px;white-space:nowrap}
 .btn-large{width:100%}
 form [style*="float:left"],form [style*="float:right"]{float:none!important}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- print: only the content ---- */
@media print{
 .nm-side,.nm-top,.uk-offcanvas,#nm-oc,.nm-guest-theme,.btn,.lock{display:none!important}
 .nm-app{display:block}body{background:#fff;color:#000}
 .nm-main{padding:0}
 .hero-unit,.main-container{box-shadow:none;border:0;max-width:none!important;padding:0!important;overflow:visible}
}

/* ---- homework cards ---- */
.nm-hw-list{display:grid;gap:12px}
.nm-hw{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:16px 18px}
.nm-hw h3{margin:0;font-size:16px}
.nm-hw p{margin:6px 0 0;color:var(--mut);max-width:70ch}
.nm-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.nm-tag{display:inline-flex;align-items:center;gap:5px;font-size:12px;background:var(--brand-soft);color:var(--brand);padding:2px 10px;border-radius:99px}
.nm-tag-late{background:#fde7ea;color:var(--bad)}
[data-theme=dark] .nm-tag-late{background:#3a1a28;color:#ff9db0}
.nm-hw-acts{display:flex;gap:6px;align-items:flex-start}
.nm-ibtn-del:hover{color:var(--bad);border-color:var(--bad)}
@media (max-width:700px){.nm-hw{grid-template-columns:1fr}}

/* dark mode: light accent needs dark text for contrast */
[data-theme=dark] .btn-primary,[data-theme=dark] button.btn-primary,[data-theme=dark] input[type=submit].btn-primary,
[data-theme=dark] .nm-main input[type=submit],[data-theme=dark] .nm-main input[type=button],[data-theme=dark] .nm-main button:not(.nm-ibtn):not(.btn){color:#0d1022}
[data-theme=dark] .btn-primary:hover,[data-theme=dark] .nm-main input[type=submit]:hover{color:#fff}
/* Student portal: center dashboard icons as one group */
.portal-icons{
  display:flex!important;
  justify-content:center!important;
  align-items:flex-start!important;
  flex-wrap:wrap!important;
  gap:28px 34px!important;
  width:100%!important;
  min-height:170px;
  margin:20px auto 0!important;
  direction:ltr;
}
.portal-icons .portal-icon{
  float:none!important;
  width:150px!important;
  margin:0!important;
  text-align:center!important;
  flex:0 0 150px;
}
.portal-icons .portal-icon a{
  display:block;
  text-align:center;
}
.portal-icons .portal-icon img{
  display:inline-block;
  max-width:100%;
}
@media (max-width:700px){
  /* Mobile: keep the dashboard icons centered and evenly distributed.
     Use a real grid instead of the legacy float widths so RTL/old inline
     styles cannot push the icons to one side. */
  .portal-icons{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    justify-items:center!important;
    align-items:start!important;
    gap:28px 12px!important;
    width:100%!important;
    margin:20px auto 0!important;
    padding:0!important;
    direction:ltr!important;
  }
  .portal-icons .portal-icon{
    float:none!important;
    width:100%!important;
    max-width:170px!important;
    margin:0!important;
    padding:0!important;
    text-align:center!important;
  }
  .portal-icons .portal-icon a{
    display:flex!important;
    flex-direction:column;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    text-align:center!important;
  }
  .portal-icons .portal-icon img{
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    height:auto!important;
    margin:0 auto!important;
  }
}
@media (max-width:420px){
  .portal-icons{
    grid-template-columns:minmax(0,1fr);
    gap:30px!important;
  }
  .portal-icons .portal-icon{max-width:180px!important;}
}

/* Homework upload progress */
.homework-upload-progress{
    margin: 18px 0 14px;
    padding: 14px 16px;
    border: 1px solid #dfe3eb;
    border-radius: 12px;
    background: #f8f9fc;
    direction: rtl;
}
.homework-upload-progress[hidden]{display:none !important}
.homework-upload-progress__header,
.homework-upload-progress__details{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}
.homework-upload-progress__header{margin-bottom:9px}
.homework-upload-progress__percent{font-weight:700;min-width:42px;text-align:left;direction:ltr}
.homework-upload-progress__track{
    width:100%;
    height:12px;
    overflow:hidden;
    border-radius:999px;
    background:#e6e9f0;
}
.homework-upload-progress__bar{
    width:0;
    height:100%;
    border-radius:inherit;
    background:#337ab7;
    transition:width .15s ease;
}
.homework-upload-progress__details{margin-top:8px;font-size:12px;color:#666}
.homework-upload-progress__size{direction:ltr;white-space:nowrap}
.homework-upload-form.is-uploading .btn-primary{opacity:.6;cursor:progress}
@media (max-width:480px){
    .homework-upload-progress{padding:12px}
    .homework-upload-progress__details{align-items:flex-start;flex-direction:column;gap:4px}
}