@font-face{font-family:Tajawal;src:url('fonts/tajawal/Tajawal-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Tajawal;src:url('fonts/tajawal/Tajawal-Medium.ttf') format('truetype');font-weight:500 600;font-display:swap}
@font-face{font-family:Tajawal;src:url('fonts/tajawal/Tajawal-Bold.ttf') format('truetype');font-weight:700 900;font-display:swap}
:root{font-family:Tajawal,Tahoma,sans-serif;--bg:#f4f7fc;--line:#dce4ef;--muted:#566780;--control-line:#b7c7dc;--nav-blue:#0753c9}
body{font-family:Tajawal,Tahoma,sans-serif;background:var(--bg);color:var(--ink);font-size:16px;line-height:1.7}h1,h2,h3,strong{font-weight:700}h1{font-size:29px;line-height:1.5}h2{font-size:21px}button,input,select,textarea{font-family:inherit}button{font-size:15px;font-weight:500}.page-head p{font-size:15px}
/* The selected menu is cut from the same surface as the workspace. */
.shell>aside#sidebar{background:var(--bg)}
#sidebar nav a.active{background:var(--bg);border:0;box-shadow:none;border-radius:0 16px 16px 0}
#sidebar nav a.active:before,#sidebar nav a.active:after{width:12px;height:12px}
#sidebar nav a.active:before{top:-12px;background:radial-gradient(circle at 100% 0,var(--nav-blue) 12px,var(--bg) 12.5px)}
#sidebar nav a.active:after{bottom:-12px;background:radial-gradient(circle at 100% 100%,var(--nav-blue) 12px,var(--bg) 12.5px)}
#sidebar nav a{font-size:14px}#sidebar .nav-caption{font-size:12px}#sidebar .side-brand>span:last-child{font-size:23px}#sidebar .side-brand small{font-size:12px}
.topbar{height:76px;background:#fff;border-bottom:1px solid var(--line);gap:20px}.header-context{gap:12px}.header-context .academy-symbol{width:42px;height:42px;background:#eaf1fc;color:var(--nav-blue);border:1px solid #d9e5f8;border-radius:12px}.header-context strong{font-size:17px}.header-sub{font-size:12px;color:var(--muted)}.header-actions{gap:16px}.global-search{height:42px;min-width:270px;padding:9px 14px;border:1px solid #dce4ef;background:#f8faff;border-radius:10px;font-size:14px;color:var(--muted)}.global-search:hover:not(:disabled){border-color:#8aaee2}.global-search kbd{font-size:11px;background:#fff}.header-attendance{border-radius:9px;font-size:14px;padding-inline:16px;min-height:42px}.account-menu{gap:10px;padding-inline-start:18px}.user-avatar{background:#fff0e6;color:#875027;width:39px;height:39px;font-size:14px}.role-label{gap:1px}.role-label>span{font-size:11px}.role-label select{font-size:13px;font-weight:700;max-width:160px;padding:3px 0 3px 28px;background-color:#fff;min-height:28px}
/* Labelled, deliberate fields; consistent RTL disclosure arrows. */
input:not([type=checkbox]):not([type=file]):not([type=hidden]),select,textarea,.date-trigger{border:1px solid var(--control-line);border-radius:9px;background-color:#fff;min-height:46px;font-size:15px;color:#203d5b;padding:10px 13px;line-height:1.65;box-shadow:0 1px 2px #172f4505}
input:not([type=checkbox]):hover,select:hover,textarea:hover,.date-trigger:hover{border-color:#7e9fc7;background-color:#fcfdff}
input:focus,select:focus,textarea:focus,.date-trigger:focus-visible{border-color:var(--primary);outline:3px solid #1165d826;outline-offset:1px;background-color:#fff}
input::placeholder,textarea::placeholder{color:#60718a;font-size:14px}
select,.attendance-table select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23526780' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 12px center;background-size:17px;padding-inline:13px 38px}
label.field,.compact-field,.portal-filters label,.agenda-filter-bar label,.control-field{color:#304a6b;font-size:14px;font-weight:700;gap:8px}.control-field{display:grid;min-width:160px}.field:focus-within,.compact-field:focus-within,.control-field:focus-within{color:var(--primary)}
.required-mark{font-size:10px;line-height:1;display:inline;color:#8e4f22;font-weight:500;position:absolute;inset-inline-end:0;top:5px}.field{position:relative}.field>input,.field>select,.field>textarea{width:100%}
.search-field{position:relative;display:grid;grid-template-columns:20px minmax(0,1fr);gap:7px 8px;align-items:center;background:transparent;border:0;padding:0;min-width:0}
.search-field .control-caption{grid-column:1/-1;font-size:13px;color:#304a6b;font-weight:700}.search-field input{grid-column:1/-1;width:100%;padding-inline-start:36px!important}.search-field>.ico{position:absolute;bottom:13px;inset-inline-start:10px;z-index:1;color:#7085a0;width:18px;height:18px}.roster-search .search-field:not(:has(.ico)) input{padding-inline-start:13px!important}.filter-bar,.roster-search{align-items:flex-end}.filter-bar .search-field{min-width:240px}.roster-search .control-field{margin-inline-start:auto}
.attendance-picker{background:#f4f8ff;align-items:end}.attendance-picker .autosave-explainer{padding:0 0 5px}.session-picker{background:#fbfcff;padding:16px 24px;border-bottom:1px solid var(--line)}.session-picker .field{margin:0}.session-picker>a{font-size:14px;font-weight:500}.attendance-counts{gap:12px;padding-bottom:18px}.attendance-counts>span{display:flex;align-items:center;gap:9px;border:1px solid #dfe7f1;border-radius:8px;background:#f6f8fc;padding:7px 12px;font-size:14px}.attendance-counts>span.good{background:#edf8f2;border-color:#d5ebde}.attendance-counts>span.bad{background:#fff0f2;border-color:#f1dce0}.attendance-counts strong{font-size:20px;margin:0}
/* Table hierarchy and semantic state labels, with stable checkbox geometry. */
table{font-size:15px}th{background:#edf3fc;color:#354f75;font-weight:700;font-size:13px;padding-block:15px;border-bottom:1px solid #dbe5f4}td{font-size:15px;padding-block:17px;vertical-align:middle;border-bottom:1px solid #e9eef5}tbody tr:nth-child(even){background:#fbfcff}tbody tr:hover{background:#f0f5ff}td .sub{font-size:12px!important;color:#60718a}.table-wrap{position:relative;isolation:isolate;scrollbar-color:#a8bdd7 #f4f7fc}.sr-only{clip-path:inset(50%)}.student-identity .name-button{font-size:16px;font-weight:700}.student-avatar{background:#edf3ff;color:#285ea1;font-size:13px;border:1px solid #dce7fa}.amount{color:#9a5621;font-weight:700}.state-label,.status.good,.data-badge{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:4px 10px;min-width:44px;border-radius:6px;font-size:13px;font-weight:700;line-height:1.6}.state-label.good,.status.good,.data-badge.good{background:#e9f6ef;color:#227351}.data-badge.bad{background:#fff0f2;color:#a63145}.state-label.muted,.data-badge.neutral{background:#edf1f7;color:#546780}.data-badge.amber{background:#fff3df;color:#895716}.pill{font-size:12px;padding:4px 9px;font-weight:500}.section-footer,.roster-caption{background:#fbfcff;color:#5c6f89}
input[type=checkbox],.attendance-check input{appearance:none;-webkit-appearance:none;width:22px;height:22px;min-width:22px;min-height:22px;padding:0;margin:0;display:inline-grid;place-items:center;border:1.5px solid #8da5c3;border-radius:5px;background:#fff;vertical-align:middle;cursor:pointer;flex-shrink:0;box-sizing:border-box}
input[type=checkbox]:checked,.attendance-check input:checked{background:var(--primary);border-color:var(--primary)}input[type=checkbox]:checked:after,.attendance-check input:checked:after{content:'';display:block;width:10px;height:6px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);margin:0 0 3px}
.attendance-check{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:52px;margin:0;padding:0}.attendance-table th.check-col,.attendance-table td.check-col{width:76px;padding:8px;text-align:center;vertical-align:middle}.attendance-table th:nth-child(2){width:auto}.attendance-table th:nth-child(3){width:190px}.attendance-table th.time-col{width:140px}.attendance-table select{font-size:14px;min-height:42px;width:100%;padding-block:7px}.attendance-table select[data-tone=present]{color:#216546;background-color:#eef8f2;border-color:#bfdfce}.attendance-table select[data-tone=absent]{color:#a63145;background-color:#fff4f5;border-color:#e9bdc7}.attendance-table select[data-tone=excused]{color:#80541b;background-color:#fff7e9;border-color:#ead6af}.attendance-table select[data-tone=unmarked]{color:#556b87;background-color:#f6f8fc}.attendance-table .is-present,.attendance-table .is-present:hover{background:#f1faf5}.recipient-list label,.checkline{display:flex;align-items:center;gap:12px}.save-footer{background:#eff8f3;font-size:14px}
/* Shared calendar; the original date field continues to carry form data. */
input.calendar-source{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;margin:0!important;opacity:0;pointer-events:none;clip-path:inset(50%)}
.date-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:start;width:100%;font-weight:500;white-space:nowrap}.date-trigger .ico{color:var(--primary);width:19px;height:19px}.date-trigger[aria-expanded=true]{border-color:var(--primary);background:#f2f7ff}.date-value{overflow:hidden;text-overflow:ellipsis}
.date-popover{position:fixed;inset:auto;border:1px solid #cddbec;border-radius:14px;padding:16px;background:#fff;color:var(--ink);box-shadow:0 12px 35px #172f4529;max-height:calc(100dvh - 24px);overflow:auto;font-family:Tajawal,Tahoma,sans-serif;font-size:14px;direction:rtl}.date-popover::backdrop{background:transparent}.calendar-fallback{z-index:100;display:block}.date-popover-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px}.date-popover-head>button{min-height:30px;width:30px;padding:4px;border:0;background:none}.date-popover-head strong{font-size:16px}.date-navigation{display:grid;grid-template-columns:30px 1fr 85px 30px;align-items:center;gap:7px;margin-bottom:12px}.date-navigation>button{padding:4px;min-height:34px;border:0;background:#f2f6fc}.date-navigation .ico{width:16px;height:16px}.date-navigation select{min-height:34px;padding:5px 8px 5px 25px;background-position:left 6px center;background-size:14px;font-size:13px;width:100%;border-color:#dce5ef}.date-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}.date-grid .weekday{text-align:center;color:#62738b;font-size:11px;padding:8px 0}.date-grid button{min-height:36px;padding:5px 0;border:0;background:none;font-size:14px;border-radius:8px;color:#243e60}.date-grid button:hover{background:#e9f1ff}.date-grid button[aria-pressed=true]{color:#fff;background:var(--primary)}.date-grid button[aria-current=date]:not([aria-pressed=true]){box-shadow:inset 0 0 0 1px var(--primary);color:var(--primary)}.date-grid button:disabled{opacity:.3}.date-footer{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);margin-top:12px;padding-top:10px}.date-footer button{font-size:12px;color:var(--primary);background:none;border:0;min-height:30px;padding:3px 7px}
/* Interactive reports: real counts, selectable days and actionable balances. */
.chart-point-detail{margin:5px 20px 0;padding:7px 10px;border-radius:6px;background:#f5f8fd;color:#3a567c;font-size:12px;min-height:34px}
.report-controls{display:flex;gap:16px;align-items:flex-end;background:white;border:1px solid var(--line);padding:20px;border-radius:12px;margin-bottom:12px;flex-wrap:wrap}.report-controls .field{flex:1;min-width:165px;margin:0}.report-periods{display:flex;gap:4px;padding:4px;background:#edf2fa;border-radius:9px;align-self:flex-end;min-height:46px}.report-periods button{font-size:13px;border:0;background:none;padding:7px 10px;min-height:36px}.report-periods button[aria-pressed=true]{background:#fff;color:var(--primary);box-shadow:0 2px 5px #172f4509}.report-summary{display:flex;gap:28px;flex-wrap:wrap;padding:18px 8px 25px}.report-summary>div{min-width:105px}.report-summary span{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:13px}.report-summary strong{font-size:28px;display:block;margin-top:3px}.report-summary i,.chart-legend i{width:9px;height:9px;background:var(--series);border-radius:3px;display:inline-block;flex-shrink:0}.insights-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:22px}.insights-grid>.panel{min-width:0}.panel-head h2{font-size:19px}.panel-head p{font-size:12px;color:var(--muted);line-height:1.7}.report-unit{font-size:11px;color:var(--muted);white-space:nowrap}.chart-legend{display:flex;gap:6px;padding:12px 20px 4px;flex-wrap:wrap}.chart-legend button{font-size:12px;display:flex;gap:7px;align-items:center;padding:5px 9px;min-height:32px;border:1px solid transparent;background:none;color:#405a77}.chart-legend button[aria-pressed=false]{color:#64758b;background:#f0f3f7}.chart-legend button[aria-pressed=false] i{background:#b9c4d3}.trend-scroll{overflow:auto;padding:10px 20px 0;direction:ltr}.trend-chart{direction:ltr;display:grid;grid-template-columns:30px repeat(var(--days),minmax(43px,1fr));min-width:max(100%,calc(var(--days)*48px + 30px));height:265px;gap:5px;align-items:stretch}.chart-axis{display:flex;flex-direction:column;justify-content:space-between;font-size:11px;color:#60718a;padding:25px 0 38px;text-align:right}.trend-day{display:grid;grid-template-rows:22px 1fr 30px;gap:7px;align-items:stretch;padding:2px 3px;border:0;border-radius:5px;background:none;min-width:0;color:#405b7a;position:relative}.trend-day:hover:not(:disabled),.trend-day.chosen{background:#eef4ff;color:var(--primary)}.bar-value{font-size:12px;line-height:22px}.bar-track{display:flex;flex-direction:column-reverse;align-items:stretch;justify-content:flex-start;margin:0 auto;width:68%;max-width:38px;border-bottom:1px solid #dce5f1;height:100%}.bar-segment{display:block;background:var(--series);position:relative;min-height:2px}.bar-segment:last-child{border-radius:4px 4px 0 0}.bar-segment span{display:none}.bar-zero{width:100%;height:2px;background:#d9e2ee}.bar-date{font-size:10px;white-space:nowrap;direction:rtl;line-height:24px}.chart-note{font-size:12px;color:#5a6f89;padding:8px 20px 15px;margin:0}.balance-chart{padding:8px 20px 20px}.balance-chart button{display:block;width:100%;text-align:start;padding:13px 0;border:0;border-bottom:1px solid #edf1f7;border-radius:0;background:none;transform:none}.balance-chart button>span:first-child{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:13px}.balance-chart b{font-size:13px;color:#99551d}.balance-track{display:block;height:9px;border-radius:3px;background:#f3ede7;margin:9px 0}.balance-track i{display:block;height:100%;border-radius:3px;background:#dda16d}.balance-chart button small{font-size:11px;color:#5c718e;display:flex;align-items:center;gap:5px}.balance-chart .ico{width:12px;height:12px}.balance-chart button:hover small{color:var(--primary)}
@media(max-width:1250px){.global-search{min-width:42px;width:42px;padding:8px}.global-search span,.global-search kbd{display:none}.header-actions{gap:12px}.insights-grid{grid-template-columns:minmax(0,1.45fr) minmax(260px,1fr)}}
@media(max-width:760px){.shell>aside#sidebar{background:var(--nav-blue)}.topbar .mobile-menu{background:#edf3ff;color:var(--primary);border-radius:9px}}
@media(max-width:1050px){.insights-grid{grid-template-columns:1fr}.report-controls .field{min-width:150px}.report-periods{width:100%;justify-content:flex-start}.header-attendance{font-size:13px}.account-menu{padding-inline-start:10px}.report-summary{gap:24px}.attendance-table th.check-col,.attendance-table td.check-col{width:64px}.attendance-table th:nth-child(3){width:170px}}
@media(max-width:760px){body{font-size:15px}.topbar{height:72px;padding:12px 16px}.header-context strong{font-size:17px}.header-sub{font-size:11px}.global-search{min-width:40px;width:40px;border-radius:9px;background:#f5f8ff}.header-attendance,.account-menu{display:none}.page-head{gap:12px}.page-head h1{font-size:25px}.page-head p{font-size:14px}.page-head .actions button{font-size:13px}#sidebar nav a{font-size:15px}#sidebar nav a.active{background:var(--bg)}.filter-bar .search-field{min-width:100%}.attendance-picker{grid-template-columns:1fr;gap:14px}.attendance-picker>.field{grid-column:auto}.attendance-picker>.autosave-explainer{padding:0}.session-picker{padding:16px;display:block}.session-picker>a{display:inline-flex;gap:6px;margin-top:10px}.attendance-counts{gap:7px;padding-inline:16px}.attendance-counts>span{padding:5px 8px;font-size:12px;gap:6px}.attendance-counts strong{font-size:18px}.roster-search{display:grid;grid-template-columns:minmax(0,1fr) 132px;align-items:end;gap:10px}.roster-search .search-field{min-width:0;width:100%}.roster-search .control-field{min-width:0;margin:0;width:100%;font-size:12px}.roster-search input{font-size:13px!important;padding-inline:10px!important}.roster-search .control-caption{font-size:12px}.roster-search select{font-size:13px}.attendance-table th.check-col,.attendance-table td.check-col{width:48px;padding:4px}.attendance-table th:nth-child(3){width:125px}.attendance-table td{padding:12px 7px}.attendance-table .student-identity .name-button{font-size:15px}.attendance-table select{font-size:12px;padding-inline:8px 24px;background-position:left 6px center;background-size:14px}.attendance-table th.time-col{display:none}.attendance-check{min-height:50px}.attendance-table .student-identity{gap:0}th{font-size:12px}.date-trigger{min-height:46px;font-size:14px;padding:10px}.report-controls{padding:16px;gap:12px;display:grid;grid-template-columns:1fr 1fr}.report-controls .field{min-width:0}.report-controls .field:last-child{grid-column:1/-1}.report-periods{grid-column:1/-1;width:auto}.report-summary{gap:18px 25px;padding:12px 4px 20px}.report-summary>div{min-width:80px}.report-summary strong{font-size:25px}.report-summary span{font-size:12px}.insights-grid{gap:0}.trend-chart{height:245px}.trend-scroll{padding-inline:12px}.chart-legend{padding-inline:12px;gap:2px}.chart-legend button{padding:5px 7px}.report-unit{display:none}.panel-head h2{font-size:18px}.balance-chart{padding-inline:16px}.control-field>select{width:100%}.header-context .academy-symbol{display:none}}
