/* Ismaili Volunteers Southwestern USA CRM — IV brand theme
   Brand navy-blue #01558B sampled from official IV SW USA identity.
   Gradient #186495 -> #79A5C2 from brand background. */
:root{
  --brand:#01558B; --brand-dark:#013F68; --brand-mid:#2D739F;
  --grad-a:#186495; --grad-b:#79A5C2;
  --bg:#F2F6F9; --card:#fff; --line:#D8E3EC; --text:#16283A; --muted:#5A6B7A;
  --tint:#E9F1F5;
  --ok:#1a7f4e; --err:#b3261e; --warn:#a15c00;
}
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 system-ui,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--brand)}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;
  background:var(--brand);color:#fff;padding:10px 16px;flex-wrap:wrap}
.topbar .brand{font-weight:700;display:flex;align-items:center;gap:10px}
.topbar .brand img{height:30px;width:30px}
.topbar nav a{color:#DCEAF4;text-decoration:none;margin-left:14px}
.topbar nav a.active{color:#fff;border-bottom:2px solid #fff}
.wrap{max-width:1080px;margin:20px auto;padding:0 14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px;margin-bottom:18px}
.card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
h1{font-size:1.4rem}h2{font-size:1.15rem;margin-top:0}
table{width:100%;border-collapse:collapse;font-size:.94rem}
th,td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{color:var(--brand-dark)}
tr.inactive{opacity:.55}
.row-actions{white-space:nowrap}
.row-actions form{display:inline}
button,.btn{background:var(--brand);color:#fff;border:0;border-radius:8px;padding:9px 14px;
  font-size:.95rem;cursor:pointer;text-decoration:none;display:inline-block}
button:hover,.btn:hover{background:var(--brand-dark)}
.btn.ghost{background:transparent;color:var(--brand);border:1px solid var(--brand)}
button.link{background:none;color:var(--brand);padding:0;text-decoration:underline;font-size:.94rem}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
label{display:block;margin:10px 0;font-weight:600}
input,select{width:100%;padding:9px 10px;margin-top:4px;border:1px solid var(--line);
  border-radius:8px;font-size:1rem;font-weight:400;background:#fff}
input:focus,select:focus{outline:2px solid var(--brand-mid);outline-offset:0}
.grid-form{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.grid-form .btn-row{grid-column:1/-1}
@media(max-width:640px){.grid-form{grid-template-columns:1fr}}
.alert{padding:10px 14px;border-radius:8px;margin-bottom:14px}
.alert.ok{background:#e5f4ec;color:var(--ok)}
.alert.error{background:#fbe9e7;color:var(--err)}
.warn{color:var(--warn);font-weight:600}
.muted{color:var(--muted)}
.share-panel pre{background:var(--tint);border:1px dashed var(--line);border-radius:8px;
  padding:12px;white-space:pre-wrap;font-size:.95rem}
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:16px 0}
.stat{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px;
  font-size:.85rem;color:var(--muted);border-top:3px solid var(--brand)}
.stat span{display:block;font-size:1.3rem;font-weight:700;color:var(--brand-dark)}
.stat.warn{border-top-color:var(--warn)}
.stat.warn span{color:var(--warn)}
.auth-page{display:grid;place-items:center;min-height:100vh;
  background:linear-gradient(160deg,var(--grad-a),var(--grad-b))}
.auth-card{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:28px;width:min(400px,92vw);text-align:left}
.auth-card .logo{display:block;margin:0 auto 12px;height:84px;width:84px}
.auth-card h1{font-size:1.05rem;color:var(--brand);text-align:center;
  text-transform:uppercase;letter-spacing:.03em}
.auth-card .tagline{text-align:center;color:var(--muted);font-size:.8rem;
  margin:-6px 0 14px;letter-spacing:.08em;text-transform:uppercase}
.auth-card button{width:100%;margin-top:8px}

/* status badges + tabs (Phase 3) */
.badge{display:inline-block;padding:2px 9px;border-radius:20px;font-size:.78rem;font-weight:700}
.st-sub{background:#FFF3D6;color:#8a5a00}
.st-rev{background:#E2ECFF;color:#1f4fa3}
.st-app{background:#DDF0FF;color:#01558B}
.st-proc{background:#EFE2FF;color:#5b2ea6}
.st-paid{background:#E0F3E8;color:#1a7f4e}
.st-rej{background:#FBE4E2;color:#b3261e}
.status-tabs a{display:inline-block;margin:0 8px 8px 0;padding:5px 11px;border-radius:20px;
  background:var(--tint);color:var(--brand-dark);text-decoration:none;font-size:.85rem}
.status-tabs a.on{background:var(--brand);color:#fff}
details summary::-webkit-details-marker{display:none}
h3{font-size:1rem;margin:16px 0 6px}

/* Phase 5: budgets, reports */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
@media(max-width:760px){.two-col{grid-template-columns:1fr}}
.bar{background:var(--tint);border-radius:20px;height:9px;overflow:hidden}
.bar span{display:block;height:100%;background:var(--brand)}
td.num,th.num{text-align:right}
code{background:var(--tint);padding:1px 5px;border-radius:4px;font-size:.9em}
@media print{.topbar,.btn,button,.status-tabs{display:none!important}
  .card{border:0;padding:0}body{background:#fff}}

/* Phase 6: PWA, i18n, RTL */
.lang-switch{margin-left:14px}
.lang-switch a{color:#DCEAF4;text-decoration:none;margin-left:6px;font-size:.85rem;opacity:.8}
.lang-switch a.on{color:#fff;opacity:1;font-weight:700}
[dir="rtl"] body{direction:rtl}
[dir="rtl"] th,[dir="rtl"] td{text-align:right}
[dir="rtl"] .topbar nav a{margin-left:0;margin-right:14px}
[dir="rtl"] .lang-switch{margin-left:0;margin-right:14px}
[dir="rtl"] td.num,[dir="rtl"] th.num{text-align:left}
#net-banner{position:sticky;top:0;z-index:5}