:root { 
    --primary-blue: #1e3a8a; --primary-hover: #1e40af; --accent-orange: #f97316; 
    --success-green: #10b981; --danger-red: #ef4444; --bg-page: #f8fafc; 
    --bg-input: #ffffff; --border-light: #e2e8f0; --text-dark: #0f172a; 
    --text-medium: #475569; --text-light: #94a3b8; --radius-lg: 8px; 
    --radius-md: 6px; --radius-sm: 4px; --font-family: 'Inter', system-ui, sans-serif; 
}

.bb-page-wrapper { display:block; max-width:950px; margin:0 auto 50px; padding:0 15px; font-family:var(--font-family); color:var(--text-dark); position:relative; z-index:1; }
.bb-wrapper { background:#fff; width:100%; border:1px solid var(--border-light); border-radius:var(--radius-lg); overflow:hidden; margin-bottom:25px; }
.bb-top-nav, .bb-sec-nav { background:#fed7aa; padding:12px 20px; display:flex; gap:10px; flex-wrap:wrap; }
.bb-pill-btn, .bb-sec-link { background:transparent; border:none; padding:8px 20px; border-radius:30px; font-weight:600; color:#c2410c; cursor:pointer; display:flex; align-items:center; gap:8px; font-size:14px; transition:all 0.2s ease; }
.bb-pill-btn.active, .bb-sec-link.active { background:var(--accent-orange); color:white; }
.bb-content { padding:25px; background:#fff; }
.bb-row { display:flex; gap:20px; margin-bottom:20px; flex-wrap:wrap; }
.bb-col { flex:1; min-width:200px; display:flex; flex-direction:column; }
.bb-label { font-weight:600; color:var(--text-medium); margin-bottom:6px; font-size:13px; }
.bb-input { padding:10px 14px; border:1px solid var(--border-light); border-radius:var(--radius-sm); font-size:14px; width:100%; box-sizing:border-box; height:42px; transition:all 0.2s ease; }
.bb-input:focus { outline:none; border-color:var(--accent-orange); box-shadow:0 0 0 1px var(--accent-orange); }

.meter-type-toggle { display:inline-flex; flex-wrap:wrap; gap:5px; background:#fff; border-radius:30px; padding:4px; border:1px solid var(--border-light); margin-bottom:20px; }
.radio-label { padding:6px 16px; cursor:pointer; border-radius:30px; font-size:13px; font-weight:600; color:var(--text-medium); display:flex; align-items:center; gap:6px; transition:all 0.2s ease; }
.radio-label.selected { background:var(--bg-page); color:var(--accent-orange); border:1px solid var(--border-light); }
.radio-dot { display:inline-block; width:10px; height:10px; border-radius:50%; border:2px solid currentColor; margin-right:4px; flex-shrink:0; }

.adv-table { width:100%; border-collapse:collapse; min-width:800px; font-size:13px; text-align:left; }
.adv-table th { background:var(--bg-page); padding:12px; font-weight:600; border-bottom:1px solid var(--border-light); }
.adv-table td { padding:10px 12px; border-bottom:1px solid var(--border-light); }
.add-btn { background:#fff; color:var(--primary-blue); border:1px solid var(--border-light); padding:8px 16px; border-radius:var(--radius-sm); font-weight:600; cursor:pointer; font-size:13px; }
.remove-icon { color:var(--danger-red); cursor:pointer; padding:8px 12px; border:1px solid var(--border-light); border-radius:var(--radius-sm); display:flex; justify-content:center; align-items:center; }
.calc-btn { background:var(--primary-blue); color:white; border:none; padding:12px 28px; border-radius:var(--radius-sm); font-weight:700; cursor:pointer; display:flex; align-items:center; gap:8px; font-size:15px; box-shadow:0 4px 6px rgba(30,58,138,0.2); }
.hidden { display:none !important; }
.dynamic-row { display:flex; gap:15px; margin-bottom:12px; align-items:center; }

.bb-modal { display:none; position:fixed; z-index:999999; left:0; top:0; width:100vw; height:100vh; background-color:rgba(15,23,42,0.7); backdrop-filter:blur(3px); align-items:center; justify-content:center; }
.bb-modal.is-open { display:flex; }
.bb-modal-content { background:#fff; width:90%; max-width:500px; border-radius:var(--radius-lg); overflow:hidden; }
.bb-modal-header { background:#fff; padding:15px 20px; display:flex; justify-content:space-between; align-items:center; font-weight:700; font-size:16px; border-bottom:1px solid var(--border-light); }
.bb-modal-close { cursor:pointer; background:transparent; border:none; width:30px; height:30px; display:flex; align-items:center; justify-content:center; font-size:16px; }
.supply-item { padding:12px; border:1px solid var(--border-light); margin-bottom:10px; border-radius:var(--radius-md); cursor:pointer; display:flex; gap:12px; align-items:center; background:#fff; }
.supply-item .s-code { background:var(--primary-blue); color:white; padding:4px 10px; border-radius:20px; font-weight:600; font-size:12px; }

/* Accordions */
.accordions-wrap { display:flex; flex-direction:column; gap:10px; margin-top:25px; }
.acc-item { border:1px solid var(--border-light); border-radius:var(--radius-md); overflow:hidden; background:white; transition:border-color 0.2s; }
.acc-item.open { border-color:var(--accent-orange); }
.acc-header { padding:15px 20px; background:#fff; cursor:pointer; display:flex; justify-content:space-between; align-items:center; font-weight:600; color:var(--text-dark); transition:all 0.2s; font-size:14px; user-select:none; }
.acc-header span { font-size:12px; font-weight:normal; color:var(--text-medium); margin-top:4px; display:block; }
.acc-body { display:none; border-top:1px solid var(--border-light); background:#fff; }
.acc-item.open .acc-body { display:block; }

/* Result Output Styles */
.bb-result-wrap { font-family:'DM Sans', system-ui, sans-serif; margin-top:30px; }
.bb-stats-bar { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:16px; }
.bb-stat-card { background:#fff; border:1px solid var(--border-light); border-radius:10px; padding:14px 16px; position:relative; overflow:hidden; }
.bb-stat-card::before { content:''; position:absolute; top:0; left:0; width:3px; height:100%; background:var(--stat-color, var(--primary-blue)); }
.bb-stat-label { font-size:11px; font-weight:700; letter-spacing:.8px; text-transform:uppercase; color:var(--text-light); margin-bottom:4px; }
.bb-stat-val   { font-size:24px; font-weight:700; color:var(--text-dark); line-height:1.1; font-family:'DM Mono',monospace; }
.bb-stat-sub   { font-size:12.5px; color:var(--text-medium); margin-top:3px; }

.bb-bill-card { background:#fff; border:1px solid var(--border-light); border-radius:12px; overflow:hidden; margin-bottom:16px; }
.bb-bill-header { background:linear-gradient(135deg,#1e3a8a 0%,#1e40af 60%,#1d4ed8 100%); padding:20px 24px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
.bb-bill-header-left { color:#fff; }
.bb-bill-header-left h3 { margin:0; font-size:16px; font-weight:700; opacity:.85; letter-spacing:.3px; }
.bb-bill-header-left .bb-period { font-family:'DM Mono',monospace; font-size:12px; opacity:.65; margin-top:3px; }
.bb-bill-header-right { text-align:right; }
.bb-bill-header-right .bb-acct { font-size:11px; color:rgba(255,255,255,.6); text-transform:uppercase; letter-spacing:.8px; }
.bb-bill-header-right .bb-name { font-size:15px; font-weight:700; color:#fff; }
.bb-bill-header-right .bb-tariff-badge { display:inline-block; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.25); border-radius:20px; padding:2px 10px; font-size:11px; color:rgba(255,255,255,.9); margin-top:4px; }

.bb-bill-body { display:grid; grid-template-columns:1fr 1.4fr; gap:0; }
.bb-bill-left  { padding:20px; border-right:1px solid var(--border-light); }
.bb-bill-right { padding:20px; }

.bb-section-label { font-size:11px; font-weight:700; letter-spacing:.8px; text-transform:uppercase; color:var(--text-light); margin:0 0 10px; display:flex; align-items:center; gap:6px; }
.bb-section-label::after { content:''; flex:1; height:1px; background:var(--border-light); }
.bb-arrear-grid { background:#fef2f2; border-radius:8px; padding:12px; margin-bottom:16px; border:1px solid #fecaca; }
.bb-arr-row { display:flex; justify-content:space-between; font-size:14px; padding:3px 0; color:var(--text-dark); }
.bb-arr-row.total { border-top:1px dashed #fca5a5; margin-top:6px; padding-top:8px; font-weight:700; color:#dc2626; font-size:15px; }

.bb-load-wrap { margin-bottom:16px; }
.bb-load-meta { display:flex; justify-content:space-between; font-size:11px; font-weight:600; color:var(--text-medium); margin-bottom:5px; }
.bb-load-track { height:6px; background:#e2e8f0; border-radius:6px; overflow:hidden; }
.bb-load-fill  { height:100%; border-radius:6px; transition:width .5s ease; }

.bb-slab-table, .bb-summ-table { width:100%; border-collapse:collapse; font-size:14px; }
.bb-slab-table th { font-size:11px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--text-light); padding:0 6px 6px; text-align:left; }
.bb-slab-table th:not(:first-child) { text-align:right; }
.bb-slab-table td { padding:7px 6px; border-top:1px solid var(--border-light); color:var(--text-dark); }
.bb-slab-table td:not(:first-child) { text-align:right; font-family:'DM Mono',monospace; }
.bb-slab-table tr:last-child td { font-weight:600; }

.bb-summ-table tr { border-bottom:1px solid var(--border-light); }
.bb-summ-table tr:last-child { border-bottom:none; }
.bb-summ-table td { padding:10px 6px; vertical-align:middle; }
.bb-summ-table .item-icon { width:30px; height:30px; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:13px; flex-shrink:0; }
.bb-summ-table .item-name  { font-weight:600; color:var(--text-dark); font-size:14px; }
.bb-summ-table .item-desc  { font-size:11.5px; color:var(--text-light); font-family:'DM Mono',monospace; margin-top:2px; }
.bb-summ-table .item-amt   { text-align:right; font-family:'DM Mono',monospace; font-weight:700; font-size:14px; white-space:nowrap; }
.bb-summ-table .item-amt.zero { color:var(--text-light); font-weight:400; }
.bb-summ-total td { background:#f8fafc; border-top:2px solid var(--border-light) !important; }
.bb-summ-total .item-name { font-size:15px; color:var(--primary-blue); }
.bb-summ-total .item-amt  { font-size:16px; color:var(--primary-blue); }

.bb-charge-rows { margin-top:12px; border-top:1px dashed var(--border-light); padding-top:12px; }
.bb-charge-row { display:flex; justify-content:space-between; align-items:center; padding:5px 6px; border-radius:6px; margin-bottom:4px; }
.bb-charge-row:hover { background:#f8fafc; }
.bb-charge-row .cr-label { font-size:13.5px; color:var(--text-medium); font-weight:500; }
.bb-charge-row .cr-amt-credit { font-size:14px; font-weight:700; color:var(--success-green); font-family:'DM Mono',monospace; }
.bb-charge-row .cr-amt-debit  { font-size:14px; font-weight:700; color:var(--danger-red);   font-family:'DM Mono',monospace; }

.bb-net-footer { background:var(--text-dark); display:flex; justify-content:space-between; align-items:center; padding:18px 24px; flex-wrap:wrap; gap:12px; }
.bb-net-words-label, .bb-net-amount-label { font-size:10px; text-transform:uppercase; letter-spacing:1px; color:rgba(255,255,255,.5); font-weight:700; display:block; margin-bottom:3px; }
.bb-net-words-val { font-size:13.5px; color:rgba(255,255,255,.85); line-height:1.4; font-style:italic; }
.bb-net-amount { text-align:right; }
.bb-net-amount-val { font-size:34px; font-weight:700; color:var(--accent-orange); font-family:'DM Mono',monospace; }

.bb-action-bar { background:#f8fafc; border-top:1px solid var(--border-light); padding:14px 20px; display:flex; justify-content:flex-end; align-items:center; gap:10px; flex-wrap:wrap; }
.btn-secondary { background:#fff; color:var(--primary-blue); border:1px solid var(--border-light); padding:10px 20px; border-radius:var(--radius-sm); font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:8px; transition:all 0.2s; font-size:14px; }
.btn-whatsapp { background:#25D366; color:white; border:none; padding:10px 20px; border-radius:var(--radius-sm); font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:8px; font-size:14px; text-decoration:none; transition:all 0.2s; }
.btn-pdf { background:#ef4444; color:white; border:none; padding:10px 20px; border-radius:var(--radius-sm); font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:8px; font-size:14px; transition:all 0.2s; }

@media(max-width:768px){ 
    .title-wrapper { flex-direction:column; text-align:center; } 
    .bb-col { min-width:100%; } 
    .bb-bill-body { grid-template-columns:1fr; } 
    .bb-stats-bar { grid-template-columns:1fr 1fr; } 
}
/* =========================================================
   ANTI-AD INJECTION (Form ke beech me ads rokne ke liye)
   ========================================================= */
.bb-page-wrapper ins.adsbygoogle,
.bb-page-wrapper .google-auto-placed,
.bb-page-wrapper .code-block,
.bb-page-wrapper [class*="ad-container"],
.bb-page-wrapper [id^="ad-"],
.bb-page-wrapper [id^="aswift_"],
.bb-page-wrapper iframe[title*="Advertisement"] {
    display: none !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: hidden !important;
}