/* =====================================================================
   HurHur brand theme — loaded LAST on every page so it wins over the
   page's own styles. Navy = trust/structure, Orange = action.
   Invoices (#inv-print-area, #ag-print-area, /inv/ page) are left alone.
   ===================================================================== */
:root {
  --brand-navy:       #0B1F4B;
  --brand-navy-dark:  #071433;
  --brand-navy-light: #1E3A7A;
  --brand-orange:     #FF6B00;
  --brand-amber:      #FFA41B;
  --brand-gradient:   linear-gradient(135deg, #FF6B00 0%, #FFA41B 100%);
  --brand-orange-ring: rgba(255,107,0,0.18);
  --bg-soft:          #F6F8FC;
  --success: #16A34A;  --error: #DC2626;  --warning: #F59E0B;
  --font-head: 'Exo 2', 'Montserrat', 'Segoe UI', sans-serif;
  --font-body: 'Inter', 'Segoe UI', Arial, sans-serif;
  --ease-swoosh: cubic-bezier(.2,.8,.2,1);
  --shadow-card: 0 8px 24px rgba(11,31,75,0.08);

  /* legacy names used all over style.css, remapped onto the brand */
  --blue:           #1E3A7A;
  --blue-dark:      #0B1F4B;
  --blue-light:     #EEF2FA;
  --indigo:         #1E3A7A;
  --sidebar-bg:     #0B1F4B;
  --sidebar-text:   #A9B4CF;
  --sidebar-active: #FF6B00;
  --bg:             #F6F8FC;
  --card-bg:        #FFFFFF;
  --border:         #E3E8F2;
  --text:           #0B1F4B;
  --text-muted:     #5A6785;
  --green:          #16A34A;
  --red:            #DC2626;
  --shadow-sm: 0 1px 3px rgba(11,31,75,0.08);
  --shadow-md: 0 8px 24px rgba(11,31,75,0.08);
  --shadow-lg: 0 20px 60px rgba(11,31,75,0.18);
}

/* ---------- Typography ---------- */
body { font-family: var(--font-body); color: var(--text); }
h1, h2, h3,
.topbar h1, .modal-header h2, .report-header h2, .mr-title, .card-header,
.sec-title, .chart-title, .ag-mhdr h2, .hdr-name, .stat-value, .mr-kpi-val,
.brand h1, .head h1, .brand .t1, .login-card-hdr h2 {
  font-family: var(--font-head);
  font-style: italic;
  font-weight: 800;
  letter-spacing: -0.2px;
}
/* small uppercase labels get the logo-tagline treatment */
.brand-tagline {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--font-body); font-size: 10.5px; font-weight: 600;
  letter-spacing: 0.15em; text-transform: uppercase; color: inherit;
}
.brand-tagline::before, .brand-tagline::after {
  content: ''; width: 22px; height: 2px; border-radius: 2px; background: var(--brand-orange);
}

a { color: var(--brand-navy-light); }
a:hover { color: var(--brand-orange); }

/* ---------- Speed-lines motif (decorative, low opacity) ---------- */
.brand-speedlines {
  position: relative; isolation: isolate;
}
.brand-speedlines::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0.08;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='160' viewBox='0 0 420 160'%3E%3Cg fill='%230B1F4B'%3E%3Cpath d='M0 40 L300 34 L300 46 Z'/%3E%3Cpath d='M40 80 L340 72 L340 88 Z'/%3E%3Cpath d='M10 120 L240 115 L240 125 Z'/%3E%3Cpath d='M120 20 L230 17 L230 23 Z'/%3E%3C/g%3E%3C/svg%3E") left center / 420px 160px no-repeat;
}

/* ---------- Motion: fast, swoosh-like ---------- */
@keyframes brandSlideIn { from { opacity: 0; transform: translateX(-14px); } to { opacity: 1; transform: none; } }
.page.active, .agent-page.active { animation: brandSlideIn .22s var(--ease-swoosh); }
@media (prefers-reduced-motion: reduce) {
  .page.active, .agent-page.active { animation: none; }
  * { transition-duration: 0s !important; }
}

/* ---------- Buttons ---------- */
.btn-primary, .inv-new-btn, .btn-new-inv, .btn-login, .btn-s, .btn,
.hd-btn-done, .btn-mark-done {
  background: var(--brand-gradient) !important;
  color: #fff !important; border: none !important; border-radius: 10px;
  font-weight: 700;
  box-shadow: 0 4px 14px rgba(255,107,0,0.25) !important;
  transition: transform .18s var(--ease-swoosh), box-shadow .18s var(--ease-swoosh), filter .18s;
}
.btn-primary:hover, .inv-new-btn:hover, .btn-new-inv:hover, .btn-login:hover, .btn-s:hover, .btn:hover,
.hd-btn-done:hover, .btn-mark-done:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(255,107,0,0.38) !important;
}
.btn-primary:active, .btn-login:active, .btn:active { transform: translateY(0); }
.btn:disabled, .btn-login:disabled { transform: none; box-shadow: none !important; }

/* secondary: navy outline, fills on hover */
.btn-ghost, .btn-c {
  background: transparent !important; color: var(--brand-navy) !important;
  border: 2px solid var(--brand-navy) !important; border-radius: 10px; font-weight: 600;
  transition: background .18s var(--ease-swoosh), color .18s var(--ease-swoosh);
}
.btn-ghost:hover, .btn-c:hover { background: var(--brand-navy) !important; color: #fff !important; }

/* ---------- Sidebar (Operations) — white, navy text ---------- */
.sidebar {
  background: #fff;
  border-right: 1px solid var(--border);
  box-shadow: 2px 0 14px rgba(11,31,75,0.05);
}
.sidebar-logo { padding: 18px 18px 16px; justify-content: center; border-bottom: 1px solid var(--border); }
.sidebar-logo .brand-logo-img { height: 58px; width: auto; display: block; }
.sidebar-nav::-webkit-scrollbar-thumb { background: #C9D2E6; }
.sidebar-nav::-webkit-scrollbar-thumb:hover { background: #A9B4CF; }
.nav-item { color: var(--text-muted); transition: background .18s var(--ease-swoosh), color .18s var(--ease-swoosh); }
.nav-item i { color: var(--brand-navy-light); }
.nav-item:hover { background: var(--bg-soft); color: var(--brand-navy); }
.nav-item.active {
  background: #FFF4EB; color: var(--brand-navy); font-weight: 600;
  border: 1px solid rgba(255,107,0,0.22);
  box-shadow: inset 3px 0 0 var(--brand-orange);
}
.nav-item.active i { color: var(--brand-orange); }
.sidebar-footer { border-top: 1px solid var(--border); }

/* ---------- Topbar ---------- */
.topbar { background: rgba(255,255,255,0.96); border-bottom: 1px solid var(--border); box-shadow: 0 2px 10px rgba(11,31,75,0.05); }
.topbar h1 { color: var(--brand-navy); }

/* ---------- Cards ---------- */
.card, .stat-card, .agent-card, .ar-card, .mr-chart-card, .mr-kpi-card, .chart-card,
.challan-stat-card, .monthly-card, .hearing-card, .work-pending-card, .table-wrapper,
.prog-card, .mini-stat {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: var(--shadow-card);
  border-top: 3px solid transparent;
  transition: border-color .2s var(--ease-swoosh), transform .2s var(--ease-swoosh), box-shadow .2s var(--ease-swoosh);
}
.card:hover, .stat-card:hover, .agent-card:hover, .ar-card:hover, .mr-chart-card:hover,
.chart-card:hover, .challan-stat-card:hover, .hearing-card:hover, .work-pending-card:hover,
.prog-card:hover, .mini-stat:hover {
  border-top-color: var(--brand-orange);
}
.table-wrapper:hover { border-top-color: transparent; }
.card-header i, .chart-title i, .sec-title i { color: var(--brand-navy-light); }

/* stat-card accents: navy for structure, orange only on the "money" cards */
.stat-card.blue .stat-icon, .stat-card.purple .stat-icon, .stat-card.teal .stat-icon {
  background: #EEF2FA; color: var(--brand-navy-light);
}
.stat-card.orange .stat-icon { background: #FFF1E6; color: var(--brand-orange); }
.stat-card.blue::after, .stat-card.purple::after, .stat-card.teal::after { background: var(--brand-navy-light); }
.stat-card.orange::after { background: var(--brand-gradient); }
.stat-value { color: var(--brand-navy); }

/* ---------- Tabs & pagination ---------- */
.ptab.active, .adv-tab.active, .preview-tab.active, .nav-tab.active {
  color: var(--brand-orange) !important;
  border-color: var(--brand-orange) !important;
}
.ptab.active:not(.full):not(.half):not(.pend) {
  background: var(--brand-navy) !important; color: #fff !important; border-color: var(--brand-navy) !important;
  box-shadow: inset 0 -3px 0 var(--brand-orange);
}
.nav-tab.active { background: transparent !important; box-shadow: inset 0 -3px 0 var(--brand-orange); color: var(--brand-navy) !important; }
.pagination button.active, .challan-page-btn.active, .pg-btn.active {
  background: var(--brand-navy) !important; color: #fff !important; border-color: var(--brand-navy) !important;
}
.pagination button:hover:not(:disabled), .challan-page-btn:hover, .pg-btn:hover { border-color: var(--brand-orange) !important; color: var(--brand-orange) !important; }

/* ---------- Inputs ---------- */
.search-box, .ag-search, .filter-bar select, .challan-filters input, .challan-filters select,
.form-group input, .form-group select, .form-group textarea, .fg input, .fg select,
.hd-fg input, .hd-fg textarea, .hd-fg select, .payment-form-group input, .payment-form-group textarea,
.note-add-box textarea, .search, input.inp, .inp input {
  border-radius: 10px;
}
.search-box:focus-within, .ag-search:focus, .filter-bar select:focus,
.challan-filters input:focus, .challan-filters select:focus,
.form-group input:focus, .form-group select:focus, .form-group textarea:focus,
.fg input:focus, .fg select:focus,
.hd-fg input:focus, .hd-fg textarea:focus, .hd-fg select:focus,
.payment-form-group input:focus, .payment-form-group textarea:focus,
.note-add-box textarea:focus, .search:focus, .inp input:focus {
  border-color: var(--brand-orange) !important;
  box-shadow: 0 0 0 3px var(--brand-orange-ring) !important;
  outline: none;
}
.search-box i { color: var(--brand-navy-light); }

/* ---------- Tables ---------- */
.data-table thead th, .monthly-table th, .month-table th, .mini-table th {
  background: var(--bg-soft); color: var(--brand-navy);
}
.data-table tbody tr:hover, .data-table tr:hover td { background: #FBFCFE; }

/* ---------- Badges ---------- */
.badge-blue    { background: #EEF2FA; color: var(--brand-navy-light); }
.badge-orange  { background: #FFF1E6; color: #C2410C; }          /* discount / highlight */
.badge-green, .badge-paid, .status-done, .challan-badge-paid { background: #DCFCE7; color: #15803D; }  /* settled */
.badge-pending, .status-pending, .challan-badge-pending { background: #FEF3C7; color: #92400E; }       /* pending */
.badge-today { background: #FFF1E6; color: #C2410C; }

/* ---------- Modals ---------- */
.modal, .ag-modal { border-radius: 14px; }
.modal-header, .ag-mhdr { border-bottom: 1px solid var(--border); }
.modal-header h2, .ag-mhdr h2 { color: var(--brand-navy); }

/* ---------- Toast ---------- */
.toast.success { background: var(--brand-navy); border-left: 4px solid var(--success); }

/* ---------- Agent dashboard header — white, navy text ---------- */
.hdr {
  background: #fff !important;
  border-bottom: 1px solid var(--border);
  box-shadow: 0 2px 12px rgba(11,31,75,0.06) !important;
}
.hdr-name, .hdr-uname { color: var(--brand-navy) !important; }
.hdr-sub { color: var(--text-muted) !important; }
.hdr-role { color: var(--success) !important; }
.btn-logout { background: #FEF2F2 !important; border: 1px solid #FECACA !important; color: var(--error) !important; }
.btn-logout:hover { background: var(--error) !important; color: #fff !important; }
.hdr-logo { background: none !important; box-shadow: none !important; width: auto !important; }
.hdr-logo .brand-logo-img { height: 40px; width: auto; display: block; }
.nav-tabs { background: #fff !important; border-bottom: 1px solid var(--border) !important; }
.nav-tab { color: var(--brand-navy-light) !important; }
.nav-tab:hover { color: var(--brand-orange) !important; }
.prog-bar-fill, .ar-progress-fill, .agent-progress-fill, .collection-fill { background: var(--brand-gradient) !important; }

/* ---------- Login page — white / soft background ---------- */
body.brand-login {
  background: radial-gradient(900px 500px at 0% 0%, rgba(255,107,0,0.07), transparent 60%),
              linear-gradient(180deg, #fff 0%, var(--bg-soft) 100%) !important;
}
.brand .brand-logo-img { height: 120px; width: auto; display: block; margin: 0 auto 6px; }
body.brand-login .brand p { color: var(--text-muted) !important; }
body.brand-login .portal-title { color: var(--brand-navy) !important; }
body.brand-login .portal-sub { color: var(--text-muted) !important; }
body.brand-login .portal-agent .portal-icon { color: #059669 !important; }
body.brand-login .portal-ca .portal-icon { color: #B45309 !important; }
body.brand-login .portal-adv .portal-icon { color: #7C3AED !important; }
body.brand-login .portal-agent.selected .portal-sub { color: #047857 !important; }
body.brand-login .portal-ca.selected .portal-sub { color: #B45309 !important; }
body.brand-login .portal-adv.selected .portal-sub { color: #6D28D9 !important; }
body.brand-login .portal-ops.selected .portal-sub { color: #C2410C !important; }
body.brand-login .divider { color: var(--text-muted) !important; }
body.brand-login .divider::before, body.brand-login .divider::after { background: var(--border) !important; }
body.brand-login .login-card {
  background: #fff !important; backdrop-filter: none !important;
  border: 1px solid var(--border) !important; box-shadow: var(--shadow-card);
}
body.brand-login .login-card-hdr h2 { color: var(--brand-navy) !important; }
body.brand-login .login-card-hdr p, body.brand-login .form-group label { color: var(--text-muted) !important; }
body.brand-login .input-wrap i { color: var(--brand-navy-light) !important; }
body.brand-login .input-wrap input {
  background: #fff !important; border: 1.5px solid var(--border) !important; color: var(--brand-navy) !important;
}
body.brand-login .input-wrap input::placeholder { color: #9AA6C2 !important; }
body.brand-login .error-msg { color: var(--error) !important; background: #FEF2F2 !important; border-color: #FECACA !important; }
body.brand-login .error-msg:not(.show) { display: none !important; }   /* the page's own CSS always showed the empty box */
body.brand-login .cred-hint { background: var(--bg-soft) !important; border-color: var(--border) !important; color: var(--text-muted) !important; }
.portal-ops { background: rgba(255,107,0,0.08) !important; border-color: rgba(255,107,0,0.30) !important; }
.portal-ops.selected {
  background: rgba(255,107,0,0.16) !important; border-color: var(--brand-orange) !important;
  box-shadow: 0 0 0 3px rgba(255,107,0,0.15), 0 6px 18px rgba(255,107,0,0.25) !important;
}
.portal-ops .portal-icon { background: rgba(255,107,0,0.18) !important; color: var(--brand-amber) !important; }
.portal-ops.selected .portal-check { background: var(--brand-orange) !important; }
.portal-ops.selected .portal-sub { color: var(--brand-amber) !important; }
.login-card-hdr-icon.ops { background: rgba(255,107,0,0.18) !important; color: var(--brand-amber) !important; }
.input-wrap input:focus, .agent-mode .input-wrap input:focus {
  border-color: var(--brand-orange) !important;
  background: rgba(255,107,0,0.06) !important;
  box-shadow: 0 0 0 3px var(--brand-orange-ring) !important;
}
.btn-login.agent-btn { background: var(--brand-gradient) !important; }
.footer-note { color: var(--text-muted) !important; }
.footer-note a { color: var(--text-muted); } .footer-note a:hover { color: var(--brand-orange); }
.cred-hint i { color: var(--brand-orange) !important; }

/* ---------- CA / Advocate login + portals — white / soft background ---------- */
body.brand-portal-login {
  background: radial-gradient(900px 500px at 0% 0%, rgba(255,107,0,0.07), transparent 60%),
              linear-gradient(180deg, #fff 0%, var(--bg-soft) 100%) !important;
}
body.brand-portal-login .head { color: var(--brand-navy) !important; }
body.brand-portal-login .head p { color: var(--text-muted) !important; opacity: 1 !important; }
body.brand-portal-login .card { border: 1px solid var(--border); box-shadow: var(--shadow-card) !important; }
body.brand-portal-login .foot { color: var(--text-muted) !important; opacity: 1 !important; }
.head .ic.brand-ic { background: none !important; border: none !important; width: auto !important; height: auto !important; }
.head .ic.brand-ic .brand-logo-img { height: 92px; width: auto; display: block; margin: 0 auto; }
.card-h .ci { background: #FFF1E6 !important; color: var(--brand-orange) !important; }
.inp i { color: var(--brand-navy-light); }
.topbar.brand-topbar {
  background: #fff !important; color: var(--brand-navy) !important;
  border-bottom: 1px solid var(--border); box-shadow: 0 2px 12px rgba(11,31,75,0.06) !important;
}
.topbar.brand-topbar .t2 { color: var(--text-muted); opacity: 1; }
.topbar.brand-topbar .logout { background: #FEF2F2 !important; color: var(--error) !important; border: 1px solid #FECACA !important; }
.topbar.brand-topbar .logout:hover { background: var(--error) !important; color: #fff !important; }
.brand .logo.brand-ic { background: none !important; width: auto !important; }
.brand .logo.brand-ic .brand-logo-img { height: 44px; width: auto; display: block; }
.btn-view, .btn-done { background: var(--brand-navy) !important; }
.btn-view:hover, .btn-done:hover { background: var(--brand-orange) !important; }

/* ---------- Scrollbars ---------- */
.cs-hscroll::-webkit-scrollbar-thumb, .modal-body::-webkit-scrollbar-thumb, .reminder-body::-webkit-scrollbar-thumb { background: #C9D2E6; }