:root{
  --navy:#173f7a; --navy-dark:#0e2a52; --blue:#1a4a9c; --ink:#0f172a; --muted:#64748b;
  --bg:#f1f5f9; --card:#ffffff; --line:#e2e8f0;
  --in:#15803d; --in-bg:#dcfce7; --out:#b91c1c; --out-bg:#fee2e2; --wait:#b45309; --wait-bg:#fef3c7;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:"Noto Sans","Noto Sans Gujarati",Segoe UI,-apple-system,BlinkMacSystemFont,Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5}
a{color:var(--blue);text-decoration:none}
a:focus-visible,.btn-ghost:focus-visible{outline:3px solid #8fb0e8;outline-offset:2px}

.shell{display:flex;min-height:100vh}

/* =====================================================================
   Sidebar & Professional Dynamic Navigation
   ===================================================================== */
.side{
  width:260px;
  flex:0 0 260px;
  min-width:260px;
  max-width:260px;
  background:#ffffff;
  border-right:1px solid var(--line);
  box-shadow:2px 0 10px rgba(0,0,0,0.02);
  display:flex;
  flex-direction:column;
  padding:20px 14px;
}

.brand{
  text-align:center;
  padding:4px 6px 16px;
  border-bottom:1px solid var(--line);
}
.brand img{
  max-width:100%;
  height:auto;
  max-height:110px;
  object-fit:contain;
}

.sidebar-nav-container{
  margin-top:14px;
  display:flex;
  flex-direction:column;
}

.sidebar-section-title{
  font-size:11px;
  font-weight:700;
  color:#94a3b8;
  letter-spacing:0.8px;
  margin:10px 4px 6px 8px;
  text-transform:uppercase;
}

.menu{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.menu a, .menu .menu-link, .menu .menu-parent{
  display:flex;
  align-items:center;
  width:100%;
  box-sizing:border-box;
  padding:11px 14px;
  border-radius:10px;
  color:#1e293b;
  font-weight:600;
  font-size:14.5px;
  text-decoration:none;
  cursor:pointer;
  transition:all .15s ease-in-out;
}

.menu a:hover, .menu .menu-link:hover, .menu .menu-parent:hover{
  background:#f1f5f9;
  color:var(--navy);
}

.menu a.on, .menu .menu-link.on{
  background:linear-gradient(135deg, var(--navy) 0%, #2563eb 100%);
  color:#ffffff !important;
  box-shadow:0 4px 10px rgba(37,99,235,0.22);
}

.menu-icon{
  width:20px;
  height:20px;
  flex-shrink:0;
  margin-right:12px;
  stroke:var(--navy);
  color:var(--navy);
  transition:stroke .15s, color .15s;
}

.menu a.on .menu-icon, .menu .menu-link.on .menu-icon{
  stroke:#ffffff !important;
  color:#ffffff !important;
}

.menu-text{
  flex:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.menu-arrow-wrap{
  margin-left:auto;
  display:flex;
  align-items:center;
}
.menu-arrow{
  width:16px;
  height:16px;
  stroke:#64748b;
  transition:transform .2s ease;
}
.menu-group.open .menu-arrow{
  transform:rotate(180deg);
}

/* Submenu Hierarchy - Larger, bold and highly readable font */
.menu-group{
  display:flex;
  flex-direction:column;
  width:100%;
}

.submenu{
  display:none;
  flex-direction:column;
  gap:4px;
  margin:4px 0 8px 18px;
  padding-left:14px;
  border-left:2px solid #cbd5e1;
}

.menu-group.open .submenu{
  display:flex !important;
}

.submenu a, .sub-link{
  display:flex !important;
  align-items:center;
  width:100%;
  box-sizing:border-box;
  padding:9px 12px;
  font-size:13.5px;
  font-weight:600;
  color:#334155;
  border-radius:8px;
  text-decoration:none;
  transition:background .15s, color .15s;
}

.submenu a:hover, .sub-link:hover{
  background:#eff6ff;
  color:#1d4ed8;
}

.submenu a.on, .sub-link.on{
  background:#2563eb;
  color:#ffffff !important;
  font-weight:700;
}

.sub-bullet{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#64748b;
  margin-right:10px;
  flex-shrink:0;
  transition:background .15s;
}

.sub-link.on .sub-bullet{
  background:#ffffff;
}

.sidebar-role-indicator{
  margin-bottom:10px;
}
.badge-role-admin{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:linear-gradient(135deg, #1e40af 0%, #2563eb 100%);
  color:#fff;
  font-size:11px;
  font-weight:800;
  letter-spacing:0.8px;
  padding:5px 12px;
  border-radius:20px;
  box-shadow:0 2px 8px rgba(37,99,235,0.25);
  width:100%;
  justify-content:center;
  box-sizing:border-box;
}
.badge-role-member{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:linear-gradient(135deg, #059669 0%, #10b981 100%);
  color:#fff;
  font-size:11px;
  font-weight:800;
  letter-spacing:0.8px;
  padding:5px 12px;
  border-radius:20px;
  box-shadow:0 2px 8px rgba(16,185,129,0.25);
  width:100%;
  justify-content:center;
  box-sizing:border-box;
}

.sidebar-user-card{
  margin-top:auto;
  padding-top:14px;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  gap:10px;
}
.user-avatar-wrap{
  flex-shrink:0;
}
.sidebar-avatar-img{
  width:38px;
  height:38px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid #2563eb;
}
.sidebar-avatar-initial{
  width:38px;
  height:38px;
  border-radius:50%;
  background:linear-gradient(135deg, #1e40af, #3b82f6);
  color:#fff;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:15px;
}
.user-info-wrap{
  flex:1;
  min-width:0;
}
.user-name{
  font-weight:700;
  font-size:13px;
  color:#0f172a;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.user-role-badge{
  font-size:11px;
  color:#64748b;
  font-weight:500;
}
.tag{
  padding-top:10px;
  text-align:center;
  color:var(--navy);
  font-weight:700;
  font-size:12px;
  letter-spacing:0.5px;
}

/* =====================================================================
   Main Layout & Header
   ===================================================================== */
.main{flex:1;min-width:0;padding:24px 32px 40px}
.top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.top h1{margin:0;font-size:24px;font-weight:700;color:var(--ink)}
.sub{margin:4px 0 0;color:var(--muted);font-size:13px}
.who{display:flex;align-items:center;gap:12px;color:var(--muted)}
.who strong{color:var(--ink)}
.btn-ghost{background:#fff;color:var(--navy);border:1px solid var(--navy);border-radius:6px;padding:7px 14px;font:600 13px inherit;cursor:pointer}
.btn-ghost:hover{background:var(--navy);color:#fff}

/* =====================================================================
   Stats Row & Dashboard Cards
   ===================================================================== */
/* =====================================================================
   Stats Row & Dashboard Cards - Executive Color Grading & Rounded
   ===================================================================== */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px}
.stat{
  background:#ffffff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  padding:20px 22px;
  display:flex;
  flex-direction:column;
  box-shadow:0 4px 20px -4px rgba(15,23,42,0.06);
  position:relative;
  overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease;
}
.stat:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 28px -6px rgba(15,23,42,0.12);
}
.stat::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background:linear-gradient(90deg, #1e40af, #3b82f6);
}
.stat.stat-emerald::before{ background:linear-gradient(90deg, #059669, #10b981); }
.stat.stat-crimson::before{ background:linear-gradient(90deg, #dc2626, #f87171); }
.stat.stat-amber::before{ background:linear-gradient(90deg, #d97706, #fbbf24); }
.stat.stat-indigo::before{ background:linear-gradient(90deg, #4f46e5, #818cf8); }

.stat-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
}
.stat .k{color:#64748b;font-weight:600;font-size:13px;letter-spacing:0.3px}
.stat-icon{
  width:38px;
  height:38px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#eff6ff;
  color:#2563eb;
  font-size:16px;
}
.stat-emerald .stat-icon{ background:#ecfdf5; color:#059669; }
.stat-crimson .stat-icon{ background:#fef2f2; color:#dc2626; }
.stat-amber .stat-icon{ background:#fffbeb; color:#d97706; }
.stat-indigo .stat-icon{ background:#eef2ff; color:#4f46e5; }

.stat .v{font-size:26px;font-weight:800;color:#0f172a;margin:2px 0;letter-spacing:-0.5px}
.stat .n{font-size:12px;color:#64748b;display:flex;align-items:center;gap:6px;margin-top:4px}
.stat .badge-mini{
  display:inline-block;
  padding:2px 6px;
  border-radius:6px;
  font-size:11px;
  font-weight:700;
}
.badge-mini.emerald{ background:#dcfce7; color:#15803d; }
.badge-mini.crimson{ background:#fee2e2; color:#b91c1c; }
.badge-mini.amber{ background:#fef3c7; color:#b45309; }
.badge-mini.indigo{ background:#e0e7ff; color:#4338ca; }

.grid{display:grid;grid-template-columns:2fr 1fr;gap:22px}
.card{
  background:#ffffff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  padding:24px;
  min-width:0;
  box-shadow:0 4px 20px -4px rgba(15,23,42,0.06);
}
.card-h{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:18px;
  border-bottom:1px solid #f1f5f9;
  padding-bottom:14px;
}
.card-h h2{
  margin:0;
  font-size:17px;
  font-weight:700;
  color:#1e293b;
  display:flex;
  align-items:center;
  gap:8px;
}
.card-h a{
  font-size:13px;
  font-weight:600;
  color:#2563eb;
  text-decoration:none;
}
.card-h a:hover{ text-decoration:underline; }

/* Chart Container */
.chart-box{
  position:relative;
  width:100%;
  min-height:260px;
}
.charts-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr;
  gap:22px;
  margin-bottom:24px;
}

/* Quick Action Tiles */
.quick-tiles{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:12px;
}
.quick-tile{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:14px 16px;
  border-radius:12px;
  border:1px solid #e2e8f0;
  background:#f8fafc;
  color:#1e293b;
  text-decoration:none;
  font-weight:600;
  font-size:13px;
  transition:all .15s ease;
}
.quick-tile:hover{
  background:#eff6ff;
  border-color:#bfdbfe;
  color:#1d4ed8;
  transform:translateY(-2px);
}
.quick-tile i, .quick-tile svg{
  font-size:20px;
  margin-bottom:8px;
  color:#2563eb;
}
.quick-tile small{
  color:#64748b;
  font-size:11px;
  font-weight:400;
  margin-top:2px;
}

/* Due List Enhancement */
.due-list{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.due-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px;
  border-radius:10px;
  background:#f8fafc;
  border:1px solid #f1f5f9;
}
.due-item .meta{ display:flex; flex-direction:column; gap:2px; }
.due-item .meta strong{ color:#0f172a; font-size:13px; }
.due-item .meta span{ color:#64748b; font-size:12px; }
.due-item .amount{ text-align:right; font-weight:700; color:#dc2626; font-size:14px; }
.due-item .badge-days{
  display:inline-block;
  background:#fee2e2;
  color:#b91c1c;
  font-size:11px;
  padding:1px 6px;
  border-radius:4px;
  font-weight:700;
  margin-top:2px;
}

/* =====================================================================
   Data Tables
   ===================================================================== */
.table-responsive{overflow-x:auto;background:#fff;border-radius:8px;border:1px solid var(--line)}
table{width:100%;border-collapse:collapse}
th{text-align:left;font-weight:600;color:var(--muted);background:#f8fafc;border-bottom:2px solid var(--line);padding:12px 14px;white-space:nowrap;font-size:12px;text-transform:uppercase;letter-spacing:0.5px}
td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:13px}
tbody tr:hover{background:#f8fafc}
.r{text-align:right;font-variant-numeric:tabular-nums}
.scroll{overflow-x:auto}

/* Status Pills & Badges */
.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.pill.in,.pill.approved{background:var(--in-bg);color:var(--in);border:1px solid #bbf7d0}
.pill.out,.pill.rejected{background:var(--out-bg);color:var(--out);border:1px solid #fecaca}
.pill.wait,.pill.pending{background:var(--wait-bg);color:var(--wait);border:1px solid #fde68a}

/* One-Click Approval & Action Buttons */
.btn-approve{
  background:#16a34a;
  color:#fff !important;
  border:1px solid #15803d;
  padding:5px 10px;
  border-radius:5px;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:4px;
  text-decoration:none;
}
.btn-approve:hover{background:#15803d}

.btn-reject{
  background:#fee2e2;
  color:#b91c1c !important;
  border:1px solid #fca5a5;
  padding:5px 10px;
  border-radius:5px;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:4px;
  text-decoration:none;
}
.btn-reject:hover{background:#fecaca}

.cell-sub{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.kyc-badge{display:inline-block;padding:1px 6px;border-radius:4px;background:#f1f5f9;font-size:11px;font-family:monospace;margin-right:4px}

/* =====================================================================
   Forms & Sections
   ===================================================================== */
.form-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:26px 32px;max-width:960px;box-shadow:0 2px 6px rgba(0,0,0,0.03)}
.form-section-header{
  margin:24px 0 16px;
  padding-bottom:8px;
  border-bottom:2px solid #e2e8f0;
  display:flex;
  align-items:center;
  gap:8px;
}
.form-section-header:first-of-type{margin-top:0}
.form-section-header h3{
  margin:0;
  font-size:15px;
  font-weight:700;
  color:var(--navy);
  text-transform:uppercase;
  letter-spacing:0.4px;
}
.form-section-badge{
  background:#e0e7ff;
  color:var(--blue);
  font-size:11px;
  font-weight:700;
  padding:2px 8px;
  border-radius:4px;
}

.form-title{margin:0 0 20px;font-size:18px;color:var(--navy);font-weight:700;border-bottom:1px solid var(--line);padding-bottom:12px;display:flex;align-items:center;justify-content:space-between}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:16px}
.form-row.three{grid-template-columns:1fr 1fr 1fr}
.form-row.full{grid-template-columns:1fr}
.form-group{display:flex;flex-direction:column;gap:6px}
.form-group label{font-weight:600;color:var(--ink);font-size:13px}
.form-group label .req{color:var(--out);margin-left:3px}
.form-group label .sub-lbl{color:var(--muted);font-weight:400;font-size:12px;margin-left:4px}
.form-input,.form-textarea,.form-select{padding:10px 12px;border:1px solid var(--line);border-radius:6px;font-size:14px;font-family:inherit;color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s}
.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(26,74,156,0.12)}
.form-textarea{min-height:75px;resize:vertical}
.form-check{display:flex;align-items:center;gap:8px;cursor:pointer;margin-top:6px;font-weight:500;font-size:14px}
.form-check input[type="checkbox"]{width:18px;height:18px;cursor:pointer}
.form-actions{display:flex;gap:12px;margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}
.btn-primary{background:var(--navy);color:#fff;border:1px solid var(--navy);padding:10px 22px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;text-decoration:none;transition:background .15s}
.btn-primary:hover{background:#11305e;color:#fff}
.btn-secondary{background:#f1f4f9;color:var(--ink);border:1px solid var(--line);padding:10px 20px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;text-decoration:none}
.btn-secondary:hover{background:#e2e8f0;color:var(--ink)}
.btn-sm{padding:5px 12px;font-size:12px;font-weight:600;border-radius:4px}
.alert{padding:12px 16px;border-radius:6px;margin-bottom:18px;font-size:14px;font-weight:500;display:block}
.alert-success{background:var(--in-bg);color:var(--in);border:1px solid #b6e2c6}
.alert-error{background:var(--out-bg);color:var(--out);border:1px solid #f6c0be}

/* Table Toolbar */
.table-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.search-box{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.search-box input{padding:8px 12px;border:1px solid var(--line);border-radius:6px;font-size:13px;width:240px}

/* Responsive */
@media (max-width:1050px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .grid{grid-template-columns:1fr}
  .form-row.three{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .shell{flex-direction:column}
  .side{width:100%;max-width:100%;border-right:0;border-bottom:1px solid var(--line);padding:12px}
  .brand img{max-height:60px}
  .menu{flex-direction:row;overflow-x:auto;gap:6px}
  .menu a{white-space:nowrap}
  .tag{display:none}
  .main{padding:16px}
  .stats{grid-template-columns:1fr}
  .form-row,.form-row.three{grid-template-columns:1fr}
  .charts-grid{grid-template-columns:1fr}
}

/* =====================================================================
   Receipt Voucher & Printable Report Styles
   ===================================================================== */
.receipt-box{
  background:#fff;
  border:2px dashed #cbd5e1;
  border-radius:12px;
  padding:24px;
  max-width:540px;
  margin:20px auto;
  box-shadow:0 4px 16px rgba(0,0,0,0.04);
}
.receipt-header{
  text-align:center;
  border-bottom:1px solid #e2e8f0;
  padding-bottom:12px;
  margin-bottom:14px;
}
.receipt-header h3{
  margin:0 0 4px;
  font-size:16px;
  color:#1e3a8a;
}
.receipt-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  row-gap:8px;
  column-gap:16px;
  font-size:13px;
  margin-bottom:16px;
}
.receipt-grid .lbl{ color:#64748b; }
.receipt-grid .val{ font-weight:700; color:#0f172a; text-align:right; }

/* =====================================================================
   Customer Portal Dedicated Styles
   ===================================================================== */
.cust-next-pay-card {
  background: linear-gradient(135deg, #0e2a52 0%, #1e40af 50%, #2563eb 100%);
  border-radius: 18px;
  color: #ffffff;
  padding: 24px 28px;
  box-shadow: 0 10px 25px -5px rgba(37,99,235,0.3);
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  position: relative;
  overflow: hidden;
}
.cust-next-pay-card::after {
  content: '';
  position: absolute;
  right: -20px;
  top: -20px;
  width: 140px;
  height: 140px;
  background: rgba(255,255,255,0.06);
  border-radius: 50%;
}
.cust-next-pay-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #bfdbfe;
  display: flex;
  align-items: center;
  gap: 6px;
}
.cust-next-pay-amount {
  font-size: 32px;
  font-weight: 800;
  margin: 6px 0;
  color: #ffffff;
  letter-spacing: -0.5px;
}
.cust-next-pay-meta {
  font-size: 13.5px;
  color: #e0e7ff;
}
.badge-due-chip {
  background: #fef08a;
  color: #854d0e;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 20px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

/* =====================================================================
   Official Cooperative Passbook Styles
   ===================================================================== */
.passbook-container {
  background: #ffffff;
  border: 2px solid #1e3a8a;
  border-radius: 14px;
  padding: 24px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
  margin-bottom: 24px;
}
.passbook-cover-header {
  border-bottom: 2px solid #1e3a8a;
  padding-bottom: 14px;
  margin-bottom: 18px;
  text-align: center;
}
.passbook-cover-header h2 {
  font-size: 20px;
  font-weight: 800;
  color: #0e2a52;
  margin: 0 0 4px;
}
.passbook-profile-grid {
  display: grid;
  grid-template-columns: 100px 1fr 1fr;
  gap: 16px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 20px;
  align-items: center;
}
.passbook-photo-wrap {
  width: 90px;
  height: 105px;
  border: 1.5px solid #cbd5e1;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.passbook-photo-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.passbook-field-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
}
.passbook-field-row .lbl {
  color: #64748b;
  font-size: 11.5px;
  font-weight: 600;
  text-transform: uppercase;
}
.passbook-field-row .val {
  color: #0f172a;
  font-weight: 700;
}

/* =====================================================================
   Executive 1-Page PDF Print Engine
   ===================================================================== */
@media print {
  @page {
    size: A4 portrait;
    margin: 8mm 10mm;
  }
  html, body {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 10pt !important;
    line-height: 1.25 !important;
  }
  .side, .top, .actions, .btn-primary, .btn-secondary, .btn-ghost, .table-toolbar, .no-print, .form-card, .footer-note, .sidebar-nav-container, .chart-box, .charts-grid, .quick-tiles, .btn-reject, .btn-approve {
    display: none !important;
  }
  .shell { display: block !important; }
  .main { padding: 0 !important; margin: 0 !important; width: 100% !important; max-width: 100% !important; }
  .card, .receipt-box, .table-responsive, .passbook-container {
    box-shadow: none !important;
    border: 1px solid #000000 !important;
    page-break-inside: avoid !important;
    margin: 0 0 10px !important;
    padding: 10px !important;
    border-radius: 0 !important;
  }
  .print-only {
    display: block !important;
  }
  table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin-top: 8px !important;
  }
  th, td {
    border: 1px solid #334155 !important;
    padding: 5px 8px !important;
    font-size: 9pt !important;
    color: #000000 !important;
  }
  th {
    background: #e2e8f0 !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    font-size: 8.5pt !important;
  }
  .print-letterhead {
    text-align: center;
    border-bottom: 2px solid #000;
    padding-bottom: 8px;
    margin-bottom: 12px;
  }
  .print-letterhead h2 {
    margin: 0;
    font-size: 16pt;
    font-weight: 800;
    color: #000;
  }
  .print-letterhead div {
    font-size: 9pt;
    margin-top: 2px;
  }
  .print-signatures {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
    padding-top: 10px;
    border-top: 1px solid #000;
    font-size: 9pt;
    font-weight: bold;
    page-break-inside: avoid;
  }
}

/* =====================================================================
   NPA & Recovery Management Styles
   ===================================================================== */
.badge-bucket {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}
.badge-current { background: #dcfce7; color: #15803d; border: 1px solid #bbf7d0; }
.badge-sma0 { background: #fef9c3; color: #a16207; border: 1px solid #fef08a; }
.badge-sma1 { background: #ffedd5; color: #c2410c; border: 1px solid #fed7aa; }
.badge-sma2 { background: #fee2e2; color: #b91c1c; border: 1px solid #fecaca; }
.badge-npa { background: #7f1d1d; color: #ffffff; border: 1px solid #991b1b; box-shadow: 0 2px 4px rgba(127,29,29,0.3); }

.tab-nav {
  display: flex;
  gap: 8px;
  border-bottom: 2px solid #e2e8f0;
  margin-bottom: 20px;
  padding-bottom: 0;
  overflow-x: auto;
}
.tab-link {
  padding: 10px 18px;
  font-size: 13.5px;
  font-weight: 700;
  color: #64748b;
  text-decoration: none;
  border-bottom: 3px solid transparent;
  transition: all 0.2s;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}
.tab-link:hover {
  color: #1e40af;
  background: #f8fafc;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.tab-link.active {
  color: #1e40af;
  border-bottom-color: #2563eb;
  background: #eff6ff;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

/* Modal Popup Overlay */
.modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(15, 23, 42, 0.65);
  backdrop-filter: blur(4px);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.modal-window {
  background: #ffffff;
  border-radius: 16px;
  max-width: 640px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2), 0 10px 10px -5px rgba(0, 0, 0, 0.08);
  border: 1px solid #e2e8f0;
  animation: modalFadeIn 0.2s ease-out;
}
@keyframes modalFadeIn {
  from { opacity: 0; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}
.modal-head {
  padding: 16px 22px;
  border-bottom: 1px solid #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #f8fafc;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
}
.modal-head h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
  color: #0f172a;
  display: flex;
  align-items: center;
  gap: 8px;
}
.modal-body {
  padding: 20px 24px;
}
.modal-foot {
  padding: 14px 24px;
  border-top: 1px solid #e2e8f0;
  background: #f8fafc;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  border-bottom-left-radius: 16px;
  border-bottom-right-radius: 16px;
}

/* Demand Notice Letter Layout */
.notice-paper {
  background: #ffffff;
  border: 1.5px solid #1e3a8a;
  padding: 32px 36px;
  border-radius: 10px;
  max-width: 820px;
  margin: 0 auto;
  color: #0f172a;
  line-height: 1.6;
  font-size: 13.5px;
}
.notice-header-seal {
  text-align: center;
  border-bottom: 2px solid #1e3a8a;
  padding-bottom: 14px;
  margin-bottom: 20px;
}
.notice-breakdown-table {
  width: 100%;
  border-collapse: collapse;
  margin: 16px 0;
}
.notice-breakdown-table th, .notice-breakdown-table td {
  border: 1px solid #cbd5e1;
  padding: 8px 12px;
  font-size: 12.5px;
}
.notice-breakdown-table th {
  background: #f1f5f9;
  font-weight: 700;
}