/* Fonts are bundled locally so the app works without internet */
@font-face { font-family: "Mukta"; font-style: normal; font-weight: 400; font-display: swap; src: url(vendor/fonts/mukta-devanagari-400-normal.woff2) format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Mukta"; font-style: normal; font-weight: 400; font-display: swap; src: url(vendor/fonts/mukta-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Mukta"; font-style: normal; font-weight: 600; font-display: swap; src: url(vendor/fonts/mukta-devanagari-600-normal.woff2) format("woff2"); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: "Mukta"; font-style: normal; font-weight: 600; font-display: swap; src: url(vendor/fonts/mukta-latin-600-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root {
  --bg: #f4f6f8;
  --side: #f8f8f8;
  --line: #e3e6ea;
  --ink: #23272b;
  --green: #5cb85c;
  --orange: #f0ad4e;
  --red: #d9534f;
  --blue: #428bca;
  --sky: #d9edf7;
}
body { font-family: "Mukta", "Noto Sans Devanagari", system-ui, sans-serif; background: #fff; color: var(--ink); font-size: 16px; }
.topbar { height: 56px; background: #f8f8f8; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 1030; }
.topbar .brand { font-size: 1.25rem; color: #555; text-decoration: none; font-weight: 500; }
.layout { display: flex; min-height: calc(100vh - 56px); }
.sidebar { width: 250px; background: var(--side); border-right: 1px solid var(--line); flex-shrink: 0; }
@media (min-width: 992px) { .sidebar { position: sticky; top: 56px; height: calc(100vh - 56px); overflow-y: auto; } }
.sidebar .nav a { display: block; padding: 9px 16px; color: #337ab7; text-decoration: none; border-bottom: 1px solid var(--line); font-size: .97rem; }
.sidebar .nav a i { width: 20px; display: inline-block; }
.sidebar .nav a:hover { background: #eee; }
.sidebar .nav a.active { background: #e7e7e7; color: #23527c; font-weight: 600; }
.content { flex: 1; padding: 24px 30px 60px; min-width: 0; }
.page-title { font-size: 2.2rem; font-weight: 500; border-bottom: 1px solid #eee; padding-bottom: 10px; margin: 10px 0 22px; }
@media (max-width: 576px) { .content { padding: 16px; } .page-title { font-size: 1.6rem; } }

.panel { border-radius: 4px; margin-bottom: 22px; }
.panel > .card-header { color: #fff; font-weight: 500; }
.panel-green { border-color: var(--green); } .panel-green > .card-header { background: var(--green); }
.panel-orange { border-color: var(--orange); } .panel-orange > .card-header { background: var(--orange); }
.panel-red { border-color: var(--red); } .panel-red > .card-header { background: var(--red); }
.panel-blue { border-color: var(--blue); } .panel-blue > .card-header { background: var(--blue); }
.panel-info { border-color: #bce8f1; } .panel-info > .card-header { background: var(--sky); color: #31708f; }
.panel .inner { border: 1px solid #ddd; }

.form-label-col { font-size: 1.1rem; }
.table thead th { font-weight: 600; white-space: nowrap; }
.table td a { text-decoration: none; }
.panel-green .table td a { color: var(--green); }
.panel-orange .table td a { color: #ec971f; }
.panel-blue .table td a { color: var(--blue); }

/* dashboard tiles */
.stat { border: 1px solid #ddd; height: 100%; display: flex; flex-direction: column; }
.stat .num { font-size: 2.4rem; padding: 18px 16px 6px; line-height: 1.15; }
.stat .words { font-size: 1.35rem; padding: 0 16px 14px; color: #444; }
.stat .foot { background: #f5f5f5; border-top: 1px solid #ddd; text-align: center; padding: 14px; font-size: 1.3rem; margin-top: auto; }
.tile { display: block; border: 1px solid; border-radius: 4px; text-decoration: none; height: 100%; overflow: hidden; }
.tile .top { color: #fff; display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; min-height: 104px; }
.tile .top i { font-size: 3.6rem; opacity: .95; }
.tile .top span { font-size: 1.55rem; text-align: right; line-height: 1.15; }
.tile .bottom { background: #f5f5f5; padding: 9px 16px; display: flex; justify-content: space-between; }
.tile.g { border-color: var(--green); } .tile.g .top { background: var(--green); } .tile.g .bottom { color: var(--green); }
.tile.r { border-color: var(--red); } .tile.r .top { background: var(--red); } .tile.r .bottom { color: var(--red); }
.tile.o { border-color: var(--orange); } .tile.o .top { background: var(--orange); } .tile.o .bottom { color: #ec971f; }
.tile.b { border-color: var(--blue); } .tile.b .top { background: var(--blue); } .tile.b .bottom { color: var(--blue); }
.tile:hover { filter: brightness(.97); }

.calc-box { background: #fcf8e3; border: 1px solid #faebcc; border-radius: 4px; padding: 12px 14px; font-size: .95rem; }
.calc-box table td, .calc-box table th { padding: 2px 8px; }
.badge-open { background: var(--orange); } .badge-closed { background: #777; }
.text-in { color: #2e7d32; } .text-out { color: #c62828; }

.report-head { text-align: center; margin-bottom: 12px; }
.report-head h2 { font-size: 1.5rem; margin: 0; }
@media print {
  .topbar, .sidebar, .no-print, .alert { display: none !important; }
  .content { padding: 0; }
  .page-title { font-size: 1.4rem; }
  .panel { border: none !important; }
  .panel > .card-header { background: none !important; color: #000 !important; padding-left: 0; }
  a { color: #000 !important; }
}

/* member self-service */
.member-ui { background: var(--bg); }
.member-ui .topbar { position: sticky; top: 0; }
.member-tabs { display: flex; background: #fff; border-bottom: 1px solid var(--line); position: sticky; top: 56px; z-index: 1020; }
.member-tabs a { flex: 1; text-align: center; padding: 8px 4px; color: #555; text-decoration: none; font-size: .9rem; border-bottom: 3px solid transparent; }
.member-tabs a i { display: block; font-size: 1.25rem; }
.member-tabs a.active { color: var(--green); border-bottom-color: var(--green); font-weight: 600; }
.mcard { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; height: 100%; }
.mcard .lbl { color: #666; font-size: .9rem; }
.mcard .val { font-size: 1.5rem; font-weight: 600; }
.msec { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; margin-bottom: 16px; }
.msec h2 { font-size: 1.1rem; font-weight: 600; margin-bottom: 10px; }