/* ============================================================
   mitsi.ai — shared design tokens (single source of truth)
   Matches the live mitsi.ai landing. Link this BEFORE a page's
   own <style> and delete that page's local :root palette — every
   surface then inherits one theme. Both token namings are provided
   (--grn/--panel canonical + --accent/--surface aliases) so older
   pages need no renaming. See the design system for guidance.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;600&display=swap');

:root{
  /* surfaces (dark-first, green-tinted) */
  --bg:#0a0e0d; --bg2:#0e1413; --panel:#121a18; --panel2:#0d1211; --panel3:#18211f;
  /* text */
  --ink:#e8efec; --mut:#8aa39a; --dim:#5f736c;
  /* structure */
  --line:#1c2623; --line2:#2a352f;
  /* brand — signal green (call · connected · live) */
  --grn:#2fd08a; --grn2:#1f9d66; --grn-hi:#54e0a4; --grn-dim:#12281f;
  /* semantic */
  --amber:#e0a24a; --amber-dim:#33280f; --danger:#e0625b; --danger-dim:#331a19; --info:#5aa9e6; --info-dim:#122736;
  /* type */
  --sans:'Heebo',system-ui,-apple-system,'Segoe UI',Roboto,Arial,'Noto Sans Hebrew',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  /* scale */
  --r-sm:7px; --r:10px; --radius:12px; --r-lg:14px;
  --shadow:0 1px 2px rgba(0,0,0,.45),0 12px 32px rgba(0,0,0,.4);

  /* aliases: surfaces built with the older names inherit the system unchanged */
  --accent:var(--grn); --accent-ink:var(--grn); --accent-wash:var(--grn-dim); --accent-hover:var(--grn-hi);
  --surface:var(--panel); --surface-2:var(--panel2); --surface-3:var(--panel3);
  --muted:var(--mut); --faint:var(--dim); --line-2:var(--line2); --grn-ink:var(--grn);
}

:root[data-theme="light"]{
  --bg:#f4f7f5; --bg2:#eef3f0; --panel:#ffffff; --panel2:#f7faf8; --panel3:#eef3f0;
  --ink:#0e1a15; --mut:#4a5f57; --dim:#7f938b; --line:#dde6e1; --line2:#c9d4cd;
  --grn:#0f9d62; --grn2:#0c7d4e; --grn-hi:#12a866; --grn-dim:#e4f3ea;
  --amber:#b26b00; --amber-dim:#f6ecda; --danger:#c0392b; --danger-dim:#f7e4e2; --info:#2c6fb0; --info-dim:#e4eef8;
  --shadow:0 1px 2px rgba(20,30,25,.06),0 12px 32px rgba(20,30,25,.08);
}

/* optional signature: the faint green dial-tone glow behind a page.
   add class="mitsi-glow" on <body> to apply it. */
.mitsi-glow{
  background-image:
    radial-gradient(680px 360px at 82% -10%, color-mix(in srgb,var(--grn) 12%,transparent), transparent 70%),
    radial-gradient(520px 320px at 6% 6%, color-mix(in srgb,var(--grn) 6%,transparent), transparent 70%);
  background-attachment:fixed;
}

/* ============================================================
   Sortable + filterable table headers (mitsi-table.js).
   Applied automatically to every data table across the surfaces.
   ============================================================ */
th.mts-sortable{cursor:pointer;user-select:none;white-space:nowrap}
th.mts-sortable:hover{color:var(--ink)}
.mts-arr{display:inline-block;margin-inline-start:5px;font-size:10px;line-height:1;opacity:.4;transition:opacity .12s,color .12s;vertical-align:1px}
th.mts-sortable:hover .mts-arr{opacity:.7}
.mts-arr.on{opacity:1;color:var(--grn)}
tr.mts-filterrow th{padding-top:0;padding-bottom:9px;border-bottom:1px solid var(--line)}
input.mts-filter{width:100%;min-width:60px;background:var(--panel2);border:1px solid var(--line);border-radius:6px;
  padding:5px 8px;color:var(--ink);font-family:var(--sans);font-size:12px;font-weight:400;text-transform:none;letter-spacing:normal}
input.mts-filter::placeholder{color:var(--dim)}
input.mts-filter:focus{outline:none;border-color:color-mix(in srgb,var(--grn) 45%,var(--line))}
td.mts-nomatch-c{padding:22px;text-align:center;color:var(--dim);font-size:13.5px}

/* footer bar: column picker (start) + pager (end) */
.mts-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:10px 16px;border-top:1px solid var(--line);font-size:12.5px;color:var(--dim)}
.mts-colwrap{position:relative}
.mts-colbtn{display:inline-flex;align-items:center;gap:6px;background:none;border:1px solid var(--line);
  color:var(--mut);border-radius:7px;padding:5px 11px;font-size:12.5px;cursor:pointer;font-family:var(--sans)}
.mts-colbtn:hover{color:var(--ink);border-color:var(--line2)}
.mts-colcog{font-size:12px;opacity:.8}.mts-caret{font-size:10px;opacity:.7}
.mts-colpop{position:fixed;z-index:10001;width:210px;max-height:60vh;overflow:auto;background:var(--panel);
  border:1px solid var(--line2);border-radius:11px;box-shadow:var(--shadow)}
.mts-colpop-h{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-bottom:1px solid var(--line);
  font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--dim)}
.mts-colreset{background:none;border:0;color:var(--grn);font-size:11.5px;cursor:pointer;font-family:var(--sans)}
.mts-colpop-l{padding:5px}
.mts-colitem{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:7px;cursor:pointer;font-size:13.5px;color:var(--ink)}
.mts-colitem:hover{background:var(--panel2)}
.mts-colitem input{accent-color:var(--grn);width:14px;height:14px;flex:none}
/* pager */
.mts-pager{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-inline-start:auto}
.mts-count{color:var(--mut)}
.mts-pgctrl{display:flex;align-items:center;gap:12px}
.mts-sellbl{display:inline-flex;align-items:center;gap:6px;color:var(--dim)}
.mts-select{background:var(--panel2);border:1px solid var(--line);color:var(--ink);border-radius:7px;
  padding:4px 7px;font-size:12.5px;font-family:var(--sans);cursor:pointer}
.mts-select:focus{outline:none;border-color:color-mix(in srgb,var(--grn) 45%,var(--line))}
.mts-pageinfo{color:var(--mut);white-space:nowrap;font-variant-numeric:tabular-nums}
.mts-nav{display:inline-flex;gap:4px;direction:ltr}
.mts-navbtn{background:var(--panel2);border:1px solid var(--line);color:var(--mut);border-radius:6px;
  min-width:26px;height:26px;padding:0 6px;font-size:13px;line-height:1;cursor:pointer;font-family:var(--sans)}
.mts-navbtn:hover:not(:disabled){color:var(--ink);border-color:var(--line2)}
.mts-navbtn:disabled{opacity:.32;cursor:default}
/* per-column multi-select filter (set-valued columns) */
.mts-msel{width:100%;min-width:0;display:inline-flex;align-items:center;justify-content:space-between;gap:6px;background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:5px 8px;color:var(--mut);font-family:var(--sans);font-size:12px;font-weight:400;text-transform:none;letter-spacing:normal;cursor:pointer;text-align:start}
.mts-msel:hover{color:var(--ink)}
.mts-msel.on{color:var(--ink);border-color:color-mix(in srgb,var(--grn) 45%,var(--line))}
.mts-msel-l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mts-mpop{position:fixed;z-index:10001;min-width:150px;max-width:240px;max-height:60vh;overflow:auto;background:var(--panel);border:1px solid var(--line2);border-radius:11px;box-shadow:var(--shadow)}
.mts-mpop-h{display:flex;align-items:center;justify-content:space-between;padding:8px 11px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--dim)}
.mts-mpop-l{padding:5px}