/* Shaheen2 shared foundation: fonts, colour tokens, reset.
   Component CSS stays with each page. Change a token here and both the login
   screen and the app follow. */

@font-face{font-family:'Outfit';src:url('/fonts/outfit-var.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;}
@font-face{font-family:'Plex Arabic';src:url('/fonts/plexar-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Plex Arabic';src:url('/fonts/plexar-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Plex Arabic';src:url('/fonts/plexar-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;}

:root{
  --ink:#16181c;
  --ink-soft:#5b6068;
  --ink-faint:#8b9099;
  --surface:#f7f6f4;
  --panel:#ffffff;
  --panel-alt:#faf9f7;
  --line:#e2e0dc;
  --line-strong:#cfccc6;
  --field:#ffffff;
  --accent:#b06f1e;
  --accent-ink:#1a1206;
  --accent-hover:#965d16;
  --accent-wash:#f6efe4;
  --danger:#a52c26;
  --danger-bg:#fbeceb;
  --ok:#20614a;
  --dark-panel:#101216;
  --radius:10px;
  --radius-sm:8px;
  --shadow:0 1px 2px rgba(30,26,20,.05), 0 12px 32px -18px rgba(30,26,20,.35);
}
@media (prefers-color-scheme: dark){
  :root{
    --ink:#eceae6;
    --ink-soft:#a2a6ad;
    --ink-faint:#767b83;
    --surface:#0d0f12;
    --panel:#15181c;
    --panel-alt:#181c21;
    --line:#262a30;
    --line-strong:#363b43;
    --field:#101317;
    --accent:#e0a44e;
    --accent-ink:#1a1206;
    --accent-hover:#eeb463;
    --accent-wash:#221a10;
    --danger:#f08a80;
    --danger-bg:#2a1614;
    --ok:#6fc4a2;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 18px 40px -22px rgba(0,0,0,.8);
  }
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  min-height:100dvh;
  background:var(--surface);
  color:var(--ink);
  font-family:'Outfit',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
html[dir="rtl"] body{font-family:'Plex Arabic','Outfit',ui-sans-serif,system-ui,sans-serif;}
[hidden]{display:none !important}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}