/* ============================================================================
   Zenotech Recovery — brand styles
   Palette: #7C3AED (purple) → #3B82F6 (blue) gradient
   Type:    Inter, system fallback
   ============================================================================ */

:root {
    --zr-purple:       #7C3AED;
    --zr-purple-dark:  #6D28D9;
    --zr-blue:         #3B82F6;
    --zr-blue-dark:    #2563EB;
    --zr-gradient:     linear-gradient(90deg, var(--zr-purple) 0%, var(--zr-blue) 100%);
    --zr-gradient-135: linear-gradient(135deg, var(--zr-purple) 0%, var(--zr-blue) 100%);

    --zr-bg:           #F8FAFC;
    --zr-bg-elevated:  #FFFFFF;
    --zr-text:         #0F172A;
    --zr-text-soft:    #334155;
    --zr-muted:        #64748B;
    --zr-border:       #E2E8F0;
    --zr-border-soft:  #F1F5F9;

    --zr-radius:       0.625rem;
    --zr-radius-lg:    1rem;
    --zr-shadow-sm:    0 1px 2px rgba(15, 23, 42, 0.04);
    --zr-shadow:       0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
    --zr-shadow-lg:    0 10px 30px rgba(15, 23, 42, 0.08);
}

html, body {
    height: 100%;
}

body, .zr-body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Arial', sans-serif;
    background-color: var(--zr-bg);
    color: var(--zr-text);
    font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.zr-main {
    flex: 1 0 auto;
}

/* --- Brand mark ------------------------------------------------------------ */
.zr-brand {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    text-decoration: none;
}

.zr-brand-mark {
    background: #FFFFFF;
    color: var(--zr-purple);
    padding: 0.25rem 0.5rem;
    border-radius: 0.45rem;
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.zr-brand-mark-lg {
    background: rgba(255, 255, 255, 0.18);
    color: #FFFFFF;
    padding: 0.5rem 0.85rem;
    font-size: 1.1rem;
    border-radius: 0.6rem;
    display: inline-block;
    margin-bottom: 0.5rem;
}

.zr-brand-text {
    font-weight: 600;
    color: #FFFFFF;
    letter-spacing: -0.01em;
}

/* --- Navbar --------------------------------------------------------------- */
.zr-navbar {
    background: var(--zr-gradient);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
    padding: 0.65rem 0;
}

.zr-navbar .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.4);
}

.zr-navbar .navbar-toggler-icon {
    filter: invert(1) brightness(2);
}

.zr-user {
    color: rgba(255, 255, 255, 0.95) !important;
    font-weight: 500;
    padding: 0.25rem 0.75rem;
}

.zr-user .bi {
    margin-right: 0.35rem;
}

.zr-logout {
    color: rgba(255, 255, 255, 0.9) !important;
    text-decoration: none;
    font-weight: 500;
}

.zr-logout:hover {
    color: #FFFFFF !important;
}

/* --- Login page ----------------------------------------------------------- */
.zr-login-page {
    min-height: calc(100vh - 60px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    background:
        radial-gradient(ellipse at top left,  rgba(124, 58, 237, 0.08), transparent 50%),
        radial-gradient(ellipse at bottom right, rgba(59, 130, 246, 0.08), transparent 50%),
        var(--zr-bg);
}

.zr-login-card {
    width: 100%;
    max-width: 420px;
    background: var(--zr-bg-elevated);
    border-radius: var(--zr-radius-lg);
    box-shadow: var(--zr-shadow-lg);
    overflow: hidden;
}

.zr-login-header {
    background: var(--zr-gradient-135);
    color: #FFFFFF;
    padding: 2rem 2rem 1.75rem;
    text-align: center;
}

.zr-login-header h1 {
    margin: 0;
    font-weight: 600;
    font-size: 1.5rem;
    letter-spacing: -0.02em;
}

.zr-login-header p {
    margin: 0.25rem 0 0;
    opacity: 0.92;
    font-size: 0.92rem;
}

.zr-login-body {
    padding: 2rem;
}

.zr-input {
    border-radius: 0.55rem !important;
    border-color: var(--zr-border) !important;
    padding: 0.625rem 0.875rem !important;
    font-size: 0.95rem;
}

.zr-input:focus {
    border-color: var(--zr-purple) !important;
    box-shadow: 0 0 0 0.2rem rgba(124, 58, 237, 0.15) !important;
}

.zr-alert {
    border-radius: 0.55rem;
    border: 1px solid #FECACA;
    background: #FEF2F2;
    color: #991B1B;
    padding: 0.625rem 0.875rem;
    font-size: 0.9rem;
}

.zr-alert:empty {
    display: none;
}

/* --- Buttons -------------------------------------------------------------- */
.zr-btn-primary {
    background: var(--zr-gradient);
    color: #FFFFFF;
    border: none;
    padding: 0.625rem 1.25rem;
    border-radius: 0.55rem;
    font-weight: 500;
    font-size: 0.95rem;
    transition: transform 0.08s ease, box-shadow 0.18s ease;
    text-decoration: none;
}

.zr-btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(124, 58, 237, 0.32);
    color: #FFFFFF;
}

.zr-btn-primary:active {
    transform: translateY(0);
}

/* --- Demo creds box on login --------------------------------------------- */
.zr-demo-creds {
    background: var(--zr-border-soft);
    border-radius: 0.55rem;
    padding: 0.875rem 1rem;
    margin-top: 1.5rem;
    font-size: 0.82rem;
    color: var(--zr-muted);
    line-height: 1.8;
}

.zr-demo-title {
    color: var(--zr-text);
    font-weight: 600;
    margin-bottom: 0.25rem;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.zr-demo-creds code {
    background: #FFFFFF;
    padding: 0.1rem 0.4rem;
    border-radius: 0.25rem;
    color: var(--zr-purple-dark);
    font-family: 'JetBrains Mono', 'Consolas', 'Courier New', monospace;
    font-size: 0.78rem;
    font-weight: 500;
}

/* --- Typography ----------------------------------------------------------- */
.zr-h1 {
    font-weight: 600;
    font-size: 1.625rem;
    letter-spacing: -0.025em;
    margin: 0;
    color: var(--zr-text);
}

.zr-h2 {
    font-weight: 600;
    font-size: 1.2rem;
    letter-spacing: -0.015em;
    margin: 0 0 0.75rem;
    color: var(--zr-text);
}

.zr-subtle {
    color: var(--zr-muted);
    font-size: 0.92rem;
}

/* --- KPI cards ------------------------------------------------------------ */
.zr-kpi-card {
    background: var(--zr-bg-elevated);
    border: 1px solid var(--zr-border);
    border-radius: var(--zr-radius);
    padding: 1.25rem 1.25rem 1rem;
    box-shadow: var(--zr-shadow-sm);
    height: 100%;
    transition: box-shadow 0.18s ease, transform 0.08s ease;
}

.zr-kpi-card:hover {
    box-shadow: var(--zr-shadow);
    transform: translateY(-1px);
}

.zr-kpi-label {
    font-size: 0.78rem;
    color: var(--zr-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.zr-kpi-value {
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: -0.03em;
    color: var(--zr-text);
    line-height: 1.1;
    margin-bottom: 0.35rem;
}

.zr-kpi-foot {
    font-size: 0.82rem;
    color: var(--zr-muted);
}

.zr-kpi-card-muted .zr-kpi-value {
    color: var(--zr-text-soft);
    font-size: 1.625rem;
}

/* --- Generic content card ------------------------------------------------- */
.zr-card {
    background: var(--zr-bg-elevated);
    border: 1px solid var(--zr-border);
    border-radius: var(--zr-radius);
    padding: 1.5rem;
    box-shadow: var(--zr-shadow-sm);
}

.zr-card p {
    color: var(--zr-text-soft);
    line-height: 1.6;
}

/* --- Footer --------------------------------------------------------------- */
.zr-footer {
    background: var(--zr-bg-elevated);
    border-top: 1px solid var(--zr-border);
    padding: 1rem 0;
    color: var(--zr-muted);
    margin-top: 2rem;
}

/* --- Inline code --------------------------------------------------------- */
code {
    background: var(--zr-border-soft);
    color: var(--zr-purple-dark);
    padding: 0.1rem 0.35rem;
    border-radius: 0.3rem;
    font-family: 'JetBrains Mono', 'Consolas', 'Courier New', monospace;
    font-size: 0.85em;
}

/* ============================================================================
   CHUNK A2 — nav links, tables, badges, detail fields
   ============================================================================ */

/* --- Main navigation links ----------------------------------------------- */
.zr-mainnav {
    margin-left: 1.5rem;
    gap: 0.25rem;
}

.zr-mainnav .nav-link {
    color: rgba(255, 255, 255, 0.82) !important;
    padding: 0.5rem 0.85rem !important;
    border-radius: 0.45rem;
    font-weight: 500;
    font-size: 0.93rem;
    transition: background-color 0.15s ease, color 0.15s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.zr-mainnav .nav-link:hover {
    color: #FFFFFF !important;
    background: rgba(255, 255, 255, 0.1);
}

.zr-mainnav .zr-nav-active {
    background: rgba(255, 255, 255, 0.18) !important;
    color: #FFFFFF !important;
}

/* --- Breadcrumb / back link ---------------------------------------------- */
.zr-breadcrumb a {
    color: var(--zr-muted);
    text-decoration: none;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.zr-breadcrumb a:hover {
    color: var(--zr-purple);
}

/* --- Buttons (secondary) ------------------------------------------------- */
.zr-btn-secondary {
    background: #FFFFFF;
    color: var(--zr-text-soft);
    border: 1px solid var(--zr-border);
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    font-weight: 500;
    font-size: 0.9rem;
    transition: border-color 0.15s, background-color 0.15s;
}

.zr-btn-secondary:hover:not(:disabled) {
    border-color: var(--zr-purple);
    color: var(--zr-purple);
}

.zr-btn-secondary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.zr-btn-secondary.btn-sm {
    padding: 0.35rem 0.75rem;
    font-size: 0.825rem;
}

.zr-btn-primary:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}

/* --- Tables -------------------------------------------------------------- */
.zr-table-wrap {
    background: var(--zr-bg-elevated);
    border: 1px solid var(--zr-border);
    border-radius: var(--zr-radius);
    overflow: hidden;
    box-shadow: var(--zr-shadow-sm);
}

.zr-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.92rem;
}

.zr-table thead th {
    background: #FAFBFC;
    color: var(--zr-muted);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--zr-border);
    text-align: left;
    vertical-align: bottom;
}

.zr-table thead th.text-end {
    text-align: right;
}

.zr-th-sub {
    display: block;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    font-size: 0.72rem;
    color: var(--zr-muted);
    margin-top: 0.15rem;
}

.zr-table tbody td {
    padding: 0.9rem 1rem;
    border-bottom: 1px solid var(--zr-border-soft);
    vertical-align: middle;
}

.zr-table tbody tr:last-child td {
    border-bottom: none;
}

.zr-table.zr-table-condensed tbody td {
    padding: 0.65rem 1rem;
}

.zr-row-clickable {
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.zr-row-clickable:hover {
    background: var(--zr-border-soft);
}

.zr-cell-primary {
    font-weight: 500;
    color: var(--zr-text);
}

.zr-cell-sub {
    font-size: 0.82rem;
    color: var(--zr-muted);
    margin-top: 0.1rem;
}

.zr-num {
    font-variant-numeric: tabular-nums;
    font-feature-settings: 'tnum';
}

.zr-muted-light {
    color: #CBD5E1;
}

.zr-text-warn {
    color: #B45309;
    font-weight: 500;
}

/* --- Code chip ---------------------------------------------------------- */
.zr-code {
    background: var(--zr-border-soft);
    color: var(--zr-purple-dark);
    padding: 0.1rem 0.4rem;
    border-radius: 0.3rem;
    font-family: 'JetBrains Mono', 'Consolas', 'Courier New', monospace;
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.02em;
}

/* --- Badges -------------------------------------------------------------- */
.zr-badge {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 0.3rem;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.4;
    vertical-align: middle;
}

.zr-badge-bank     { background: #DBEAFE; color: #1E40AF; }
.zr-badge-nbfc     { background: #FEF3C7; color: #92400E; }
.zr-badge-telco    { background: #FCE7F3; color: #9D174D; }
.zr-badge-utility  { background: #D1FAE5; color: #065F46; }
.zr-badge-fintech  { background: #E0E7FF; color: #3730A3; }
.zr-badge-other    { background: #E2E8F0; color: #475569; }

.zr-badge-legal    { background: #FED7AA; color: #9A3412; }
.zr-badge-primary  { background: #EDE9FE; color: var(--zr-purple-dark); }
.zr-badge-bucket   { background: var(--zr-border-soft); color: var(--zr-text-soft); }
.zr-badge-warn     { background: #FEF3C7; color: #92400E; }
.zr-badge-danger   { background: #FECACA; color: #991B1B; }
.zr-badge-inactive { background: #E2E8F0; color: #64748B; }

.zr-badge-status-active    { background: #D1FAE5; color: #065F46; }
.zr-badge-status-paused    { background: #FEF3C7; color: #92400E; }
.zr-badge-status-closed    { background: #E2E8F0; color: #475569; }
.zr-badge-status-returned  { background: #FECACA; color: #991B1B; }

/* --- Recovery % progress bar -------------------------------------------- */
.zr-progress-wrap {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 120px;
}

.zr-progress {
    flex: 1;
    height: 0.45rem;
    background: var(--zr-border-soft);
    border-radius: 0.25rem;
    overflow: hidden;
}

.zr-progress-bar {
    height: 100%;
    background: var(--zr-gradient);
    border-radius: 0.25rem;
    transition: width 0.6s ease;
}

.zr-progress-label {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--zr-text);
    font-variant-numeric: tabular-nums;
    min-width: 3rem;
    text-align: right;
}

/* --- Detail page fields ------------------------------------------------- */
.zr-field {
    border-left: 3px solid var(--zr-border-soft);
    padding: 0.1rem 0 0.1rem 0.75rem;
}

.zr-field-label {
    font-size: 0.72rem;
    color: var(--zr-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
    margin-bottom: 0.2rem;
}

.zr-field-value {
    font-size: 0.95rem;
    color: var(--zr-text);
    word-break: break-word;
}

.zr-field-mono {
    font-family: 'JetBrains Mono', 'Consolas', 'Courier New', monospace;
    font-size: 0.88rem;
    letter-spacing: 0.02em;
}

.zr-field-value a {
    color: var(--zr-purple-dark);
    text-decoration: none;
}

.zr-field-value a:hover {
    text-decoration: underline;
}

/* ============================================================================
   CHUNK A3 — debtor list filter bar, debtor status badges, timeline
   ============================================================================ */

/* --- Breadcrumb separator ----------------------------------------------- */
.zr-breadcrumb-sep {
    color: #CBD5E1;
    margin: 0 0.3rem;
}

.zr-breadcrumb a + a {
    margin-left: 0;
}

/* --- Filter bar --------------------------------------------------------- */
.zr-filter-bar {
    background: var(--zr-bg-elevated);
    border: 1px solid var(--zr-border);
    border-radius: var(--zr-radius);
    padding: 1rem 1.25rem;
    box-shadow: var(--zr-shadow-sm);
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
}

.zr-filter-group {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 180px;
    min-width: 160px;
}

.zr-filter-group.zr-filter-actions {
    flex: 0 0 auto;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
}

.zr-filter-label {
    font-size: 0.72rem;
    color: var(--zr-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
    margin-bottom: 0.1rem;
}

/* --- Debtor status badges ----------------------------------------------- */
.zr-badge-debtor-open           { background: #DBEAFE; color: #1E40AF; }
.zr-badge-debtor-inprogress     { background: #E0E7FF; color: #3730A3; }
.zr-badge-debtor-promisedtopay  { background: #FEF3C7; color: #92400E; }
.zr-badge-debtor-partpaid       { background: #FDE68A; color: #78350F; }
.zr-badge-debtor-settled        { background: #D1FAE5; color: #065F46; }
.zr-badge-debtor-closed         { background: #E2E8F0; color: #475569; }
.zr-badge-debtor-returned       { background: #FECACA; color: #991B1B; }
.zr-badge-debtor-skip           { background: #F5D0FE; color: #86198F; }
.zr-badge-debtor-disputed       { background: #FED7AA; color: #9A3412; }
.zr-badge-debtor-legal          { background: #FCA5A5; color: #7F1D1D; }
.zr-badge-debtor-deceased       { background: #1F2937; color: #FFFFFF; }

/* --- Allocation type badges --------------------------------------------- */
.zr-badge-alloc-tele   { background: #DBEAFE; color: #1E40AF; }
.zr-badge-alloc-field  { background: #FEF3C7; color: #92400E; }
.zr-badge-alloc-legal  { background: #FCA5A5; color: #7F1D1D; }
.zr-badge-alloc-skip   { background: #F5D0FE; color: #86198F; }

/* --- PTP status badges -------------------------------------------------- */
.zr-badge-ptp-open          { background: #DBEAFE; color: #1E40AF; }
.zr-badge-ptp-kept          { background: #D1FAE5; color: #065F46; }
.zr-badge-ptp-partiallykept { background: #FDE68A; color: #78350F; }
.zr-badge-ptp-broken        { background: #FECACA; color: #991B1B; }
.zr-badge-ptp-extended      { background: #E0E7FF; color: #3730A3; }
.zr-badge-ptp-cancelled     { background: #E2E8F0; color: #475569; }

/* --- Misc badges -------------------------------------------------------- */
.zr-badge-case      { background: #FED7AA; color: #9A3412; }
.zr-badge-contact   { background: #E0E7FF; color: #3730A3; }
.zr-badge-addrtype  { background: var(--zr-border-soft); color: var(--zr-text-soft); }

/* --- DPD chip ----------------------------------------------------------- */
.zr-dpd {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 0.3rem;
    font-size: 0.78rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.zr-dpd-low   { background: #D1FAE5; color: #065F46; }
.zr-dpd-mid   { background: #FEF3C7; color: #92400E; }
.zr-dpd-high  { background: #FECACA; color: #991B1B; }

/* --- Field stack on detail pages --------------------------------------- */
.zr-field-stack > .zr-field + .zr-field {
    margin-top: 0.85rem;
}

.zr-text-soft { color: var(--zr-text-soft); }

.zr-kpi-unit {
    font-size: 0.9rem;
    color: var(--zr-muted);
    font-weight: 500;
}

/* --- Mini section blocks within cards ---------------------------------- */
.zr-mini-section-title {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--zr-muted);
    margin: 0 0 0.5rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid var(--zr-border-soft);
}

.zr-mini-row {
    padding: 0.5rem 0;
}

.zr-mini-row + .zr-mini-row {
    border-top: 1px solid var(--zr-border-soft);
}

/* --- Mini cards (addresses / employers / refs) ------------------------- */
.zr-mini-card {
    background: var(--zr-bg);
    border: 1px solid var(--zr-border);
    border-radius: 0.55rem;
    padding: 0.85rem 1rem;
    height: 100%;
}

.zr-mini-card-body {
    color: var(--zr-text-soft);
    font-size: 0.9rem;
    line-height: 1.55;
}

.zr-mini-card-foot {
    margin-top: 0.6rem;
    padding-top: 0.5rem;
    border-top: 1px dashed var(--zr-border);
    color: var(--zr-muted);
    font-size: 0.78rem;
}

/* --- Consent chips ------------------------------------------------------ */
.zr-consent {
    display: inline-block;
    background: var(--zr-border-soft);
    color: var(--zr-text-soft);
    padding: 0.05rem 0.4rem;
    border-radius: 0.3rem;
    font-size: 0.72rem;
    font-weight: 600;
    margin-right: 0.25rem;
}

/* --- Tabs --------------------------------------------------------------- */
.zr-tabs {
    border-bottom: 1px solid var(--zr-border);
}

.zr-tabs .nav-link {
    color: var(--zr-muted);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 0.65rem 1rem;
    font-weight: 500;
    font-size: 0.92rem;
    border-radius: 0;
}

.zr-tabs .nav-link:hover {
    color: var(--zr-text-soft);
    border-bottom-color: var(--zr-border);
}

.zr-tabs .nav-link.active {
    color: var(--zr-purple-dark);
    background: transparent;
    border-bottom-color: var(--zr-purple);
}

.zr-tab-count {
    background: var(--zr-border-soft);
    color: var(--zr-text-soft);
    border-radius: 0.4rem;
    padding: 0.05rem 0.4rem;
    font-size: 0.72rem;
    font-weight: 600;
    margin-left: 0.25rem;
    vertical-align: middle;
}

.zr-tabs .nav-link.active .zr-tab-count {
    background: var(--zr-purple);
    color: #FFFFFF;
}

.zr-tabs-content {
    background: var(--zr-bg-elevated);
    border: 1px solid var(--zr-border);
    border-top: none;
    border-radius: 0 0 var(--zr-radius) var(--zr-radius);
    padding: 1.5rem;
    box-shadow: var(--zr-shadow-sm);
}

/* ========================================================================
   ACTIVITY TIMELINE — the centerpiece of the Debtor 360
   ======================================================================== */

.zr-timeline {
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
}

.zr-timeline::before {
    content: '';
    position: absolute;
    left: 0.55rem;
    top: 0.5rem;
    bottom: 0.5rem;
    width: 2px;
    background: var(--zr-border-soft);
}

.zr-timeline-item {
    position: relative;
    padding-left: 2.25rem;
    padding-bottom: 1.25rem;
    padding-top: 0.25rem;
}

.zr-timeline-item:last-child {
    padding-bottom: 0;
}

.zr-timeline-dot {
    position: absolute;
    left: 0;
    top: 0.35rem;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 50%;
    border: 3px solid var(--zr-bg-elevated);
    box-shadow: 0 0 0 1px var(--zr-border);
}

.zr-timeline-content {
    background: var(--zr-bg);
    border: 1px solid var(--zr-border-soft);
    border-radius: 0.55rem;
    padding: 0.7rem 0.95rem;
    transition: background-color 0.12s ease;
}

.zr-timeline-item:hover .zr-timeline-content {
    background: var(--zr-border-soft);
}

.zr-timeline-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.zr-timeline-type {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--zr-text);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.zr-timeline-channel {
    background: var(--zr-border-soft);
    color: var(--zr-text-soft);
    padding: 0.05rem 0.4rem;
    border-radius: 0.3rem;
    font-size: 0.72rem;
    font-weight: 500;
}

.zr-timeline-amount {
    background: #D1FAE5;
    color: #065F46;
    padding: 0.05rem 0.45rem;
    border-radius: 0.3rem;
    font-size: 0.8rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.zr-timeline-time {
    margin-left: auto;
    font-size: 0.78rem;
    color: var(--zr-muted);
    font-variant-numeric: tabular-nums;
}

.zr-timeline-body {
    color: var(--zr-text-soft);
    font-size: 0.92rem;
    line-height: 1.5;
}

.zr-timeline-actor {
    margin-top: 0.35rem;
    font-size: 0.78rem;
    color: var(--zr-muted);
}

/* --- Dot colors per event type ----------------------------------------- */
.zr-tl-call          .zr-timeline-dot { background: #8B5CF6; }
.zr-tl-communication .zr-timeline-dot { background: #3B82F6; }
.zr-tl-visit         .zr-timeline-dot { background: #F59E0B; }
.zr-tl-receipt       .zr-timeline-dot { background: #10B981; }
.zr-tl-ptp           .zr-timeline-dot { background: #FBBF24; }
.zr-tl-legalevent    .zr-timeline-dot { background: #EF4444; }

/* ============================================================================
   CHUNK A4 — allocation board, agent cards, flash messages, alloc timeline
   ============================================================================ */

/* --- Flash banners (TempData success/error) ---------------------------- */
.zr-flash {
    border-radius: var(--zr-radius);
    padding: 0.75rem 1rem;
    font-size: 0.93rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.zr-flash-success {
    background: #ECFDF5;
    color: #065F46;
    border: 1px solid #A7F3D0;
}

.zr-flash-error {
    background: #FEF2F2;
    color: #991B1B;
    border: 1px solid #FECACA;
}

.zr-flash i {
    font-size: 1.1rem;
}

/* --- Read-only banner -------------------------------------------------- */
.zr-readonly-banner {
    background: var(--zr-border-soft);
    color: var(--zr-muted);
    border: 1px solid var(--zr-border);
    border-radius: var(--zr-radius);
    padding: 0.45rem 0.85rem;
    font-size: 0.85rem;
}

/* --- Board panes ------------------------------------------------------- */
.zr-board-pane {
    background: var(--zr-bg-elevated);
    border: 1px solid var(--zr-border);
    border-radius: var(--zr-radius);
    box-shadow: var(--zr-shadow-sm);
    overflow: hidden;
}

.zr-board-pane-head {
    padding: 0.85rem 1.1rem;
    border-bottom: 1px solid var(--zr-border);
    background: #FAFBFC;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.zr-board-pane-sticky {
    position: sticky;
    top: 1rem;
}

.zr-table-wrap-flat {
    border: none;
    border-radius: 0;
    box-shadow: none;
}

/* --- Inline link button ------------------------------------------------ */
.zr-btn-link {
    background: none;
    border: none;
    color: var(--zr-purple-dark);
    padding: 0;
    font-size: 0.82rem;
    text-decoration: none;
    cursor: pointer;
}

.zr-btn-link:hover {
    text-decoration: underline;
}

.zr-btn-link.small {
    font-size: 0.82rem;
}

/* --- Small input variant ----------------------------------------------- */
.zr-input-sm {
    padding: 0.4rem 0.65rem !important;
    font-size: 0.88rem !important;
}

/* --- Smaller primary button -------------------------------------------- */
.zr-btn-primary.btn-sm {
    padding: 0.35rem 0.9rem;
    font-size: 0.85rem;
}

/* --- Allocation options card (top-right of right pane) ----------------- */
.zr-alloc-options {
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--zr-border);
    background: #FBFAFD;
}

.zr-alloc-options .zr-filter-label {
    margin-bottom: 0.15rem;
}

.zr-alloc-options textarea {
    resize: vertical;
    min-height: 2.4rem;
}

/* --- Agent cards ------------------------------------------------------- */
.zr-agent-list {
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    max-height: 60vh;
    overflow-y: auto;
}

.zr-agent-card {
    background: var(--zr-bg);
    border: 1px solid var(--zr-border);
    border-radius: 0.6rem;
    padding: 0.7rem 0.9rem;
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

.zr-agent-card:hover {
    border-color: var(--zr-purple);
    box-shadow: 0 2px 8px rgba(124, 58, 237, 0.1);
}

.zr-agent-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem;
}

.zr-agent-name {
    font-weight: 600;
    color: var(--zr-text);
    font-size: 0.95rem;
}

.zr-agent-sub {
    font-size: 0.78rem;
    color: var(--zr-muted);
    margin-top: 0.1rem;
}

.zr-agent-load {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--zr-purple-dark);
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.zr-agent-foot {
    margin-top: 0.6rem;
    padding-top: 0.55rem;
    border-top: 1px dashed var(--zr-border);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.zr-agent-foot .zr-btn-primary:disabled {
    background: var(--zr-border);
    color: var(--zr-muted);
    transform: none !important;
    box-shadow: none !important;
}

/* --- Unallocated badge ------------------------------------------------- */
.zr-badge-unalloc {
    background: #FED7AA;
    color: #9A3412;
}

/* --- Allocation history timeline colors -------------------------------- */
.zr-tl-alloc        .zr-timeline-dot { background: #94A3B8; }
.zr-tl-alloc-active .zr-timeline-dot { background: var(--zr-purple); }

/* --- Quoted note block ------------------------------------------------- */
.zr-card-quote {
    border-left: 3px solid var(--zr-purple);
    background: var(--zr-border-soft);
    padding: 0.5rem 0.75rem;
    border-radius: 0 0.4rem 0.4rem 0;
    color: var(--zr-text-soft);
    font-size: 0.9rem;
    font-style: italic;
}

/* ============================================================================
   CHUNK A5 — agent queue, work view, priority chips, PTP form section
   ============================================================================ */

/* --- Priority chips ----------------------------------------------------- */
.zr-prio {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    border-radius: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    min-width: 4.5rem;
    text-align: center;
}

.zr-prio-critical { background: #FECACA; color: #7F1D1D; }
.zr-prio-high     { background: #FED7AA; color: #9A3412; }
.zr-prio-medium   { background: #DBEAFE; color: #1E3A8A; }
.zr-prio-low      { background: var(--zr-border-soft); color: var(--zr-muted); }

/* --- Due indicators ---------------------------------------------------- */
.zr-text-due {
    color: #B45309;
    font-weight: 600;
}

/* --- DNC warning callout ----------------------------------------------- */
.zr-dnc-warning {
    background: #FEF2F2;
    color: #991B1B;
    border: 1px solid #FECACA;
    border-radius: 0.5rem;
    padding: 0.45rem 0.7rem;
    font-size: 0.83rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* --- PTP sub-form section ---------------------------------------------- */
.zr-ptp-section {
    background: #ECFDF5;
    border: 1px solid #A7F3D0;
    border-radius: 0.7rem;
    padding: 1rem 1.1rem;
    margin-top: 1rem;
}

.zr-ptp-header {
    font-weight: 600;
    color: #065F46;
    margin-bottom: 0.65rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.zr-ptp-ratio {
    background: #FFFFFF;
    border: 1px solid #A7F3D0;
    border-radius: 0.5rem;
    padding: 0.55rem 0.875rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: #065F46;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.zr-ptp-ratio.zr-ptp-ratio-low {
    background: #FEF3C7;
    border-color: #FDE68A;
    color: #92400E;
}

/* --- Compact timeline (used in work view sidebar) ---------------------- */
.zr-timeline-compact .zr-timeline-item {
    padding-left: 2rem;
    padding-bottom: 0.85rem;
}

.zr-timeline-compact .zr-timeline-content {
    padding: 0.5rem 0.7rem;
}

.zr-timeline-compact .zr-timeline-body {
    font-size: 0.85rem;
}

.zr-timeline-compact .zr-timeline-time {
    font-size: 0.7rem;
}

.zr-timeline-compact::before {
    left: 0.5rem;
}

.zr-timeline-compact .zr-timeline-dot {
    width: 1rem;
    height: 1rem;
    top: 0.5rem;
}

/* --- Bootstrap input-group sizing tweak --------------------------------- */
.input-group .zr-input {
    border-right: none;
}

.input-group-text {
    background: var(--zr-border-soft);
    border: 1px solid var(--zr-border);
    color: var(--zr-muted);
    font-size: 0.85rem;
}

/* ============================================================================
   CHUNK A6 — receipt book form (waterfall + JV preview), receipt details
   ============================================================================ */

/* --- Large input variant (for the receipt amount) ---------------------- */
.zr-input-lg {
    font-size: 1.3rem !important;
    padding: 0.55rem 0.85rem !important;
    font-weight: 600;
}

/* --- Preview cards (waterfall + JV preview on the right) --------------- */
.zr-preview-card {
    background: #FBFAFD;
    border: 1px solid var(--zr-border);
}

.zr-preview-head {
    font-weight: 600;
    color: var(--zr-purple-dark);
    margin-bottom: 0.65rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.95rem;
}

/* --- Waterfall preview table ------------------------------------------ */
.zr-waterfall {
    width: 100%;
    border-collapse: collapse;
}

.zr-waterfall td {
    padding: 0.45rem 0.4rem;
    border-bottom: 1px dashed var(--zr-border);
}

.zr-waterfall tr:last-child td { border-bottom: none; }

.zr-wf-label {
    font-size: 0.88rem;
}

.zr-wf-out {
    color: var(--zr-muted);
    font-size: 0.75rem;
    margin-left: 0.35rem;
}

.zr-wf-tag {
    display: inline-block;
    padding: 0.12rem 0.45rem;
    border-radius: 0.3rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.zr-wf-tag-penalty    { background: #FECACA; color: #7F1D1D; }
.zr-wf-tag-interest   { background: #FED7AA; color: #9A3412; }
.zr-wf-tag-principal  { background: #BFDBFE; color: #1E3A8A; }
.zr-wf-tag-excess     { background: #FEF3C7; color: #92400E; }

.zr-wf-total {
    background: var(--zr-bg-elevated);
    font-weight: 600;
}

.zr-wf-total td {
    border-top: 2px solid var(--zr-border) !important;
    padding-top: 0.6rem !important;
}

/* --- JV preview blocks ------------------------------------------------- */
.zr-jv-block + .zr-jv-block {
    margin-top: 0.6rem;
    padding-top: 0.6rem;
    border-top: 1px dashed var(--zr-border);
}

.zr-jv-label {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--zr-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.35rem;
}

.zr-jv {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}

.zr-jv td {
    padding: 0.35rem 0.4rem;
    vertical-align: top;
}

.zr-jv-acc {
    line-height: 1.3;
}

.zr-jv-dr {
    color: #047857;
    font-weight: 500;
}

.zr-jv-cr {
    color: #B91C1C;
    font-weight: 500;
}

.zr-jv-note {
    background: var(--zr-border-soft);
    border-radius: 0.4rem;
    padding: 0.55rem 0.7rem;
    font-size: 0.83rem;
    color: var(--zr-muted);
}

.zr-jv-note i { margin-right: 0.25rem; }

/* --- Agency net highlight --------------------------------------------- */
.zr-agency-net {
    margin-top: 0.7rem;
    padding: 0.65rem 0.85rem;
    background: #ECFDF5;
    border: 1px solid #A7F3D0;
    border-radius: 0.55rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #065F46;
    font-size: 0.95rem;
}

/* --- Receipt details JV card ------------------------------------------ */
.zr-jv-card {
    background: var(--zr-bg);
    border: 1px solid var(--zr-border);
    border-radius: 0.55rem;
    padding: 0.85rem 1rem;
    margin-bottom: 0.85rem;
}

.zr-jv-card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.zr-jv-narration {
    background: var(--zr-border-soft);
    border-radius: 0.35rem;
    padding: 0.45rem 0.65rem;
    font-size: 0.85rem;
    color: var(--zr-text-soft);
    font-style: italic;
    margin-bottom: 0.6rem;
}

.zr-jv-detail {
    border-top: 1px solid var(--zr-border);
    padding-top: 0.4rem;
}

.zr-jv-detail thead th {
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--zr-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--zr-border);
    padding: 0.35rem 0.4rem;
}

.zr-jv-total {
    border-top: 1px solid var(--zr-border);
    font-weight: 600;
}

.zr-jv-total td {
    border-top: 1px solid var(--zr-border);
    padding-top: 0.5rem;
}

/* --- Detail table for receipt summary --------------------------------- */
.zr-detail-table {
    width: 100%;
    border-collapse: collapse;
}

.zr-detail-table th {
    text-align: left;
    width: 30%;
    padding: 0.4rem 0.6rem 0.4rem 0;
    color: var(--zr-muted);
    font-weight: 500;
    font-size: 0.85rem;
    vertical-align: top;
    border-bottom: 1px dashed var(--zr-border);
}

.zr-detail-table td {
    padding: 0.4rem 0;
    border-bottom: 1px dashed var(--zr-border);
}

.zr-detail-table tr:last-child th,
.zr-detail-table tr:last-child td {
    border-bottom: none;
}

/* --- Receipt list badges ---------------------------------------------- */
.zr-badge-mode {
    background: #E0E7FF;
    color: #312E81;
    font-weight: 600;
}

.zr-badge-remit-pending  { background: #FEF3C7; color: #92400E; }
.zr-badge-remit-inbatch  { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-remit-remitted { background: #D1FAE5; color: #065F46; }
.zr-badge-remit-failed   { background: #FECACA; color: #7F1D1D; }

.zr-badge-jv-receipt    { background: #E0E7FF; color: #312E81; }
.zr-badge-jv-commission { background: #ECFDF5; color: #065F46; }
.zr-badge-jv-jv         { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-jv-payment    { background: #FED7AA; color: #9A3412; }
.zr-badge-jv-contra     { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-jv-payout     { background: #FECACA; color: #7F1D1D; }

.zr-badge-ptp-kept           { background: #D1FAE5; color: #065F46; }
.zr-badge-ptp-partiallykept  { background: #FEF3C7; color: #92400E; }
.zr-badge-ptp-broken         { background: #FECACA; color: #7F1D1D; }
.zr-badge-ptp-open           { background: #DBEAFE; color: #1E3A8A; }

/* --- Big inline code (e.g. receipt number header) --------------------- */
.zr-code-big {
    font-size: 1.05em;
    padding: 0.18em 0.45em;
}

/* --- Table totals row (receipt waterfall details) --------------------- */
.zr-table-total {
    background: var(--zr-bg-elevated);
    font-weight: 600;
    border-top: 2px solid var(--zr-border);
}

.zr-table-total td {
    border-top: 2px solid var(--zr-border) !important;
    padding-top: 0.55rem !important;
}

/* ============================================================================
   CHUNK A7 — legal cases (Section 138 milestones, badges) + settlement letters
   ============================================================================ */

/* --- Case type badges ------------------------------------------------- */
.zr-badge-casetype-section138    { background: #FECACA; color: #7F1D1D; }
.zr-badge-casetype-civilsuit     { background: #FED7AA; color: #9A3412; }
.zr-badge-casetype-arbitration   { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-casetype-lokadalat     { background: #D1FAE5; color: #065F46; }
.zr-badge-casetype-consumerforum { background: #E0E7FF; color: #312E81; }
.zr-badge-casetype-other         { background: var(--zr-border-soft); color: var(--zr-muted); }

/* --- Case status badges ----------------------------------------------- */
.zr-badge-casestatus-drafting       { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-casestatus-noticestage    { background: #FEF3C7; color: #92400E; }
.zr-badge-casestatus-filed          { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-casestatus-pendinghearing { background: #E0E7FF; color: #312E81; }
.zr-badge-casestatus-inhearing      { background: #C7D2FE; color: #312E81; }
.zr-badge-casestatus-judgement      { background: #FED7AA; color: #9A3412; }
.zr-badge-casestatus-settled        { background: #D1FAE5; color: #065F46; }
.zr-badge-casestatus-withdrawn      { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-casestatus-dismissed      { background: #FECACA; color: #7F1D1D; }
.zr-badge-casestatus-closed         { background: var(--zr-border-soft); color: var(--zr-muted); }

/* --- Letter status badges --------------------------------------------- */
.zr-badge-letterstatus-drafted   { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-letterstatus-approved  { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-letterstatus-issued    { background: #E0E7FF; color: #312E81; }
.zr-badge-letterstatus-accepted  { background: #D1FAE5; color: #065F46; }
.zr-badge-letterstatus-rejected  { background: #FECACA; color: #7F1D1D; }
.zr-badge-letterstatus-expired   { background: #FED7AA; color: #9A3412; }
.zr-badge-letterstatus-revoked   { background: var(--zr-border-soft); color: var(--zr-muted); }

/* --- Section 138 milestones ------------------------------------------- */
.zr-s138-milestones {
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
}

.zr-s138-milestones::before {
    content: '';
    position: absolute;
    left: 0.6rem;
    top: 0.4rem;
    bottom: 0.4rem;
    width: 2px;
    background: var(--zr-border);
    z-index: 0;
}

.zr-milestone {
    position: relative;
    padding: 0.4rem 0 0.9rem 2rem;
    margin: 0;
}

.zr-milestone-dot {
    position: absolute;
    left: 0.15rem;
    top: 0.55rem;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: var(--zr-bg);
    border: 2px solid var(--zr-border);
    z-index: 1;
}

.zr-milestone-title {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--zr-text);
}

.zr-milestone-meta {
    font-size: 0.85rem;
    color: var(--zr-muted);
    margin-top: 0.15rem;
}

.zr-milestone-actual {
    font-size: 0.85rem;
    margin-top: 0.3rem;
    color: var(--zr-text-soft);
}

/* State variants */
.zr-milestone-done .zr-milestone-dot {
    background: #10B981;
    border-color: #10B981;
}
.zr-milestone-done .zr-milestone-actual {
    color: #047857;
}

.zr-milestone-due-soon .zr-milestone-dot {
    background: #F59E0B;
    border-color: #F59E0B;
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.18);
}
.zr-milestone-due-soon .zr-milestone-actual {
    color: #92400E;
    font-weight: 500;
}

.zr-milestone-overdue .zr-milestone-dot {
    background: #DC2626;
    border-color: #DC2626;
    box-shadow: 0 0 0 4px rgba(220, 38, 38, 0.22);
}
.zr-milestone-overdue .zr-milestone-actual {
    color: #991B1B;
    font-weight: 600;
}

.zr-milestone-upcoming .zr-milestone-dot {
    background: #FFFFFF;
    border-color: var(--zr-purple);
}
.zr-milestone-upcoming .zr-milestone-actual {
    color: var(--zr-purple-dark);
}

.zr-milestone-pending .zr-milestone-dot,
.zr-milestone-pending-dependent .zr-milestone-dot {
    background: var(--zr-border-soft);
    border-color: var(--zr-border);
}
.zr-milestone-pending .zr-milestone-meta,
.zr-milestone-pending-dependent .zr-milestone-meta {
    color: var(--zr-muted-light, var(--zr-muted));
    font-style: italic;
}

/* --- Section 138 quick-set divider ------------------------------------ */
.zr-s138-quickset {
    border-top: 1px dashed var(--zr-border);
    padding-top: 0.7rem;
    margin-top: 0.5rem;
}

/* --- How-it-works numbered list (Open Case info pane) ----------------- */
.zr-howit-list {
    margin: 0;
    padding-left: 1.4rem;
    font-size: 0.88rem;
}

.zr-howit-list li {
    padding-left: 0.3rem;
    margin-bottom: 0.5rem;
    color: var(--zr-text-soft);
}

.zr-howit-list li::marker {
    color: var(--zr-purple);
    font-weight: 700;
}

/* --- Info-blue quote variant (used in Open Case info) ----------------- */
.zr-card-quote-info {
    background: #EFF6FF;
    border-left: 3px solid #3B82F6;
    color: #1E3A8A;
}

.zr-card-quote-info > div {
    padding: 0.15rem 0;
    font-size: 0.88rem;
}

/* --- Generic card-quote (used inside milestone for drawer response) --- */
.zr-card-quote {
    background: var(--zr-border-soft);
    border-left: 3px solid var(--zr-purple);
    border-radius: 0.3rem;
    padding: 0.5rem 0.8rem;
    color: var(--zr-text-soft);
    font-style: italic;
    font-size: 0.88rem;
}

/* --- Compact timeline variant (used in Case details right column) ----- */
.zr-timeline-compact {
    padding-left: 1rem;
}

.zr-timeline-compact .zr-timeline-item {
    padding-left: 1.5rem;
    padding-bottom: 0.8rem;
}

.zr-timeline-compact .zr-timeline-dot {
    width: 0.7rem;
    height: 0.7rem;
    left: 0.35rem;
    top: 0.45rem;
}

.zr-timeline-compact .zr-timeline-head {
    font-size: 0.85rem;
}

.zr-timeline-compact .zr-timeline-body {
    font-size: 0.83rem;
    line-height: 1.4;
    color: var(--zr-text-soft);
}

.zr-tl-event .zr-timeline-dot {
    background: var(--zr-purple);
    border-color: var(--zr-purple);
}

.zr-timeline-type {
    background: var(--zr-border-soft);
    color: var(--zr-text-soft);
    padding: 0.08rem 0.4rem;
    border-radius: 0.3rem;
    font-weight: 600;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.zr-timeline-time {
    color: var(--zr-muted);
    font-size: 0.78rem;
    margin-left: 0.4rem;
}

.zr-timeline-actor {
    color: var(--zr-muted);
    font-size: 0.75rem;
    margin-top: 0.2rem;
}

/* --- Small input variant (used in quickset row) ----------------------- */
.zr-input-sm {
    font-size: 0.85rem !important;
    padding: 0.3rem 0.55rem !important;
}

/* --- Text color utilities --------------------------------------------- */
.zr-text-due  { color: #92400E; font-weight: 500; }
.zr-text-warn { color: #B91C1C; font-weight: 600; }

/* --- Checkbox styling on Draft form ----------------------------------- */
.zr-checkbox .form-check-input:checked {
    background-color: var(--zr-purple);
    border-color: var(--zr-purple);
}

/* --- Small button link variant ---------------------------------------- */
.zr-btn-link.small {
    color: var(--zr-purple);
    font-size: 0.85rem;
    font-weight: 500;
    text-decoration: none;
}
.zr-btn-link.small:hover { text-decoration: underline; }


/* ============================================================================
   SETTLEMENT LETTER PRINT-READY VIEW
   ============================================================================ */

.zr-print-toolbar {
    background: var(--zr-bg-elevated);
    border-bottom: 1px solid var(--zr-border);
}

.zr-letter-page {
    background: #F4F4F7;
    padding: 2rem 1rem;
    min-height: calc(100vh - 60px);
}

.zr-letter {
    background: #FFFFFF;
    max-width: 780px;       /* approximate A4 readable width */
    margin: 0 auto;
    padding: 3rem 3.5rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    font-family: 'Inter', Arial, sans-serif;
    font-size: 11pt;
    line-height: 1.5;
    color: #1F2937;
}

.zr-letterhead {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 3px solid var(--zr-purple);
    padding-bottom: 1.2rem;
    margin-bottom: 1.8rem;
    gap: 1.2rem;
}

.zr-letterhead-brand {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}

.zr-letterhead-logo {
    width: 52px;
    height: 52px;
    border-radius: 8px;
    background: linear-gradient(135deg, #7C3AED 0%, #3B82F6 100%);
    color: #FFFFFF;
    font-weight: 700;
    font-size: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.zr-letterhead-name {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--zr-purple-dark);
    letter-spacing: 0.04em;
}

.zr-letterhead-tag {
    font-size: 0.78rem;
    color: var(--zr-muted);
    font-weight: 500;
}

.zr-letterhead-meta {
    text-align: right;
    font-size: 0.78rem;
    color: var(--zr-muted);
    line-height: 1.5;
}

.zr-letter-topref {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.zr-letter-ref-line {
    font-size: 0.85rem;
    color: var(--zr-text-soft);
}

.zr-letter-date {
    font-size: 0.9rem;
    color: var(--zr-text-soft);
    text-align: right;
}

.zr-letter-to {
    margin-bottom: 1.2rem;
}

.zr-letter-to-label {
    margin-bottom: 0.2rem;
}

.zr-letter-to-name {
    font-size: 1rem;
}

.zr-letter-to-addr {
    color: var(--zr-text-soft);
    font-size: 0.9rem;
}

.zr-letter-subject {
    background: #FAF8FF;
    border-left: 3px solid var(--zr-purple);
    padding: 0.65rem 0.9rem;
    margin-bottom: 1.2rem;
    font-size: 0.95rem;
}

.zr-letter-salutation {
    margin-bottom: 0.7rem;
    font-size: 0.98rem;
}

.zr-letter-body p {
    margin-bottom: 0.85rem;
    text-align: justify;
}

.zr-letter-amount {
    background: #FAF8FF;
    border: 1px solid var(--zr-purple);
    border-radius: 4px;
    padding: 1rem 1.2rem;
    margin: 1rem 0;
}

.zr-letter-amount table {
    width: 100%;
    border-collapse: collapse;
}

.zr-letter-amount td {
    padding: 0.4rem 0.2rem;
    border-bottom: 1px dashed var(--zr-border);
    font-size: 0.95rem;
}

.zr-letter-amount tr:last-child td { border-bottom: none; }

.zr-letter-amount-waived td {
    padding-top: 0.7rem !important;
    border-top: 2px solid var(--zr-purple) !important;
    border-bottom: none !important;
    font-size: 1.05rem !important;
    color: var(--zr-purple-dark);
}

.zr-letter-pct {
    color: var(--zr-muted);
    font-weight: 400;
}

.zr-letter-noc {
    background: #F0FDF4;
    border-left: 3px solid #10B981;
    padding: 0.7rem 1rem;
    font-style: italic;
    font-size: 0.9rem;
    margin: 0.8rem 0 !important;
}

.zr-letter-signoff {
    margin-top: 2.5rem;
    font-size: 0.95rem;
}

.zr-letter-sig-block {
    margin-top: 0.5rem;
}

.zr-letter-sig-line {
    height: 2.5rem;
    border-bottom: 1px solid #1F2937;
    max-width: 240px;
    margin-bottom: 0.4rem;
}

.zr-letter-sig-org {
    font-size: 0.85rem;
    color: var(--zr-text-soft);
}

.zr-letter-sig-acting {
    font-size: 0.78rem;
    color: var(--zr-muted);
    margin-top: 0.3rem;
}

.zr-letter-footer {
    margin-top: 2.5rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--zr-border);
    display: flex;
    justify-content: space-between;
    color: var(--zr-muted);
    font-size: 0.72rem;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* --- Print rules: hide app chrome, show only the letter --------------- */
@media print {
    body { background: #FFFFFF !important; }
    .zr-app-header,
    .zr-app-footer,
    .zr-print-toolbar,
    nav,
    .zr-flash {
        display: none !important;
    }
    .zr-letter-page {
        background: #FFFFFF !important;
        padding: 0 !important;
        min-height: auto !important;
    }
    .zr-letter {
        box-shadow: none !important;
        margin: 0 !important;
        max-width: 100% !important;
        padding: 1.5cm 1.8cm !important;
        border-radius: 0 !important;
    }
    @page {
        size: A4;
        margin: 0;
    }
    .zr-letter-noc {
        page-break-inside: avoid;
    }
    .zr-letter-signoff {
        page-break-inside: avoid;
    }
}

/* ============================================================================
   CHUNK A8 — principal payout batches + settlement letter approval workflow
   ============================================================================ */

/* --- Batch status badges ---------------------------------------------- */
.zr-badge-batch-draft       { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-batch-calculated  { background: #FEF3C7; color: #92400E; }
.zr-badge-batch-approved    { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-batch-remitted    { background: #D1FAE5; color: #065F46; }
.zr-badge-batch-reconciled  { background: #BBF7D0; color: #14532D; }
.zr-badge-batch-failed      { background: #FECACA; color: #7F1D1D; }
.zr-badge-batch-cancelled   { background: var(--zr-border-soft); color: var(--zr-muted); }

/* --- KPI strip (used on Payouts Index) -------------------------------- */
.zr-kpi {
    background: var(--zr-bg);
    border: 1px solid var(--zr-border);
    border-radius: 0.55rem;
    padding: 0.85rem 1.1rem;
    height: 100%;
}

.zr-kpi-label {
    font-size: 0.78rem;
    color: var(--zr-muted);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.zr-kpi-value {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--zr-text);
    margin-top: 0.2rem;
}

.zr-kpi-sub {
    font-size: 0.78rem;
    color: var(--zr-muted);
    margin-top: 0.1rem;
}

/* --- Status-aware action bar (used on Payouts Details) ---------------- */
.zr-action-bar {
    background: var(--zr-bg-elevated);
    border: 1px solid var(--zr-border);
    border-radius: 0.55rem;
    padding: 0.7rem 1rem;
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

/* --- NEFT bank file display ------------------------------------------- */
.zr-neft-file {
    background: #0F172A;
    color: #E2E8F0;
    border-radius: 0.4rem;
    padding: 0.9rem 1.1rem;
    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
    font-size: 0.78rem;
    line-height: 1.5;
    overflow-x: auto;
    margin: 0 0 0.6rem 0;
    white-space: pre;
}

.zr-code-tiny {
    background: var(--zr-border-soft);
    color: var(--zr-muted);
    padding: 0.05rem 0.3rem;
    border-radius: 0.2rem;
    font-family: 'Consolas', 'Monaco', monospace;
    font-size: 0.72rem;
}

/* --- Inline reason form (Reject/Revoke on letter Preview) ------------- */
.zr-inline-reason-form {
    background: var(--zr-bg-elevated);
    border: 1px solid var(--zr-border);
    border-radius: 0.55rem;
    padding: 0.9rem 1.1rem;
    margin-top: 0.8rem;
}

/* Print rules: also hide inline reason forms and action toolbar buttons */
@media print {
    .zr-inline-reason-form,
    .zr-action-bar {
        display: none !important;
    }
}

/* --- Status-active badge (used on JV "Posted" pill) ------------------- */
.zr-badge-status-active { background: #D1FAE5; color: #065F46; font-weight: 600; }

/* ============================================================================
   CHUNK A9 — Principal MIS dashboard (chooser cards + KPIs + SVG chart + aging + print)
   ============================================================================ */

/* --- Chooser cards ---------------------------------------------------- */
.zr-mis-card {
    display: block;
    background: var(--zr-bg);
    border: 1px solid var(--zr-border);
    border-radius: 0.55rem;
    padding: 1.1rem 1.2rem;
    text-decoration: none;
    color: inherit;
    height: 100%;
    transition: border-color 120ms, box-shadow 120ms, transform 120ms;
}

.zr-mis-card:hover {
    border-color: var(--zr-purple);
    box-shadow: 0 4px 14px rgba(124, 58, 237, 0.10);
    transform: translateY(-1px);
    text-decoration: none;
    color: inherit;
}

.zr-mis-card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.6rem;
    gap: 0.5rem;
}

.zr-mis-card-name {
    font-size: 1.1rem;
    margin: 0.1rem 0 0 0;
    color: var(--zr-text);
    font-weight: 600;
}

.zr-mis-card-type {
    background: var(--zr-border-soft);
    color: var(--zr-muted);
    padding: 0.15rem 0.5rem;
    border-radius: 0.3rem;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.zr-mis-card-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.7rem 1rem;
    margin-top: 0.7rem;
    padding-top: 0.7rem;
    border-top: 1px dashed var(--zr-border);
}

.zr-mis-stat-label {
    font-size: 0.72rem;
    color: var(--zr-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 500;
}

.zr-mis-stat-value {
    font-size: 1.05rem;
    font-weight: 600;
    margin-top: 0.1rem;
}

.zr-mis-card-foot {
    margin-top: 0.7rem;
    padding-top: 0.6rem;
    border-top: 1px dashed var(--zr-border);
    font-size: 0.78rem;
    color: var(--zr-text-soft);
}

/* --- Dashboard header (with period selector on right) ----------------- */
.zr-mis-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 1.2rem;
    gap: 1rem;
    flex-wrap: wrap;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--zr-purple);
}

.zr-mis-period-form {
    min-width: 240px;
}

/* --- KPI accent variant (for the "collected" headline) ---------------- */
.zr-kpi-accent {
    background: linear-gradient(135deg, #FAF5FF 0%, #EFF6FF 100%);
    border-color: var(--zr-purple);
}

.zr-kpi-accent .zr-kpi-value {
    color: var(--zr-purple-dark);
}

/* --- SVG bar chart ---------------------------------------------------- */
.zr-chart {
    width: 100%;
    height: auto;
    max-height: 280px;
    font-family: inherit;
}

.zr-chart-bar {
    fill: #7C3AED;
    opacity: 0.85;
    transition: opacity 150ms;
}

.zr-chart-bar:hover {
    opacity: 1;
}

.zr-chart-bar-current {
    fill: url(#zrChartGrad);
    opacity: 1;
}

/* Inline gradient via stop colors not needed - keeping it simple with solid */
.zr-chart-bar-current {
    fill: #3B82F6;
}

.zr-chart-x-label {
    fill: var(--zr-muted);
    font-size: 0.78rem;
    text-anchor: middle;
}

.zr-chart-value {
    fill: var(--zr-text);
    font-size: 0.75rem;
    font-weight: 600;
    text-anchor: middle;
}

.zr-chart-axis {
    stroke: var(--zr-border);
    stroke-width: 1;
}

/* --- Aging bars ------------------------------------------------------- */
.zr-aging-list {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.zr-aging-row {
    display: grid;
    grid-template-columns: 110px 1fr 110px 60px;
    align-items: center;
    gap: 0.7rem;
    font-size: 0.88rem;
}

.zr-aging-label {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.zr-aging-tag {
    display: inline-block;
    padding: 0.12rem 0.45rem;
    border-radius: 0.3rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    width: fit-content;
}

.zr-aging-tag-030      { background: #D1FAE5; color: #065F46; }
.zr-aging-tag-3160     { background: #DBEAFE; color: #1E3A8A; }
.zr-aging-tag-6190     { background: #FEF3C7; color: #92400E; }
.zr-aging-tag-90plus   { background: #FED7AA; color: #9A3412; }
.zr-aging-tag-NPA      { background: #FECACA; color: #7F1D1D; }
.zr-aging-tag-WrittenOff { background: var(--zr-border-soft); color: var(--zr-muted); }

.zr-aging-bar-wrap {
    background: var(--zr-border-soft);
    border-radius: 0.3rem;
    height: 14px;
    overflow: hidden;
}

.zr-aging-bar {
    height: 100%;
    border-radius: 0.3rem;
    transition: width 250ms;
}

.zr-aging-bar-030      { background: #10B981; }
.zr-aging-bar-3160     { background: #3B82F6; }
.zr-aging-bar-6190     { background: #F59E0B; }
.zr-aging-bar-90plus   { background: #F97316; }
.zr-aging-bar-NPA      { background: #DC2626; }
.zr-aging-bar-WrittenOff { background: var(--zr-muted); }

.zr-aging-amount {
    text-align: right;
}

.zr-aging-pct {
    text-align: right;
    color: var(--zr-muted);
    font-size: 0.82rem;
}

/* --- PTP big-number panel --------------------------------------------- */
.zr-ptp-big {
    text-align: center;
    background: linear-gradient(135deg, #F0FDF4 0%, #DCFCE7 100%);
    border: 1px solid #BBF7D0;
    border-radius: 0.5rem;
    padding: 0.9rem 1rem;
    margin-bottom: 0.7rem;
}

.zr-ptp-big-value {
    font-size: 2.2rem;
    font-weight: 700;
    color: #065F46;
    line-height: 1.1;
}

.zr-ptp-big-label {
    font-size: 0.78rem;
    color: #047857;
    margin-top: 0.15rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 500;
}

/* --- Debtor status badges (used in Top Debtors table) ----------------- */
.zr-badge-debtor-open          { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-debtor-inprogress    { background: #E0E7FF; color: #312E81; }
.zr-badge-debtor-promisedtopay { background: #FEF3C7; color: #92400E; }
.zr-badge-debtor-partpaid      { background: #FED7AA; color: #9A3412; }
.zr-badge-debtor-settled       { background: #D1FAE5; color: #065F46; }
.zr-badge-debtor-closed        { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-debtor-returned      { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-debtor-skip          { background: #FECACA; color: #7F1D1D; }
.zr-badge-debtor-disputed      { background: #FECACA; color: #7F1D1D; }
.zr-badge-debtor-legal         { background: #FECACA; color: #7F1D1D; }
.zr-badge-debtor-deceased      { background: var(--zr-border-soft); color: var(--zr-muted); }

/* --- Footer ----------------------------------------------------------- */
.zr-mis-footer {
    margin-top: 1.2rem;
    padding-top: 1rem;
    border-top: 1px solid var(--zr-border);
    color: var(--zr-text-soft);
    font-size: 0.82rem;
}

/* --- Print rules ------------------------------------------------------ */
@media print {
    .zr-no-print,
    .zr-app-header,
    .zr-app-footer,
    nav,
    .zr-breadcrumb {
        display: none !important;
    }

    .zr-mis-header {
        border-bottom-color: #7C3AED;
    }

    .zr-card {
        break-inside: avoid;
        page-break-inside: avoid;
        border: 1px solid #CBD5E1 !important;
        box-shadow: none !important;
    }

    .zr-chart-bar { fill: #7C3AED !important; }
    .zr-chart-bar-current { fill: #3B82F6 !important; }

    @page {
        size: A4 landscape;
        margin: 1.2cm;
    }

    body { background: #FFFFFF !important; }
}

/* ============================================================================
   CHUNK A10 — Compliance scorecard (traffic-light tiles + tabs + badges)
   ============================================================================ */

/* --- Score tile (used on Compliance Index) ---------------------------- */
.zr-score-tile {
    display: block;
    background: var(--zr-bg);
    border: 1px solid var(--zr-border);
    border-radius: 0.55rem;
    padding: 1rem 1.1rem;
    text-decoration: none;
    color: inherit;
    height: 100%;
    transition: border-color 120ms, box-shadow 120ms, transform 120ms;
    position: relative;
}

.zr-score-tile:hover {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
    transform: translateY(-1px);
    text-decoration: none;
    color: inherit;
}

.zr-score-tile-ok    { border-left: 4px solid #10B981; }
.zr-score-tile-warn  { border-left: 4px solid #F59E0B; }
.zr-score-tile-fail  { border-left: 4px solid #DC2626; }

.zr-score-tile-ok:hover    { border-color: #10B981; }
.zr-score-tile-warn:hover  { border-color: #F59E0B; }
.zr-score-tile-fail:hover  { border-color: #DC2626; }

.zr-score-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.zr-score-label {
    font-size: 0.78rem;
    color: var(--zr-muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.zr-score-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.zr-score-dot-ok   { background: #10B981; box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2); }
.zr-score-dot-warn { background: #F59E0B; box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.2); }
.zr-score-dot-fail { background: #DC2626; box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.22); }

.zr-score-value {
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--zr-text);
    line-height: 1.1;
}

.zr-score-sub {
    font-size: 0.78rem;
    color: var(--zr-muted);
    margin-top: 0.1rem;
}

.zr-score-warn,
.zr-score-fail,
.zr-score-info {
    font-size: 0.78rem;
    margin-top: 0.3rem;
}

.zr-score-warn { color: #92400E; }
.zr-score-fail { color: #B91C1C; font-weight: 500; }
.zr-score-info { color: var(--zr-text-soft); }

.zr-score-warn i,
.zr-score-fail i,
.zr-score-info i { margin-right: 0.25rem; }

.zr-score-cite {
    font-size: 0.7rem;
    color: var(--zr-muted-light, var(--zr-muted));
    margin-top: 0.7rem;
    padding-top: 0.5rem;
    border-top: 1px dashed var(--zr-border);
    font-style: italic;
    letter-spacing: 0.02em;
}

/* --- Tabs (used on Recordings + Certifications) ----------------------- */
.zr-tabs {
    display: flex;
    gap: 0.3rem;
    border-bottom: 1px solid var(--zr-border);
    padding-bottom: 0;
    flex-wrap: wrap;
}

.zr-tab {
    padding: 0.45rem 0.95rem;
    font-size: 0.88rem;
    color: var(--zr-muted);
    text-decoration: none;
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: 0.4rem 0.4rem 0 0;
    margin-bottom: -1px;
    font-weight: 500;
}

.zr-tab:hover {
    color: var(--zr-text);
    background: var(--zr-bg-elevated);
    text-decoration: none;
}

.zr-tab-active {
    color: var(--zr-purple-dark);
    background: var(--zr-bg);
    border-color: var(--zr-border);
    border-bottom-color: var(--zr-bg);
    font-weight: 600;
}

/* --- Recording status badges ----------------------------------------- */
.zr-badge-rec-active     { background: #D1FAE5; color: #065F46; }
.zr-badge-rec-legalhold  { background: #FED7AA; color: #9A3412; }
.zr-badge-rec-purged     { background: var(--zr-border-soft); color: var(--zr-muted); }

/* --- Cert verification status badges --------------------------------- */
.zr-badge-vstat-pending    { background: #FEF3C7; color: #92400E; }
.zr-badge-vstat-verified   { background: #D1FAE5; color: #065F46; }
.zr-badge-vstat-failed     { background: #FECACA; color: #7F1D1D; }
.zr-badge-vstat-suspended  { background: #FED7AA; color: #9A3412; }
.zr-badge-vstat-revoked    { background: #FECACA; color: #7F1D1D; }

/* --- Cert type badges ------------------------------------------------ */
.zr-badge-cert-iba              { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-cert-iibfdra          { background: #E0E7FF; color: #312E81; }
.zr-badge-cert-iibfccp          { background: #C7D2FE; color: #312E81; }
.zr-badge-cert-fedai            { background: #FBCFE8; color: #831843; }
.zr-badge-cert-internaltraining { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-cert-other            { background: var(--zr-border-soft); color: var(--zr-muted); }

/* --- DNC type badges ------------------------------------------------- */
.zr-badge-dnc-customerinitiated { background: #FED7AA; color: #9A3412; }
.zr-badge-dnc-ncprsync          { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-dnc-legalnotice       { background: #FECACA; color: #7F1D1D; }
.zr-badge-dnc-regulatoryorder   { background: #FECACA; color: #7F1D1D; }

/* --- Channel badges (for consents) ----------------------------------- */
.zr-badge-channel-voicecall { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-channel-sms       { background: #D1FAE5; color: #065F46; }
.zr-badge-channel-whatsapp  { background: #DCFCE7; color: #14532D; }
.zr-badge-channel-email     { background: #FED7AA; color: #9A3412; }
.zr-badge-channel-letter    { background: var(--zr-border-soft); color: var(--zr-muted); }

/* --- Consent status badges ------------------------------------------- */
.zr-badge-cstat-granted     { background: #D1FAE5; color: #065F46; }
.zr-badge-cstat-denied      { background: #FECACA; color: #7F1D1D; }
.zr-badge-cstat-withdrawn   { background: #FED7AA; color: #9A3412; }
.zr-badge-cstat-expired     { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-cstat-notobtained { background: #FECACA; color: #7F1D1D; }

/* --- Calling hours outcome badges ------------------------------------ */
.zr-badge-hours-allowed  { background: #D1FAE5; color: #065F46; }
.zr-badge-hours-blocked  { background: #FECACA; color: #7F1D1D; }
.zr-badge-hours-override { background: #FEF3C7; color: #92400E; }

/* ============================================================================
   CHUNK A11 — Polish (tab count chip + minor utility classes)
   ============================================================================ */

.zr-tab-count {
    display: inline-block;
    background: var(--zr-border-soft);
    color: var(--zr-muted);
    padding: 0.05rem 0.45rem;
    border-radius: 0.7rem;
    font-size: 0.72rem;
    font-weight: 600;
    margin-left: 0.3rem;
    vertical-align: 1px;
}

.zr-tab-active .zr-tab-count {
    background: var(--zr-purple);
    color: #FFFFFF;
}

.zr-btn-link {
    color: var(--zr-purple-dark);
    text-decoration: none;
    font-weight: 500;
}
.zr-btn-link:hover { text-decoration: underline; }

/* ============================================================================
   CHUNK B1.6b — Commission policy admin (badges + form)
   ============================================================================ */

/* --- Commission model badges ----------------------------------------- */
.zr-badge-cmodel-flatpercent            { background: var(--zr-border-soft); color: var(--zr-muted); }
.zr-badge-cmodel-dpdslab                { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-cmodel-dpdslablifecycletrueup { background: #E0E7FF; color: #312E81; font-weight: 600; }
.zr-badge-cmodel-dpdslabadditivebonus   { background: #D1FAE5; color: #065F46; font-weight: 600; }

/* --- Expired status badge -------------------------------------------- */
.zr-badge-status-expired { background: var(--zr-border-soft); color: var(--zr-muted); }

/* ============================================================================
   CHUNK B1.6g — Commission invoice status badges
   ============================================================================ */

.zr-badge-invstatus-draft           { background: #E2E8F0; color: #475569; }
.zr-badge-invstatus-issued          { background: #DBEAFE; color: #1E3A8A; }
.zr-badge-invstatus-disputed        { background: #FECACA; color: #991B1B; }
.zr-badge-invstatus-partialaccepted { background: #FEF3C7; color: #92400E; }
.zr-badge-invstatus-accepted        { background: #DCFCE7; color: #14532D; }
.zr-badge-invstatus-partpaid        { background: #E0E7FF; color: #312E81; }
.zr-badge-invstatus-paidinfull      { background: #D1FAE5; color: #065F46; font-weight: 600; }
.zr-badge-invstatus-cancelled       { background: #FECACA; color: #7F1D1D; }
.zr-badge-invstatus-supersededbytrueup { background: #F5F3FF; color: #6D28D9; }

.zr-code-tiny  { font-family: 'JetBrains Mono', monospace; font-size: 0.78em; background: #F1F5F9; padding: 1px 5px; border-radius: 3px; }
.zr-pre        { background: #F8FAFC; padding: 0.75rem; border-radius: 6px; font-family: inherit; white-space: pre-wrap; margin: 0; font-size: 0.92rem; }

/* ============================================================================
   CHUNK B1.6j — Commission MIS dashboard
   ============================================================================ */

/* --- Aging bars --- */
.zr-aging-bar-track {
    height: 18px;
    background: #F1F5F9;
    border-radius: 9px;
    overflow: hidden;
    position: relative;
}
.zr-aging-bar {
    height: 100%;
    border-radius: 9px;
    transition: width 0.3s;
}
.zr-aging-bar-fresh  { background: linear-gradient(90deg, #14B8A6, #06B6D4); }
.zr-aging-bar-warn   { background: linear-gradient(90deg, #FACC15, #F59E0B); }
.zr-aging-bar-danger { background: linear-gradient(90deg, #EF4444, #DC2626); }
.zr-aging-bar-paid   { background: #94A3B8; }

/* --- KPI sub-label + warn variant --- */
.zr-kpi-sub {
    font-size: 0.78rem;
    color: var(--zr-muted);
    margin-top: 4px;
    font-weight: 400;
}
.zr-kpi-warn {
    border-left: 3px solid #DC2626;
    background: linear-gradient(135deg, #FEF2F2 0%, #FFFFFF 60%);
}
.zr-kpi-warn .zr-kpi-value { color: #B91C1C; }

/* --- Feed list (recent activity) --- */
.zr-feed-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.zr-feed-list li {
    border-bottom: 1px solid var(--zr-border-soft);
    padding: 0;
}
.zr-feed-list li:last-child { border-bottom: none; }
.zr-feed-item {
    display: block;
    padding: 10px 0;
    text-decoration: none;
    color: inherit;
}
.zr-feed-item:hover { background: #F8FAFC; }
.zr-feed-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 3px;
}
.zr-feed-body  { font-size: 0.88rem; color: var(--zr-text); }
.zr-feed-meta  { font-size: 0.78rem; color: var(--zr-muted); margin-top: 2px; }

/* ============================================================================
   CHUNK B1.2 — User & role admin
   ============================================================================ */

/* Compact role badge — used in user list rows */
.zr-badge-role {
    display: inline-block;
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.10), rgba(59, 130, 246, 0.10));
    color: #4338CA;
    border: 1px solid #C7D2FE;
    border-radius: 4px;
    padding: 1px 7px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    margin-right: 3px;
    margin-bottom: 2px;
}

/* ============================================================================
   CHUNK B1.4 — Global search nav input
   ============================================================================ */

.zr-navsearch-form {
    position: relative;
    display: flex;
    align-items: center;
}
.zr-navsearch-icon {
    position: absolute;
    left: 10px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.85rem;
    pointer-events: none;
}
.zr-navsearch-input {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: white;
    border-radius: 999px;
    padding: 5px 12px 5px 30px;
    font-size: 0.85rem;
    width: 220px;
    transition: background 0.2s, border-color 0.2s, width 0.2s;
}
.zr-navsearch-input::placeholder { color: rgba(255, 255, 255, 0.45); }
.zr-navsearch-input:focus {
    outline: none;
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.35);
    width: 280px;
}
.zr-navsearch-input::-webkit-search-cancel-button { filter: invert(0.7); }

@media (max-width: 991px) {
    .zr-navsearch-input { width: 100%; }
}

/* ============================================================================
   CHUNK B1.4 — Live search dropdown
   ============================================================================ */

.zr-navsearch-form {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.zr-navsearch-kbd {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.10);
    color: rgba(255, 255, 255, 0.70);
    font-size: 0.68rem;
    font-family: 'JetBrains Mono', monospace;
    padding: 1px 6px;
    border-radius: 3px;
    pointer-events: none;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

/* The dropdown itself is appended to <body> to escape navbar clipping */
.zr-navsearch-dropdown {
    position: absolute;
    z-index: 1050;
    background: white;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    max-height: 70vh;
    overflow-y: auto;
    color: #1F2937;
    font-size: 13px;
}

.zr-navsearch-cat-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px 5px;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6B7280;
    font-weight: 600;
    background: #F9FAFB;
    border-bottom: 1px solid #F3F4F6;
}
.zr-navsearch-cat-head:not(:first-child) { margin-top: 4px; }
.zr-navsearch-cat-count {
    background: #E5E7EB;
    color: #4B5563;
    padding: 0 6px;
    border-radius: 8px;
    margin-left: auto;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
}

.zr-navsearch-item {
    display: block;
    padding: 8px 14px;
    text-decoration: none;
    color: #1F2937;
    border-bottom: 1px solid #F9FAFB;
}
.zr-navsearch-item:last-child { border-bottom: none; }
.zr-navsearch-item:hover,
.zr-navsearch-item-active {
    background: linear-gradient(90deg, rgba(124, 58, 237, 0.08), rgba(59, 130, 246, 0.04));
    color: #1F2937;
    text-decoration: none;
}
.zr-navsearch-item-primary { font-weight: 500; font-size: 0.92rem; }
.zr-navsearch-item-sec     { font-size: 0.8rem; color: #6B7280; margin-top: 2px; }
.zr-navsearch-item-ter     { font-size: 0.75rem; color: #9CA3AF; margin-top: 1px; }
.zr-navsearch-item mark    { background: #FEF3C7; color: #78350F; padding: 0 1px; border-radius: 2px; }

.zr-navsearch-more {
    display: block;
    padding: 10px 14px;
    text-align: center;
    background: linear-gradient(90deg, #7C3AED, #3B82F6);
    color: white !important;
    text-decoration: none;
    font-weight: 500;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}
.zr-navsearch-more:hover { opacity: 0.92; }

.zr-navsearch-loading, .zr-navsearch-empty {
    padding: 18px 14px;
    text-align: center;
    color: #6B7280;
}
.zr-navsearch-empty i { display: block; font-size: 1.5rem; margin-bottom: 6px; color: #9CA3AF; }

/* ============================================================================
   CHUNK B1.3 + B1.5 — Legal deadline row urgency styling
   ============================================================================ */

/* Row-level color bands by urgency on deadline-table rows */
tr.zr-deadline-overdue {
    background: linear-gradient(90deg, rgba(220, 38, 38, 0.08), transparent 60%);
    border-left: 3px solid #DC2626;
}
tr.zr-deadline-overdue td:first-child { padding-left: 11px; }

tr.zr-deadline-critical {
    background: linear-gradient(90deg, rgba(234, 88, 12, 0.07), transparent 60%);
    border-left: 3px solid #EA580C;
}
tr.zr-deadline-critical td:first-child { padding-left: 11px; }

tr.zr-deadline-urgent {
    background: linear-gradient(90deg, rgba(217, 119, 6, 0.05), transparent 60%);
    border-left: 3px solid #D97706;
}
tr.zr-deadline-urgent td:first-child { padding-left: 11px; }

tr.zr-deadline-normal {
    /* no special background — normal row */
}