/* =====================================================================
   floor.css  —  Amal floor app  ·  SINGLE source of truth for theme tokens + chrome
   Canonical theme = the QC-Screening chrome (screening.html).
   Every floor surface MUST include this file:  <link rel="stylesheet" href="/floor.css">
   and the icon set:                            <script src="/floor-icons.js"></script>
   Served by server.py static handler from /var/www/floor/floor.css (no backend change).

   Office override: rbac-admin.html re-sets these vars to an office palette in a
   small local <style> block so its appearance is UNCHANGED while tokens stay
   single-sourced here.
   ===================================================================== */

:root{
  /* --- core palette (the proven QC-Screening values) --- */
  --bg:#f7f5ef;          /* app background */
  --bg2:#f0eee6;         /* secondary surface (rows/totals/banners) */
  --card:#ffffff;        /* card / panel background */
  --ink:#1f1e1c;         /* primary text */
  --ink2:#5f5e5a;        /* secondary text */
  --ink3:#8a8880;        /* tertiary / muted text */
  --line:rgba(0,0,0,0.12);
  --line2:rgba(0,0,0,0.22);

  --brand:#185fa5;       /* primary blue — title band, primary button */
  --focus:#378add;       /* input focus ring */
  --ok:#0a7d33;          /* success */
  --warn:#a32d2d;        /* danger / error */
  --lang-on:#2f7d32;     /* language pill active (green) */
  --accent-gold:#c79a3a; /* date-input accent (screening) */

  /* --- legacy aliases so existing per-file vocabularies map onto the single source --- */
  --info:var(--brand);
  --color-background-primary:var(--card);
  --color-background-secondary:var(--bg2);
  --color-background-tertiary:var(--bg);
  --color-text-primary:var(--ink);
  --color-text-secondary:var(--ink2);
  --color-text-tertiary:var(--ink3);
  --color-text-info:var(--brand);
  --color-border-tertiary:var(--line);
  --color-border-secondary:var(--line2);

  --r-sm:8px; --r-md:9px; --r-lg:12px; --r-band:11px;
  --border-radius-md:8px; --border-radius-lg:12px;

  --font:"Noto Sans Devanagari",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-sans:var(--font);
}

*{box-sizing:border-box;}
html,body{margin:0;}
body{background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-text-size-adjust:100%;min-height:100vh;}

/* ---------- TOP NAV BAR  (Home · हि/EN pill · user name) ---------- */
.bar{display:flex;align-items:center;justify-content:space-between;background:var(--card);
  padding:10px 14px;border-bottom:0.5px solid rgba(0,0,0,0.1);position:sticky;top:0;z-index:5;}
.hb{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--brand);text-decoration:none;
  background:none;border:none;font-family:inherit;cursor:pointer;padding:6px 4px;min-height:44px;}
.bar-r{display:flex;align-items:center;gap:8px;}
.lang{display:inline-flex;border:0.5px solid rgba(0,0,0,0.14);border-radius:13px;overflow:hidden;
  font-size:12px;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.lang span{padding:8px 10px;color:var(--ink2);user-select:none;}
.lang .on{background:var(--lang-on);color:#fff;}
/* user name = a tap target that opens the logout menu (no hover-only) */
.uname{font-size:12px;font-weight:500;position:relative;display:inline-flex;align-items:center;gap:4px;
  background:none;border:none;font-family:inherit;color:var(--ink);cursor:pointer;
  padding:8px 4px;min-height:44px;-webkit-tap-highlight-color:transparent;}
.uname .caret{width:9px;height:9px;opacity:.55;}
.umenu{position:absolute;top:100%;right:0;margin-top:4px;background:var(--card);
  border:0.5px solid var(--line2);border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,0.18);
  min-width:140px;z-index:30;overflow:hidden;display:none;}
.umenu.open{display:block;}
.umenu a{display:block;padding:13px 14px;font-size:14px;color:var(--warn);text-decoration:none;
  min-height:44px;line-height:1.4;}
.umenu a:active{background:#fcebeb;}

/* ---------- TITLE BAND  (title left + date right) ---------- */
.band{display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--brand);color:#fff;border-radius:var(--r-band);padding:11px 15px;margin:2px 0 14px;}
.band-t{font-size:18px;font-weight:600;}
.band-d{font-size:16px;font-weight:700;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;letter-spacing:.2px;}
.band-d svg{flex:0 0 auto;}

/* ---------- ADMIN-PREVIEW STRIP (dark) ---------- */
.prevbar,.prev{display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:#2b2a27;color:#fff;font-size:12.5px;padding:7px 14px;}
.prevbar a,.prev a{color:#ffd9a3;text-decoration:none;font-weight:500;}

/* ---------- LAYOUT WRAPPERS (mobile-first, fluid) ---------- */
.ph{max-width:440px;margin:0 auto;}
.wrap{max-width:760px;margin:0 auto;padding:14px;}
.body{padding:13px;}

/* ---------- CARDS / SECTIONS ---------- */
.card,.sec{background:var(--card);border:0.5px solid var(--line);border-radius:var(--r-lg);padding:14px;margin-bottom:12px;}
.sec-h{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;margin-bottom:12px;}

/* ---------- BUTTONS  (>=46px touch, radius 9) ---------- */
.btn{min-height:46px;border-radius:var(--r-md);font-size:15px;font-weight:500;font-family:inherit;
  cursor:pointer;border:0.5px solid var(--line2);background:var(--card);color:var(--ink2);
  padding:0 18px;display:inline-flex;align-items:center;justify-content:center;gap:6px;
  -webkit-tap-highlight-color:transparent;}
.btn:active{transform:scale(0.99);}
.btn:disabled{opacity:.5;cursor:default;}
.btn.full{width:100%;}
.btn.primary,.btn.sub{background:var(--brand);border-color:var(--brand);color:#fff;}
.btn.save{background:var(--card);border-color:var(--brand);color:var(--brand);}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff;}
.btn.danger{background:var(--card);border-color:var(--warn);color:var(--warn);}

/* ---------- INPUTS ---------- */
input[type=text],input[type=number],input[type=date],input[type=password],textarea,select{
  width:100%;border:0.5px solid var(--line2);border-radius:var(--r-md);padding:0 11px;min-height:46px;
  font-size:16px;font-family:inherit;background:var(--card);color:var(--ink);}
textarea{height:auto;min-height:72px;padding:10px 11px;resize:vertical;line-height:1.4;}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--focus);
  box-shadow:0 0 0 3px rgba(55,138,221,0.15);}

/* ---------- STATUS PILLS / BADGES ---------- */
.badge{font-size:11px;font-weight:500;border-radius:8px;padding:3px 9px;display:inline-flex;align-items:center;gap:5px;}
.b-sub{background:#faeeda;color:#854f0b;}     /* submitted / pending */
.b-app{background:#eaf3de;color:#3b6d11;}     /* approved */
.b-ret{background:#f1efe8;color:#5f5e5a;}     /* returned */
.b-today{background:#eef2f7;color:#185fa5;}   /* today / info */
.b-pri{background:#fcebeb;color:#a32d2d;}     /* priority / danger */
.b-mute{background:#edecea;color:#73726c;}    /* muted */
.b-ok{background:#e6f5ea;color:#0a7d33;}      /* ok */

/* ---------- COMMON HELPERS ---------- */
.empty{font-size:13px;color:var(--ink3);text-align:center;padding:30px 0;}
.dim{color:var(--ink3);}
svg{display:block;}
.icoslot{display:inline-flex;align-items:center;justify-content:center;}

/* ---------- MOBILE-FIRST DEFAULTS ---------- */
@media (max-width:430px){
  .wrap{padding:10px;}
  .band{padding:9px 12px;flex-wrap:wrap;row-gap:3px;}
  .band-t{font-size:16px;}
  .band-d{font-size:14px;}
}