/* BizLink Client Styles — v1.1.0 (2026-05-07)
   Header sections rewritten around the bzl design tokens
   (modules/cases/assets/css/bzl/colors_and_type.css). The legacy
   #navbar-brutal / #top-live-bar / #registry-profile-* selectors are
   retired — markup now lives in
   application/views/themes/perfex/template_parts/navigation.php
   under .bzl-portal-nav__* and .bzl-portal-drawer__* class names. */

/* ================================================================
   0. CLIENT HEADER — bzl-portal-nav (BEM-style)
   ================================================================ */

:root {
    --navbar-height: 64px;
    --header-height: var(--navbar-height);
}
@media (max-width: 767px) {
    :root { --navbar-height: 56px; }
}

/* Body offset to clear the fixed nav. */
body.customers { padding-top: var(--header-height) !important; }

/* ── Shell ─────────────────────────────────────────────────────── */
.bzl-portal-nav {
    position: fixed;
    top: 0; left: 0; right: 0;
    width: 100%;
    height: var(--header-height);
    z-index: 100;
    background: rgba(252, 252, 252, 0.86);
    backdrop-filter: saturate(180%) blur(10px);
    -webkit-backdrop-filter: saturate(180%) blur(10px);
    border-bottom: 1px solid var(--border-color, #e4e4e7);
    transition: box-shadow var(--duration-base, 200ms) var(--ease-out, cubic-bezier(0.16,1,0.3,1)),
                background var(--duration-base, 200ms) ease;
}
.bzl-portal-nav.is-scrolled {
    background: rgba(252, 252, 252, 0.94);
    box-shadow: var(--shadow-sm, 0 1px 3px rgba(9,9,11,0.06));
}

.bzl-portal-nav__inner {
    display: flex;
    align-items: center;
    gap: 1rem;
    height: 100%;
    width: 100%;
    padding: 0 clamp(1rem, 4vw, 2.5rem);
}

/* ── Hamburger (≤1023px) ───────────────────────────────────────── */
.bzl-portal-nav__hamburger {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 38px;
    height: 38px;
    border: 1px solid var(--border-color, #e4e4e7);
    border-radius: var(--radius-md, 8px);
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
    padding: 0;
    transition: background var(--duration-fast, 150ms) ease,
                border-color var(--duration-fast, 150ms) ease;
}
.bzl-portal-nav__hamburger:hover,
.bzl-portal-nav__hamburger:focus-visible {
    background: var(--surface-2, #fafafa);
    border-color: var(--border-active, #18181b);
    outline: none;
}
.bzl-portal-nav__hamburger-bar {
    display: block;
    width: 16px;
    height: 1.5px;
    background: var(--primary-text, #18181b);
    border-radius: 1px;
    transition: transform var(--duration-base, 200ms) var(--ease-out),
                opacity var(--duration-base, 200ms) ease;
}
.bzl-portal-nav__hamburger[aria-expanded="true"] .bzl-portal-nav__hamburger-bar:nth-child(1) {
    transform: translateY(5.5px) rotate(45deg);
}
.bzl-portal-nav__hamburger[aria-expanded="true"] .bzl-portal-nav__hamburger-bar:nth-child(2) {
    opacity: 0;
}
.bzl-portal-nav__hamburger[aria-expanded="true"] .bzl-portal-nav__hamburger-bar:nth-child(3) {
    transform: translateY(-5.5px) rotate(-45deg);
}
@media (max-width: 1023px) {
    .bzl-portal-nav__hamburger { display: inline-flex; }
}

/* ── Brand (logo + Portal pill) ────────────────────────────────── */
.bzl-portal-nav__brand {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    text-decoration: none;
    flex-shrink: 0;
}
.bzl-portal-nav__brand:hover { text-decoration: none; }
.bzl-portal-nav__logo {
    height: 22px;
    width: auto;
    display: block;
}
@media (max-width: 1023px) {
    .bzl-portal-nav__inner { gap: 0.625rem; }
    /* Centre the brand on tablet/mobile so the hamburger and profile
       button flank it symmetrically. */
    .bzl-portal-nav__brand {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }
    .bzl-portal-nav__inner { position: relative; }
}
@media (max-width: 479px) {
    .bzl-portal-nav__logo { height: 18px; }
    .bzl-pill--brand { display: none; }
}

/* ── Brand pill modifier ───────────────────────────────────────── */
.bzl-scope .bzl-pill--brand,
.bzl-pill--brand {
    padding: 3px 7px;
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 0.18em;
    color: var(--primary-text, #18181b);
    background: var(--surface-2, #fafafa);
    border: 1px solid var(--border-strong, #d4d4d8);
    border-radius: var(--radius-sm, 4px);
    text-transform: uppercase;
    line-height: 1;
}

/* ── Primary nav (≥1024px) ─────────────────────────────────────── */
.bzl-portal-nav__primary {
    display: none;
    align-items: center;
    gap: 0.25rem;
    list-style: none;
    margin: 0 0 0 1rem;
    padding: 0;
    flex: 1;
    min-width: 0;
}
@media (min-width: 1024px) {
    .bzl-portal-nav__primary { display: flex; }
}
.bzl-portal-nav__link {
    position: relative;
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 12px;
    font-family: var(--font-display, system-ui), system-ui, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--secondary-text, #52525b);
    text-decoration: none;
    border-radius: var(--radius-sm, 4px);
    transition: color var(--duration-fast, 150ms) ease,
                background var(--duration-fast, 150ms) ease;
}
.bzl-portal-nav__link::after {
    content: '';
    position: absolute;
    left: 12px; right: 12px; bottom: 6px;
    height: 1px;
    background: var(--primary-text, #18181b);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform var(--duration-base, 200ms) var(--ease-out, cubic-bezier(0.16,1,0.3,1));
}
.bzl-portal-nav__link:hover,
.bzl-portal-nav__link:focus-visible {
    color: var(--primary-text, #18181b);
    text-decoration: none;
    outline: none;
}
.bzl-portal-nav__link:hover::after,
.bzl-portal-nav__link:focus-visible::after,
.bzl-portal-nav__link.is-active::after {
    transform: scaleX(1);
}
.bzl-portal-nav__link.is-active {
    color: var(--primary-text, #18181b);
}

/* ── Profile (right side) ──────────────────────────────────────── */
.bzl-portal-nav__profile {
    position: relative;
    margin-left: auto;
    flex-shrink: 0;
}
.bzl-portal-nav__profile-trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 38px;
    padding: 0 12px 0 6px;
    background: transparent;
    border: 1px solid var(--border-color, #e4e4e7);
    border-radius: var(--radius-md, 8px);
    cursor: pointer;
    color: var(--primary-text, #18181b);
    font-family: var(--font-display, system-ui), system-ui, sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    transition: background var(--duration-fast, 150ms) ease,
                border-color var(--duration-fast, 150ms) ease;
}
.bzl-portal-nav__profile-trigger:hover,
.bzl-portal-nav__profile-trigger:focus-visible,
.bzl-portal-nav__profile-trigger[aria-expanded="true"] {
    background: var(--surface-2, #fafafa);
    border-color: var(--border-active, #18181b);
    outline: none;
}
.bzl-portal-nav__profile-avatar {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--border-color, #e4e4e7);
    background: var(--surface-2, #fafafa);
    flex-shrink: 0;
}
.bzl-portal-nav__profile-name {
    line-height: 1;
    white-space: nowrap;
}
@media (max-width: 639px) {
    .bzl-portal-nav__profile-name { display: none; }
    .bzl-portal-nav__profile-trigger { padding: 0 8px 0 4px; }
}
.bzl-portal-nav__profile-caret {
    font-size: 9px;
    opacity: 0.5;
    transition: transform var(--duration-fast, 150ms) ease;
}
.bzl-portal-nav__profile-trigger[aria-expanded="true"] .bzl-portal-nav__profile-caret {
    transform: rotate(180deg);
    opacity: 1;
}

/* ── Profile dropdown menu ─────────────────────────────────────── */
.bzl-portal-nav__profile-menu {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    width: 18rem;
    padding: 0;
    background: var(--surface-1, #ffffff);
    border: 1px solid var(--border-color, #e4e4e7);
    border-radius: var(--radius-md, 8px);
    box-shadow: var(--shadow-lg, 0 10px 15px -3px rgba(9,9,11,0.08), 0 4px 6px -4px rgba(9,9,11,0.04));
    overflow: hidden;
    z-index: 110;
    animation: bzl-portal-menu-in 160ms var(--ease-out, cubic-bezier(0.16,1,0.3,1)) both;
}
.bzl-portal-nav__profile-menu[hidden] { display: none; }

@keyframes bzl-portal-menu-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* User card */
.bzl-portal-nav__profile-card {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.125rem;
    background: var(--surface-2, #fafafa);
    border-bottom: 1px solid var(--border-subtle, #f4f4f5);
}
.bzl-portal-nav__profile-card-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--border-color, #e4e4e7);
    flex-shrink: 0;
}
.bzl-portal-nav__profile-card-meta { min-width: 0; flex: 1; }
.bzl-portal-nav__profile-card-name {
    font-family: var(--font-display, system-ui), system-ui, sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--primary-text, #18181b);
    letter-spacing: -0.01em;
    line-height: 1.2;
    margin-bottom: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bzl-portal-nav__profile-card-email {
    font-family: var(--font-mono, ui-monospace), ui-monospace, SFMono-Regular, monospace;
    font-size: 11px;
    color: var(--secondary-text, #52525b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Menu rows — extend bzl-menu-item from components.css */
.bzl-portal-nav__menu-item {
    /* bzl-menu-item provides padding/colour; override radius to 0 so the
       row sits flush against the rounded outer container. */
    border-radius: 0 !important;
    padding: 0.75rem 1.125rem !important;
    font-family: var(--font-display, system-ui), system-ui, sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--secondary-text, #52525b) !important;
}
.bzl-portal-nav__menu-icon {
    width: 14px;
    text-align: center;
    font-size: 11px;
    color: var(--tertiary-text, #a1a1aa);
    transition: color var(--duration-fast, 150ms) ease;
}
.bzl-portal-nav__menu-item:hover .bzl-portal-nav__menu-icon { color: var(--primary-text, #18181b); }
.bzl-portal-nav__menu-item--danger {
    color: var(--registry-red, #dc2626) !important;
}
.bzl-portal-nav__menu-item--danger .bzl-portal-nav__menu-icon { color: var(--registry-red, #dc2626); }
.bzl-portal-nav__menu-item--danger:hover {
    background: var(--registry-red-soft, #fee2e2) !important;
    color: var(--registry-red, #dc2626) !important;
}
.bzl-portal-nav__menu-badge {
    margin-left: auto;
    font-family: var(--font-display, system-ui), system-ui, sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--inverse-text, #fafafa);
    background: var(--accent, #18181b);
    padding: 2px 7px;
    border-radius: 999px;
    line-height: 1;
}

/* ================================================================
   0a. CLIENT HEADER — bzl-portal-drawer (≤1023px)
   ================================================================ */
.bzl-portal-drawer {
    position: fixed;
    inset: 0;
    z-index: 1200;
    pointer-events: none;
    visibility: hidden;
}
.bzl-portal-drawer.is-open {
    visibility: visible;
    pointer-events: auto;
}
.bzl-portal-drawer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(9, 9, 11, 0.45);
    opacity: 0;
    transition: opacity var(--duration-base, 200ms) ease;
}
.bzl-portal-drawer.is-open .bzl-portal-drawer__backdrop { opacity: 1; }

.bzl-portal-drawer__panel {
    position: absolute;
    top: 0; left: 0; bottom: 0;
    width: min(86vw, 320px);
    background: var(--surface-1, #ffffff);
    border-right: 1px solid var(--border-color, #e4e4e7);
    box-shadow: var(--shadow-xl, 0 20px 25px -5px rgba(9,9,11,0.1));
    transform: translateX(-100%);
    transition: transform var(--duration-base, 200ms) var(--ease-out, cubic-bezier(0.16,1,0.3,1));
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.bzl-portal-drawer.is-open .bzl-portal-drawer__panel {
    transform: translateX(0);
}

.bzl-portal-drawer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    border-bottom: 1px solid var(--border-subtle, #f4f4f5);
    flex-shrink: 0;
}
.bzl-portal-drawer__brand {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}
.bzl-portal-drawer__brand:hover { text-decoration: none; }
.bzl-portal-drawer__logo { height: 20px; width: auto; }
.bzl-portal-drawer__close {
    width: 32px;
    height: 32px;
    border: 1px solid var(--border-color, #e4e4e7);
    border-radius: var(--radius-md, 8px);
    background: transparent;
    color: var(--secondary-text, #52525b);
    cursor: pointer;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background var(--duration-fast, 150ms) ease,
                border-color var(--duration-fast, 150ms) ease;
}
.bzl-portal-drawer__close:hover,
.bzl-portal-drawer__close:focus-visible {
    background: var(--surface-2, #fafafa);
    border-color: var(--border-active, #18181b);
    color: var(--primary-text, #18181b);
    outline: none;
}

.bzl-portal-drawer__user {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-bottom: 1px solid var(--border-subtle, #f4f4f5);
    background: var(--surface-2, #fafafa);
    flex-shrink: 0;
}
.bzl-portal-drawer__user-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--border-color, #e4e4e7);
    flex-shrink: 0;
}
.bzl-portal-drawer__user-meta { min-width: 0; flex: 1; }
.bzl-portal-drawer__user-name {
    font-family: var(--font-display, system-ui), system-ui, sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--primary-text, #18181b);
    letter-spacing: -0.01em;
    line-height: 1.2;
    margin-bottom: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bzl-portal-drawer__user-email {
    font-family: var(--font-mono, ui-monospace), ui-monospace, SFMono-Regular, monospace;
    font-size: 11px;
    color: var(--secondary-text, #52525b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bzl-portal-drawer__nav,
.bzl-portal-drawer__footer {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0.5rem;
}
.bzl-portal-drawer__nav { flex: 1; overflow-y: auto; }
.bzl-portal-drawer__footer {
    border-top: 1px solid var(--border-subtle, #f4f4f5);
    flex-shrink: 0;
}
.bzl-portal-drawer__section-label {
    display: block;
    padding: 0.625rem 0.75rem 0.375rem;
    font-family: var(--font-display, system-ui), system-ui, sans-serif;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--tertiary-text, #a1a1aa);
}
.bzl-portal-drawer__link {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem;
    font-family: var(--font-display, system-ui), system-ui, sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--primary-text, #18181b);
    text-decoration: none;
    border-radius: var(--radius-sm, 4px);
    transition: background var(--duration-fast, 150ms) ease;
}
.bzl-portal-drawer__link:hover,
.bzl-portal-drawer__link:focus-visible {
    background: var(--surface-2, #fafafa);
    text-decoration: none;
    outline: none;
}
.bzl-portal-drawer__link.is-active {
    background: var(--surface-3, #f4f4f5);
    color: var(--primary-text, #18181b);
}
.bzl-portal-drawer__link-icon {
    width: 16px;
    text-align: center;
    color: var(--tertiary-text, #a1a1aa);
    font-size: 12px;
    flex-shrink: 0;
}
.bzl-portal-drawer__link--danger { color: var(--registry-red, #dc2626); }
.bzl-portal-drawer__link--danger .bzl-portal-drawer__link-icon { color: var(--registry-red, #dc2626); }
.bzl-portal-drawer__link--danger:hover {
    background: var(--registry-red-soft, #fee2e2);
    color: var(--registry-red, #dc2626);
}

/* Body scroll lock while drawer open */
html.is-drawer-open,
html.is-drawer-open body {
    overflow: hidden !important;
}

/* ================================================
   1. GLOBAL & TYPOGRAPHY
   ================================================ */
body {
    background-color: var(--body-bg) !important;
    font-family: var(--font-main) !important;
    color: var(--primary-text);
    line-height: var(--line-height);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .font-display { 
    font-family: var(--font-display) !important; 
    font-weight: 700 !important;
    letter-spacing: var(--tracking-tight) !important;
    color: var(--registry-black);
}

/* ================================================
   2. REGISTRY COMPONENTS
   ================================================ */

/* The Protocol Card */
.registry-card, .minimal-card {
    background: var(--component-bg);
    border: 1px solid var(--border-light);
    border-radius: var(--card-radius);
    padding: calc(var(--gap-unit) * 3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

.registry-card:hover, .minimal-card:hover { 
    border-color: var(--registry-black); 
    box-shadow: var(--shadow-registry-hover) !important; 
    transform: translateY(-2px); 
}

/* The Button Protocol */
.btn-protocol {
    background: var(--registry-black) !important;
    color: #ffffff !important;
    padding: 0.75rem 1.5rem;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--registry-black);
    border-radius: var(--btn-radius);
    text-decoration: none !important;
}

.btn-protocol:hover { 
    background: #ffffff !important; 
    color: var(--registry-black) !important; 
    box-shadow: 4px 4px 0px var(--registry-black);
}

/* Badge Protocol */
.badge-protocol {
    padding: 0.25rem 0.75rem;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    background: var(--registry-zinc-100);
    color: var(--registry-black);
    border: 1px solid var(--border-light);
}

/* Status Anchor (Left-side bar) */
.status-anchor {
    border-left-width: 6px !important;
}

/* ================================================
   3. DATA VISUALIZATION & FLOW
   ================================================ */

/* Progress Segment (Financial Health) */
.progress-segment {
    height: 2px;
    background: var(--border-light);
    position: relative;
    overflow: hidden;
}

.progress-segment-inner {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    background: var(--registry-black);
    transition: width 0.3s ease;
}

/* Custom Minimal Scrollbar */
.registry-scrollbar::-webkit-scrollbar {
    width: 4px;
}
.registry-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}
.registry-scrollbar::-webkit-scrollbar-thumb {
    background: var(--registry-zinc-200);
}
.registry-scrollbar::-webkit-scrollbar-thumb:hover {
    background: var(--registry-zinc-400);
}

/* ================================================
   4. CASE DETAILS — cd-* SYSTEM (mirrors admin)
   ================================================ */

.cd-page { padding: 24px; }

/* Command bar */
.cd-command-bar {
    background: #fff;
    border: 1px solid #e8ecf0;
    border-radius: 6px;
    padding: 18px 24px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}
.cd-command-bar .cd-title-block { flex: 1; min-width: 0; }
.cd-command-bar .cd-case-number {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #9ca3af;
    margin-bottom: 4px;
}
.cd-command-bar h2 {
    font-size: 20px;
    font-weight: 700 !important;
    margin: 0 0 4px !important;
    letter-spacing: normal !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #1f2937 !important;
}
.cd-command-bar .cd-court {
    font-size: 13px;
    color: #6b7280;
}
.cd-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Stats strip */
.cd-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 20px;
}
.cd-stat-card {
    background: #fff;
    border: 1px solid #e8ecf0;
    border-radius: 6px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.cd-stat-icon {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}
.cd-stat-icon.blue   { background: #eff6ff; color: #3b82f6; }
.cd-stat-icon.green  { background: #f0fdf4; color: #16a34a; }
.cd-stat-icon.amber  { background: #fffbeb; color: #d97706; }
.cd-stat-icon.gray   { background: #f9fafb; color: #6b7280; }
.cd-stat-icon.red    { background: #fef2f2; color: #dc2626; }
.cd-stat-val {
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    color: #111827;
    letter-spacing: normal !important;
    font-family: inherit !important;
}
.cd-stat-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #9ca3af;
    margin-top: 3px;
}

/* Two-column body */
.cd-body  { display: flex; align-items: flex-start; gap: 20px; }
.cd-main  { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.cd-rail  { flex: 0 0 290px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }

/* Card */
.cd-card { background: #fff; border: 1px solid #e8ecf0; border-radius: 6px; overflow: hidden; }
.cd-card-header {
    padding: 14px 20px;
    border-bottom: 1px solid #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cd-card-header h5 {
    font-size: 13px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: #374151 !important;
    text-transform: uppercase;
    letter-spacing: .05em !important;
    font-family: var(--font-display) !important;
}
.cd-card-body { padding: 20px; }

/* Info grid */
.cd-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 24px; }
.cd-info-item { display: flex; flex-direction: column; gap: 3px; }
.cd-info-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #9ca3af;
}
.cd-info-value { font-size: 13px; font-weight: 500; color: #1f2937; }

/* Timeline */
.cd-timeline { display: flex; flex-direction: column; }
.cd-tl-item  { display: flex; }
.cd-tl-gutter {
    flex: 0 0 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 3px;
}
.cd-tl-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #d1d5db;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px #d1d5db;
    flex-shrink: 0;
    z-index: 1;
}
.cd-tl-dot.success { background: #22c55e; box-shadow: 0 0 0 2px #bbf7d0; }
.cd-tl-dot.danger  { background: #ef4444; box-shadow: 0 0 0 2px #fecaca; }
.cd-tl-dot.warning { background: #f59e0b; box-shadow: 0 0 0 2px #fde68a; }
.cd-tl-dot.info    { background: #3b82f6; box-shadow: 0 0 0 2px #bfdbfe; }
.cd-tl-line { flex: 1; width: 2px; background: #e5e7eb; margin-top: 4px; }
.cd-tl-item:last-child .cd-tl-line { display: none; }
.cd-tl-content { flex: 1; padding: 0 0 20px 14px; }
.cd-tl-card {
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 12px 14px;
    background: #fafafa;
    transition: all 0.15s;
}
.cd-tl-card:hover { border-color: #d1d5db; background: #fff; }
.cd-tl-meta { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; flex-wrap: wrap; }
.cd-tl-date { font-size: 11px; font-weight: 700; color: #6b7280; text-transform: uppercase; letter-spacing: .05em; }
.cd-tl-time { font-size: 11px; color: #9ca3af; background: #f3f4f6; padding: 1px 6px; border-radius: 4px; }
.cd-tl-title  { font-size: 13px; font-weight: 600; color: #111827; margin-bottom: 4px; }
.cd-tl-desc   { font-size: 12px; color: #6b7280; line-height: 1.5; margin-bottom: 8px; }
.cd-tl-footer { display: flex; align-items: center; justify-content: space-between; }

/* Quick action list */
.cd-action-list { display: flex; flex-direction: column; gap: 8px; }

/* Disposal banner */
.cd-disposed-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 20px;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-left: 4px solid #6c757d;
    border-radius: 6px;
    margin-bottom: 20px;
}

/* Responsive */
@media (max-width: 1100px) {
    .cd-stats { grid-template-columns: repeat(2, 1fr); }
    .cd-body  { flex-direction: column; }
    .cd-rail  { flex: none; width: 100%; }
}
@media (max-width: 640px) {
    .cd-stats { grid-template-columns: 1fr 1fr; }
    .cd-command-bar { flex-direction: column; align-items: flex-start; }
    .cd-info-grid { grid-template-columns: 1fr; }
}

/* ================================================
   5. PAGE HEADER — BRUTAL MINIMAL STYLE
   (mirrors admin caseboard header pattern)
   ================================================ */

.btn-brutal-black {
    background: #000;
    color: #fff !important;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 1px solid #000;
    border-radius: 0.75rem;
    padding: 10px 20px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
    text-decoration: none;
    cursor: pointer;
}
.btn-brutal-black:hover,
.btn-brutal-black:focus {
    background: #fff;
    color: #000 !important;
    transform: translateY(-1px);
    text-decoration: none;
}

.btn-brutal-white {
    background: #fff;
    color: #000 !important;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    padding: 10px 20px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: border-color 0.15s ease, transform 0.15s ease;
    text-decoration: none;
    cursor: pointer;
}
.btn-brutal-white:hover,
.btn-brutal-white:focus {
    border-color: #000;
    color: #000 !important;
    transform: translateY(-1px);
    text-decoration: none;
}

/* ================================================
   6. LEGACY OVERRIDES
   ================================================ */
.panel_s, .soft-card { 
    border-radius: var(--card-radius) !important; 
    border: 1px solid var(--border-light) !important; 
    box-shadow: none !important; 
    background: var(--component-bg) !important; 
}

.table.dataTable thead th {
    font-family: var(--font-display) !important;
    text-transform: uppercase;
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    border-bottom: 1px solid var(--registry-black) !important;
}

/* ================================================
   7. ENHANCED UTILITIES & ANIMATIONS
   ================================================ */

/* Filter Pills — replaces btn-default btn-xs for list-page filters */
.cd-filter-pills {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}
.cd-filter-pill {
    padding: 5px 13px;
    border-radius: 20px;
    border: 1px solid #e8ecf0;
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    background: #fff;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    white-space: nowrap;
    font-family: var(--font-display, inherit);
    letter-spacing: 0.02em;
    line-height: 1;
}
.cd-filter-pill:hover {
    border-color: #c4c9d4;
    color: #374151;
    background: #f9fafb;
}
.cd-filter-pill.active {
    background: #111827;
    border-color: #111827;
    color: #fff;
}

/* Search input for filter bars */
.cd-search-input {
    border: 1px solid #e8ecf0;
    border-radius: 6px;
    font-size: 13px;
    outline: none;
    background: #fff;
    transition: border-color 0.15s;
    width: 100%;
}
.cd-search-input:focus { border-color: #374151; }

/* Stat card hover lift */
.cd-stat-card {
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.cd-stat-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
}

/* Extra stat icon colors */
.cd-stat-icon.purple { background: #f5f3ff; color: #7c3aed; }
.cd-stat-icon.indigo { background: #eef2ff; color: #4f46e5; }
.cd-stat-icon.cyan   { background: #ecfeff; color: #0891b2; }

/* Agreement / consultation card hover (load-card) */
.load-card {
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1),
                border-color 0.2s ease;
}
.load-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
    border-color: #d1d5db !important;
}

/* cd-card lift variant for clickable cards */
.cd-card-lift {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.cd-card-lift:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.07) !important;
}

/* Empty state block */
.cd-empty {
    text-align: center;
    padding: 48px 24px;
}
.cd-empty-icon {
    font-size: 36px;
    color: #d1d5db;
    margin-bottom: 14px;
    display: block;
}
.cd-empty-title {
    font-size: 15px;
    font-weight: 700;
    color: #374151;
    margin: 0 0 6px;
}
.cd-empty-text {
    font-size: 13px;
    color: #9ca3af;
    margin: 0 0 20px;
    max-width: 380px;
    margin-left: auto;
    margin-right: auto;
}

/* Alert strips (replaces ad-hoc inline alert styling) */
.cd-alert {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    border-radius: 6px;
    border: 1px solid transparent;
    margin-bottom: 8px;
    text-decoration: none !important;
    transition: opacity 0.15s;
    color: inherit;
}
.cd-alert:hover { opacity: 0.88; text-decoration: none !important; }
.cd-alert.warning { background: #fffbeb; border-color: #fde68a; border-left: 4px solid #d97706; }
.cd-alert.danger  { background: #fef2f2; border-color: #fecaca; border-left: 4px solid #dc2626; }
.cd-alert.info    { background: #eff6ff; border-color: #bfdbfe; border-left: 4px solid #3b82f6; }
.cd-alert-icon    { flex-shrink: 0; font-size: 13px; }
.cd-alert-text    { font-size: 13px; font-weight: 600; flex: 1; }
.cd-alert-arrow   { margin-left: auto; font-size: 11px; color: #9ca3af; }

/* Section header pair (list page headers without cd-command-bar) */
.cd-section-title {
    font-size: 22px;
    font-weight: 700;
    color: #111827;
    margin: 0 0 4px;
    font-family: var(--font-display, inherit);
    letter-spacing: -0.01em;
}
.cd-section-subtitle {
    font-size: 11px;
    font-weight: 700;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0;
}

/* Entry animations */
@keyframes cd-fade-up {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}
.cd-animate    { animation: cd-fade-up 0.3s ease both; }
.cd-animate-d1 { animation-delay: 0.06s; }
.cd-animate-d2 { animation-delay: 0.12s; }
.cd-animate-d3 { animation-delay: 0.18s; }
.cd-animate-d4 { animation-delay: 0.24s; }
.cd-animate-d5 { animation-delay: 0.30s; }

/* Consultation card — left-strip accent */
.consultation-card .cd-card {
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.consultation-card .cd-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
    transform: translateY(-1px);
}

/* ================================================
   8. CONSULTATION DETAIL PAGE — v2 Design
   ================================================ */

/* ── Hero Header ── */
.cd-detail-hero {
    background: #fff;
    border: 1px solid #e8ecf0;
    border-radius: 8px;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
    animation: cd-fade-up 0.3s ease both;
}
.cd-detail-hero::after {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: var(--cdh-accent, #111827);
    border-radius: 8px 0 0 8px;
}
.cd-detail-hero-inner {
    padding: 24px 28px 22px 32px;
    display: flex;
    align-items: flex-start;
    gap: 20px;
}
.cd-detail-hero-type-bg {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 68px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -0.03em;
    color: #f3f4f6;
    line-height: 1;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
    font-family: var(--font-display, inherit);
    z-index: 0;
}
.cd-detail-hero-inner { position: relative; z-index: 1; }
.cd-detail-hero-body { flex: 1; min-width: 0; }
.cd-detail-hero-eyebrow {
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: #9ca3af;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.cd-detail-hero-eyebrow .cd-detail-type-chip {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.cd-detail-hero h1 {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin: 0 0 8px !important;
    letter-spacing: -0.015em !important;
    font-family: var(--font-display, inherit) !important;
    line-height: 1.2 !important;
}
.cd-detail-hero-date {
    font-size: 13px;
    color: #6b7280;
    display: flex;
    align-items: center;
    gap: 6px;
}
.cd-detail-hero-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    flex-shrink: 0;
}

/* ── Meta strip ── */
.cd-meta-strip {
    display: flex;
    align-items: stretch;
    background: #fff;
    border: 1px solid #e8ecf0;
    border-radius: 8px;
    margin-bottom: 20px;
    overflow: hidden;
    animation: cd-fade-up 0.3s 0.06s ease both;
}
.cd-meta-item {
    flex: 1;
    padding: 14px 20px;
    border-right: 1px solid #f3f4f6;
    min-width: 0;
}
.cd-meta-item:last-child { border-right: none; }
.cd-meta-key {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: #9ca3af;
    margin-bottom: 5px;
}
.cd-meta-val {
    font-size: 13px;
    font-weight: 600;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Card lift on entry ── */
.cd-card-entry {
    animation: cd-fade-up 0.3s ease both;
}
.cd-card-entry:nth-child(1) { animation-delay: 0.10s; }
.cd-card-entry:nth-child(2) { animation-delay: 0.17s; }
.cd-card-entry:nth-child(3) { animation-delay: 0.24s; }
.cd-card-entry:nth-child(4) { animation-delay: 0.31s; }
.cd-card-entry:nth-child(5) { animation-delay: 0.38s; }

/* ── Meeting Notes ── */
.cd-notes-body {
    font-size: 13px;
    color: #374151;
    line-height: 1.8;
    padding: 16px 20px;
    border-left: 3px solid #e5e7eb;
    margin: 0;
    background: #fafafa;
    border-radius: 0 6px 6px 0;
}

/* ── File Attachment row ── */
.cd-file-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    border: 1px solid #e8ecf0;
    border-radius: 8px;
    background: #fafafa;
    transition: border-color 0.15s, background 0.15s;
    margin-bottom: 8px;
}
.cd-file-row:hover { border-color: #d1d5db; background: #fff; }
.cd-file-icon {
    width: 40px; height: 40px;
    border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}
.cd-file-icon.pdf  { background: #fef2f2; color: #dc2626; }
.cd-file-icon.doc  { background: #eff6ff; color: #3b82f6; }
.cd-file-icon.file { background: #f5f3ff; color: #7c3aed; }
.cd-file-meta { flex: 1; min-width: 0; }
.cd-file-name {
    font-size: 13px;
    font-weight: 600;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cd-file-sub { font-size: 11px; color: #9ca3af; margin-top: 2px; }
.cd-file-actions { display: flex; gap: 6px; flex-shrink: 0; }

/* ── Risk Score display ── */
.cd-risk-hero {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 20px 24px;
    border-radius: 8px;
    margin-bottom: 24px;
    border: 1px solid;
}
.cd-risk-number-wrap { flex-shrink: 0; text-align: center; }
.cd-risk-number {
    font-size: 52px;
    font-weight: 900;
    line-height: 1;
    font-family: var(--font-display, inherit);
    letter-spacing: -0.04em;
}
.cd-risk-of { font-size: 11px; font-weight: 700; color: #9ca3af; letter-spacing: .05em; }
.cd-risk-bar-track {
    height: 6px;
    background: rgba(0,0,0,0.08);
    border-radius: 3px;
    margin-top: 8px;
    overflow: hidden;
}
.cd-risk-bar-fill {
    height: 100%;
    border-radius: 3px;
    width: 0;
    transition: width 1s cubic-bezier(0.4, 0, 0.2, 1);
}
.cd-risk-text { flex: 1; }
.cd-risk-label-big {
    font-size: 15px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 4px;
}
.cd-risk-summary { font-size: 13px; line-height: 1.6; opacity: 0.85; }

/* ── Report Sections ── */
.cd-report-section {
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 12px;
    border: 1px solid;
}
.cd-report-section-head {
    padding: 10px 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .07em;
    cursor: pointer;
    user-select: none;
}
.cd-report-section-head .cd-rs-count {
    margin-left: auto;
    font-size: 10px;
    opacity: 0.65;
    font-weight: 700;
}
.cd-report-section-body { padding: 0 16px 14px; }
.cd-report-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(0,0,0,0.04);
    font-size: 13px;
    line-height: 1.6;
}
.cd-report-item:last-child { border-bottom: none; padding-bottom: 0; }
.cd-report-item-num {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: 800;
    margin-top: 1px;
}

/* Risk section colors */
.cd-rs-risk   { background: #fff5f5; border-color: #fecaca; }
.cd-rs-risk   .cd-report-section-head { background: #fef2f2; color: #991b1b; }
.cd-rs-risk   .cd-report-item-num { background: #fecaca; color: #991b1b; }
.cd-rs-risk   .cd-report-item { color: #7f1d1d; }

.cd-rs-clause { background: #fffdf5; border-color: #fde68a; }
.cd-rs-clause .cd-report-section-head { background: #fffbeb; color: #854d0e; }
.cd-rs-clause .cd-report-item-num { background: #fde68a; color: #854d0e; }
.cd-rs-clause .cd-report-item { color: #78350f; }

.cd-rs-recs   { background: #f0fdf6; border-color: #bbf7d0; }
.cd-rs-recs   .cd-report-section-head { background: #dcfce7; color: #15803d; }
.cd-rs-recs   .cd-report-item-num { background: #bbf7d0; color: #15803d; }
.cd-rs-recs   .cd-report-item { color: #14532d; }

/* Advocate notes callout */
.cd-advocate-notes {
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-left: 3px solid #d97706;
    border-radius: 6px;
    padding: 14px 18px;
    margin-top: 16px;
}
.cd-advocate-notes-head {
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #92400e;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.cd-advocate-notes-body {
    font-size: 13px;
    color: #374151;
    line-height: 1.7;
    white-space: pre-line;
}

/* ── Message Thread ── */
.cd-thread { display: flex; flex-direction: column; gap: 16px; }
.cd-thread-msg { display: flex; gap: 12px; align-items: flex-start; }
.cd-thread-avatar {
    width: 34px; height: 34px;
    border-radius: 50%;
    background: #111827;
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
    letter-spacing: .02em;
}
.cd-thread-content { flex: 1; min-width: 0; }
.cd-thread-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}
.cd-thread-name {
    font-size: 13px;
    font-weight: 700;
    color: #111827;
}
.cd-thread-role {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #fff;
    background: #374151;
    padding: 1px 6px;
    border-radius: 3px;
}
.cd-thread-time {
    font-size: 11px;
    color: #9ca3af;
    margin-left: auto;
}
.cd-thread-bubble {
    background: #f9fafb;
    border: 1px solid #e8ecf0;
    border-radius: 0 8px 8px 8px;
    padding: 12px 16px;
    font-size: 13px;
    color: #374151;
    line-height: 1.7;
}

/* ── Rail sidebar ── */
.cd-rail-section {
    background: #fff;
    border: 1px solid #e8ecf0;
    border-radius: 8px;
    overflow: hidden;
}
.cd-rail-section-head {
    padding: 12px 18px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: #9ca3af;
    border-bottom: 1px solid #f3f4f6;
    background: #fafafa;
}
.cd-rail-row {
    padding: 12px 18px;
    border-bottom: 1px solid #f3f4f6;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.cd-rail-row:last-child { border-bottom: none; }
.cd-rail-key {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #9ca3af;
}
.cd-rail-val {
    font-size: 13px;
    font-weight: 600;
    color: #111827;
}

/* report ready pill */
.cd-report-ready-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    background: #e0e7ff;
    color: #4338ca;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
}

@media (max-width: 1100px) {
    .cd-detail-hero-type-bg { display: none; }
    .cd-meta-strip { flex-wrap: wrap; }
    .cd-meta-item { flex: 0 0 50%; border-bottom: 1px solid #f3f4f6; }
    .cd-meta-item:nth-last-child(-n+2) { border-bottom: none; }
}
@media (max-width: 640px) {
    .cd-detail-hero-inner { flex-direction: column; gap: 12px; }
    .cd-detail-hero-actions { flex-direction: row; align-items: center; }
    .cd-meta-item { flex: 0 0 100%; }
    .cd-risk-hero { flex-direction: column; text-align: center; }
}