:root{
  --brand:#0d4f9e;        /* मुख्य निळा (buttons, links) */
  --brand-2:#1a6fd1;
  --brand-soft:#e8f0fb;
  --ink:#1f2430;
  --bg:#f4f5f8;
  --card:#ffffff;
  --line:#e4e6ec;
}
body{font-family:'Mukta',system-ui,sans-serif;background:var(--bg);color:var(--ink)}
a{color:var(--brand)}

/* ---------- Top bar ---------- */
.app-top{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;position:sticky;top:0;z-index:1030;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.app-logo{height:48px;width:48px;border-radius:50%;background:#fff;padding:2px}
.app-org{font-size:1.15rem;font-weight:700;line-height:1.2}
.app-branch,.app-date{font-size:.85rem;opacity:.85}
.app-nav{background:rgba(0,0,0,.18)}
.app-nav .nav-link{color:#fff!important;padding:.55rem .9rem!important;font-weight:600}
.app-nav .nav-link:hover,.app-nav .show>.nav-link{background:rgba(255,255,255,.12)}
.app-dropdown{max-height:70vh;overflow:auto;border:0;box-shadow:0 8px 24px rgba(0,0,0,.15);font-size:.95rem}
.app-dropdown .dropdown-item:hover{background:var(--brand-soft);color:var(--brand)}

/* ---------- Dashboard ---------- */
.chip{background:#fff;border:1px solid var(--line);border-radius:999px;padding:.25rem .75rem;font-size:.85rem}
.stat-card{background:var(--card);border-radius:12px;padding:1rem;border:1px solid var(--line);border-top:4px solid var(--c);height:100%}
.stat-label{font-size:.9rem;color:#5b6170;font-weight:600}
.stat-icon{font-size:1.4rem;color:var(--c)}
.stat-amt{font-size:1.15rem;font-weight:700;margin-top:.35rem;word-break:break-all}
.stat-cnt{font-size:.82rem;color:#7a8090}
.c-blue{--c:#2f6fdb}.c-teal{--c:#0f9488}.c-indigo{--c:#5b4bd6}
.c-amber{--c:#d98a06}.c-green{--c:#2e9b4f}.c-red{--c:#c43d3d}

.panel{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:1.25rem}
.panel-head{font-weight:700;margin-bottom:1rem}
.quick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem}
.quick-tile{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem .5rem;border-radius:10px;
  border:1px solid var(--line);text-decoration:none;color:var(--ink);font-weight:600;font-size:.92rem;text-align:center;transition:.15s}
.quick-tile:hover{border-color:var(--brand);background:var(--brand-soft);transform:translateY(-2px)}
.quick-ic{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:1.5rem;background:var(--brand-soft);color:var(--brand)}

/* ---------- Login ---------- */
.login-bg{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#f6e9eb,#eef1f7)}
.login-wrap{display:flex;width:min(920px,94vw);background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.12)}
.login-side{flex:1;background:linear-gradient(160deg,var(--brand),#4d1219);color:#fff;padding:3rem;align-items:center}
.login-side h1{font-size:1.6rem;font-weight:700;line-height:1.35}
.login-card{flex:1;padding:2.5rem}
.btn-brand{background:var(--brand);color:#fff;font-weight:600}
.btn-brand:hover{background:var(--brand-2);color:#fff}
@media (min-width:992px){.quick-grid{grid-template-columns:repeat(5,1fr)}}

/* ---------- User permissions ---------- */
.perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.75rem;transition:opacity .2s}
.perm-card{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.perm-head{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;background:var(--brand-soft);border-bottom:1px solid var(--line)}
.perm-body{padding:.5rem .75rem;max-height:230px;overflow:auto;font-size:.93rem}
.perm-body .form-check{margin-bottom:.15rem}
.perm-body-tall{max-height:380px}
.perm-sec{border-top:1px dashed var(--line);padding-top:.25rem}
.form-check-input:checked{background-color:var(--brand);border-color:var(--brand)}
.sticky-actions{position:sticky;bottom:0;background:var(--bg);padding:.75rem 0;border-top:1px solid var(--line)}

/* =========================================================
   Classic layout (header + dashboard)
   ========================================================= */
body.classic{min-height:100vh;background:#fff radial-gradient(ellipse at center,#fff 55%,#f7dcdc 100%)}
@media (max-width:991px){.cl-sep{display:none}}
.cl-top{background:#fff;box-shadow:0 0 10px 5px rgba(0,0,0,.18);position:sticky;top:0;z-index:1030}
.cl-logo{width:92px;height:92px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px #fff,0 2px 8px rgba(0,0,0,.25)}
.cl-org{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem;min-width:0}
.cl-name{color:#e00000;font-size:1.6rem;font-weight:600;line-height:1.2}
.cl-sep{color:#555;font-size:1.8rem;font-weight:300}
.cl-branch{color:#0026ff;font-size:1.25rem}
.cl-user{font-family:'Open Sans',sans-serif;font-size:.95rem;white-space:nowrap}
.cl-date{color:#e00000;font-weight:700;margin-right:.35rem;animation:clBlink 1.6s steps(2,start) infinite}
@keyframes clBlink{to{visibility:hidden}}
.cl-power{color:#1a73e8;font-size:1.25rem;vertical-align:middle;margin-left:.25rem}
.cl-power:hover{color:#c00}
.cl-nav .navbar-nav{gap:0}
.cl-nav .nav-link{font-family:'Open Sans',sans-serif;color:#000!important;font-size:1rem;padding:.6rem 1.1rem!important;position:relative}
.cl-nav .nav-item:not(:last-child) .nav-link::after{content:"";position:absolute;right:0;top:25%;height:50%;border-right:2px solid #222}
.cl-nav .nav-link:hover,.cl-nav .show>.nav-link{color:#0026ff!important}
.cl-dropdown{max-height:70vh;overflow:auto;border:0;border-top:3px solid #0d4f9e;border-radius:0 0 6px 6px;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.cl-dropdown .dropdown-item{font-size:.93rem;padding:.35rem 1rem}
.cl-dropdown .dropdown-item:hover{background:#0d4f9e;color:#fff}

.cl-panel{background:linear-gradient(135deg,#0a2a5c 0%,#14468a 55%,#0d3a78 100%);border-radius:6px;
  box-shadow:0 6px 18px rgba(0,0,0,.35);padding:2.25rem 1.25rem;max-width:980px;margin:0 auto}
.cl-grid{display:grid;grid-template-columns:repeat(5,1fr);row-gap:2rem;column-gap:1rem}
.cl-tile{display:flex;flex-direction:column;align-items:center;gap:.9rem;text-decoration:none;color:#fff}
.cl-circle{width:116px;height:116px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 30%,#fff 0%,#f1f3f6 70%,#d9dde3 100%);
  box-shadow:0 0 0 4px rgba(255,255,255,.25),0 6px 14px rgba(0,0,0,.35);transition:transform .15s}
.cl-circle i{font-size:3.4rem}
.cl-label{font-weight:700;font-size:1rem;text-align:center}
.cl-tile:hover .cl-circle{transform:scale(1.08)}
.cl-tile:hover{color:#ffd54f}

.cl-stats{max-width:420px;margin:1.5rem auto 0;text-align:center}
.cl-stat-k{font-style:italic;color:#4a3a3a;font-size:1.1rem}
.cl-stat-v{font-size:1.3rem;font-weight:600;color:#111}

.cl-notify-tab{position:fixed;left:0;top:45%;z-index:1020;border:0;background:#f26b5b;color:#fff;
  width:30px;height:56px;border-radius:0 30px 30px 0;display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.cl-notify-dot{position:absolute;top:-8px;right:-10px;background:#c00;color:#fff;border-radius:999px;font-size:.7rem;padding:.1rem .4rem}
.cl-n-ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;margin-right:.6rem}
.cl-n-ic.red{background:#e53935}.cl-n-ic.blue{background:#1e88e5}.cl-n-ic.green{background:#43a047}

@media (max-width:991px){
  .cl-grid{grid-template-columns:repeat(3,1fr)}
  .cl-logo{width:64px;height:64px}
  .cl-name{font-size:1.2rem}.cl-branch{font-size:1rem}
  .cl-nav .nav-link::after{display:none}
}
@media (max-width:575px){
  .cl-grid{grid-template-columns:repeat(2,1fr)}
  .cl-circle{width:88px;height:88px}.cl-circle i{font-size:2.5rem}
  .cl-user{white-space:normal}
}

/* ---------- Master screens ---------- */
.master-sec{font-weight:700;font-size:.85rem;color:var(--brand);border-bottom:1px solid var(--line);margin:.75rem 0 .5rem;padding-bottom:.2rem}
.master-list{max-height:70vh;overflow:auto}
.master-list thead th{position:sticky;top:0;z-index:1;font-size:.85rem;white-space:nowrap}
.master-list td{font-size:.9rem}
.master-form .form-label{font-weight:600;color:#3b4252}
@media print{
  .cl-top,.cl-notify-tab,footer,.d-print-none,.alert,.toast-container{display:none!important}
  body.classic{background:#fff}
  .col-lg-7{width:100%!important;flex:0 0 100%;max-width:100%}
  .master-list{max-height:none;overflow:visible}
  .panel{border:0;padding:0}
}

/* ---------- मराठी transliteration ---------- */
.tl-wrap{position:relative;display:block}
.tl-wrap>input,.tl-wrap>textarea{padding-right:2.1rem}
.tl-badge{position:absolute;right:.4rem;top:.35rem;width:1.35rem;height:1.35rem;border-radius:50%;display:grid;place-items:center;
  font-size:.75rem;font-weight:700;background:var(--brand-soft);color:var(--brand);cursor:pointer;user-select:none}
.tl-pop{position:absolute;z-index:2000;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.15);
  display:flex;gap:.25rem;padding:.25rem}
.tl-pop[hidden]{display:none}
.tl-pop button{border:0;background:var(--brand-soft);border-radius:6px;padding:.15rem .5rem;font-size:.95rem}
.tl-pop button:hover{background:var(--brand);color:#fff}

/* ---------- यादी: English / मराठी आणि print शीर्षक ---------- */
.l-mr{display:none}
.lang-mr .l-en{display:none}
.lang-mr .l-mr{display:table-cell}
.print-head{display:none;text-align:center;margin-bottom:.75rem}
.print-head div{font-weight:700}
.lang-mr .print-head .l-en,.print-head .l-mr{display:none}
.lang-mr .print-head .l-mr{display:block}
@media print{
  .print-head{display:block}
  .master-list table{border:1px solid #000}
  .master-list th,.master-list td{border:1px solid #000!important;padding:.2rem .4rem!important}
  .master-list tr.table-active td{background:#fff!important}
}

/* ---------- फोटो / कागदपत्रे ---------- */
.img-box{width:100%;height:120px;border:1px dashed var(--line);border-radius:8px;display:grid;place-items:center;background:#fafbfd;overflow:hidden}
.img-box img{max-width:100%;max-height:100%;object-fit:contain}
.img-box .bi{font-size:2rem}
.img-field.is-invalid .img-box{border-color:#dc3545}
.party-accounts td,.party-accounts th{font-size:.85rem}

/* ---------- सभासद शोध (party-find.js) ---------- */
.pf-wrap{position:relative}
.pf-list{position:absolute;top:100%;left:0;right:0;min-width:18rem;z-index:1060;max-height:320px;overflow:auto;margin-top:2px}
.pf-list .list-group-item.active{background:var(--brand-soft);color:var(--ink);border-color:var(--line)}
.pf-list .list-group-item.active b{color:var(--brand)}
.pf-unpicked{border-color:#e0a10b!important;box-shadow:0 0 0 .15rem rgba(224,161,11,.25)}
.lang-mr span.l-mr{display:inline}
.hist-table td{vertical-align:top}

/* ---------- खाते screens ---------- */
.acc-party{border:1px solid var(--line);border-radius:10px;background:#fbfcfe;padding:.6rem .75rem;margin:-.25rem 0 .75rem}
.acc-party img{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.acc-party img.acc-sign{width:110px;height:48px;object-fit:contain;background:#fff}
.acc-ph{width:64px;height:64px;border-radius:8px;background:#eef1f6;display:grid;place-items:center;font-size:1.8rem;color:#98a2b3}
.acc-kind{display:none}
.acc-calc{background:#f6f9ff;border:1px dashed #b9c9e6;border-radius:8px;padding:.5rem .75rem}

/* ---------- पिग्मी वसुली तक्ता ---------- */
.pig-grid{max-height:70vh}
.pig-grid table{font-size:.85rem}
.pig-grid th,.pig-grid td{white-space:nowrap}
.pig-grid thead th{position:sticky;top:0;z-index:2}
.pg-sticky{position:sticky;left:0;background:#fff;z-index:1}
.pg-sticky2{position:sticky;left:4.5rem;background:#fff;z-index:1;max-width:12rem;overflow:hidden;text-overflow:ellipsis}
thead .pg-sticky,thead .pg-sticky2,tfoot .pg-sticky,tfoot .pg-sticky2{background:#f8f9fa;z-index:3}
.pg-in{width:100%;min-width:4.6rem;border:0;padding:.25rem .35rem;text-align:right;background:transparent}
.pg-in:focus{outline:2px solid var(--brand);background:#fffbe6}
.pg-in[readonly]{color:#6c757d;background:repeating-linear-gradient(45deg,#f6f6f6,#f6f6f6 4px,#fff 4px,#fff 8px)}
.table-success .pg-in[readonly]{background:transparent;color:#146c43;font-weight:600}
.pg-in.is-bad{background:#ffe3e3}
/* मोठा menu (Reports): गटनिहाय स्तंभ */
@media (min-width:992px){.cl-mega{width:min(96vw,1180px);columns:4 14rem;column-gap:.5rem;padding:.5rem;max-height:none;overflow:visible}
  .cl-nav .dropdown:has(.cl-mega){position:static}.cl-mega{left:50%!important;transform:translateX(-50%)}}
.cl-mega .cl-sec{break-inside:avoid-column}
.cl-mega .dropdown-item{font-size:.86rem;padding:.2rem .75rem;white-space:normal}
.cl-mega .dropdown-header{font-weight:700;color:#0d4f9e;padding:.35rem .75rem .15rem}

/* Clerk Entry: Receipt / Payment रंगपट्टा, खातेदाराचा फोटो-सही */
.vf-side-rec { border-top: 4px solid #2e9b4f; }
.vf-side-pay { border-top: 4px solid #c62828; }
.vf-side-pay #vfSide { color: #c62828; }
.vf-side-rec #vfSide { color: #1e7b3c; }
.vf-thumb { height: 40px; width: auto; max-width: 48px; object-fit: cover; border: 1px solid var(--line, #ccc); border-radius: 3px; background: #fff; }
.vf-thumb-sign { max-width: 70px; object-fit: contain; margin-left: 2px; }
.vf-det { font-size: .78rem; }
.vf-ps-photo img { max-height: 320px; }
.vf-ps-sign img { max-height: 220px; }
.cl-date-closed{color:#6c757d;animation:none}
