/* Credit Baniya CB-UI 1.0 — 2026-10-20
   Progressive, opt-in visual foundation. Applies only to <body class="cb-ui ...">.
   Scoped by shell to avoid changing application, payment, auth, or modal behavior.
   No external scripts, database changes, or DOM mutations required.
*/
:root {
  --cbui-deep:#06231F;
  --cbui-deep-2:#0B312B;
  --cbui-teal:#075D53;
  --cbui-teal-hover:#05473F;
  --cbui-teal-soft:#E7F3EF;
  --cbui-gold:#E6A129;
  --cbui-gold-hover:#D9911C;
  --cbui-gold-soft:#FFF4DC;
  --cbui-bg:#F4F8F7;
  --cbui-white:#FFFFFF;
  --cbui-ink:#173B35;
  --cbui-ink-strong:#102A26;
  --cbui-muted:#556E68;
  --cbui-border:#D8E5E0;
  --cbui-border-strong:#BCD1C9;
  --cbui-success:#13795B;
  --cbui-warning:#98610D;
  --cbui-danger:#B42318;
  --cbui-radius-sm:10px;
  --cbui-radius:14px;
  --cbui-radius-lg:18px;
  --cbui-shadow:0 8px 24px rgba(6,35,31,.075);
  --cbui-shadow-lg:0 18px 44px rgba(6,35,31,.11);
  --cbui-font:Inter,"Noto Sans Devanagari","Segoe UI",Arial,sans-serif;
  --cbui-font-size:14px;
  --cbui-touch:44px;
}
body.cb-ui,
body.cb-ui :where(button,input,select,textarea) {
  font-family:var(--cbui-font);
}
body.cb-ui {
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  line-height:1.55;
}
body.cb-ui :where(button,input,select,textarea) {letter-spacing:normal;}
body.cb-ui :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible {
  outline:3px solid var(--cbui-gold)!important;
  outline-offset:3px;
}
body.cb-ui :where(button,input[type="button"],input[type="submit"],a) {
  -webkit-tap-highlight-color:rgba(230,161,41,.14);
}
body.cb-ui :where(button,[role="button"],a):not([aria-disabled="true"]) {
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease;
}
/* Fully reusable, opt-in components for new pages and progressively migrated old pages. */
body.cb-ui .cbui-page {max-width:1520px;margin:0 auto;padding:24px;}
body.cb-ui .cbui-page-head {display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:16px;margin-bottom:22px;}
body.cb-ui .cbui-title {margin:0;color:var(--cbui-ink-strong);font-size:clamp(24px,2vw,32px);font-weight:800;letter-spacing:-.035em;line-height:1.2;}
body.cb-ui .cbui-subtitle {color:var(--cbui-muted);font-size:14px;line-height:1.55;margin:6px 0 0;}
body.cb-ui .cbui-card {background:#fff;border:1px solid var(--cbui-border);border-radius:var(--cbui-radius);box-shadow:var(--cbui-shadow);min-width:0;}
body.cb-ui .cbui-card-head {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid #E7EFEC;}
body.cb-ui .cbui-card-body {padding:20px;}
body.cb-ui .cbui-card-title {font-size:16px;font-weight:750;color:var(--cbui-ink-strong);margin:0;}
body.cb-ui .cbui-grid {display:grid;gap:16px;grid-template-columns:repeat(12,minmax(0,1fr));}
body.cb-ui .cbui-col-3 {grid-column:span 3;}body.cb-ui .cbui-col-4 {grid-column:span 4;}body.cb-ui .cbui-col-6 {grid-column:span 6;}body.cb-ui .cbui-col-12 {grid-column:span 12;}
body.cb-ui .cbui-btn {display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:42px;padding:10px 17px;border-radius:10px;border:1px solid var(--cbui-border-strong);background:#fff;color:var(--cbui-ink);font-size:13px;font-weight:700;text-decoration:none;cursor:pointer;line-height:1.15;}
body.cb-ui .cbui-btn:hover {border-color:var(--cbui-teal);background:#F2F9F6;}
body.cb-ui .cbui-btn-primary {background:var(--cbui-teal);color:#fff;border-color:var(--cbui-teal);}
body.cb-ui .cbui-btn-primary:hover {background:var(--cbui-teal-hover);color:#fff;border-color:var(--cbui-teal-hover);}
body.cb-ui .cbui-btn-gold {background:var(--cbui-gold);color:var(--cbui-deep);border-color:var(--cbui-gold);}
body.cb-ui .cbui-btn-gold:hover {background:var(--cbui-gold-hover);color:var(--cbui-deep);border-color:var(--cbui-gold-hover);}
body.cb-ui .cbui-label {display:block;margin-bottom:7px;font-size:13px;font-weight:700;color:var(--cbui-ink);}
body.cb-ui .cbui-input,body.cb-ui .cbui-select {width:100%;min-height:44px;padding:10px 13px;border:1px solid var(--cbui-border-strong);border-radius:10px;background:#fff;color:var(--cbui-ink);font-size:14px;}
body.cb-ui .cbui-input:focus,body.cb-ui .cbui-select:focus {border-color:var(--cbui-teal);box-shadow:0 0 0 3px rgba(7,93,83,.12);}
body.cb-ui .cbui-badge {display:inline-flex;align-items:center;gap:5px;border:1px solid var(--cbui-border);border-radius:999px;background:#F1F7F5;color:var(--cbui-ink);padding:5px 10px;font-size:12px;font-weight:700;}
body.cb-ui .cbui-badge-success {background:#E6F7EF;color:#12633F;border-color:#C4E8D4;}
body.cb-ui .cbui-badge-warning {background:#FFF5E2;color:#83540A;border-color:#EFDEB7;}
body.cb-ui .cbui-table-wrap {width:100%;overflow:auto;border-radius:var(--cbui-radius);border:1px solid var(--cbui-border);}
body.cb-ui .cbui-table {width:100%;border-collapse:collapse;text-align:left;}
body.cb-ui .cbui-table :is(th,td) {padding:13px 16px;border-bottom:1px solid #E7EFEC;font-size:13px;}
body.cb-ui .cbui-table th {color:var(--cbui-muted);font-weight:750;background:#F5FAF8;}
body.cb-ui .cbui-table tr:last-child td {border-bottom:0;}
body.cb-ui .cbui-kpi-value {color:var(--cbui-ink-strong);font-size:clamp(24px,2.4vw,32px);font-weight:800;letter-spacing:-.035em;font-variant-numeric:tabular-nums;}
body.cb-ui .cbui-kpi-label {font-size:13px;font-weight:650;color:var(--cbui-muted);}
body.cb-ui .cbui-skeleton {background:linear-gradient(90deg,#E7EFEC 25%,#F7FAF9 50%,#E7EFEC 75%);background-size:200% 100%;animation:cbui-skeleton 1.6s ease-in-out infinite;border-radius:7px;}
@keyframes cbui-skeleton {to {background-position-x:-200%;}}

/* Employee CRM — one shell drives the majority of permission-controlled modules. */
body.cb-ui-crm {--cb-bg:var(--cbui-bg);--cb-surface:#fff;--cb-surface-soft:#F8FBF9;--cb-border:var(--cbui-border);--cb-border-strong:var(--cbui-border-strong);--cb-ink:var(--cbui-ink-strong);--cb-body:var(--cbui-muted);--cb-muted:var(--cbui-muted);--cb-teal:var(--cbui-teal);--cb-teal-deep:var(--cbui-deep);--cb-gold:var(--cbui-gold);background:var(--cbui-bg);color:var(--cbui-ink);}
body.cb-ui-crm .sidebar {background:linear-gradient(180deg,#06231F 0%,#0B3A32 58%,#06231F 100%)!important;border-right:1px solid rgba(255,255,255,.10)!important;}
body.cb-ui-crm .brand.cb-brand-logo {border-bottom-color:rgba(255,255,255,.13);}
body.cb-ui-crm .sidebar .nav-section-head {color:#D6E6E2!important;font-size:11.5px!important;letter-spacing:.05em;min-height:40px;}
body.cb-ui-crm .sidebar .nav-section-items a {color:#EAF5F1!important;font-size:13.5px!important;line-height:1.35;border-radius:10px;min-height:46px;}
body.cb-ui-crm .sidebar .nav-section-items a:hover {background:rgba(255,255,255,.10)!important;}
body.cb-ui-crm .sidebar .nav-section-items a.active {background:rgba(230,161,41,.14)!important;border-color:rgba(230,161,41,.28)!important;box-shadow:inset 3px 0 0 var(--cbui-gold)!important;color:#fff!important;}
body.cb-ui-crm .sidebar .nav-icon {color:#F6BF57!important;background:rgba(255,255,255,.055);border-radius:10px;}
body.cb-ui-crm .menu-search-wrap {border-radius:11px;min-height:45px;}
body.cb-ui-crm .menu-search-wrap input {font-size:13px!important;}
body.cb-ui-crm .main {background:var(--cbui-bg)!important;color:var(--cbui-ink);}
body.cb-ui-crm .topbar {background:rgba(255,255,255,.98)!important;border-bottom:1px solid var(--cbui-border)!important;box-shadow:0 2px 14px rgba(6,35,31,.045)!important;}
body.cb-ui-crm .top-search {height:42px;border-color:var(--cbui-border)!important;border-radius:11px;background:#F7FAF9!important;}
body.cb-ui-crm .top-search input {font-size:13px!important;color:var(--cbui-ink)!important;}
body.cb-ui-crm .top-icon {border-radius:10px;color:var(--cbui-teal);}
body.cb-ui-crm .top-icon:hover {background:var(--cbui-teal-soft);}
body.cb-ui-crm .user-info b {color:var(--cbui-ink-strong)!important;font-size:13px!important;}
body.cb-ui-crm .user-info small {color:var(--cbui-muted)!important;font-size:11.5px!important;}
body.cb-ui-crm .workspace-breadcrumb {color:var(--cbui-muted)!important;font-size:12px!important;}
body.cb-ui-crm .workspace-breadcrumb a {color:var(--cbui-teal)!important;}
body.cb-ui-crm .workspace-title-row h1 {color:var(--cbui-ink-strong)!important;font-size:clamp(23px,2vw,29px)!important;letter-spacing:-.03em;line-height:1.2;}
body.cb-ui-crm .workspace-title-row p {color:var(--cbui-muted)!important;font-size:13px!important;}
body.cb-ui-crm .workspace-actions a {min-height:42px!important;border-radius:10px!important;font-size:13px!important;}
body.cb-ui-crm .workspace-actions a:first-child {background:var(--cbui-teal)!important;border-color:var(--cbui-teal)!important;color:#fff!important;}
body.cb-ui-crm .notify-item :is(p,small),body.cb-ui-crm .notify-read,body.cb-ui-crm .profile-action {font-size:12px!important;}
body.cb-ui-crm .notify-item b {font-size:13px!important;}
body.cb-ui-crm .profile-menu,body.cb-ui-crm .notify-panel {border-color:var(--cbui-border);border-radius:14px;box-shadow:var(--cbui-shadow-lg);}
/* Repair the legacy shared component system's very small 8–10px typography. */
body.cb-ui-crm .module .cb-page-title {font-size:clamp(23px,2vw,29px)!important;}
body.cb-ui-crm .module .cb-page-subtitle {font-size:13px!important;}
body.cb-ui-crm .module .cb-card {border-color:var(--cbui-border)!important;border-radius:14px!important;box-shadow:var(--cbui-shadow)!important;}
body.cb-ui-crm .module .cb-card-head {padding:15px 18px;}
body.cb-ui-crm .module .cb-card-body {padding:18px;}
body.cb-ui-crm .module .cb-btn {font-size:13px!important;min-height:41px;border-radius:10px;}
body.cb-ui-crm .module .cb-badge {font-size:11.5px!important;}
body.cb-ui-crm .module .cb-field label {font-size:13px!important;}
body.cb-ui-crm .module .cb-field :is(input,select,textarea) {font-size:13.5px!important;min-height:42px;}
body.cb-ui-crm .module .cb-table th {font-size:12px!important;}
body.cb-ui-crm .module .cb-table td {font-size:13px!important;}
body.cb-ui-crm .module .cb-empty {font-size:13px!important;}

/* Public website + shared customer header. Explicitly avoid overriding loan/payment forms. */
body.cb-ui-public {font-size:var(--cbui-font-size);}
body.cb-ui-public > header:first-of-type {background:var(--cbui-deep)!important;border-bottom:1px solid #275149!important;box-shadow:0 4px 20px rgba(6,35,31,.14)!important;}
body.cb-ui-public > header:first-of-type .nav-links a {color:#DFEDE8!important;font-weight:650;font-size:14px;}
body.cb-ui-public > header:first-of-type .nav-links a:hover {color:var(--cbui-gold)!important;}
body.cb-ui-public > header:first-of-type .cta-btn {background:var(--cbui-gold)!important;border-radius:10px!important;color:var(--cbui-deep)!important;}
body.cb-ui-public > header:first-of-type .cta-btn:hover {background:var(--cbui-gold-hover)!important;}
@media (max-width:992px) {body.cb-ui-public > header:first-of-type .nav-links {background:var(--cbui-deep)!important;border-bottom-color:#275149!important;}}
body.cb-ui-public .section-title h2 {letter-spacing:-.02em;}
body.cb-ui-public .feature-card {border-radius:var(--cbui-radius);}
body.cb-ui-public :where(input,select,textarea):focus-visible {outline:2px solid var(--cbui-gold)!important;outline-offset:2px;}

/* Standalone Employee Login. Small deliberate additions; layout remains untouched. */
body.cb-ui-login {font-size:14px;}
body.cb-ui-login .login-side .card {border-radius:22px;box-shadow:var(--cbui-shadow-lg);border-color:var(--cbui-border);}
body.cb-ui-login .card h2 {color:var(--cbui-ink-strong);letter-spacing:-.035em;}
body.cb-ui-login .field label {font-size:13px;}
body.cb-ui-login .field input {border-radius:11px;}
body.cb-ui-login .submit {background:var(--cbui-teal);border-radius:11px;}
body.cb-ui-login .submit:hover {background:var(--cbui-teal-hover);}
body.cb-ui-login .security {font-size:12px;}

/* App/PWA/Management/Vendor/Mini Mall: preserve their different workflows and branding.
   The common layer provides fonts, readable controls and accessible focus only. */
body.cb-ui-app,body.cb-ui-management,body.cb-ui-vendor,body.cb-ui-mall {font-size:14px;}
body.cb-ui-app :where(input,select,textarea),
body.cb-ui-management :where(input,select,textarea),
body.cb-ui-vendor :where(input,select,textarea),
body.cb-ui-mall :where(input,select,textarea) {font-family:var(--cbui-font);}

@media (max-width:950px) {
  body.cb-ui .cbui-col-3 {grid-column:span 6;}
  body.cb-ui .cbui-col-4 {grid-column:span 6;}
  body.cb-ui-crm .workspace-title-row {gap:12px;}
}
@media (max-width:640px) {
  body.cb-ui .cbui-page {padding:16px;}
  body.cb-ui .cbui-page-head {align-items:flex-start;}
  body.cb-ui .cbui-card-head,body.cb-ui .cbui-card-body {padding:15px;}
  body.cb-ui .cbui-col-3,body.cb-ui .cbui-col-4,body.cb-ui .cbui-col-6 {grid-column:span 12;}
  body.cb-ui-crm .topbar {padding-left:14px;padding-right:14px;}
  body.cb-ui-crm .content {padding-left:13px;padding-right:13px;}
  body.cb-ui-crm .workspace-title-row h1 {font-size:23px!important;}
  body.cb-ui-crm .workspace-actions a {font-size:12px!important;}
}
@media (prefers-reduced-motion:reduce) {
  body.cb-ui :where(button,a),body.cb-ui .cbui-skeleton {animation:none!important;transition:none!important;}
}
