*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Cairo","Noto Sans Arabic",Tahoma,Arial,sans-serif;background:#f4f7f5;color:#17231f}a{text-decoration:none}.logo{width:110px;height:110px;object-fit:contain}.hero{min-height:100vh;padding:55px 6vw 28px;position:relative;overflow:hidden;background:radial-gradient(circle at 80% 10%,#24654f 0,#0d3b30 34%,#062a23 100%);color:#fff}.orb{position:absolute;border-radius:50%;background:rgba(210,166,53,.12)}.o1{width:520px;height:520px;right:-180px;top:-180px}.o2{width:300px;height:300px;left:-100px;bottom:-100px}.brand{max-width:1180px;margin:auto;display:flex;align-items:center;gap:28px;position:relative}.brand h1{font-size:48px;margin:7px 0}.brand p{font-size:18px;color:#d9e7e2}.cards{max-width:1180px;margin:55px auto;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}.card{background:#fff;color:#17231f;padding:34px;border-radius:24px;min-height:285px;box-shadow:0 25px 60px rgba(0,0,0,.22);transition:.25s}.card:hover{transform:translateY(-8px)}.card i{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#e9f2ee;color:#07503d;font-style:normal;font-weight:bold}.card h2{font-size:25px;margin:25px 0 10px}.card p{color:#68736f;line-height:1.9}.card b{display:block;margin-top:28px;color:#07503d}.card.gold{border-top:5px solid #d3a52f}.hero footer{text-align:center;color:#b9cdc6;position:relative}.app-shell{min-height:100vh;display:grid;grid-template-columns:300px 1fr}.app-shell aside{background:#073c30;color:#fff;padding:35px 28px;position:sticky;top:0;height:100vh}.app-shell aside h2{font-size:28px}.app-shell aside p{color:#bed0ca;line-height:1.8}.side-steps{display:grid;gap:12px;margin:35px 0}.side-steps span{padding:12px;border-right:3px solid #d3a52f;background:rgba(255,255,255,.06)}.app-shell aside>a{color:#e4bd58}.form-area{padding:45px 5vw}.form-top{display:flex;justify-content:space-between;align-items:center;max-width:1050px;margin:auto}.form-top h1{font-size:34px;margin:5px 0}.appno{background:#fff;padding:13px 20px;border-radius:13px;box-shadow:0 8px 25px rgba(0,0,0,.06)}.appno b{display:block;color:#07503d}.form-area form{max-width:1050px;margin:25px auto;background:#fff;border-radius:22px;box-shadow:0 12px 40px rgba(0,0,0,.06);overflow:hidden}.form-area section{padding:30px 34px;border-bottom:1px solid #edf0ee}.form-area h3{font-size:21px;border-right:4px solid #d3a52f;padding-right:12px}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px 25px}label span{display:block;font-weight:bold;margin-bottom:8px}input,select{width:100%;height:47px;border:1px solid #d8e0dc;border-radius:10px;padding:0 12px;background:#fbfcfc}.upload input{padding:9px}.upload small{display:block;margin-top:7px}.check{display:flex;align-items:center;gap:8px}.check input{width:auto;height:auto}.form-actions{padding:25px 34px;display:flex;gap:12px}.btn{border:0;background:#07503d;color:#fff;border-radius:11px;padding:14px 24px;font-weight:bold;cursor:pointer}.btn.alt{background:#d3a52f}.btn.inline{display:inline-block}.notice{max-width:1050px;margin:20px auto;background:#e9f6f0;color:#07503d;padding:14px;border-radius:10px}.login-screen{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top right,#21634e,#07372d 55%,#04241e);padding:20px}.login-box{width:min(480px,100%);background:#fff;border-radius:25px;padding:38px;box-shadow:0 25px 70px rgba(0,0,0,.28);text-align:center}.login-box .logo{width:130px;height:130px}.login-box h1{font-size:30px}.login-box p{color:#6b7772}.login-box label{text-align:right;display:block;margin:15px 0}.login-box .btn{width:100%}.back{display:block;margin-top:18px;color:#07503d}.error{background:#fff0f0;color:#8a2525;padding:10px;border-radius:9px}.student-dash,.staff{min-height:100vh;padding:30px 5vw}.student-dash header,.staff header{display:flex;align-items:center;gap:22px;max-width:1200px;margin:auto}.student-dash header>a,.staff header>a{margin-right:auto;color:#07503d}.student-dash h1,.staff h1{margin:4px 0}.status-hero{max-width:1200px;margin:35px auto;background:linear-gradient(120deg,#07503d,#0d6a51);color:#fff;border-radius:22px;padding:30px;display:flex;justify-content:space-between}.status-hero small{display:block;color:#c5ddd5}.status-hero b,.status-hero strong{font-size:24px}.timeline{max-width:1200px;margin:35px auto;display:grid;grid-template-columns:repeat(6,1fr);background:#fff;border-radius:18px;padding:28px;box-shadow:0 8px 30px rgba(0,0,0,.05)}.timeline div{text-align:center;color:#9aa5a1}.timeline i{display:block;width:16px;height:16px;background:#dce3e0;border-radius:50%;margin:0 auto 10px}.timeline .now{color:#07503d;font-weight:bold}.timeline .now i{background:#d3a52f;box-shadow:0 0 0 6px #f5ecd3}.dash-card{max-width:1200px;margin:auto;background:#fff;padding:28px;border-radius:18px}.staff header{background:#fff;padding:18px 24px;border-radius:18px}.stats{max-width:1200px;margin:25px auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.stats div{background:#fff;padding:24px;border-radius:17px}.stats b{display:block;font-size:32px;color:#07503d}.stats span{color:#73807b}.toolbar,.table-wrap{max-width:1200px;margin:20px auto}.table-wrap{background:#fff;border-radius:18px;overflow:auto}.table-wrap table{width:100%;border-collapse:collapse;min-width:900px}.table-wrap th,.table-wrap td{padding:15px;border-bottom:1px solid #edf0ee;text-align:right}.tag{background:#e9f5ef;color:#07503d;padding:6px 10px;border-radius:20px}@media(max-width:850px){.cards{grid-template-columns:1fr}.brand{flex-direction:column;text-align:center}.brand h1{font-size:34px}.app-shell{display:block}.app-shell aside{height:auto;position:relative}.side-steps{display:none}.grid{grid-template-columns:1fr}.form-area{padding:25px 15px}.form-top,.status-hero{align-items:flex-start;gap:15px;flex-direction:column}.timeline{grid-template-columns:1fr;gap:15px}.timeline div{display:flex;align-items:center;gap:10px;text-align:right}.timeline i{margin:0}.stats{grid-template-columns:1fr}}
/* v2.1 visual polish */
:root{--uac-green:#064936;--uac-green2:#0b684e;--uac-gold:#d6a62e;--uac-ink:#14231e}
.logo{filter:none;object-fit:contain}
.card{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.75);box-shadow:0 28px 70px rgba(0,0,0,.24);animation:uacRise .7s cubic-bezier(.2,.8,.2,1) both}
.card:nth-child(2){animation-delay:.12s}.card:nth-child(3){animation-delay:.24s}
.card:before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;left:-90px;top:-90px;background:radial-gradient(circle,rgba(211,165,47,.16),transparent 70%);transition:.35s}
.card:hover{transform:translateY(-10px) scale(1.012);box-shadow:0 34px 80px rgba(0,0,0,.3)}
.card:hover:before{transform:scale(1.4)}
.card i{transition:.3s}.card:hover i{transform:rotate(-5deg) scale(1.08);background:#f5ecd2;color:#9b7415}
@keyframes uacRise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
.brand .logo{animation:uacLogo 1s ease both}
@keyframes uacLogo{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}
.field-error{border-color:#b42318!important;box-shadow:0 0 0 3px rgba(180,35,24,.08)!important}
.arabic-error{font-size:12px;color:#b42318;margin-top:6px;font-weight:700}
.cred-overlay{position:fixed;inset:0;z-index:999999;background:rgba(3,25,20,.72);backdrop-filter:blur(7px);display:grid;place-items:center;padding:20px;animation:uacFade .25s ease}
.cred-modal{width:min(520px,100%);background:#fff;border-radius:26px;padding:36px;position:relative;text-align:center;box-shadow:0 35px 100px rgba(0,0,0,.38);animation:uacPop .4s cubic-bezier(.2,.9,.2,1.15)}
.cred-close{position:absolute;left:18px;top:15px;width:38px;height:38px;border:0;border-radius:50%;background:#f0f4f2;color:#24443a;font-size:24px;cursor:pointer}
.cred-icon{width:66px;height:66px;margin:auto;border-radius:50%;display:grid;place-items:center;background:#eaf6f0;color:var(--uac-green);font-size:32px;font-weight:900}
.cred-modal h2{font-size:27px;margin:18px 0 7px}.cred-modal>p{color:#697772;line-height:1.8}
.cred-row{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;margin:10px 0;background:#f5f8f7;border:1px solid #e1e8e5;border-radius:13px;text-align:right}
.cred-row span{color:#68756f}.cred-row b{font-size:19px;color:var(--uac-green);direction:ltr;letter-spacing:.5px}
.cred-btn{margin-top:18px}.cred-modal small{display:block;color:#84908b;margin-top:13px}
@keyframes uacFade{from{opacity:0}to{opacity:1}}@keyframes uacPop{from{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:none}}
.status-hero{box-shadow:0 20px 55px rgba(7,80,61,.18)}
.timeline,.dash-card{box-shadow:0 14px 40px rgba(0,0,0,.07)}
@media(prefers-reduced-motion:reduce){.card,.brand .logo,.cred-overlay,.cred-modal{animation:none!important}.card{transition:none!important}}

/* v2.2 — enforce Cairo on the entire standalone system */
html,body,button,input,select,textarea,label,a,table,th,td,span,small,strong,b,h1,h2,h3,h4,p,div{
 font-family:"Cairo",sans-serif!important;
}
input::placeholder,textarea::placeholder{font-family:"Cairo",sans-serif!important}
.logo{filter:none!important;background:transparent!important}
.brand .logo{width:125px;height:125px}
.login-box .logo{width:145px;height:145px}
.app-shell aside .logo{width:135px;height:135px}
.staff header .logo,.student-dash header .logo{width:105px;height:105px}

/* v2.3 student sidebar, branded staff login, print/PDF */
.staff-login-box{border-top:5px solid #d3a52f}.login-badge{display:inline-block;background:#edf6f2;color:#07503d;padding:7px 13px;border-radius:30px;font-weight:800;font-size:12px}
.student-shell{min-height:100vh;display:grid;grid-template-columns:280px 1fr;background:#f4f7f5}
.student-side{height:100vh;position:sticky;top:0;background:linear-gradient(180deg,#043c30,#062c25);padding:28px 22px;color:#fff;display:flex;flex-direction:column}
.student-side .logo{width:115px;height:115px;margin:0 auto 18px}.student-side-name{text-align:center;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.12)}.student-side-name small{display:block;color:#b9d0c8;margin-bottom:5px}.student-side-name b{font-size:16px}
.student-side nav{display:grid;gap:8px;margin-top:28px}.student-side nav a{color:#e6f0ec;padding:13px 15px;border-radius:10px;border-right:3px solid transparent;transition:.2s}.student-side nav a:hover,.student-side nav a.active{background:rgba(255,255,255,.09);border-right-color:#d3a52f;color:#fff}
.student-logout{margin-top:auto;color:#e8c768;padding:13px 15px}.student-main{padding:35px 5vw}.student-main>header{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:auto}.student-main>header h1{margin:5px 0}.mini-appno{background:#fff;border-radius:14px;padding:12px 18px;box-shadow:0 8px 25px rgba(0,0,0,.05)}.mini-appno span{display:block;color:#7b8782;font-size:12px}.mini-appno b{color:#07503d;direction:ltr;display:block}.student-grid{max-width:1200px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.print-report{max-width:1100px;margin:30px auto;padding:0 20px}.print-head{display:flex;align-items:center;gap:20px;background:#fff;padding:22px;border-radius:18px;margin-bottom:22px}.print-head .logo{width:90px;height:90px}.print-head h1{margin:0}.print-head p{margin:5px 0;color:#68756f}.print-head button{margin-right:auto;border:0;background:#07503d;color:#fff;border-radius:10px;padding:12px 18px;cursor:pointer;font-weight:800}.print-app{background:#fff;border-radius:18px;padding:25px;margin-bottom:18px;break-inside:avoid}.print-app-title{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e8eeeb;padding-bottom:14px}.print-app-title h2{margin:0}.print-app-title>b{color:#07503d;direction:ltr}.print-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:18px 0}.print-grid div,.print-files div{background:#f6f8f7;padding:12px;border-radius:9px}.print-grid span,.print-files span{display:block;color:#76827d;font-size:12px}.print-files{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.print-files a{color:#07503d;font-weight:800}.print-files em{color:#8d9894;font-style:normal}
@media print{body{background:#fff}.print-report{max-width:none;margin:0;padding:0}.print-head button{display:none}.print-head,.print-app{box-shadow:none;border:1px solid #ddd}.print-app{page-break-inside:avoid}}
@media(max-width:850px){.student-shell{display:block}.student-side{height:auto;position:relative}.student-side nav{grid-template-columns:1fr 1fr}.student-logout{margin-top:15px}.student-main{padding:24px 15px}.student-main>header{align-items:flex-start;gap:15px;flex-direction:column}.student-grid,.print-grid,.print-files{grid-template-columns:1fr}}

/* v2.5 unmistakable version marker */
.system-version{display:inline-block;margin-top:7px;padding:5px 10px;border-radius:20px;background:#edf6f2;color:#07503d;font-size:11px;font-weight:800;direction:ltr}
.footer-version{display:inline-block;margin-right:7px;padding:3px 8px;border:1px solid rgba(255,255,255,.22);border-radius:20px;font-size:10px;direction:ltr}

/* v2.6 — two registration cards + compact status tab + logo rules */
.registration-cards{grid-template-columns:repeat(3,1fr);align-items:stretch}
.status-mini-card{grid-column:1/-1;justify-self:center;width:min(520px,100%);display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(8px);padding:13px 18px;border-radius:15px;color:#fff;transition:.25s}
.status-mini-card:hover{background:rgba(255,255,255,.16);transform:translateY(-3px)}
.status-mini-card span{font-size:12px;color:#e7c66e;font-weight:800}.status-mini-card b{font-size:14px}.status-mini-card em{margin-right:auto;font-style:normal;font-size:20px}
.logo-white{filter:none!important}.logo-color{filter:none!important}
.brand .logo-white{width:135px;height:135px}
.app-shell aside .logo-white,.student-side .logo-white{width:135px;height:135px}
.login-box .logo-color{width:145px;height:145px}
.staff header .logo-color,.print-head .logo-color{object-fit:contain}
.new-students-shell .form-area form{border-top:4px solid #d3a52f}
@media(max-width:850px){.registration-cards{grid-template-columns:1fr}.status-mini-card{grid-column:auto}}

/* v2.6.1 — restore normal page scrolling; sidebar moves with the document */
.student-side,
.app-shell > aside{
  position:relative !important;
  top:auto !important;
  height:auto !important;
  min-height:100vh;
  max-height:none !important;
  overflow:visible !important;
  align-self:stretch;
}
.student-shell,
.app-shell{
  min-height:100vh;
  height:auto !important;
  overflow:visible !important;
}
html,body{
  height:auto !important;
  min-height:100%;
  overflow-x:hidden;
  overflow-y:auto !important;
}

/* v2.7 staff workflow */
.row-actions{min-width:270px}.admin-action-form{display:flex;gap:6px;flex-wrap:wrap}
.mini{border:0;border-radius:8px;padding:7px 10px;font-family:"Cairo",sans-serif;font-weight:800;cursor:pointer}
.mini.approve{background:#07503d;color:#fff}.mini.return{background:#d3a52f;color:#17251f}.mini.delete{background:#8f2525;color:#fff}
.row-note{display:block;margin-top:5px;max-width:220px;white-space:normal;color:#8f5e00}
.return-note{margin:14px 0;padding:16px 18px;border-right:4px solid #d3a52f;background:#fff8e6;border-radius:12px}
.return-note b{color:#805b00}.return-note p{margin:6px 0}.return-note a{font-weight:800;color:#07503d}

/* v2.7.1 — explicit return to status */
.status-back{background:#fff!important;color:#07503d!important;border:1px solid #07503d!important;text-decoration:none;text-align:center}
.status-back:hover{background:#edf6f2!important}

/* v2.8.1 submitted application lock */
.application-fields{border:0;padding:0;margin:0;min-width:0}
.application-fields:disabled{opacity:.86}
.application-fields:disabled input,.application-fields:disabled select,.application-fields:disabled textarea{background:#f3f5f4!important;color:#46504b!important;cursor:not-allowed}
.locked-notice{margin:0 0 18px;padding:16px 18px;border-radius:14px;background:#f7f3e7;border-right:4px solid #d3a52f;display:flex;gap:8px 14px;align-items:center;flex-wrap:wrap}
.locked-notice b{color:#07503d}.locked-notice span{flex:1;min-width:260px}.locked-notice a{font-weight:800;color:#07503d}

/* v2.8.4 smart registration filters */
.smart-filters{display:grid;grid-template-columns:minmax(220px,1.6fr) repeat(5,minmax(135px,1fr));gap:10px;align-items:end;background:#fff;border:1px solid #e2e7e4;border-radius:16px;padding:14px;margin:14px 0;box-shadow:0 5px 18px rgba(10,60,45,.05)}
.smart-filters label{display:block;font-size:12px;font-weight:800;color:#51615a;margin:0 0 5px}
.smart-filters input,.smart-filters select{width:100%;height:42px;border:1px solid #d8e0dc;border-radius:10px;padding:0 10px;background:#fafcfb;color:#18352b}
.filter-reset{height:42px;border:0;border-radius:10px;background:#edf2ef;color:#07503d;font-weight:800;cursor:pointer}
.filter-count{height:42px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#07503d;color:#fff;font-weight:700}.filter-count b{margin-right:5px}
.type-tag{display:inline-flex;padding:5px 9px;border-radius:999px;background:#eef5f1;color:#07503d;font-size:12px;font-weight:800;white-space:nowrap}
@media(max-width:1100px){.smart-filters{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.smart-filters{grid-template-columns:1fr 1fr}.filter-search{grid-column:1/-1}}

.staff-head-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.staff-head-actions>a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.staff-head-actions .staff-logout{background:#fff;border:1px solid #d7dfdb;color:#8b2d2d!important;padding:9px 13px;border-radius:8px;font-weight:800}
.staff-head-actions .staff-logout:hover{background:#fff6f6;border-color:#caa;color:#6f1f1f!important}
@media(max-width:700px){.staff-head-actions{width:100%}.staff-head-actions>a{flex:1}}

.student-open-link{color:#07503d;text-decoration:none;font-weight:800;border-bottom:1px dashed #9ab7ad}.student-open-link:hover{color:#b18a25}
.student-detail{max-width:1180px;margin:0 auto}.student-form-view{background:#fff;border:1px solid #dfe6e2;border-radius:14px;padding:20px;margin-top:18px}
.detail-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.detail-title h2,.attachments-heading{margin:0;color:#07503d;font-size:18px}
.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid #e1e7e4;border-right:1px solid #e1e7e4}
.detail-field{display:grid;grid-template-columns:38% 62%;border-left:1px solid #e1e7e4;border-bottom:1px solid #e1e7e4;min-height:48px}.detail-field span{background:#f5f7f6;padding:10px;color:#65716b;font-size:12px;font-weight:700}.detail-field b{padding:10px;font-size:13px;overflow-wrap:anywhere}
.detail-note{margin-top:14px;padding:12px;border:1px solid #e7ddbd;background:#fffaf0;border-radius:9px}.detail-note p{margin:4px 0 0}
.attachments-heading{margin-top:22px;margin-bottom:10px}.attachment-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.attachment-card{border:1px solid #dfe6e2;border-radius:10px;overflow:hidden;background:#fafcfb}.attachment-card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;background:#f3f6f4}.attachment-card-head a,.attachment-file a{color:#07503d;font-weight:800;text-decoration:none}.attachment-preview{display:block;padding:10px;text-align:center}.attachment-preview img{display:block;max-width:100%;height:300px;object-fit:contain;margin:auto;background:#fff}.attachment-pdf{width:100%;height:380px;border:0;background:#fff}.attachment-empty,.attachment-file{padding:28px 12px;text-align:center;color:#7d8983}.attachment-file{display:flex;justify-content:center;gap:12px}
@media(max-width:760px){.detail-grid,.attachment-cards{grid-template-columns:1fr}.detail-field{grid-template-columns:42% 58%}.attachment-preview img{height:auto;max-height:360px}}

html{scroll-behavior:smooth}
.student-section-nav a{position:relative;transition:background .2s ease,color .2s ease,border-color .2s ease}
.student-section-nav a i{display:none;margin-right:auto;font-style:normal;width:22px;height:22px;border-radius:50%;align-items:center;justify-content:center;background:#d7eee4;color:#07503d;font-size:12px;font-weight:900}
.student-section-nav a.completed i{display:inline-flex}
.student-section-nav a.active{background:#fff!important;color:#07503d!important;border-color:#d5e3dd!important;font-weight:900}
.student-section-nav a.active:before{content:"";position:absolute;right:0;top:9px;bottom:9px;width:4px;border-radius:4px;background:#c3a052}
.student-extra-section{scroll-margin-top:22px;background:#fff;border:1px solid #dfe6e2;border-radius:14px;padding:20px;margin-top:18px}
#overview,#status,#application,#documents{scroll-margin-top:22px}
.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-head small{color:#78857e}.section-head h2{margin:2px 0 0;color:#07503d;font-size:19px}
.change-code-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:end}.change-code-form label{display:grid;gap:6px}.change-code-form label span{font-size:12px;font-weight:800;color:#52615a}.change-code-form input{width:100%;box-sizing:border-box;border:1px solid #d7e0dc;border-radius:9px;padding:11px;background:#fff}
.student-success{padding:10px 12px;margin-bottom:12px;border-radius:9px;background:#edf8f2;color:#07503d;font-weight:800}
.contact-list{border-top:1px solid #e0e7e3;border-right:1px solid #e0e7e3}.contact-list>div{display:grid;grid-template-columns:30% 70%;border-left:1px solid #e0e7e3;border-bottom:1px solid #e0e7e3}.contact-list span{background:#f5f7f6;padding:12px;color:#66736d;font-size:12px;font-weight:800}.contact-list b{padding:12px;font-size:13px;overflow-wrap:anywhere}.contact-list a{color:#07503d;text-decoration:none;border-bottom:1px dashed #9bb8ad}
@media(max-width:760px){.change-code-form{grid-template-columns:1fr}.contact-list>div{grid-template-columns:1fr}.contact-list span{border-bottom:1px solid #e0e7e3}}

.interactive-form-steps{display:grid;gap:14px}
.interactive-form-steps a{display:flex!important;align-items:center;gap:10px;text-decoration:none!important;background:rgba(255,255,255,.07);border-right:3px solid #c6a02d;padding:15px 14px!important;color:#fff!important;transition:background .2s ease,border-color .2s ease,color .2s ease}
.interactive-form-steps a span{flex:1;padding:0!important;background:none!important;border:0!important}
.interactive-form-steps a i{display:none;width:23px;height:23px;border-radius:50%;align-items:center;justify-content:center;background:#dff4e9;color:#07503d;font-style:normal;font-size:12px;font-weight:900}
.interactive-form-steps a.completed{background:rgba(214,239,226,.16)!important;border-right-color:#78c49f!important}
.interactive-form-steps a.completed i{display:inline-flex}
.interactive-form-steps a.active{background:#fff!important;color:#07503d!important;border-right-color:#d2aa2c!important;font-weight:900}
.interactive-form-steps a.active i{background:#07503d;color:#fff}
.form-area section[id]{scroll-margin-top:22px}
.form-college-contact{margin-top:20px}
.form-contact-grid{border-top:1px solid #dfe6e2;border-right:1px solid #dfe6e2}
.form-contact-grid>div{display:grid;grid-template-columns:30% 70%;border-left:1px solid #dfe6e2;border-bottom:1px solid #dfe6e2}
.form-contact-grid span{padding:11px;background:#f5f7f6;color:#65716b;font-size:12px;font-weight:800}.form-contact-grid b{padding:11px;font-size:13px;overflow-wrap:anywhere}.form-contact-grid a{color:#07503d;text-decoration:none;border-bottom:1px dashed #9ab7ad}
@media(max-width:760px){.form-contact-grid>div{grid-template-columns:1fr}.form-contact-grid span{border-bottom:1px solid #dfe6e2}}

/* v2.8.15 — compact fixed registration sidebar */
@media(min-width:901px){
 .app-shell{align-items:stretch}
 .app-shell>aside{position:sticky!important;top:0!important;align-self:flex-start!important;height:100vh!important;max-height:100vh!important;overflow:hidden!important;box-sizing:border-box!important;padding:22px 22px 18px!important;display:flex!important;flex-direction:column!important}
 .app-shell>aside .brand-logo,.app-shell>aside img{max-height:72px!important;width:auto!important;object-fit:contain!important}
 .app-shell>aside h2{font-size:19px!important;line-height:1.45!important;margin:12px 0 5px!important}
 .app-shell>aside>p{font-size:12px!important;line-height:1.65!important;margin:0 0 12px!important}
 .interactive-form-steps{display:grid!important;gap:7px!important;margin:0!important}
 .interactive-form-steps a{min-height:46px!important;padding:9px 11px!important;box-sizing:border-box!important}
 .interactive-form-steps a span{font-size:14px!important;line-height:1.35!important}
 .interactive-form-steps a i{width:20px!important;height:20px!important;flex:0 0 20px!important}
 .app-shell>aside>a:last-child{margin-top:12px!important;padding-top:10px!important;font-size:13px!important}
}
@media(min-width:901px) and (max-height:720px){
 .app-shell>aside{padding-top:12px!important;padding-bottom:10px!important}
 .app-shell>aside .brand-logo,.app-shell>aside img{max-height:52px!important}
 .app-shell>aside h2{font-size:17px!important;margin:7px 0 3px!important}
 .app-shell>aside>p{font-size:11px!important;line-height:1.45!important;margin-bottom:7px!important}
 .interactive-form-steps{gap:5px!important}
 .interactive-form-steps a{min-height:38px!important;padding:6px 9px!important}
 .interactive-form-steps a span{font-size:12px!important}
 .app-shell>aside>a:last-child{margin-top:7px!important;padding-top:6px!important}
}

/* v2.8.16 — truly fixed registration sidebar; only content scrolls */
@media(min-width:901px){
 body:has(.app-shell){overflow:hidden!important;height:100vh!important}
 .app-shell{height:100vh!important;min-height:0!important;overflow:hidden!important;display:grid!important;grid-template-columns:minmax(0,1fr) 360px!important;align-items:stretch!important}
 .app-shell>aside{
   grid-column:2!important;grid-row:1!important;position:relative!important;top:auto!important;
   height:100vh!important;max-height:none!important;overflow:hidden!important;
   padding:18px 24px 16px!important;box-sizing:border-box!important;
   display:flex!important;flex-direction:column!important;
 }
 .app-shell>.form-area{
   grid-column:1!important;grid-row:1!important;height:100vh!important;min-height:0!important;
   overflow-y:auto!important;overflow-x:hidden!important;box-sizing:border-box!important;
   scroll-behavior:smooth!important;overscroll-behavior:contain!important;
 }
 .app-shell>aside .brand-logo,.app-shell>aside img{max-height:64px!important;margin:0 auto 5px!important}
 .app-shell>aside h2{margin:5px 0 2px!important;font-size:19px!important}
 .app-shell>aside>p{margin:0 0 13px!important;font-size:12px!important;line-height:1.55!important}
 .interactive-form-steps{flex:0 0 auto!important;display:grid!important;gap:7px!important;width:100%!important}
 .interactive-form-steps a{min-height:48px!important;padding:9px 12px!important}
 .interactive-form-steps a span{font-size:14px!important}
 .app-shell>aside>a:last-child{margin-top:auto!important;padding:12px 0 2px!important;font-size:13px!important}
}
@media(min-width:901px) and (max-height:760px){
 .app-shell>aside{padding:10px 20px 9px!important}
 .app-shell>aside .brand-logo,.app-shell>aside img{max-height:46px!important;margin-bottom:2px!important}
 .app-shell>aside h2{font-size:17px!important;margin:3px 0 1px!important}
 .app-shell>aside>p{font-size:11px!important;line-height:1.35!important;margin-bottom:7px!important}
 .interactive-form-steps{gap:5px!important}
 .interactive-form-steps a{min-height:39px!important;padding:6px 9px!important}
 .interactive-form-steps a span{font-size:12px!important}
 .app-shell>aside>a:last-child{padding-top:7px!important}
}

/* v2.8.17 — fixed RIGHT sidebar, larger and vertically distributed */
@media(min-width:901px){
 body:has(.app-shell){direction:rtl!important}
 .app-shell{
   direction:rtl!important;
   grid-template-columns:380px minmax(0,1fr)!important;
 }
 .app-shell>aside{
   grid-column:1!important;grid-row:1!important;
   direction:rtl!important;
   padding:26px 26px 22px!important;
 }
 .app-shell>.form-area{
   grid-column:2!important;grid-row:1!important;
   direction:rtl!important;
 }
 .app-shell>aside .brand-logo,.app-shell>aside img{
   max-height:92px!important;margin:0 auto 12px!important;
 }
 .app-shell>aside h2{
   font-size:24px!important;line-height:1.45!important;margin:6px 0 5px!important;
 }
 .app-shell>aside>p{
   font-size:14px!important;line-height:1.75!important;margin:0 0 20px!important;
 }
 .interactive-form-steps{
   flex:1 1 auto!important;
   display:flex!important;flex-direction:column!important;
   justify-content:space-evenly!important;
   gap:10px!important;
   min-height:0!important;
 }
 .interactive-form-steps a{
   flex:0 1 66px!important;
   min-height:58px!important;
   padding:14px 16px!important;
   border-right-width:4px!important;
 }
 .interactive-form-steps a span{
   font-size:16px!important;line-height:1.5!important;font-weight:800!important;
 }
 .interactive-form-steps a i{
   width:26px!important;height:26px!important;flex-basis:26px!important;font-size:14px!important;
 }
 .app-shell>aside>a:last-child{
   margin-top:18px!important;padding:14px 0 2px!important;
   font-size:15px!important;font-weight:800!important;text-align:center!important;
 }
}
@media(min-width:901px) and (max-height:760px){
 .app-shell{grid-template-columns:350px minmax(0,1fr)!important}
 .app-shell>aside{padding:13px 20px 11px!important}
 .app-shell>aside .brand-logo,.app-shell>aside img{max-height:60px!important;margin-bottom:4px!important}
 .app-shell>aside h2{font-size:20px!important;margin:3px 0!important}
 .app-shell>aside>p{font-size:12px!important;line-height:1.45!important;margin-bottom:7px!important}
 .interactive-form-steps{gap:6px!important}
 .interactive-form-steps a{min-height:45px!important;flex-basis:48px!important;padding:8px 11px!important}
 .interactive-form-steps a span{font-size:14px!important}
 .app-shell>aside>a:last-child{margin-top:7px!important;padding-top:7px!important;font-size:13px!important}
}

/* v2.8.18 — tighter desktop tabs + mobile bottom navigation */
@media(min-width:901px){
 .interactive-form-steps{
   justify-content:flex-start!important;
   gap:6px!important;
 }
 .interactive-form-steps a{
   flex:0 0 auto!important;
   min-height:52px!important;
   padding:10px 14px!important;
 }
 .app-shell>aside>a:last-child{margin-top:auto!important}
}
@media(max-width:900px){
 body:has(.app-shell){padding-bottom:76px!important}
 .app-shell{display:block!important;min-height:0!important}
 .app-shell>aside{
   position:fixed!important;
   z-index:9999!important;
   right:0!important;left:0!important;bottom:0!important;top:auto!important;
   width:100%!important;height:auto!important;min-height:0!important;
   padding:7px 8px calc(7px + env(safe-area-inset-bottom))!important;
   background:#064b3b!important;
   box-shadow:0 -5px 18px rgba(0,0,0,.16)!important;
   overflow-x:auto!important;overflow-y:hidden!important;
   display:block!important;
 }
 .app-shell>aside>.brand-logo,.app-shell>aside>img,
 .app-shell>aside>h2,.app-shell>aside>p,
 .app-shell>aside>a:last-child{display:none!important}
 .interactive-form-steps{
   display:flex!important;
   flex-direction:row!important;
   gap:6px!important;
   width:max-content!important;
   min-width:100%!important;
   margin:0!important;
 }
 .interactive-form-steps a{
   flex:1 0 auto!important;
   min-width:112px!important;min-height:52px!important;
   padding:7px 9px!important;
   border-right:0!important;border-bottom:3px solid #c6a02d!important;
   border-radius:7px!important;
   justify-content:center!important;
 }
 .interactive-form-steps a span{
   flex:0 1 auto!important;
   font-size:12px!important;line-height:1.35!important;
   text-align:center!important;white-space:nowrap!important;
 }
 .interactive-form-steps a i{
   width:19px!important;height:19px!important;flex:0 0 19px!important;font-size:11px!important;
 }
 .interactive-form-steps a.active{border-bottom-color:#d2aa2c!important}
 .app-shell>.form-area{
   height:auto!important;overflow:visible!important;
   padding-bottom:20px!important;
 }
 .form-area section[id]{scroll-margin-top:18px!important;scroll-margin-bottom:88px!important}
}
@media(max-width:480px){
 body:has(.app-shell){padding-bottom:72px!important}
 .app-shell>aside{padding:6px 6px calc(6px + env(safe-area-inset-bottom))!important}
 .interactive-form-steps{gap:5px!important}
 .interactive-form-steps a{min-width:104px!important;min-height:48px!important;padding:6px 7px!important}
 .interactive-form-steps a span{font-size:11px!important}
}

/* v2.8.19 — mobile bottom bar: all tabs visible, no horizontal scroll */
@media(max-width:900px){
 .app-shell>aside{
   overflow:hidden!important;
   padding:5px 5px calc(5px + env(safe-area-inset-bottom))!important;
 }
 .interactive-form-steps{
   display:grid!important;
   grid-template-columns:repeat(var(--uac-step-count,5),minmax(0,1fr))!important;
   gap:4px!important;
   width:100%!important;
   min-width:0!important;
   overflow:visible!important;
 }
 .interactive-form-steps a{
   min-width:0!important;
   width:auto!important;
   min-height:50px!important;
   padding:6px 3px!important;
   gap:3px!important;
   overflow:hidden!important;
 }
 .interactive-form-steps a span{
   min-width:0!important;
   width:100%!important;
   font-size:10px!important;
   line-height:1.25!important;
   white-space:normal!important;
   text-align:center!important;
 }
 .interactive-form-steps a i{
   position:absolute!important;
   top:2px!important;left:2px!important;
   width:16px!important;height:16px!important;
   font-size:9px!important;
 }
}
@media(max-width:380px){
 .interactive-form-steps a span{font-size:9px!important}
 .interactive-form-steps a{padding-left:2px!important;padding-right:2px!important}
}

@media(max-width:900px){
 .app-shell:not(.new-students-shell) .interactive-form-steps{--uac-step-count:6}
 .new-students-shell .interactive-form-steps{--uac-step-count:5}
}

/* v2.8.20 — restore mobile form identity + portal return above fixed bottom tabs */
@media(max-width:900px){
 body:has(.app-shell){padding-top:92px!important;padding-bottom:70px!important}
 .app-shell>aside{
   display:block!important;
   position:fixed!important;
   right:0!important;left:0!important;bottom:0!important;top:auto!important;
   width:100%!important;height:auto!important;
   padding:5px 5px calc(5px + env(safe-area-inset-bottom))!important;
   background:#064b3b!important;
 }
 /* mobile title strip */
 .app-shell>aside>h2{
   display:block!important;
   position:fixed!important;z-index:9998!important;
   top:0!important;right:0!important;left:0!important;
   margin:0!important;padding:11px 54px 7px!important;
   min-height:48px!important;box-sizing:border-box!important;
   background:#064b3b!important;color:#fff!important;
   font-size:17px!important;line-height:1.35!important;text-align:center!important;
   border-bottom:1px solid rgba(255,255,255,.13)!important;
 }
 .app-shell>aside>p{
   display:block!important;
   position:fixed!important;z-index:9998!important;
   top:48px!important;right:0!important;left:0!important;
   margin:0!important;padding:5px 48px 8px!important;
   height:38px!important;box-sizing:border-box!important;
   overflow:hidden!important;
   background:#064b3b!important;color:#d9ebe5!important;
   font-size:10px!important;line-height:1.35!important;text-align:center!important;
 }
 .app-shell>aside>.brand-logo,.app-shell>aside>img{display:none!important}
 /* return button visible in top bar */
 .app-shell>aside>a:last-child{
   display:flex!important;
   position:fixed!important;z-index:10000!important;
   top:10px!important;right:8px!important;
   width:40px!important;height:34px!important;
   margin:0!important;padding:0!important;
   align-items:center!important;justify-content:center!important;
   overflow:hidden!important;
   font-size:0!important;line-height:1!important;
   color:#fff!important;text-decoration:none!important;
   border:1px solid rgba(255,255,255,.35)!important;border-radius:8px!important;
   background:rgba(255,255,255,.08)!important;
 }
 .app-shell>aside>a:last-child:before{content:"↩"!important;font-size:20px!important;font-weight:900!important}
 .interactive-form-steps{position:relative!important;z-index:10001!important}
 .app-shell>.form-area{padding-top:8px!important}
}

/* v2.8.21 — mobile header: college white logo right, exit left */
.mobile-form-head{display:none}
@media(max-width:900px){
 body:has(.app-shell){padding-top:104px!important}
 .mobile-form-head{
   display:block!important;
   position:fixed!important;z-index:10002!important;
   top:0!important;right:0!important;left:0!important;
   height:104px!important;pointer-events:none!important;
 }
 .mobile-college-logo{
   position:absolute!important;right:10px!important;top:10px!important;
   width:58px!important;height:58px!important;
   display:flex!important;align-items:center!important;justify-content:center!important;
   pointer-events:auto!important;
 }
 .mobile-college-logo .brand-logo,.mobile-college-logo img{
   display:block!important;position:static!important;
   width:auto!important;max-width:58px!important;height:auto!important;max-height:58px!important;
   margin:0!important;object-fit:contain!important;
 }
 .mobile-form-exit{
   position:absolute!important;left:10px!important;right:auto!important;top:18px!important;
   width:44px!important;height:42px!important;
   display:flex!important;align-items:center!important;justify-content:center!important;
   border:1px solid rgba(255,255,255,.38)!important;border-radius:10px!important;
   background:rgba(255,255,255,.08)!important;color:#fff!important;
   font-size:24px!important;font-weight:900!important;text-decoration:none!important;
   pointer-events:auto!important;
 }
 /* center title/description between controls */
 .app-shell>aside>h2{
   top:8px!important;min-height:48px!important;
   padding:10px 76px 6px!important;
 }
 .app-shell>aside>p{
   top:54px!important;height:45px!important;
   padding:5px 72px 8px!important;
 }
 /* hide the older duplicate return icon; the new left control replaces it */
 .app-shell>aside>a:last-child{display:none!important}
}

/* v2.8.22 — responsive Staff dashboard + Student portal */
@media(max-width:700px){
 .login-screen{min-height:100dvh!important;padding:14px!important;box-sizing:border-box!important;align-items:flex-start!important}
 .login-box{width:100%!important;max-width:none!important;margin:0!important;padding:22px 18px!important;border-radius:22px!important;box-sizing:border-box!important}
 .login-box .brand-logo,.login-box>img{max-height:125px!important;width:auto!important;margin:0 auto 12px!important}
 .login-box h1{font-size:31px!important;line-height:1.2!important;margin:8px 0!important}
 .login-box>p{font-size:15px!important;line-height:1.65!important;margin:0 auto 16px!important}
 .login-box form{gap:12px!important}.login-box label span{font-size:14px!important}
 .login-box input{min-height:52px!important;padding:12px 14px!important}.login-box .btn{min-height:52px!important;margin-top:3px!important}.login-box .back{margin-top:12px!important}
 .staff{padding:12px!important;box-sizing:border-box!important;overflow-x:hidden!important}
 .staff>header{display:grid!important;grid-template-columns:72px minmax(0,1fr)!important;gap:10px!important;padding:14px!important;border-radius:18px!important;align-items:center!important}
 .staff>header .brand-logo,.staff>header>img{width:66px!important;max-width:66px!important;height:auto!important;margin:0!important}
 .staff>header h1{font-size:24px!important;line-height:1.25!important;margin:2px 0!important}.staff>header small{font-size:11px!important}
 .staff>header .system-version{display:inline-block!important;font-size:9px!important;padding:5px 8px!important;margin-top:5px!important}
 .staff-head-actions{grid-column:1/-1!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;width:100%!important}
 .staff-head-actions>a{min-height:42px!important;padding:7px 8px!important;font-size:12px!important;border-radius:9px!important}
 .stats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin:12px 0!important}
 .stats>div{min-height:92px!important;padding:12px 7px!important;border-radius:14px!important;box-sizing:border-box!important}.stats b{font-size:27px!important}.stats span{font-size:11px!important;line-height:1.35!important}
 .toolbar{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;margin:10px 0!important}
 .toolbar .btn{width:100%!important;min-height:45px!important;padding:8px!important;font-size:11px!important;line-height:1.35!important;box-sizing:border-box!important}
 .smart-filters{display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;padding:13px!important;border-radius:16px!important}
 .smart-filters .filter-search{grid-column:1/-1!important}.smart-filters label{font-size:11px!important;margin-bottom:4px!important}
 .smart-filters input,.smart-filters select{width:100%!important;min-width:0!important;min-height:44px!important;padding:8px!important;font-size:12px!important;box-sizing:border-box!important}
 .smart-filters .filter-reset,.smart-filters .filter-count{min-height:44px!important;width:100%!important;box-sizing:border-box!important}.filter-count{display:flex!important;align-items:center!important;justify-content:center!important}
 .table-wrap{overflow:visible!important;margin-top:12px!important}.table-wrap table,.table-wrap tbody{display:block!important;width:100%!important}.table-wrap thead{display:none!important}
 .table-wrap tr.uac-app-row{display:grid!important;grid-template-columns:1fr 1fr!important;gap:0!important;width:100%!important;margin:0 0 11px!important;padding:12px!important;background:#fff!important;border:1px solid #e1e7e4!important;border-radius:16px!important;box-sizing:border-box!important;box-shadow:0 5px 18px rgba(0,0,0,.035)!important}
 .table-wrap tr.uac-app-row td{display:block!important;width:auto!important;min-width:0!important;padding:8px 7px!important;border:0!important;border-bottom:1px solid #edf1ef!important;white-space:normal!important;overflow-wrap:anywhere!important;font-size:12px!important}
 .table-wrap tr.uac-app-row td:before{display:block!important;color:#77847e!important;font-size:9px!important;font-weight:800!important;margin-bottom:3px!important}
 .table-wrap tr.uac-app-row td:nth-child(1):before{content:"رقم الطلب"}.table-wrap tr.uac-app-row td:nth-child(2):before{content:"نوع التسجيل"}.table-wrap tr.uac-app-row td:nth-child(3):before{content:"الطالب"}.table-wrap tr.uac-app-row td:nth-child(4):before{content:"البرنامج"}.table-wrap tr.uac-app-row td:nth-child(5):before{content:"الهاتف"}.table-wrap tr.uac-app-row td:nth-child(6):before{content:"الحالة"}.table-wrap tr.uac-app-row td:nth-child(7):before{content:"تاريخ التسجيل"}.table-wrap tr.uac-app-row td:nth-child(8):before{content:"الإجراء"}
 .table-wrap tr.uac-app-row td:nth-child(1),.table-wrap tr.uac-app-row td:nth-child(3),.table-wrap tr.uac-app-row td:nth-child(4),.table-wrap tr.uac-app-row td:nth-child(8){grid-column:1/-1!important}
 .row-actions .admin-action-form{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important}.row-actions .mini{width:100%!important;min-width:0!important;min-height:38px!important;padding:6px 4px!important;font-size:10px!important;white-space:normal!important}
 .student-detail{padding:10px!important}.student-detail>header{grid-template-columns:62px minmax(0,1fr)!important}.student-form-view{padding:13px!important;margin-top:10px!important;border-radius:14px!important}
 .detail-grid{grid-template-columns:1fr!important}.detail-field{grid-template-columns:40% 60%!important}.attachment-cards{grid-template-columns:1fr!important}.attachment-pdf{height:320px!important}
}
@media(max-width:420px){
 .staff{padding:8px!important}.staff>header{grid-template-columns:58px minmax(0,1fr)!important;padding:11px!important}.staff>header .brand-logo,.staff>header>img{width:54px!important}.staff>header h1{font-size:20px!important}
 .stats{gap:5px!important}.stats>div{min-height:82px!important;padding:10px 5px!important}.stats b{font-size:23px!important}.stats span{font-size:9px!important}
 .toolbar{grid-template-columns:1fr!important}.smart-filters{gap:7px!important;padding:10px!important}.table-wrap tr.uac-app-row{padding:10px!important}
 .row-actions .admin-action-form{grid-template-columns:1fr!important}.detail-field{grid-template-columns:1fr!important}.detail-field span{border-bottom:1px solid #e1e7e4!important}
}
