/* ==========================================================================
   Bazarmela Affiliates — পোর্টাল ডিজাইন
   ভাগ: ১) ভেরিয়েবল ও বেস  ২) লেআউট (সাইডবার/টপবার)  ৩) কার্ড ও KPI
        ৪) টেবিল/ব্যাজ  ৫) ফর্ম ও বাটন  ৬) সেকশন-ভিত্তিক  ৭) লগইন পেজ  ৮) মোবাইল
   ========================================================================== */

/* ১) ভেরিয়েবল ও বেস */
.nba-app, .nba-auth {
	--nba-brand: #16a34a;
	--nba-brand-soft: color-mix(in srgb, var(--nba-brand) 12%, #fff);
	--nba-bg: #f4f6fa;
	--nba-card: #ffffff;
	--nba-text: #0f172a;
	--nba-muted: #64748b;
	--nba-line: #e6e9ef;
	--nba-side: #0f172a;
	--nba-radius: 14px;
	--nba-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 4px 16px rgba(15, 23, 42, .05);
	font-family: "Hind Siliguri", "Noto Sans Bengali", system-ui, -apple-system, "Segoe UI", sans-serif;
	color: var(--nba-text);
	font-size: 15px;
	line-height: 1.55;
	box-sizing: border-box;
}
.nba-app *, .nba-auth * { box-sizing: border-box; }
/* বাংলা যুক্তাক্ষর যেন না ভাঙে: থিমের letter-spacing / uppercase বাতিল, সব জায়গায় একই ফন্ট */
.nba-app, .nba-app *, .nba-auth, .nba-auth * { letter-spacing: normal !important; word-spacing: normal !important; text-transform: none !important; }
.nba-app h1, .nba-app h2, .nba-app h3, .nba-app h4, .nba-app h5, .nba-app p, .nba-app label, .nba-app button, .nba-app input, .nba-app select, .nba-app textarea, .nba-app th, .nba-app td,
.nba-auth h2, .nba-auth p, .nba-auth label, .nba-auth button, .nba-auth input, .nba-auth textarea { font-family: inherit !important; }
.nba-app [lang="en"], .nba-app[lang="en"] { word-break: normal; }
.nba-app a, .nba-auth a { color: inherit; text-decoration: none; }
.nba-app h1, .nba-app h2, .nba-app h3, .nba-app h4, .nba-auth h2 { margin: 0; font-weight: 600; line-height: 1.3; color: var(--nba-text); }
.nba-app code, .nba-auth code { background: #f1f5f9; padding: 2px 6px; border-radius: 6px; font-size: .9em; }
.nba-ico { flex: none; vertical-align: middle; }
.nba-muted { color: var(--nba-muted); }
body.nba-portal-body { margin: 0; background: #f4f6fa; }

/* ২) লেআউট */
.nba-app { display: flex; min-height: 100vh; background: var(--nba-bg); }
.nba-side {
	width: 256px; flex: none; background: var(--nba-side); color: #cbd5e1;
	display: flex; flex-direction: column; padding: 20px 14px; position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.admin-bar .nba-side { top: 32px; height: calc(100vh - 32px); }
.nba-brand { display: flex; align-items: center; gap: 12px; padding: 4px 8px 22px; color: #fff !important; }
.nba-brand img { width: 40px; height: 40px; border-radius: 10px; }
.nba-brand strong { display: block; color: #fff; font-size: 16px; }
.nba-brand small { display: block; color: #94a3b8; font-size: 12px; }
.nba-logo {
	width: 40px; height: 40px; border-radius: 11px; background: var(--nba-brand); color: #fff;
	display: grid; place-items: center; font-weight: 700; font-size: 19px; flex: none;
}
.nba-logo-lg { width: 56px; height: 56px; font-size: 26px; border-radius: 15px; }
.nba-nav { display: flex; flex-direction: column; gap: 2px; }
.nba-nav a, .nba-side-foot a {
	display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px;
	color: #cbd5e1; font-size: 14.5px; transition: background .15s, color .15s;
}
.nba-nav a:hover, .nba-side-foot a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.nba-nav a.is-active { background: var(--nba-brand); color: #fff; box-shadow: 0 6px 16px color-mix(in srgb, var(--nba-brand) 35%, transparent); }
.nba-side-foot { margin-top: auto; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .08); display: flex; flex-direction: column; gap: 2px; }

.nba-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.nba-top {
	display: flex; align-items: center; gap: 14px; padding: 16px 28px; background: rgba(244, 246, 250, .85);
	backdrop-filter: blur(8px); position: sticky; top: 0; z-index: 5; border-bottom: 1px solid var(--nba-line);
}
.admin-bar .nba-top { top: 32px; }
.nba-top h1 { font-size: 21px; flex: 1; }
.nba-top-right { display: flex; align-items: center; gap: 10px; }
.nba-chip {
	display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px;
	background: var(--nba-card); border: 1px solid var(--nba-line); font-weight: 600; font-size: 14px; color: var(--nba-brand) !important;
}
.nba-avatar {
	width: 38px; height: 38px; border-radius: 50%; background: var(--nba-brand-soft); color: var(--nba-brand) !important;
	display: grid; place-items: center; font-weight: 700;
}
.nba-lang { display: inline-flex; background: #fff; border: 1px solid var(--nba-line); border-radius: 999px; padding: 3px; }
.nba-lang a { padding: 4px 10px; border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--nba-muted) !important; line-height: 1.3; }
.nba-lang a.is-active { background: var(--nba-text); color: #fff !important; }
.nba-auth { position: relative; }
.nba-auth-lang { position: absolute; top: 18px; right: 18px; }
.nba-burger { display: none; background: none; border: 0; padding: 6px; cursor: pointer; color: var(--nba-text); }
.nba-overlay { display: none; }
.nba-content { padding: 24px 28px 48px; display: flex; flex-direction: column; gap: 20px; max-width: 1280px; width: 100%; }

/* ৩) কার্ড ও KPI */
.nba-card { background: var(--nba-card); border-radius: var(--nba-radius); box-shadow: var(--nba-shadow); padding: 20px; border: 1px solid var(--nba-line); min-width: 0; }
.nba-card-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.nba-card-h h3 { font-size: 16.5px; }
.nba-card-h > a { color: var(--nba-brand); font-size: 14px; font-weight: 500; }
.nba-mt { margin-top: 18px; }

.nba-hello {
	display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
	background: linear-gradient(120deg, var(--nba-brand), color-mix(in srgb, var(--nba-brand) 60%, #0f172a));
	color: #fff; border-radius: var(--nba-radius); padding: 22px 24px;
}
.nba-hello h2 { color: #fff; font-size: 22px; }
.nba-hello p { margin: 4px 0 0; opacity: .9; }
.nba-hello .nba-btn-primary { background: #fff; color: var(--nba-brand) !important; border-color: #fff; }
.nba-trophy { width: 64px; height: 64px; border-radius: 50%; background: rgba(255, 255, 255, .15); display: grid; place-items: center; }

.nba-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.nba-kpis-3 { grid-template-columns: repeat(3, 1fr); }
.nba-kpi { display: flex; align-items: center; gap: 14px; background: var(--nba-card); border: 1px solid var(--nba-line); border-radius: var(--nba-radius); padding: 18px; box-shadow: var(--nba-shadow); min-width: 0; }
.nba-kpi > div > span { display: block; color: var(--nba-muted); font-size: 13.5px; }
.nba-kpi strong { display: block; font-size: 22px; font-weight: 700; line-height: 1.25; white-space: nowrap; }
.nba-kpi small { color: var(--nba-muted); font-size: 12px; }
.nba-kpi-ico { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; flex: none; }
.nba-t-brand { background: var(--nba-brand-soft); color: var(--nba-brand); }
.nba-t-amber { background: #fef3c7; color: #b45309; }
.nba-t-blue { background: #dbeafe; color: #1d4ed8; }
.nba-t-violet { background: #ede9fe; color: #6d28d9; }
.nba-t-red { background: #fee2e2; color: #b91c1c; }

.nba-mini { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--nba-card); border: 1px solid var(--nba-line); border-radius: var(--nba-radius); box-shadow: var(--nba-shadow); }
.nba-mini > div { padding: 14px 18px; border-left: 1px solid var(--nba-line); }
.nba-mini > div:first-child { border-left: 0; }
.nba-mini > div > span { display: block; font-size: 13px; color: var(--nba-muted); }
.nba-mini strong { font-size: 18px; }

.nba-row-2 { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 20px; align-items: start; }

/* চার্ট */
.nba-chart { position: relative; min-height: 240px; }
.nba-svg { display: block; overflow: visible; }
.nba-grid { stroke: #eef1f5; }
.nba-axis { fill: #94a3b8; font-size: 11px; font-family: inherit; }
.nba-bar { fill: #cbd5e1; opacity: .55; }
.nba-area { fill: var(--nba-brand); opacity: .1; }
.nba-line { fill: none; stroke: var(--nba-brand); stroke-width: 2.5; stroke-linejoin: round; }
.nba-dot { fill: #fff; stroke: var(--nba-brand); stroke-width: 3; }
.nba-guide { stroke: #cbd5e1; stroke-dasharray: 3 3; }
.nba-tip { display: none; position: absolute; top: 6px; background: #0f172a; color: #fff; font-size: 12.5px; padding: 8px 10px; border-radius: 8px; pointer-events: none; min-width: 120px; line-height: 1.5; }
.nba-legend { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--nba-muted); }
.nba-legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; margin-left: 8px; }
.nba-l-earn { background: var(--nba-brand); }
.nba-l-click { background: #cbd5e1; }

/* ৪) টেবিল / ব্যাজ */
.nba-table-wrap { overflow-x: auto; }
.nba-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.nba-table th { text-align: left; font-weight: 500; color: var(--nba-muted); font-size: 13px; padding: 10px 12px; border-bottom: 1px solid var(--nba-line); background: #f8fafc; white-space: nowrap; }
.nba-table td { padding: 12px; border-bottom: 1px solid var(--nba-line); vertical-align: middle; }
.nba-table tr:last-child td { border-bottom: 0; }
.nba-table tr.is-me td { background: var(--nba-brand-soft); }
.nba-table td small { display: block; }
.nba-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 500; background: #f1f5f9; color: #475569; }
.nba-b-pending { background: #fef3c7; color: #92400e; }
.nba-b-approved, .nba-b-paid, .nba-b-active { background: #dcfce7; color: #166534; }
.nba-b-rejected, .nba-b-blocked { background: #fee2e2; color: #991b1b; }
.nba-tag { display: inline-block; padding: 2px 8px; border-radius: 6px; font-size: 12px; background: #f1f5f9; color: #475569; }
.nba-rank { font-weight: 700; color: var(--nba-brand); }

.nba-pills { display: flex; gap: 6px; flex-wrap: wrap; }
.nba-pills a { padding: 6px 12px; border-radius: 999px; font-size: 13.5px; background: #f1f5f9; color: #475569; }
.nba-pills a.is-active { background: var(--nba-text); color: #fff; }
.nba-pager { display: flex; gap: 6px; justify-content: center; margin-top: 16px; flex-wrap: wrap; }
.nba-pager a, .nba-pager span { min-width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; border: 1px solid var(--nba-line); font-size: 14px; background: #fff; }
.nba-pager a.is-active { background: var(--nba-brand); border-color: var(--nba-brand); color: #fff; }
.nba-pager span { border: 0; background: none; }

.nba-empty { text-align: center; padding: 36px 16px; color: var(--nba-muted); display: flex; flex-direction: column; align-items: center; gap: 8px; }
.nba-empty strong { color: var(--nba-text); font-weight: 600; }
.nba-empty p { margin: 0; font-size: 14px; }
.nba-note { font-size: 13.5px; color: var(--nba-muted); margin: 14px 0 0; display: flex; gap: 6px; align-items: flex-start; }
.nba-warn { color: #b45309; margin-top: -4px; }

.nba-alert { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: 12px; font-size: 14.5px; }
.nba-alert.is-success { background: #dcfce7; color: #166534; }
.nba-alert.is-error { background: #fee2e2; color: #991b1b; }

/* ৫) ফর্ম ও বাটন */
.nba-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 16px; border-radius: 10px;
	border: 1px solid var(--nba-line); background: #fff; color: var(--nba-text) !important; font: inherit; font-size: 14.5px; font-weight: 500;
	cursor: pointer; transition: transform .1s, box-shadow .15s, background .15s; line-height: 1.2; white-space: nowrap;
}
.nba-btn:hover { box-shadow: 0 2px 8px rgba(15, 23, 42, .08); }
.nba-btn:active { transform: translateY(1px); }
.nba-btn[disabled] { opacity: .5; cursor: not-allowed; }
.nba-btn-primary { background: var(--nba-brand); border-color: var(--nba-brand); color: #fff !important; }
.nba-btn-sm { padding: 7px 11px; font-size: 13.5px; border-radius: 8px; }
.nba-btn-block { width: 100%; padding: 13px; font-size: 15.5px; }
.nba-fb { background: #1877f2; border-color: #1877f2; color: #fff !important; }
.nba-wa { background: #25d366; border-color: #25d366; color: #fff !important; }
.nba-icon-btn { border: 1px solid var(--nba-line); background: #fff; border-radius: 9px; width: 40px; height: 40px; display: grid; place-items: center; cursor: pointer; color: #94a3b8; flex: none; }
.nba-icon-btn:hover { color: #dc2626; border-color: #fecaca; }

.nba-form label, .nba-auth-form label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; margin-bottom: 14px; color: #334155; }
.nba-app input[type=text], .nba-app input[type=tel], .nba-app input[type=email], .nba-app input[type=url], .nba-app input[type=number],
.nba-app input[type=password], .nba-app input[type=search], .nba-app select, .nba-app textarea,
.nba-auth input[type=text], .nba-auth input[type=tel], .nba-auth input[type=email], .nba-auth input[type=password], .nba-auth textarea {
	width: 100%; padding: 10px 12px; border: 1px solid #d7dce4; border-radius: 10px; font: inherit; font-size: 14.5px; background: #fff; color: var(--nba-text);
	transition: border-color .15s, box-shadow .15s; min-height: 42px;
}
.nba-app input:focus, .nba-app select:focus, .nba-app textarea:focus, .nba-auth input:focus, .nba-auth textarea:focus {
	outline: none; border-color: var(--nba-brand); box-shadow: 0 0 0 3px color-mix(in srgb, var(--nba-brand) 18%, transparent);
}
.nba-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.nba-check { flex-direction: row !important; align-items: flex-start; gap: 10px !important; font-weight: 400 !important; font-size: 13.5px !important; color: var(--nba-muted) !important; }
.nba-check input { margin-top: 4px; width: 16px; height: 16px; accent-color: var(--nba-brand); flex: none; }
.nba-hp { position: absolute; left: -9999px; }
.nba-label { font-size: 13.5px; color: var(--nba-muted); margin: 14px 0 6px; }

.nba-copy { display: flex; gap: 6px; }
.nba-copy input { flex: 1; min-width: 0; background: #f8fafc !important; font-size: 13.5px !important; }
.nba-share { display: flex; gap: 6px; margin-top: 8px; }

.nba-coupon { margin-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border: 2px dashed color-mix(in srgb, var(--nba-brand) 45%, #fff); border-radius: 12px; background: var(--nba-brand-soft); }
.nba-coupon > div > span { display: block; font-size: 12.5px; color: var(--nba-muted); }
.nba-coupon strong { display: block; font-size: 20px; letter-spacing: 1.5px !important; color: var(--nba-brand); }
.nba-coupon small { font-size: 12.5px; color: #475569; }

/* ৬) সেকশন-ভিত্তিক */
.nba-gen { display: flex; gap: 8px; }
.nba-gen input { flex: 1; }
.nba-gen-out { margin-top: 12px; }
.nba-search { display: flex; align-items: center; gap: 8px; background: #f8fafc; border: 1px solid var(--nba-line); border-radius: 10px; padding: 0 10px; color: #94a3b8; }
.nba-search input { border: 0 !important; background: transparent !important; box-shadow: none !important; min-width: 200px; }

.nba-products { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.nba-product { display: flex; gap: 12px; border: 1px solid var(--nba-line); border-radius: 12px; padding: 12px; background: #fff; min-width: 0; }
.nba-product-img { width: 84px; height: 84px; border-radius: 10px; overflow: hidden; background: #f1f5f9; flex: none; }
.nba-product-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nba-product-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.nba-product h4 { font-size: 14.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nba-product-meta { display: flex; justify-content: space-between; gap: 8px; font-size: 13.5px; flex-wrap: wrap; }
.nba-product-meta del { color: #94a3b8; }
.nba-earn { color: var(--nba-brand); font-weight: 600; }

.nba-creatives { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.nba-creative { background: #fff; border: 1px solid var(--nba-line); border-radius: var(--nba-radius); overflow: hidden; box-shadow: var(--nba-shadow); display: flex; flex-direction: column; }
.nba-creative-img { aspect-ratio: 16 / 10; background: #f1f5f9; }
.nba-creative-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nba-creative-body { padding: 16px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.nba-creative-body h4 { font-size: 15.5px; }
.nba-creative-body textarea { font-size: 13.5px !important; background: #f8fafc !important; resize: vertical; }
.nba-creative-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: auto; }

.nba-rows { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.nba-line { display: flex; gap: 8px; }
.nba-app .nba-line select { flex: 1; min-width: 0; width: auto; }
.nba-app .nba-line .nba-qty { width: 84px; flex: none; }
.nba-summary { position: sticky; top: 90px; }
.nba-summary dl, .nba-dl { display: grid; grid-template-columns: 1fr auto; gap: 10px 12px; margin: 0 0 16px; font-size: 14.5px; }
.nba-summary dt, .nba-dl dt { color: var(--nba-muted); }
.nba-summary dd, .nba-dl dd { margin: 0; text-align: right; font-weight: 500; }
.nba-summary .nba-total { font-size: 17px; font-weight: 700; color: var(--nba-text); padding-top: 10px; border-top: 1px solid var(--nba-line); }
.nba-summary dt.nba-earn, .nba-summary dd.nba-earn { color: var(--nba-brand); font-weight: 600; }
.nba-dl dd { text-align: left; }
.nba-dl { grid-template-columns: 120px 1fr; }

.nba-progress-box { background: #fffbeb; border: 1px solid #fde68a; border-radius: 12px; padding: 12px 14px; margin-bottom: 16px; font-size: 14px; }
.nba-progress-box p { margin: 0 0 8px; }
.nba-progress { height: 8px; background: #fde68a; border-radius: 99px; overflow: hidden; }
.nba-progress span { display: block; height: 100%; background: #f59e0b; border-radius: 99px; }
.nba-steps { margin: 0; padding-left: 20px; color: #334155; display: flex; flex-direction: column; gap: 10px; font-size: 14.5px; }

.nba-podium { display: flex; justify-content: center; align-items: flex-end; gap: 14px; padding: 8px 0; }
.nba-pod { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 150px; text-align: center; }
.nba-pod strong { font-size: 15px; }
.nba-pod small { color: var(--nba-muted); }
.nba-pod-avatar { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 20px; background: #fff; border: 3px solid #e2e8f0; }
.nba-pod-bar { width: 100%; border-radius: 12px 12px 0 0; display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 20px; margin-top: 6px; }
.nba-pod-1 .nba-pod-bar { height: 120px; background: linear-gradient(#fbbf24, #f59e0b); }
.nba-pod-1 .nba-pod-avatar { border-color: #f59e0b; }
.nba-pod-2 .nba-pod-bar { height: 88px; background: linear-gradient(#cbd5e1, #94a3b8); }
.nba-pod-3 .nba-pod-bar { height: 64px; background: linear-gradient(#fdba74, #ea580c); }
.nba-pod.is-me .nba-pod-avatar { background: var(--nba-brand); color: #fff; }

.nba-toast { position: fixed; bottom: 24px; left: 50%; transform: translate(-50%, 20px); background: #0f172a; color: #fff; padding: 10px 18px; border-radius: 10px; font-size: 14px; opacity: 0; transition: .25s; z-index: 99999; font-family: "Hind Siliguri", system-ui, sans-serif; }
.nba-toast.is-in { opacity: 1; transform: translate(-50%, 0); }

/* ৭) লগইন / রেজিস্ট্রেশন */
.nba-auth { min-height: 100vh; display: grid; place-items: center; padding: 32px 16px; background: radial-gradient(1200px 600px at 10% -10%, var(--nba-brand-soft), transparent), #f4f6fa; }
.nba-auth-card { width: 100%; max-width: 940px; background: #fff; border-radius: 20px; box-shadow: 0 20px 60px rgba(15, 23, 42, .12); display: grid; grid-template-columns: 1fr 1.1fr; overflow: hidden; }
.nba-auth-single { max-width: 520px; grid-template-columns: 1fr; padding: 8px; }
.nba-center { text-align: center; padding: 40px 28px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.nba-auth-brand { background: linear-gradient(150deg, var(--nba-brand), color-mix(in srgb, var(--nba-brand) 55%, #0f172a)); color: #fff; padding: 40px 36px; display: flex; flex-direction: column; gap: 14px; }
.nba-auth-brand .nba-logo { background: rgba(255, 255, 255, .18); }
.nba-auth-brand h2 { color: #fff; font-size: 26px; }
.nba-auth-brand p { margin: 0; opacity: .9; }
.nba-auth-brand ul { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.nba-auth-brand li { display: flex; gap: 10px; align-items: center; }
.nba-auth-form { padding: 32px 36px; }
.nba-auth-form h2 { font-size: 22px; margin-bottom: 4px; }
.nba-auth-form .nba-alert { margin-bottom: 14px; }
.nba-seg { display: grid; grid-template-columns: 1fr 1fr; background: #f1f5f9; border-radius: 12px; padding: 4px; margin-bottom: 20px; }
.nba-seg a { text-align: center; padding: 9px; border-radius: 9px; font-weight: 500; color: var(--nba-muted); }
.nba-seg a.is-active { background: #fff; color: var(--nba-text); box-shadow: 0 1px 4px rgba(15, 23, 42, .1); }
.nba-login p { margin: 0 0 14px; }
.nba-login label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 500; }
.nba-login .login-remember label { display: flex; flex-direction: row; gap: 8px; align-items: center; font-weight: 400; }
.nba-login input[type=submit] { width: 100%; padding: 13px; border: 0; border-radius: 10px; background: var(--nba-brand); color: #fff; font: inherit; font-size: 15.5px; font-weight: 600; cursor: pointer; }
.nba-status-ico { width: 72px; height: 72px; border-radius: 50%; display: grid; place-items: center; }
.nba-status-ico.is-wait { background: #fef3c7; color: #b45309; }
.nba-status-ico.is-stop { background: #fee2e2; color: #b91c1c; }

/* ৮) মোবাইল ও ট্যাবলেট */
@media (max-width: 1100px) {
	.nba-kpis { grid-template-columns: repeat(2, 1fr); }
	.nba-row-2 { grid-template-columns: 1fr; }
	.nba-summary { position: static; }
}
@media (max-width: 860px) {
	.nba-side { position: fixed; left: 0; top: 0; bottom: 0; height: 100vh; z-index: 1001; transform: translateX(-100%); transition: transform .25s; }
	.admin-bar .nba-side { top: 0; height: 100vh; }
	.nba-app.is-open .nba-side { transform: none; }
	.nba-app.is-open .nba-overlay { display: block; position: fixed; inset: 0; background: rgba(15, 23, 42, .45); z-index: 1000; }
	.nba-burger { display: block; }
	.nba-top { padding: 12px 16px; }
	.nba-top h1 { font-size: 18px; }
	.nba-content { padding: 16px 16px 40px; gap: 16px; }
	.nba-auth-card { grid-template-columns: 1fr; }
	.nba-auth-brand { padding: 28px 24px; }
	.nba-auth-brand ul { display: none; }
	.nba-auth-form { padding: 24px 20px; }
}
@media (max-width: 600px) {
	.nba-kpis, .nba-kpis-3 { grid-template-columns: 1fr 1fr; gap: 10px; }
	.nba-kpis-3 > :last-child { grid-column: span 2; }
	.nba-kpi { flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px; }
	.nba-kpi strong { font-size: 18px; }
	.nba-kpi-ico { width: 38px; height: 38px; }
	.nba-mini { grid-template-columns: 1fr 1fr; }
	.nba-mini > div:nth-child(3) { border-left: 0; }
	.nba-mini > div:nth-child(n+3) { border-top: 1px solid var(--nba-line); }
	.nba-grid-2 { grid-template-columns: 1fr; }
	.nba-chip { display: none; }
	.nba-gen { flex-direction: column; }
	.nba-search input { min-width: 0; }
	.nba-card-h .nba-search { width: 100%; }
	.nba-hello { padding: 18px; }
	.nba-hello h2 { font-size: 19px; }
	.nba-pod { width: 100px; }
	/* টেবিল মোবাইলে কার্ডের মতো */
	.nba-table thead { display: none; }
	.nba-table, .nba-table tbody, .nba-table tr, .nba-table td { display: block; width: 100%; }
	.nba-table tr { border: 1px solid var(--nba-line); border-radius: 12px; margin-bottom: 10px; padding: 6px 4px; }
	.nba-table td { border: 0; display: flex; justify-content: space-between; gap: 12px; padding: 7px 10px; text-align: right; }
	.nba-table td::before { content: attr(data-l); color: var(--nba-muted); font-size: 13px; text-align: left; }
	.nba-table td small { display: inline; margin-left: 6px; }
}