/* Institutional palette and shared layout */
:root {
  --primary-green:#21765c; --primary-green-dark:#195c49; --primary-green-light:#e8f4ee;
  --page-bg:#f5f7f8; --card-bg:#fff; --text-primary:#203b3e; --text-secondary:#74858e;
  --border-color:#e8edf0; --danger:#c8353b; --warning:#bd8b28;
  --forest:var(--primary-green); --dark:var(--text-primary); --muted:var(--text-secondary);
  --bg:var(--page-bg); --line:var(--border-color); --header-height:94px; --sidebar-width:264px;
  --shadow:0 3px 16px rgba(25,56,49,.045);
}
* {box-sizing:border-box}
body {margin:0;background:var(--page-bg);font-family:Tahoma,Arial,sans-serif;color:var(--text-primary);line-height:1.65}
a {color:var(--primary-green);text-decoration:none}
a:hover {text-decoration:underline}
.icon {width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
/* Header: physical left branding and right account, independent of RTL content. */
.app-header {height:var(--header-height);background:var(--primary-green-dark);color:white;display:flex;align-items:center;gap:24px;padding:10px 30px;position:sticky;top:0;z-index:30;direction:ltr;box-shadow:0 1px 4px #143e3015}
.brand {display:flex;align-items:center;gap:26px;min-width:0}
.brand-logo {height:74px;width:auto;max-width:96px;object-fit:contain;display:block;background:white;border-radius:5px;padding:3px}
.brand-divider {height:52px;width:1px;background:#ffffff80;flex-shrink:0}
.brand strong {font-size:25px;letter-spacing:0;direction:rtl;font-weight:700;white-space:nowrap}
.header-account {display:flex;align-items:center;gap:12px;margin-left:auto;direction:rtl;font-size:15px}
.avatar {display:grid;place-items:center;background:#d1e8df;color:var(--primary-green-dark);width:43px;height:43px;border-radius:50%}
#nav-toggle {display:none;background:transparent;color:white;border:1px solid #ffffff55;padding:5px 10px;font-size:22px}
/* Sidebar stays physically on the left; each content panel remains Arabic RTL. */
.shell {display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr);direction:ltr;min-height:calc(100vh - var(--header-height))}
.sidebar {position:sticky;top:var(--header-height);height:calc(100vh - var(--header-height));overflow:auto;background:#fff;border-right:1px solid var(--border-color);padding:18px 13px;direction:ltr;display:flex;flex-direction:column;gap:5px}
.nav-link,.navbtn {display:flex;align-items:center;gap:18px;width:100%;padding:12px 18px;border-radius:8px;border:0;border-right:3px solid transparent;color:var(--text-secondary);background:transparent;font:inherit;font-size:15px;text-align:left;cursor:pointer}
.nav-link span,.navbtn span {direction:rtl}
.nav-link:hover,.navbtn:hover {background:#f4f8f6;color:var(--primary-green);text-decoration:none;filter:none}
.nav-link.active {color:var(--primary-green);background:var(--primary-green-light);border-right-color:var(--primary-green);font-weight:700}
.sidebar form {margin-top:8px}
main {direction:rtl;min-width:0;padding:28px 30px 42px;width:100%;max-width:1800px}
h1 {font-size:29px;line-height:1.4;margin:0 0 24px;color:#183331}
h2 {font-size:19px;line-height:1.5;margin:0 0 18px;font-weight:700}
h3 {font-size:16px}
small {font-size:14px;font-weight:400;color:var(--text-secondary)}
.page-heading {display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px;direction:ltr}
.page-heading h1 {margin:0;direction:rtl}
.date-label {display:flex;gap:10px;align-items:center;direction:rtl;color:#526b75;font-size:13px}
/* Shared cards and charts */
.panel,.card {background:var(--card-bg);border:1px solid var(--border-color);border-radius:14px;padding:24px;margin-bottom:20px;box-shadow:var(--shadow)}
.cards {display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px;margin-bottom:24px}
.card {display:flex;flex-direction:column;min-height:124px;color:var(--text-primary);margin-bottom:0}
.card:hover {text-decoration:none}
.card span {font-size:14px;color:var(--text-secondary)}
.card b {font-size:34px;line-height:1.35;color:var(--primary-green);font-variant-numeric:tabular-nums}
.dashboard-cards {direction:ltr}
.metric-card {flex-direction:row;justify-content:space-between;align-items:center;gap:18px;padding:23px;direction:ltr}
.metric-card>div {direction:rtl;text-align:right;flex:1}
.metric-card>div span {display:block;color:#345967;font-size:15px;font-weight:700;margin-bottom:8px}
.metric-icon {width:58px;height:58px;display:grid;place-items:center;border-radius:12px;background:#e0f1e7;color:var(--primary-green)!important;flex-shrink:0}
.metric-icon .icon {width:34px;height:34px}
.critical-card .metric-icon {background:#fde9e9;color:var(--danger)!important}
.critical-card b {color:var(--danger)}
.warning-card .metric-icon {background:#fff4de;color:var(--warning)!important}
.warning-card b {color:var(--primary-green-dark)}
.grid,.stats-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.dashboard-charts {display:grid;grid-template-columns:1.2fr 1fr;gap:20px;direction:ltr}
.chart-panel {direction:rtl;min-width:0}
.panel-heading {display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}
.panel-heading h2 {margin:0}
.panel-heading>.icon {color:var(--primary-green)}
.chart-frame {height:285px;position:relative;min-width:0}
.dashboard-summaries {direction:ltr}
.dashboard-summaries>.panel {direction:rtl}
canvas {max-width:100%}
/* Forms: existing labels, error output, form names and actions are preserved. */
.filters {display:flex;flex-wrap:wrap;gap:14px;align-items:end}
.filters label {min-width:150px;flex:1;margin:0}
label {display:block;font-weight:600;font-size:14px;margin:10px 0;color:#39545c}
input,select,textarea {display:block;width:100%;min-height:44px;border:1px solid #d7e1e4;border-radius:9px;padding:10px 12px;background:white;color:var(--text-primary);font:inherit;font-size:14px;margin-top:7px;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus {outline:none;border-color:#73ab93;box-shadow:0 0 0 3px #21765c14}
input[type=checkbox],input[type=radio] {width:18px;height:18px;min-height:0;display:inline-block;vertical-align:middle;accent-color:var(--primary-green)}
input[type=hidden] {display:none}
input[type=file] {padding:8px;font-size:12px}
button,.button {display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:8px;background:var(--primary-green);color:white;padding:11px 19px;font:inherit;font-size:14px;cursor:pointer;text-align:center}
button:hover,.button:hover {background:var(--primary-green-dark);color:white;text-decoration:none}
button:focus-visible,a:focus-visible {outline:3px solid #75b495;outline-offset:3px}
.secondary {background:#eef6f3;color:var(--primary-green)}
.secondary:hover {background:#dceee5;color:var(--primary-green-dark)}
.danger {background:var(--danger);color:white}
.danger:hover {background:#a32930}
.compact {padding:6px 12px;font-size:12px}
form .helptext {font-size:12px;color:var(--text-secondary);display:block}
form ul.errorlist {padding:8px 18px;color:var(--danger);background:#fff2f2;border-radius:8px;font-size:13px}
/* Tables and status labels */
.tablewrap {overflow-x:auto;border-radius:10px}
table {border-collapse:collapse;width:100%;font-size:13px;white-space:nowrap}
th,td {border-bottom:1px solid var(--border-color);padding:13px 15px;text-align:right}
th {background:#f4f6f8;font-weight:600;color:#56707c}
tr:last-child td {border-bottom:0}
tr:hover td {background:#fbfdfc}
.badge {display:inline-block;padding:4px 12px;border-radius:7px;background:var(--primary-green-light);color:var(--primary-green-dark);font-size:12px;font-weight:600;line-height:1.55}
.badge.warning {background:#fff3dc;color:#946819}
.badge.danger {background:#fde9e9;color:var(--danger)}
.empty-state {padding:40px 15px;text-align:center;color:var(--text-secondary);font-size:14px}
.statrow {display:flex;justify-content:space-between;align-items:center;gap:15px;padding:11px 3px;border-bottom:1px solid var(--border-color)}
.statrow b {color:var(--primary-green);font-size:15px}
.pager {display:flex;gap:20px;align-items:center;justify-content:center;padding:18px}
.notice {background:var(--primary-green-light);border:1px solid #c2dfcf;color:var(--primary-green-dark);padding:13px 16px;border-radius:9px;margin-bottom:20px;font-size:14px}
.error {color:var(--danger)}
.inline {display:inline}.inline button {padding:4px 9px}
.actions {display:flex;flex-wrap:wrap;gap:9px}
pre {white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}
.floating,.nav-overlay {display:none}
/* Sign-in uses the same local visual identity. */
.login {min-height:100vh;display:grid;place-items:center;padding:24px;background:#edf4ef}
.login .panel {width:min(440px,100%);padding:32px}
.login h1 {font-size:23px;text-align:center}
.login button {width:100%;margin-top:18px}
.login-logo {display:block;height:95px;width:auto;margin:0 auto 22px;object-fit:contain}
@media(min-width:1600px){.cards{grid-template-columns:repeat(auto-fit,minmax(235px,1fr))}}
@media(max-width:1100px){:root{--sidebar-width:230px}.app-header{padding-inline:20px}.brand strong{font-size:22px}main{padding:25px 22px}.dashboard-charts{grid-template-columns:1fr 1fr}.metric-card{padding:18px}.metric-icon{width:48px;height:48px}.nav-link,.navbtn{gap:13px;padding:12px}}
@media(max-width:850px){:root{--header-height:84px}.app-header{padding:8px 16px;gap:12px}.brand{gap:14px}.brand-logo{height:65px}.brand-divider{height:40px}.brand strong{font-size:19px}.header-account{font-size:12px;gap:8px}.avatar{width:35px;height:35px}#nav-toggle{display:block}.shell{display:block}.sidebar{display:none;position:fixed;left:0;right:auto;top:var(--header-height);bottom:0;height:auto;width:264px;z-index:25;box-shadow:8px 0 25px #163f301a}.sidebar.open{display:flex}.nav-overlay:not([hidden]){display:block;position:fixed;inset:var(--header-height) 0 0;background:#163f3033;border-radius:0;z-index:24}main{padding:22px 18px}.page-heading{margin-bottom:20px}.page-heading h1{font-size:25px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dashboard-charts{grid-template-columns:1fr}.chart-frame{height:270px}.floating{display:grid;place-items:center;position:fixed;bottom:20px;right:20px;background:var(--primary-green);color:white;border-radius:50%;width:52px;height:52px;font-size:30px;box-shadow:0 4px 18px #174e302a;z-index:20}.grid,.stats-grid{grid-template-columns:1fr}.panel{padding:20px}}
@media(max-width:520px){.header-account>span:not(.avatar){display:none}.brand strong{font-size:16px}.brand{gap:10px}.brand-logo{height:60px}.brand-divider{height:34px}.app-header{gap:9px;padding-inline:12px}.avatar{width:30px;height:30px}.page-heading{align-items:start;gap:10px}.date-label{font-size:10px;max-width:135px}.date-label .icon{width:18px}.metric-card{padding:15px;gap:10px;min-height:120px}.metric-card>div span{font-size:12px}.metric-icon{width:38px;height:38px}.metric-icon .icon{width:25px;height:25px}.card b{font-size:29px}.filters label{min-width:100%;flex-basis:100%}.panel{padding:16px}h2{font-size:17px}}
@media print{.app-header,.sidebar,.floating,.nav-overlay,#nav-toggle{display:none!important}.shell{display:block}main{padding:0}.panel,.card{box-shadow:none;break-inside:avoid}body{background:white}}
