/* TAKAMUL Weekly V4 — additions shared by both editions (identity colors come from style.css: body.boys / body.girls). */
:root{--font:'Tajawal',system-ui,sans-serif}
h1,h2,h3{font-family:'Cairo',var(--font)}
.login{min-height:100vh;display:grid;place-items:center;padding:16px;background:linear-gradient(140deg,var(--dark),var(--p))}
.login-card{width:min(430px,100%);background:#fff;border-radius:20px;padding:28px;box-shadow:0 25px 60px #0004;display:grid;gap:14px}
.login-card .hero-icon{margin:auto}.login-card h1{text-align:center;font-size:21px}.login-card p{text-align:center;margin:0;color:#6f8591;font-size:12px}
.login-takamul{width:150px;height:150px;object-fit:contain;margin:-6px auto 0;display:block}
.product-lockup{display:flex;align-items:center;justify-content:center;gap:12px;padding:10px 12px;border-radius:16px;background:var(--sub)}
.product-lockup img{width:58px;height:58px;flex:0 0 auto}.product-lockup h1{text-align:right;font-size:21px;color:var(--dark)}.product-lockup p{text-align:right;margin:2px 0 0}
.brand-logo{width:46px;height:46px;border-radius:12px;background:#fff;display:grid;place-items:center;overflow:hidden;box-shadow:0 3px 10px #0002;flex:0 0 auto}.brand-logo img{width:44px;height:44px;object-fit:contain}
.brand-mark{width:42px;height:42px;border-radius:12px;background:#ffffff1f;display:grid;place-items:center;flex:0 0 auto}.brand-mark img{width:36px;height:36px}
@media(max-width:650px){.brand-mark{display:none}.login-takamul{width:120px;height:120px}}
.err{background:#fff1f1;border:1px solid #efc6c6;color:#9a3434;padding:10px 12px;border-radius:10px;font-size:12px}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin:12px 0}
.kpi{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px;display:flex;gap:10px;align-items:center;text-align:right;color:var(--ink);box-shadow:0 4px 12px var(--shadow)}
button.kpi{cursor:pointer;font:inherit}button.kpi:hover{border-color:var(--accent)}button.kpi.on{outline:2px solid var(--accent)}
.kpi .orb{width:40px;height:40px;border-radius:12px;background:var(--sub);color:var(--p);display:grid;place-items:center;flex:0 0 auto}
.kpi b{display:block;font:800 21px 'Cairo',sans-serif}.kpi small{display:block;color:#6d8592;font-size:11px}
.tcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.tcard{background:#fff;border:1px solid var(--line);border-radius:16px;padding:15px;display:grid;gap:10px;box-shadow:0 4px 14px var(--shadow)}
.tcard .who{display:flex;gap:10px;align-items:center}.avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--accent));color:#fff;display:grid;place-items:center;font:800 17px 'Cairo'}
.tcard .who b{display:block}.tcard .who small{font-size:11px}
.mini{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.mini div{background:var(--sub);border-radius:9px;padding:6px 4px;text-align:center}.mini b{display:block;font:800 15px 'Cairo'}.mini small{font-size:9.5px;color:#5f7987}
.chips{display:flex;flex-wrap:wrap;gap:5px}.chip{display:inline-flex;align-items:center;gap:4px;background:var(--sub);color:var(--p);border-radius:20px;padding:3px 9px;font-size:11px;font-weight:700}.chip .ico,.chip .ico svg{width:15px;height:15px}
.units{display:grid;gap:5px}.unitrow{display:flex;justify-content:space-between;align-items:center;gap:6px;border:1px solid var(--line);border-radius:10px;padding:7px 9px;font-size:12px;background:#fff}
.unitrow .ico{color:var(--p)}
.st{display:inline-block;padding:3px 9px;border-radius:20px;font-size:10.5px;font-weight:800;white-space:nowrap;background:#eef1f3;color:#55636b}
.st.none{background:#f7f0e4;color:#8a5a12}.st.draft,.st.saved{background:#eef2f6;color:#3f5869}.st.scheduled{background:#e8f0fe;color:#2753a6}.st.submitted{background:#e5f2fb;color:#1d6693}
.st.returned{background:#fdecea;color:#a3322a}.st.deputy_approved{background:#e7f6ef;color:#20714b}.st.final_approved{background:#d8f2e5;color:#11603c}.st.published{background:#e9e4fb;color:#4d32a0}
.progress{height:8px;background:#e7edf0;border-radius:8px;overflow:hidden}.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--p),var(--accent))}
.ptable{width:100%;border-collapse:separate;border-spacing:0 6px}.ptable th{font-size:11px;color:#5c7684;text-align:right;padding:0 6px}
.ptable td{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:7px 6px;vertical-align:top;font-size:12px}
.ptable td:first-child{border-right:1px solid var(--line);border-radius:0 10px 10px 0}.ptable td:last-child{border-left:1px solid var(--line);border-radius:10px 0 0 10px}
.ptable .field{min-height:34px;padding:7px;font-size:12px}.ptable tr.rep td{background:#fbfaf4}.ptable tr.missing td{background:#fff7f6}
.daycell{font-weight:800;color:var(--dark);white-space:nowrap}.daycell small{display:block;font-weight:500}
.tag{display:inline-block;font-size:10px;border-radius:6px;padding:2px 6px;background:#fff4dc;color:#8a5b0c;margin-top:4px}.tag.off{background:#e8f5ee;color:#1d6b45}
.banner{border-radius:12px;padding:12px 14px;display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;font-size:12.5px;line-height:1.8}
.banner.warn{background:#fff6e6;border:1px solid #f0d9a8;color:#7d5512}.banner.bad{background:#fdeeee;border:1px solid #f0c9c9;color:#8e2f2f}.banner.good{background:#e9f7f0;border:1px solid #bfe5d1;color:#1c6644}.banner.info{background:var(--sub);border:1px solid var(--line);color:var(--dark)}
.ttgrid{border-collapse:separate;border-spacing:4px;width:100%;min-width:640px}.ttgrid th{background:#eef3f6;border-radius:7px;padding:7px;font-size:11px}
.ttgrid td{background:#f8fbfc;border:1px solid var(--line);border-radius:8px;padding:4px;vertical-align:top}.ttgrid td.none{background:repeating-linear-gradient(135deg,#f1f2f3 0 6px,#e6e9ec 6px 12px)}
.ttgrid td.conf{border-color:#e06a5f;background:#fff3f2}.ttgrid select{width:100%;font-size:11px;padding:4px;border:1px solid #d6e3e8;border-radius:6px;margin:1px 0;background:#fff}
.ttcell{font-size:11px;line-height:1.5}.ttcell b{display:block;color:var(--p)}
.preview{background:#e4ebef;border-radius:14px;padding:12px;overflow:auto;border:1px solid var(--line)}
/* Preview scaling draws the fitted page smaller without re-laying it out (CSS zoom changed line breaks and heights). */
.preview{overflow-x:hidden}.preview .pp-page{transform:scale(var(--z,1));transform-origin:top right;box-shadow:0 10px 30px #0002}
.preview .pp-landscape{margin-bottom:calc((var(--z,1) - 1) * 209mm + 12px)}.preview .pp-portrait{margin-bottom:calc((var(--z,1) - 1) * 296mm + 12px)}
.flag{display:inline-block;font-size:10px;padding:1px 6px;border-radius:5px;background:#fdecea;color:#9b2c2c;margin:2px}.flag.ok{background:#e8f5ee;color:#1d6b45}
.notif{border-bottom:1px solid var(--line);padding:9px 2px;font-size:12px}.notif.new{font-weight:800}.notif small{display:block}
.bell{position:relative}.bell .count{position:absolute;top:-6px;left:-6px;background:#e0533f;color:#fff;border-radius:10px;font-size:10px;padding:1px 6px}
.hidden{display:none!important}
.dialog.wide{width:min(1100px,100%)}
.seg{display:inline-flex;background:var(--sub);border-radius:10px;padding:3px;gap:3px}.seg button{border:0;background:transparent;padding:7px 12px;border-radius:8px;font-weight:800;font-size:12px;color:var(--p)}.seg button.on{background:#fff;box-shadow:0 2px 6px var(--shadow)}
@media(max-width:650px){.mini{grid-template-columns:repeat(2,1fr)}.kpis{grid-template-columns:repeat(2,1fr)}.ptable,.ptable tbody,.ptable tr,.ptable td{display:block}.ptable thead{display:none}.ptable tr{margin-bottom:10px}.ptable td{border:1px solid var(--line)!important;border-radius:0!important}.ptable td:first-child{border-radius:10px 10px 0 0!important}.ptable td:last-child{border-radius:0 0 10px 10px!important}.login-card{padding:20px}}

/* ---------- A4 pages (shared by preview and print) ---------- */
.pp-page{--pp-line:#8fa5b0;background:#fff;color:#1b2b36;direction:rtl;font-family:'Cairo','Tajawal',sans-serif;font-size:var(--pp-size,9pt);line-height:1.3;box-sizing:border-box;padding:6mm 7mm;margin:0 auto 12px;display:flex;flex-direction:column;gap:2mm;overflow:hidden;border-top:2.5mm solid var(--p)}
.pp-landscape{width:297mm;height:209mm}.pp-portrait{width:210mm;height:296mm}
.pp-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:4mm;border-bottom:.5mm solid var(--dark);padding-bottom:2mm}
.pp-org{display:flex;flex-direction:column;line-height:1.35}.pp-org strong{color:var(--dark);font-size:1.12em}
.pp-logo{min-width:24mm;display:flex;justify-content:center;align-items:center}.pp-logo img{display:block;height:18mm;width:auto;max-width:46mm;object-fit:contain}
.pp-tight .pp-logo img{height:15mm}
/* Framed info bar: student's name at the start of the line, then class/section and the week's dates. */
.pp-infobar{display:flex;align-items:center;gap:3mm 8mm;flex-wrap:wrap;border:.35mm solid var(--dark);border-radius:1.5mm;padding:1.3mm 3mm;background:#f7fafc;font-size:1.02em}
.pp-infobar b{color:var(--dark)}.pp-ib-student{flex:1 1 70mm;display:flex;align-items:baseline;gap:2mm;white-space:nowrap}.pp-ib-student span{font-weight:700}
.pp-blank{flex:1;display:inline-block;min-width:45mm;border-bottom:.3mm dotted #5a6d77}
.pp-tight .pp-infobar{padding:.8mm 2.5mm}
.pp-meta{display:flex;flex-direction:column;align-items:flex-end;text-align:left;line-height:1.35}.pp-meta strong{font-size:1.45em;color:var(--p)}
.pp-grid{width:100%;table-layout:fixed;border-collapse:collapse;flex:1 1 auto}
.pp-grid th,.pp-grid td{border:.3mm solid var(--pp-line);padding:1mm 1.2mm;text-align:center;vertical-align:top;overflow-wrap:anywhere}
.pp-grid thead th{background:var(--dark);color:#fff;font-weight:800;padding:1.3mm;vertical-align:middle}
.pp-grid col.pp-daycol{width:10%}.pp-portrait .pp-grid col.pp-daycol{width:13%}
.pp-day{background:var(--sub);color:var(--dark);font-weight:800;vertical-align:middle!important}.pp-day small{display:block;font-weight:500;font-size:.8em;margin-top:1mm}
.pp-none{background:repeating-linear-gradient(135deg,#f4f4f4 0 1.6mm,#e3e3e3 1.6mm 3.2mm)}
.pp-off{background:#efece4;color:#6d6550;font-weight:700;vertical-align:middle!important}.pp-free{color:#99a7ae;vertical-align:middle!important}
.pp-subj{display:flex;gap:1mm;align-items:center;justify-content:center;font-weight:800;color:var(--p)}.pp-subj .ico{width:4.2mm;height:4.2mm}.pp-subj .ico svg{width:4.2mm;height:4.2mm}
.pp-title{font-weight:700;margin-top:.6mm}.pp-act{display:inline-block;font-style:normal;background:var(--sub);color:var(--dark);border-radius:1mm;padding:0 1.2mm;font-size:.84em;margin-top:.6mm}
.pp-hw,.pp-skill{font-size:.84em;text-align:right;margin-top:.6mm;color:#33454f}.pp-skill{color:#2c5d4c}
.pp-tt .pp-grid td{vertical-align:middle;font-size:1.1em}.pp-tt .pp-grid td small{display:block;color:#4a5c66;font-size:.85em}
.pp-note{margin:0;font-size:.85em;color:#5a6d77}
.pp-foot{display:grid;gap:1.5mm;border-top:.3mm solid var(--pp-line);padding-top:1.5mm}
.pp-legend{display:flex;flex-wrap:wrap;gap:2mm 8mm;font-size:.9em}.pp-sign{display:flex;justify-content:space-between;gap:4mm;flex-wrap:wrap;font-size:.95em}.pp-stamp{color:#6a7c86;font-size:.85em}
.pp-tight{line-height:1.18;gap:1.4mm}.pp-tight .pp-grid th,.pp-tight .pp-grid td{padding:.55mm .8mm}.pp-tight .pp-title,.pp-tight .pp-act,.pp-tight .pp-hw,.pp-tight .pp-skill{margin-top:.25mm}.pp-tight .pp-head{padding-bottom:1.2mm}
.pp-r0 .pp-day{background:#fdecec}.pp-r1 .pp-day{background:#e8f3fa}.pp-r2 .pp-day{background:#eaf6e9}.pp-r3 .pp-day{background:#fff2df}.pp-r4 .pp-day{background:#f1e9fb}
/* Weekly plan — list layout: one line per period, each day in its own colour; numbers are coloured badges. */
.pp-r0{--dc:#b4232a;--dt:#fdeceb}.pp-r1{--dc:#0b6aa2;--dt:#e5f1f9}.pp-r2{--dc:#177a3c;--dt:#e7f5ec}.pp-r3{--dc:#b45a09;--dt:#fff1df}.pp-r4{--dc:#7a2bc4;--dt:#f2eafb}
.pp-list{font-family:'IBM Plex Sans Arabic','Tajawal','Cairo',sans-serif;line-height:1.28}
.pp-list .pp-head,.pp-list .pp-grid thead th,.pp-list .pp-day,.pp-list .pp-no{font-family:'Cairo','Tajawal',sans-serif}
.pp-list .pp-grid{flex:0 0 auto}.pp-list .pp-grid td{vertical-align:middle;text-align:right;padding:calc(.75mm + var(--pp-extra,0px)) 1.5mm;overflow-wrap:normal}
.pp-list .pp-grid thead th{font-size:1em;padding:1.1mm}
.pp-list .pp-line{white-space:nowrap;overflow:hidden}.pp-list .pp-line.pp-wrap{white-space:normal;overflow:visible;overflow-wrap:anywhere}
.pp-list col.pp-c-day{width:9%}.pp-list col.pp-c-no{width:3.6%}.pp-list col.pp-c-sub{width:14%}.pp-list col.pp-c-hw{width:25%}.pp-list col.pp-c-sk{width:19%}.pp-list col.pp-c-sign{width:8%}
.pp-portrait.pp-list col.pp-c-day{width:11%}.pp-portrait.pp-list col.pp-c-no{width:5%}.pp-portrait.pp-list col.pp-c-sub{width:16%}.pp-portrait.pp-list col.pp-c-hw{width:23%}.pp-portrait.pp-list col.pp-c-sk{width:18%}.pp-portrait.pp-list col.pp-c-sign{width:10%}
/* List plan footer: only the class leader's line; no bottom margin beyond the page edge spacing. */
.pp-list{padding-bottom:3mm}.pp-list .pp-leader{display:flex;align-items:baseline;gap:2mm;border:0;padding:0;font-size:1.05em}.pp-list .pp-leader b{color:var(--dark)}.pp-leader .pp-blank{flex:0 0 70mm}
.pp-list .pp-dayblock{border-top:.8mm solid var(--dc)}.pp-list .pp-dayblock tr:nth-child(even) td:not(.pp-sign-cell){background:#f7fafb}
.pp-list .pp-day{background:var(--dt);color:var(--dc);text-align:center;font-size:1.08em;line-height:1.25}.pp-list .pp-day small{color:#52646e}
.pp-list .pp-no{text-align:center;padding:.2mm!important}.pp-list .pp-no span{display:inline-grid;place-items:center;min-width:1.45em;height:1.45em;border-radius:50%;background:var(--dc);color:#fff;font-weight:800;font-size:.86em;line-height:1}
.pp-list .pp-sub{font-weight:800;color:var(--dc)}.pp-list .pp-sub .ico{display:inline-block;width:1.1em;height:1.1em;vertical-align:-.18em;margin-inline-end:1mm}.pp-list .pp-sub .ico svg{width:1.1em;height:1.1em}
.pp-list .pp-ttl{font-weight:700;color:#14232d}.pp-list .pp-ttl .pp-act{margin:0 1mm 0 0;vertical-align:.2mm}.pp-list .pp-hwc{color:#2f414b}.pp-list .pp-skc{color:#2c5d4c;font-size:.94em}
.pp-list .pp-dash{color:#a3b0b6;font-weight:400}.pp-list .pp-off{text-align:center!important}.pp-list .pp-sign-cell{background:#fff}
.pp-tight.pp-list{line-height:1.1}.pp-tight.pp-list .pp-grid td{padding:calc(.35mm + var(--pp-extra,0px)) 1.1mm}.pp-tight.pp-list .pp-no{padding:0!important}.pp-tight.pp-list .pp-no span{min-width:1.3em;height:1.3em}.pp-tight.pp-list .pp-grid thead th{padding:.7mm}.pp-tight.pp-list .pp-dayblock{border-top-width:.6mm}
.pp-mono,.pp-mono *{color:#000!important;background:#fff!important;border-color:#666!important}.pp-mono{border-top-color:#000!important}.pp-mono.pp-list .pp-no span{border:.3mm solid #000}.pp-mono.pp-list .pp-dayblock{border-top-color:#000!important}.pp-mono .pp-none{background:repeating-linear-gradient(135deg,#fff 0 1.6mm,#d4d4d4 1.6mm 3.2mm)!important}.pp-mono .pp-grid thead th{background:#e6e6e6!important}
@media print{
 @page{margin:0}
 html,body{background:#fff!important;margin:0!important}
 #app,#popup,#toast{display:none!important}
 .printable{display:block!important}
 .printable .pp-page{margin:0!important;box-shadow:none!important;zoom:1!important;break-after:page;page-break-after:always}
 .printable .pp-page:last-child{break-after:auto;page-break-after:auto}
 .pp-page,.pp-page *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}