@font-face{font-family:Amiri;src:url(Amiri-Regular.ttf)}@font-face{font-family:Amiri;src:url(Amiri-Bold.ttf);font-weight:700}*{box-sizing:border-box}body{margin:0;background:#f3f7f3;color:#1d3f30;font:16px/1.9 Tahoma,Arial,sans-serif}header{position:sticky;top:0;background:#fffffffa;border-bottom:1px solid #dde7df;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px max(20px,calc((100% - 1080px)/2));z-index:10}.brand{display:flex;align-items:center;gap:15px}.brand img{object-fit:contain}.brand p{font-size:12px;color:#8d784c;margin:0}h1{font:700 25px/1.5 Amiri;margin:0}a{color:#17644e}main{max-width:1040px;margin:30px auto;padding:0 20px}.intro{margin:30px 0}.intro h2{font:700 36px/1.5 Amiri;margin:10px 0}.intro p{max-width:760px;color:#62796b}.badge{display:inline-block;border-radius:30px;background:#e3eee5;color:#17644e;padding:5px 15px;font-size:13px}.card{background:white;border:1px solid #dce6df;border-radius:16px;padding:25px;margin:20px 0;box-shadow:0 5px 20px #173d2405}.card h2,.card summary{font:700 25px/1.6 Amiri;margin:0 0 18px}.card summary{cursor:pointer;margin:0}details[open] summary{margin-bottom:18px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}.field.wide{grid-column:1/-1}.field label,label{display:block;font-size:14px;margin-bottom:5px}input,select,textarea{font:16px/1.7 Tahoma,Arial,sans-serif;color:#1c3f2d;background:#fbfdfb;border:1px solid #d4e0d6;border-radius:9px;min-height:47px;padding:9px 12px;width:100%;max-width:100%}input:focus,select:focus,textarea:focus{outline:2px solid #91b69d;outline-offset:2px;background:white}textarea{resize:vertical}button{font:15px/1.7 Tahoma,Arial,sans-serif;background:#17644e;color:white;border:1px solid transparent;border-radius:10px;padding:10px 20px;min-height:44px;cursor:pointer;margin:12px 0 0 8px}.secondary{background:white;color:#17644e;border-color:#cdded1}button:disabled{opacity:.55;cursor:wait}.check{display:flex;align-items:flex-start;gap:10px;margin:20px 0}.check input{width:19px;height:19px;min-height:19px;flex-shrink:0;accent-color:#17644e}#answer{max-width:200px}.teacher-row{border:1px solid #dce6df;border-radius:10px;padding:16px;margin:12px 0;display:grid;grid-template-columns:1fr 1fr;gap:12px}#message{padding:18px;border-radius:10px;border:1px solid #a3c5ad;background:#e9f4e9;white-space:pre-line}#message.error{border-color:#dfb09e;background:#fff2eb;color:#853a22}#receipt{font:14px/1.7 monospace;direction:ltr;text-align:left}.trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}footer{text-align:center;font-size:13px;color:#64796b;padding:25px}footer p{margin:3px}footer img{height:auto;max-height:70px;object-fit:contain;margin:8px auto}[hidden]{display:none!important}@media(max-width:650px){header{padding:10px 14px;gap:10px}.brand{gap:10px}.brand img{width:46px;height:46px}h1{font-size:20px}header>a{font-size:12px}main{padding:0 14px;margin:22px auto}.intro h2{font-size:29px}.card{padding:19px 16px}.fields,.teacher-row{grid-template-columns:1fr}.field.wide{grid-column:auto}}@media print{header{position:static}button,.intro,#resume,footer{display:none}.card{box-shadow:none;break-inside:avoid}body{background:white}}

.image-field img{display:block;max-width:100%;width:220px;height:150px;object-fit:contain;border:1px solid #d2dfd3;border-radius:10px;margin:10px 0}.image-field img[hidden]{display:none}.image-field small{color:#53665c}

#addTeacher[hidden],section[hidden]{display:none}

.narjis-office{text-align:center}.narjis-office p{margin:.2em 0}.narjis-contact{display:flex;justify-content:center;flex-wrap:wrap;gap:.4em 1em}.narjis-contact a{display:inline-flex;align-items:center;gap:.35em;direction:ltr}.narjis-contact svg{flex:none}

.portal { max-width: 37rem; padding-block: clamp(2rem, 8vh, 5rem); }
.portal-card { text-align: center; padding: clamp(1.2rem, 5vw, 2.5rem); }
.portal-card h1 { margin: .7rem 0 .2rem; line-height: 1.45; }
.portal-options { display: grid; gap: .85rem; margin-top: 1.5rem; }
.portal-options a { display: flex; align-items: center; justify-content: space-between; padding: .8rem 1.2rem; border-radius: .75rem; background: #175346; color: #fff; font-size: 1.35rem; text-decoration: none; }
.portal-options a:hover { background: #236e5d; }
.portal-options a:focus-visible { outline: 3px solid #bc8524; outline-offset: 3px; }