/* Priority Web design system, reproduced from Priority Software's public
   "Priority Web" brochure (Dec 2023). Unofficial. */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --navy:#131e3d; --navy2:#0f1730; --cyan:#00a5e3; --cyan-l:#41c3f0;
  --ink:#1b2436; --ink2:#3d4757; --muted:#6b7385;
  --line:#dfe3e9; --line2:#e7ebf0; --head:#eef1f5;
  --page:#f4f5f7; --sel:#d6eefb; --amber:#f59e0b; --red:#d3352a; --green:#12b76a;
}
body{font-family:"Assistant","Segoe UI",Arial,sans-serif;background:var(--page);
  color:var(--ink);font-size:12px;direction:rtl}
.app{display:flex;flex-direction:column;height:100vh;overflow:hidden}

/* ---- chrome ---- */
.topbar{background:var(--navy);height:34px;display:flex;align-items:center;gap:10px;
  padding:0 10px;color:#fff;flex:0 0 auto}
.brand{display:flex;align-items:center;gap:6px;font-weight:700;font-size:14px}
.mark{width:16px;height:16px;border-radius:4px;
  background:linear-gradient(135deg,var(--cyan-l),#5b4bf5 55%,#9333ea)}
.gsearch{flex:1;max-width:420px;margin:0 auto;background:#fff;border-radius:3px;height:20px;
  display:flex;align-items:center;padding:0 8px;color:#8a92a3;font-size:11px}
.tico{display:flex;gap:11px;align-items:center;color:#c8cfdd;font-size:11px}
.modbar{background:var(--navy);height:27px;display:flex;align-items:center;padding:0 10px;
  border-top:1px solid rgba(255,255,255,.07);flex:0 0 auto}
.mod{color:#c3cade;font-size:11px;padding:4px 8px;border-bottom:2px solid transparent;
  text-decoration:none;cursor:pointer}
.mod:hover{color:#fff}
.mod.on{color:var(--cyan-l);border-bottom-color:var(--cyan-l);font-weight:600}
.chip{margin-inline-start:auto;background:var(--green);color:#fff;font-size:10px;
  padding:2px 9px;border-radius:3px;font-weight:600}

/* ---- screen header ---- */
.shead{background:#fff;padding:7px 12px 6px;border-bottom:1px solid var(--line);flex:0 0 auto}
.strow{display:flex;align-items:center;gap:9px}
.stitle{font-size:19px;font-weight:700;color:#1b2f5e}
.meta{color:var(--muted);font-size:11px}
.hact{margin-inline-start:auto;display:flex;gap:11px;color:#55607a;font-size:11px}
.arow{display:flex;align-items:center;gap:7px;padding-top:7px;flex-wrap:wrap}
.btn{background:var(--cyan);color:#fff;border:0;border-radius:3px;padding:4px 13px;
  font-size:11px;font-weight:600;font-family:inherit;cursor:pointer}
.pill{border:1px solid #cfd5df;border-radius:3px;padding:2px 9px;font-size:10.5px;
  color:var(--ink2);background:#fff}
.pill.live{border-color:#b7e3c6;background:#eefaf1;color:#137a3d}

/* ---- grids ---- */
.main{flex:1;display:flex;flex-direction:column;min-height:0;overflow:auto;background:#fff}
table{border-collapse:collapse;width:100%;font-size:11px;white-space:nowrap}
th{background:var(--head);color:var(--ink2);font-weight:600;text-align:right;padding:5px 8px;
  border:1px solid #dde2e9;position:sticky;top:0;font-size:10.5px;z-index:2}
td{padding:3px 8px;border:1px solid var(--line2)}
tbody tr:nth-child(even) td{background:#fafbfc}
tbody tr:hover td{background:#f0f7fd}
tbody tr.sel td{background:var(--sel)}
tr.warnrow td{background:#fff6e5}
tr.badrow td{background:#ffecea}
.num{text-align:left;font-variant-numeric:tabular-nums}
.flag{display:inline-block;font-size:9.5px;font-weight:700;padding:1px 5px;border-radius:2px;
  margin-inline-start:5px;color:#fff}
.flag.fx{background:var(--amber)} .flag.dup{background:var(--red)}
.st{display:inline-block;padding:1px 7px;border-radius:9px;font-size:10px;font-weight:600}
.st.draft{background:#eef1f5;color:#55607a}
.st.ok{background:#eefaf1;color:#137a3d}
.st.cancel{background:#ffecea;color:#a8261d}

/* ---- form + subform (the Priority paradigm) ---- */
.form{background:#fff;border-top:3px solid #e3e7ed;padding:9px 12px;flex:0 0 auto}
.ftabs{display:flex;gap:15px;border-bottom:1px solid var(--line);margin-bottom:9px;flex-wrap:wrap}
.ftab{font-size:11px;color:#55607a;padding:0 0 5px;border-bottom:2px solid transparent;cursor:pointer}
.ftab.on{color:var(--cyan);border-bottom-color:var(--cyan);font-weight:600}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px 22px}
.f{display:flex;align-items:center;gap:6px}
.f label{width:118px;font-size:11px;color:var(--ink2);text-align:right;flex:0 0 auto}
.f .req{color:var(--red);font-size:9px;margin-inline-end:2px}
.f .in{flex:1;border:1px solid #ccd3dd;background:#fff;height:19px;font-size:11px;
  padding:1px 5px;display:flex;align-items:center;color:#111927;overflow:hidden}
.f .in.ro{background:#f2f4f7;color:#5c6577}
.sftabs{background:var(--navy);display:flex;align-items:center;gap:1px;padding:0 6px;flex:0 0 auto}
.sftab{color:#c3cade;font-size:10.5px;padding:5px 10px;cursor:pointer}
.sftab.on{background:var(--cyan);color:#fff;font-weight:600}

/* ---- dashboard ---- */
.dash{padding:12px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-content:start}
.tile{background:#fff;border:1px solid var(--line);border-radius:6px;padding:11px 13px;
  text-decoration:none;color:inherit;display:block}
.tile:hover{border-color:var(--cyan);box-shadow:0 1px 6px rgba(0,90,160,.10)}
.tile .lab{font-size:11px;color:var(--muted)}
.tile .val{font-size:23px;font-weight:700;color:#1b2f5e;margin-top:2px;font-variant-numeric:tabular-nums}
.tile .sub{font-size:10.5px;color:var(--muted);margin-top:2px}
.card{background:#fff;border:1px solid var(--line);border-radius:6px;padding:11px 13px}
.card h3{font-size:12px;font-weight:700;color:#1b2f5e;margin-bottom:9px}
.card.w2{grid-column:span 2} .card.w4{grid-column:span 4}
.bar{display:flex;align-items:center;gap:7px;margin-bottom:4px;font-size:11px}
.bar .bl{width:88px;color:var(--ink2);text-align:right;flex:0 0 auto;
  overflow:hidden;text-overflow:ellipsis}
.bar .bt{flex:1;background:#eef1f5;border-radius:2px;height:13px;position:relative}
.bar .bf{background:var(--cyan);height:100%;border-radius:2px}
.bar .bv{width:76px;text-align:left;color:var(--ink2);font-variant-numeric:tabular-nums;flex:0 0 auto}

/* ---- status bar + note ---- */
.status{background:var(--navy);color:#c3cade;height:22px;display:flex;align-items:center;
  gap:16px;padding:0 10px;font-size:10.5px;flex:0 0 auto}
.status .r{margin-inline-start:auto;display:flex;gap:14px}
.note{background:#fffbe6;border-top:1px solid #f0e2b0;padding:4px 12px;font-size:10.5px;
  color:#6b5d20;direction:ltr;text-align:left;flex:0 0 auto}
.loading{padding:16px;color:var(--muted)}