/* Admin-panel theme. Reports keep each client's own brand colours in both modes. */
:root{
  color-scheme:light;
  --bg:#F2F5FA;--surface:#FFFFFF;--ink:#061126;--on-ink:#FFFFFF;--bar:#061126;
  --muted:#5B6B88;--muted2:#8296B8;--border:#E1E7F0;--line2:#D5DEEB;--dashed:#C6D2E4;--tabbg:#EDF1F7;--divider:#E8EDF4;
  --ocr-bg:#EEF4FF;--ocr-line:#D3E0FA;--tri1:#DCE7FF;--tri2:#D9F7EC;
  --ok-bg:#DDF7EE;--ok:#0E7A57;--bad-bg:#F6E5E3;--bad:#B3261E;
  --chip-icon:brightness(0) saturate(100%) invert(13%) sepia(35%) saturate(2200%) hue-rotate(245deg);--chip-icon-on:brightness(0) invert(1);
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#070E1C;--surface:#0F1A2E;--ink:#E6ECF7;--on-ink:#061126;--bar:#030915;
  --muted:#9AA9C4;--muted2:#7488AA;--border:#1E2C46;--line2:#2A3B5A;--dashed:#2F4266;--tabbg:#16233B;--divider:#1C2A43;
  --ocr-bg:#10204A;--ocr-line:#24407A;--tri1:#0F2350;--tri2:#0B2E28;
  --ok-bg:#0E3A2C;--ok:#4FD3A0;--bad-bg:#3A1715;--bad:#FF8A80;
  --chip-icon:brightness(0) invert(1) opacity(.85);--chip-icon-on:brightness(0);
}
body{margin:0;background:var(--bg);font-family:'Thmanyah Sans','IBM Plex Sans Arabic',Arial,sans-serif;-webkit-font-smoothing:antialiased;-webkit-print-color-adjust:exact;print-color-adjust:exact;}
a{color:#2468FF;text-decoration:none;}a:hover{color:#1549CC;}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
input[type=number]{-moz-appearance:textfield;}
button,input{font-family:'Thmanyah Sans','IBM Plex Sans Arabic',Arial,sans-serif;}
#app{min-height:100vh;display:flex;flex-direction:column;}

/* Responsive grids (the prototype switched these on container width) */
.g-clients{display:grid;gap:18px;grid-template-columns:minmax(0,1fr);}
@media (min-width:640px){.g-clients{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:1000px){.g-clients{grid-template-columns:repeat(3,minmax(0,1fr));}}

.g-kpi{display:grid;grid-template-columns:minmax(0,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.g-kpi>.kpi+.kpi{border-top:1px solid var(--line);}
@media (min-width:760px){
  .g-kpi{grid-template-columns:repeat(3,minmax(0,1fr));}
  .g-kpi>.kpi+.kpi{border-top:0;}
  .g-kpi>.kpi:not(:last-child){border-left:1px solid var(--line);}
}

.g-plat{display:grid;gap:16px;grid-template-columns:minmax(0,1fr);}
@media (min-width:600px){.g-plat{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:1100px){.g-plat{grid-template-columns:repeat(4,minmax(0,1fr));}}

.g-form4{display:grid;gap:12px;grid-template-columns:minmax(0,1fr);}
@media (min-width:420px){.g-form4{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:760px){.g-form4{grid-template-columns:repeat(4,minmax(0,1fr));}}

.g-form2{display:grid;gap:12px;grid-template-columns:minmax(0,1fr);}
@media (min-width:560px){.g-form2{grid-template-columns:repeat(2,minmax(0,1fr));}}

.g-target{display:grid;gap:12px;grid-template-columns:minmax(0,1fr);}
@media (min-width:640px){.g-target{grid-template-columns:repeat(3,minmax(0,1fr));}}

/* PDF export: A4 pages in the report colour, no card or section split across a page break */
@page{size:A4;margin:0;}
@media print{
  .no-print,#modal,#toast{display:none !important;}
  html,body{background:var(--print-bg,#FFFFFF) !important;}
  #app{min-height:0;}
  .report{overflow:visible !important;zoom:.82;}
  /* margin-less pages, so the inner padding is repeated on every page instead */
  .report-inner{padding:14mm 12mm !important;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
  .report-tri{display:none;}
  .avoid-break{break-inside:avoid;page-break-inside:avoid;}
  .keep-next{break-after:avoid;page-break-after:avoid;}
  .g-kpi{grid-template-columns:repeat(3,minmax(0,1fr));}
  .g-kpi>.kpi+.kpi{border-top:0;}
  .g-kpi>.kpi:not(:last-child){border-left:1px solid var(--line);}
  .g-plat{grid-template-columns:repeat(2,minmax(0,1fr));}
}
