/* ==================================================================
   Unity 30 Fund Manager
   Everything is scoped to .u30 so it cannot fight with the theme.
   ================================================================== */

.u30 {
	--u30-navy:  #0f2740;
	--u30-navy2: #1b3c5e;
	--u30-gold:  #c8a24a;
	--u30-ink:   #14202c;
	--u30-mut:   #667a8c;
	--u30-line:  #dfe6ec;
	--u30-bg:    #f6f8fa;
	--u30-good:  #146c2e;
	--u30-goodbg:#e6f4ea;
	--u30-bad:   #b3261e;
	--u30-badbg: #fdeceb;
	--u30-warn:  #8a6100;
	--u30-warnbg:#fff5db;
	--u30-r:     12px;

	color: var(--u30-ink);
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
	font-family: "Inter", "Hind Siliguri", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans Bengali", system-ui, sans-serif;
	box-sizing: border-box;
}
.u30 *, .u30 *::before, .u30 *::after { box-sizing: inherit; }
.u30 p { margin: 0 0 .8em; }

/* ---------- language ---------- */
.u30-bn { display: none; }
[data-u30lang="bn"] .u30-en { display: none; }
[data-u30lang="bn"] .u30-bn { display: inline; }
[data-u30lang="bn"] .u30 { font-family: "Hind Siliguri", "Noto Sans Bengali", -apple-system, system-ui, sans-serif; }

.u30-langbar { display: flex; justify-content: flex-end; margin: 0 0 1rem; }
.u30-lang {
	display: inline-flex; border: 1px solid var(--u30-line);
	border-radius: 999px; overflow: hidden; background: #fff;
}
.u30-lang button {
	appearance: none; border: 0; background: transparent; cursor: pointer;
	padding: .45rem 1rem; font: inherit; font-size: .85rem; color: var(--u30-mut);
	line-height: 1.4; transition: background .15s, color .15s;
}
.u30-lang button.is-on { background: var(--u30-navy); color: #fff; }

/* ---------- hero / progress ---------- */
.u30-hero {
	background: linear-gradient(150deg, var(--u30-navy) 0%, var(--u30-navy2) 100%);
	color: #fff; border-radius: var(--u30-r); padding: 2rem 1.5rem;
	text-align: center; margin: 0 0 1.25rem;
}
.u30-hero-label { font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; opacity: .7; }
.u30-hero-value { font-size: clamp(2rem, 7vw, 3.25rem); font-weight: 700; letter-spacing: -.02em; line-height: 1.1; margin: .35rem 0 .2rem; }
.u30-hero-sub { font-size: .92rem; opacity: .78; }
.u30-hero-foot { font-size: .88rem; opacity: .85; margin-top: .6rem; }
.u30-bar {
	height: 10px; border-radius: 999px; background: rgba(255,255,255,.16);
	overflow: hidden; margin: 1.1rem auto 0; max-width: 640px;
}
.u30-bar > span {
	display: block; height: 100%; border-radius: 999px;
	background: linear-gradient(90deg, var(--u30-gold), #e6c882);
	transition: width 1.1s cubic-bezier(.2,.7,.3,1);
}

/* ---------- KPI cards ---------- */
.u30-kpis {
	display: grid; gap: .85rem; margin: 0 0 1.25rem;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}
.u30-kpi {
	background: #fff; border: 1px solid var(--u30-line); border-radius: var(--u30-r);
	padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: .15rem;
}
.u30-kpi-l { font-size: .74rem; letter-spacing: .09em; text-transform: uppercase; color: var(--u30-mut); }
.u30-kpi-v { font-size: 1.55rem; font-weight: 700; letter-spacing: -.015em; }
.u30-kpi-s { font-size: .78rem; color: var(--u30-mut); }
.u30-kpi.is-bad  { border-color: #f3c9c5; background: var(--u30-badbg); }
.u30-kpi.is-bad  .u30-kpi-v { color: var(--u30-bad); }
.u30-kpi.is-good { border-color: #bfe0c8; background: var(--u30-goodbg); }
.u30-kpi.is-good .u30-kpi-v { color: var(--u30-good); }

/* ---------- panels ---------- */
.u30-panel {
	background: #fff; border: 1px solid var(--u30-line);
	border-radius: var(--u30-r); padding: 1.25rem; margin: 0 0 1.25rem;
}
.u30-panel > h3 {
	margin: 0 0 1rem; font-size: 1rem; font-weight: 650;
	letter-spacing: .01em; color: var(--u30-navy);
}
.u30-cols { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@media (min-width: 900px) { .u30-cols { grid-template-columns: 1fr 1fr; } }

.u30-pill {
	display: inline-block; min-width: 1.4em; padding: 0 .45em;
	background: var(--u30-bad); color: #fff; border-radius: 999px;
	font-size: .72rem; font-weight: 700; text-align: center; vertical-align: middle;
}

/* ---------- bar chart ---------- */
.u30-chart {
	display: grid; grid-template-columns: repeat(12, 1fr);
	gap: 4px; align-items: end; height: 190px;
}
.u30-bar-col { display: flex; flex-direction: column; height: 100%; justify-content: flex-end; text-align: center; }
.u30-bar-val { font-size: .6rem; color: var(--u30-mut); height: 1.1em; white-space: nowrap; }
.u30-bar-track { flex: 1; display: flex; align-items: flex-end; }
.u30-bar-track > span {
	display: block; width: 100%; border-radius: 4px 4px 0 0;
	background: linear-gradient(180deg, var(--u30-navy2), var(--u30-navy));
	min-height: 2px; transition: height .8s cubic-bezier(.2,.7,.3,1);
}
.u30-bar-col.is-future .u30-bar-track > span { background: var(--u30-line); }
.u30-bar-lab { font-size: .68rem; color: var(--u30-mut); padding-top: .35rem; }

/* ---------- tables ---------- */
.u30-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--u30-r); border: 1px solid var(--u30-line); background: #fff; }
.u30-table { width: 100%; border-collapse: collapse; font-size: .88rem; background: #fff; }
.u30-table th, .u30-table td { padding: .6rem .7rem; border-bottom: 1px solid var(--u30-line); text-align: left; vertical-align: middle; }
.u30-table thead th {
	position: sticky; top: 0; z-index: 3;
	background: var(--u30-navy); color: #fff; font-weight: 600;
	font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap;
}
.u30-table tbody tr:nth-child(even) { background: #fbfcfd; }
.u30-table tbody tr:hover { background: #eef4fa; }
.u30-table tfoot td, .u30-table tfoot th {
	background: var(--u30-bg); font-weight: 700; border-top: 2px solid var(--u30-navy); border-bottom: 0;
	position: sticky; bottom: 0; z-index: 2;
}
.u30-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.u30-mono { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; color: var(--u30-mut); font-size: .85em; }
.u30-grand { color: var(--u30-navy); font-size: 1rem; }

.u30-table-plain { border: 1px solid var(--u30-line); border-radius: var(--u30-r); overflow: hidden; }
.u30-table-plain td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.u30-tr-head td { background: var(--u30-bg); font-weight: 650; font-size: .78rem; letter-spacing: .07em; text-transform: uppercase; color: var(--u30-mut); }
.u30-tr-sub td { font-weight: 600; background: #fbfcfd; }
.u30-tr-total td { background: var(--u30-navy); color: #fff; font-weight: 700; font-size: 1rem; }

/* collection grid */
.u30-grid { min-width: 1080px; }
.u30-grid .u30-sticky {
	position: sticky; left: 0; z-index: 2; background: #fff;
	min-width: 200px; box-shadow: 1px 0 0 var(--u30-line);
	font-weight: 500; text-align: left;
}
.u30-grid thead .u30-sticky { z-index: 4; background: var(--u30-navy); }
.u30-grid tfoot .u30-sticky { z-index: 3; background: var(--u30-bg); }
.u30-grid tbody tr:nth-child(even) .u30-sticky { background: #fbfcfd; }
.u30-grid tbody tr:hover .u30-sticky { background: #eef4fa; }
.u30-rowname { display: block; font-size: .92em; color: var(--u30-ink); }
.u30-cell { font-size: .82rem; }
.u30-cell.is-paid   { color: var(--u30-good); }
.u30-cell.is-due    { color: var(--u30-bad); background: var(--u30-badbg); font-weight: 600; }
.u30-cell.is-future { color: #b9c4cd; }
.u30-cell.is-fine   { color: var(--u30-warn); background: var(--u30-warnbg); font-weight: 600; }
.u30-rowtotal { font-weight: 700; background: var(--u30-bg); }
.u30-due { color: var(--u30-bad); font-weight: 700; }
.u30-table thead th.is-future { opacity: .55; }

/* ---------- toolbar ---------- */
.u30-toolbar {
	display: flex; flex-wrap: wrap; gap: .75rem; align-items: center;
	justify-content: space-between; margin: 0 0 .75rem;
}
.u30-search {
	flex: 1 1 220px; max-width: 340px; padding: .55rem .85rem; font: inherit; font-size: .9rem;
	border: 1px solid var(--u30-line); border-radius: 999px; background: #fff; color: var(--u30-ink);
}
.u30-search:focus { outline: 2px solid var(--u30-navy2); outline-offset: 1px; }
.u30-legend { display: flex; gap: .9rem; flex-wrap: wrap; font-size: .78rem; color: var(--u30-mut); }
.u30-legend span { display: inline-flex; align-items: center; gap: .35rem; }
.u30-sw { width: 11px; height: 11px; border-radius: 3px; display: inline-block; }
.u30-sw.is-paid   { background: var(--u30-good); }
.u30-sw.is-due    { background: var(--u30-bad); }
.u30-sw.is-future { background: #cfd8e0; }
.u30-count { font-size: .82rem; color: var(--u30-mut); }

/* ---------- tags ---------- */
.u30-tag {
	display: inline-block; padding: .12rem .55rem; border-radius: 999px;
	font-size: .72rem; font-weight: 600; letter-spacing: .02em; white-space: nowrap;
	background: #eef1f4; color: var(--u30-mut);
}
.u30-tag.is-active { background: var(--u30-goodbg); color: var(--u30-good); }
.u30-tag.is-bad    { background: var(--u30-badbg);  color: var(--u30-bad); }
.u30-tag.is-office { background: #efe4c9; color: #6b5218; }

/* ---------- statement ---------- */
.u30-idform { background: var(--u30-bg); border: 1px solid var(--u30-line); border-radius: var(--u30-r); padding: 1.1rem 1.25rem; margin: 0 0 1.25rem; }
.u30-idform label { display: block; font-weight: 600; margin-bottom: .5rem; font-size: .92rem; }
.u30-idrow { display: flex; gap: .5rem; max-width: 380px; }
.u30-idrow input { flex: 1; padding: .6rem .85rem; font: inherit; border: 1px solid var(--u30-line); border-radius: 8px; background: #fff; }
.u30-stmt-head { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; background: var(--u30-navy); color: #fff; border-radius: var(--u30-r) var(--u30-r) 0 0; }
.u30-stmt-head .u30-muted, .u30-stmt-head .u30-kpi-l { color: rgba(255,255,255,.72); }
.u30-stmt-name { font-size: 1.3rem; font-weight: 700; }
.u30-stmt-total { text-align: right; display: flex; flex-direction: column; }
.u30-stmt-total .u30-kpi-v { color: var(--u30-gold); }
.u30-stmt-table tbody tr.is-due td { background: var(--u30-badbg); }
.u30-stmt-table tbody tr.is-future td { color: #9fadb9; }
.u30-alert { padding: .7rem 1rem; border-radius: 0 0 var(--u30-r) var(--u30-r); margin: 0 0 1.25rem; font-size: .92rem; }
.u30-alert.is-bad  { background: var(--u30-badbg);  color: var(--u30-bad); }
.u30-alert.is-good { background: var(--u30-goodbg); color: var(--u30-good); }
.u30-allclear { color: var(--u30-good); background: var(--u30-goodbg); padding: .8rem 1rem; border-radius: 8px; font-size: .92rem; margin: 0; }

/* ---------- bank ---------- */
.u30-bankcard { background: #fff; border: 1px solid var(--u30-line); border-top: 4px solid var(--u30-gold); border-radius: var(--u30-r); padding: 1.5rem; max-width: 560px; }
.u30-bank-title { font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; color: var(--u30-mut); margin-bottom: 1rem; }
.u30-bankcard dl { display: grid; grid-template-columns: minmax(110px, auto) 1fr; gap: .55rem 1rem; margin: 0 0 1.25rem; }
.u30-bankcard dt { font-size: .82rem; color: var(--u30-mut); }
.u30-bankcard dd { margin: 0; font-weight: 600; }
.u30-bignum { font-size: 1.15rem; letter-spacing: .04em; color: var(--u30-navy) !important; }
.u30-bank-amounts { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: .6rem; padding-top: 1rem; border-top: 1px solid var(--u30-line); margin-bottom: 1rem; }
.u30-bank-amounts div { display: flex; flex-direction: column; }
.u30-bank-amounts span { font-size: .72rem; color: var(--u30-mut); text-transform: uppercase; letter-spacing: .06em; }
.u30-bank-amounts strong { font-size: 1.05rem; }

/* ---------- lock screen ---------- */
.u30-lock { display: flex; justify-content: center; padding: 1.5rem 0; }
.u30-lock-box { background: #fff; border: 1px solid var(--u30-line); border-radius: var(--u30-r); padding: 2rem 1.75rem; max-width: 420px; width: 100%; text-align: center; }
.u30-lock-icon { font-size: 2rem; line-height: 1; margin-bottom: .5rem; }
.u30-lock-box h3 { margin: 0 0 .5rem; font-size: 1.15rem; color: var(--u30-navy); }
.u30-lock-form { display: flex; gap: .5rem; margin: 1rem 0 .75rem; }
.u30-lock-form input { flex: 1; padding: .6rem .85rem; font: inherit; border: 1px solid var(--u30-line); border-radius: 8px; }

/* ---------- buttons & misc ---------- */
.u30-btn {
	appearance: none; border: 0; cursor: pointer; font: inherit; font-weight: 600; font-size: .92rem;
	padding: .6rem 1.3rem; border-radius: 8px; background: var(--u30-navy); color: #fff;
	transition: background .15s, transform .05s;
}
.u30-btn:hover { background: var(--u30-navy2); }
.u30-btn:active { transform: translateY(1px); }
.u30-btn-ghost { background: transparent; color: var(--u30-navy); border: 1px solid var(--u30-line); }
.u30-btn-ghost:hover { background: var(--u30-bg); }

.u30-muted { color: var(--u30-mut); }
.u30-tiny { font-size: .78rem; line-height: 1.5; }
.u30-error { color: var(--u30-bad); font-weight: 600; font-size: .9rem; }
.u30-stamp { font-size: .78rem; color: var(--u30-mut); margin-top: 1rem; }
.u30-empty { background: var(--u30-warnbg); border: 1px solid #f0dfae; color: var(--u30-warn); padding: 1rem 1.25rem; border-radius: var(--u30-r); font-size: .92rem; }
.u30-note { background: var(--u30-bg); border-radius: 8px; padding: 1rem 1.15rem; margin: 1rem 0; font-size: .9rem; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }

/* ---------- print ---------- */
@media print {
	.u30-noprint, .u30-langbar, .u30-toolbar, .u30-idform, .u30-lock { display: none !important; }
	.u30-scroll { overflow: visible !important; border: 0; }
	.u30-grid { min-width: 0; font-size: .62rem; }
	.u30-table thead th { position: static; background: #e8edf2 !important; color: #000 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.u30-hero, .u30-stmt-head, .u30-tr-total td { background: #e8edf2 !important; color: #000 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.u30 { font-size: 11px; }
}

/* ---------- mobile ---------- */
@media (max-width: 600px) {
	.u30-chart { height: 150px; gap: 2px; }
	.u30-bar-val { display: none; }
	.u30-grid .u30-sticky { min-width: 150px; }
	.u30-stmt-total { text-align: left; }
	.u30-legend { font-size: .72rem; }
}

/* ==================================================================
   Admin screens
   ================================================================== */
.u30-admin .u30-lede { max-width: 760px; font-size: 14px; color: #50575e; }
.u30-admin-grid { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); margin: 20px 0; }
.u30-admin .u30-card { background: #fff; border: 1px solid #dcdcde; border-radius: 8px; padding: 18px 20px; }
.u30-admin .u30-card h2 { margin-top: 0; font-size: 15px; }
.u30-admin .u30-card input[type=file] { display: block; margin: 10px 0; max-width: 100%; }
.u30-admin .u30-ok { background: #edf7ed; border-left: 4px solid #146c2e; padding: 8px 12px; font-size: 13px; margin: 12px 0 0; }
.u30-admin .u30-warn { background: #fff5db; border-left: 4px solid #dba617; padding: 8px 12px; font-size: 13px; margin: 12px 0 0; }
.u30-admin .u30-muted { color: #646970; font-size: 13px; }
.u30-admin-table { max-width: 860px; margin-bottom: 24px; }
.u30-admin-table td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.u30-admin .u30-warnlist { max-width: 860px; }
.u30-admin .u30-warnlist li { background: #fff5db; border-left: 4px solid #dba617; padding: 8px 12px; margin: 0 0 6px; font-size: 13px; list-style: none; }
.u30-admin .u30-pill { background: #dba617; }
