/* ============================================================
   EHR Mirror — Data browser styling (cross-cutting / shared)
   Conceptual neighbor: shared shell for every EHR mirror page.
   Loaded by: templates/base/bundles/css.html (always).
   Defines the --ehr-* design tokens consumed by every sibling
   stylesheet (financial / insurance / clinical / nav / imports),
   plus the chip strip, toolbar, calendar shell and the per-page
   layout primitives shared by clinic / location / provider /
   patient / appointment list+detail templates.
   ============================================================ */

:root {
    --ehr-radius:        1rem;
    --ehr-radius-sm:     0.625rem;
    --ehr-radius-pill:   999px;
    --ehr-border:        rgba(15, 23, 42, 0.07);
    --ehr-border-strong: rgba(15, 23, 42, 0.12);
    --ehr-shadow-sm:     0 1px 2px rgba(15, 23, 42, 0.04);
    --ehr-shadow-md:     0 6px 18px rgba(15, 23, 42, 0.07);
    --ehr-shadow-lg:     0 14px 32px rgba(15, 23, 42, 0.09);
    --ehr-bg:            #ffffff;
    --ehr-bg-soft:       #f8fafc;
    --ehr-bg-muted:      #f1f5f9;
    --ehr-text:          var(--bs-heading-color, #0f172a);
    --ehr-text-sub:      #475569;
    --ehr-text-muted:    #94a3b8;
    --ehr-primary:       #0069a6;
    --ehr-primary-soft:  rgba(0, 105, 166, 0.10);
    --ehr-info:          #0891b2;
    --ehr-success:       #16a34a;
    --ehr-warning:       #d97706;
    --ehr-danger:        #dc2626;
    --ehr-chip-bg:       #ffffff;
    --ehr-chip-border:   rgba(15, 23, 42, 0.10);
    --ehr-chip-active:   var(--ehr-primary);
}

[data-bs-theme="dark"], [data-theme="dark"] {
    --ehr-border:        rgba(148, 163, 184, 0.12);
    --ehr-border-strong: rgba(148, 163, 184, 0.20);
    --ehr-shadow-sm:     0 1px 2px rgba(0, 0, 0, 0.30);
    --ehr-shadow-md:     0 6px 18px rgba(0, 0, 0, 0.35);
    --ehr-shadow-lg:     0 14px 32px rgba(0, 0, 0, 0.45);
    --ehr-bg:            #1e293b;
    --ehr-bg-soft:       #0f172a;
    --ehr-bg-muted:      #1e293b;
    --ehr-text:          #e2e8f0;
    --ehr-text-sub:      #cbd5e1;
    --ehr-text-muted:    #94a3b8;
    --ehr-primary:       #4ea7d8;
    --ehr-primary-soft:  rgba(78, 167, 216, 0.18);
    --ehr-chip-bg:       #1e293b;
    --ehr-chip-border:   rgba(148, 163, 184, 0.20);
}

/* ── Chip strip (clinic switcher + filter rows) ───────────── */
.ehr-chip-strip,
.ehr-chip-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.25rem;
    margin-bottom: 0.5rem;
}

.ehr-chip-strip {
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-sm);
    padding: 0.55rem 0.75rem;
    margin-bottom: 1rem;
    box-shadow: var(--ehr-shadow-sm);
}

.ehr-chip-strip-label,
.ehr-chip-row__label {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ehr-text-sub);
    margin-right: 0.35rem;
}

.ehr-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.32rem 0.7rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ehr-text);
    background: var(--ehr-chip-bg);
    border: 1px solid var(--ehr-chip-border);
    border-radius: var(--ehr-radius-pill);
    text-decoration: none;
    line-height: 1.2;
    transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease, transform 120ms ease;
    white-space: nowrap;
}

.ehr-chip:hover {
    color: var(--ehr-text);
    border-color: var(--ehr-border-strong);
    background: var(--ehr-bg-soft);
    transform: translateY(-1px);
}

.ehr-chip.is-active {
    color: #fff;
    background: var(--ehr-chip-active);
    border-color: var(--ehr-chip-active);
}

.ehr-chip.is-active:hover {
    color: #fff;
    background: var(--ehr-chip-active);
    transform: none;
}

.ehr-chip i {
    font-size: 0.9em;
    opacity: 0.85;
}

.ehr-chip-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.1rem;
    height: 1.1rem;
    padding: 0 0.4rem;
    margin-left: 0.25rem;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ehr-text-sub);
    background: var(--ehr-bg-muted);
    border-radius: var(--ehr-radius-pill);
}

.ehr-chip.is-active .ehr-chip-count {
    color: var(--ehr-chip-active);
    background: #fff;
}

/* Per-flavor accents */
.ehr-chip--clinic.is-active   { background: #0069a6; border-color: #0069a6; }
.ehr-chip--taxonomy.is-active { background: #0891b2; border-color: #0891b2; }
.ehr-chip--location.is-active { background: #7c3aed; border-color: #7c3aed; }
.ehr-chip--status.is-active   { background: #16a34a; border-color: #16a34a; }

/* ── Toolbar (search + density toggle row) ───────────────── */
.ehr-toolbar {
    border: 1px solid var(--ehr-border) !important;
    border-radius: var(--ehr-radius-sm) !important;
    box-shadow: var(--ehr-shadow-sm);
}

.ehr-toolbar .input-group-text {
    border-color: var(--ehr-border-strong);
    color: var(--ehr-text-muted);
}

.ehr-toolbar__density .btn.active {
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
    border-color: var(--ehr-primary);
}

/* ── Clinic grid + cards ─────────────────────────────────── */
.ehr-clinic-card {
    display: flex;
    flex-direction: column;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border) !important;
    border-radius: 1.125rem !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03),
                0 6px 14px -8px rgba(15, 23, 42, 0.05);
    overflow: hidden;
    position: relative;
    transition: transform 240ms cubic-bezier(.2,.8,.2,1),
                box-shadow 240ms ease,
                border-color 240ms ease;
}

.ehr-clinic-card:hover {
    transform: translateY(-3px);
    border-color: rgba(99, 102, 241, 0.22) !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04),
                0 16px 32px -14px rgba(99, 102, 241, 0.20);
}

.ehr-clinic-card .stretched-link::after {
    border-radius: var(--ehr-radius);
}

.ehr-clinic-card__header {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.95rem;
    padding: 1.2rem 1.25rem 1.05rem;
    background:
        radial-gradient(280px 120px at 0% 0%, rgba(99, 102, 241, 0.06) 0%, transparent 70%),
        linear-gradient(180deg, #fafbff 0%, #ffffff 100%);
}
.ehr-clinic-card__header::after {
    content: '';
    position: absolute;
    left: 1.25rem;
    right: 1.25rem;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(15, 23, 42, 0.06), transparent);
}

.ehr-clinic-card__avatar {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 0.875rem;
    background: linear-gradient(135deg, #38bdf8 0%, #6366f1 100%);
    color: #ffffff;
    font-size: 1.2rem;
    box-shadow: 0 8px 18px -6px rgba(99, 102, 241, 0.40),
                inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.ehr-clinic-card__title-wrap {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.ehr-clinic-card__title {
    margin: 0;
    color: var(--ehr-text);
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.018em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ehr-clinic-card__title a {
    color: inherit;
    text-decoration: none;
}

.ehr-clinic-card__org {
    align-self: flex-start;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.15rem 0.55rem;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-pill);
    color: var(--ehr-text-sub);
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ehr-clinic-card__org i {
    color: var(--ehr-text-muted);
    font-size: 0.72rem;
}

.ehr-clinic-card__body {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 1rem 1.15rem 0.85rem;
}

/* Stat tile row — three equal columns of primary metrics, each owning a
   soft pastel surface so the eye separates them by hue, not by border. */
.ehr-clinic-card__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

.ehr-stat-tile {
    --tile-color: #6366f1;
    --tile-soft:  rgba(99, 102, 241, 0.10);
    --tile-tint:  rgba(99, 102, 241, 0.05);
    --tile-edge:  rgba(99, 102, 241, 0.14);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    padding: 0.95rem 0.55rem 0.85rem;
    background: var(--tile-tint);
    border: 1px solid var(--tile-edge);
    border-radius: 0.875rem;
    text-align: center;
    min-width: 0;
    transition: border-color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}

.ehr-clinic-card:hover .ehr-stat-tile {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px -6px var(--tile-edge);
}

.ehr-stat-tile__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 0.625rem;
    background: var(--tile-soft);
    color: var(--tile-color);
    font-size: 0.92rem;
}

.ehr-stat-tile__value {
    color: var(--ehr-text);
    font-weight: 800;
    font-size: 1.375rem;
    line-height: 1;
    letter-spacing: -0.028em;
    font-variant-numeric: tabular-nums;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ehr-stat-tile__label {
    color: var(--ehr-text-sub);
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1.15;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.ehr-stat-tile__sub {
    margin-top: 0.05rem;
    color: var(--ehr-success);
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Per-tile pastel: sky / mint / peach. Each defines its own soft chip,
   tile tint, and border edge — pick from the same hue family so the
   trio reads as a unified palette, not three separate UIs. */
.ehr-stat-tile--locations {
    --tile-color: #0284c7;
    --tile-soft:  rgba(14, 165, 233, 0.14);
    --tile-tint:  rgba(14, 165, 233, 0.05);
    --tile-edge:  rgba(14, 165, 233, 0.18);
}
.ehr-stat-tile--providers {
    --tile-color: #059669;
    --tile-soft:  rgba(16, 185, 129, 0.14);
    --tile-tint:  rgba(16, 185, 129, 0.05);
    --tile-edge:  rgba(16, 185, 129, 0.18);
}
.ehr-stat-tile--patients {
    --tile-color: #d97706;
    --tile-soft:  rgba(245, 158, 11, 0.16);
    --tile-tint:  rgba(245, 158, 11, 0.06);
    --tile-edge:  rgba(245, 158, 11, 0.20);
}

/* Cities row */
.ehr-clinic-card__cities {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem;
    color: var(--ehr-text-sub);
    font-size: 0.78rem;
    line-height: 1.35;
}

.ehr-clinic-card__cities-icon {
    color: var(--ehr-text-muted);
    margin-right: 0.2rem;
    font-size: 0.78rem;
}

.ehr-clinic-card__city       { color: var(--ehr-text-sub); }
.ehr-clinic-card__city-sep   { color: var(--ehr-text-muted); margin: 0 0.1rem; }
.ehr-clinic-card__city-more  { color: var(--ehr-text-muted); font-style: italic; }
.ehr-clinic-card__city-empty { color: var(--ehr-text-muted); font-style: italic; }

.ehr-clinic-card__footer {
    margin-top: auto;
    padding: 0.85rem 1.25rem 1rem;
    background: linear-gradient(180deg, transparent 0%, rgba(241, 245, 249, 0.5) 100%);
    position: relative;
}
.ehr-clinic-card__footer::before {
    content: '';
    position: absolute;
    left: 1.25rem;
    right: 1.25rem;
    top: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(15, 23, 42, 0.06), transparent);
}

.ehr-clinic-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #6366f1;
    font-size: 0.8rem;
    font-weight: 700;
    transition: gap 220ms ease;
}

.ehr-clinic-card:hover .ehr-clinic-card__cta {
    gap: 0.55rem;
}

/* ── Location section header (per-clinic group) ──────────── */
.ehr-loc-section {
    margin-bottom: 1.75rem;
}

.ehr-loc-section__head {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.9rem;
    padding: 0 0.15rem;
}

.ehr-loc-section__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 0.55rem;
    background: linear-gradient(135deg, var(--ehr-primary) 0%, var(--ehr-info) 100%);
    color: #ffffff;
    font-size: 0.82rem;
    box-shadow: 0 4px 10px rgba(0, 105, 166, 0.18);
}

.ehr-loc-section__title {
    margin: 0;
    color: var(--ehr-text);
    font-size: 0.98rem;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.ehr-loc-section__count {
    margin-left: auto;
    padding: 0.18rem 0.65rem;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-pill);
    color: var(--ehr-text-sub);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ── Location grid + cards ───────────────────────────────────────────
   2027-modern, milky-soft card. Generous whitespace, gentle radial
   tint on the header (no harsh gradient stripe), pillowy shadow,
   subtle border that lifts only on hover. The location's name
   already conveys clinic affiliation, so no separate clinic ribbon
   is rendered — keeping the surface uncluttered. */
.ehr-loc-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background:
        radial-gradient(140% 90% at 100% 0%, rgba(8, 145, 178, 0.025) 0%, transparent 55%),
        linear-gradient(180deg, #ffffff 0%, #fdfdfd 100%);
    border: 1px solid var(--ehr-border) !important;
    border-radius: 1.25rem !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03),
                0 6px 16px -8px rgba(15, 23, 42, 0.05);
    overflow: hidden;
    position: relative;
    transition: transform 280ms cubic-bezier(.2,.8,.2,1),
                box-shadow 280ms ease,
                border-color 280ms ease;
}

.ehr-loc-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 105, 166, 0.22) !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04),
                0 18px 36px -16px rgba(0, 105, 166, 0.18);
}

.ehr-loc-card .stretched-link::after {
    border-radius: 1.25rem;
}

/* Header band — soft milky tint, no border separator. The visual break
   from body now comes from whitespace + a faint inner gradient instead
   of a hard line, which makes the card feel more pillowy. */
.ehr-loc-card__header {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.35rem 1.4rem 1.15rem;
    background:
        radial-gradient(280px 100px at 0% 0%, rgba(0, 105, 166, 0.05) 0%, transparent 75%);
    position: relative;
}
.ehr-loc-card__header::after {
    content: '';
    position: absolute;
    left: 1.4rem;
    right: 1.4rem;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--ehr-border), transparent);
}

/* Avatar — softer corner, gentler shadow, slightly larger. */
.ehr-loc-card__avatar {
    position: relative;
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    border-radius: 1rem;
    background: linear-gradient(135deg, #38bdf8 0%, #6366f1 100%);
    color: #ffffff;
    box-shadow: 0 10px 24px -8px rgba(99, 102, 241, 0.36),
                inset 0 1px 0 rgba(255, 255, 255, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.ehr-loc-card__avatar-initial {
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: -0.028em;
    line-height: 1;
}
.ehr-loc-card__avatar-pin {
    position: absolute;
    bottom: -5px;
    right: -5px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid #ffffff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.12);
    color: #6366f1;
    font-size: 0.65rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ehr-loc-card__title-wrap {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 0.15rem;
}

.ehr-loc-card__title {
    margin: 0;
    color: var(--ehr-text);
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.022em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ehr-loc-card__title a {
    color: inherit;
    text-decoration: none;
}

.ehr-loc-card__subline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
}

.ehr-loc-card__status,
.ehr-loc-card__mode,
.ehr-loc-card__city {
    display: inline-flex;
    align-items: center;
    gap: 0.36rem;
    padding: 0.22rem 0.6rem;
    border-radius: var(--ehr-radius-pill);
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.01em;
}

.ehr-loc-card__status i,
.ehr-loc-card__mode i,
.ehr-loc-card__city i {
    font-size: 0.68rem;
    opacity: 0.85;
}

.ehr-loc-card__status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.18);
}

.ehr-loc-card__status--active {
    background: rgba(16, 185, 129, 0.12);
    color: #059669;
}

.ehr-loc-card__status--inactive {
    background: rgba(244, 63, 94, 0.10);
    color: #e11d48;
}

.ehr-loc-card__mode {
    background: rgba(148, 163, 184, 0.10);
    color: #475569;
    text-transform: capitalize;
}

.ehr-loc-card__city {
    background: rgba(99, 102, 241, 0.10);
    color: #6366f1;
    text-transform: none;
    font-weight: 600;
}

.ehr-loc-card__body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 1.05rem;
    padding: 1.2rem 1.4rem 1.1rem;
}

/* Stat strip — three vertical tiles. Soft cream tiles with subtle
   inner gradient so they recede into the milky body rather than
   reading as borders-on-borders. Vertical layout keeps labels
   readable at narrow xl-4 widths (~85px tile). */
.ehr-loc-card__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
    margin: 0;
    padding: 0;
}
.ehr-loc-card__stat {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.8rem 0.85rem;
    border-radius: 0.875rem;
    background: rgba(248, 250, 252, 0.65);
    border: 1px solid rgba(15, 23, 42, 0.05);
    min-width: 0;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.ehr-loc-card__stat:hover {
    border-color: rgba(99, 102, 241, 0.18);
    transform: translateY(-1px);
    box-shadow: 0 6px 16px -8px rgba(99, 102, 241, 0.18);
}
.ehr-loc-card__stat-icon {
    width: 28px;
    height: 28px;
    border-radius: 0.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.82rem;
    flex-shrink: 0;
    margin: 0;
}
.ehr-loc-card__stat-icon--provider { background: rgba(14, 165, 233, 0.12); color: #0284c7; }
.ehr-loc-card__stat-icon--patient  { background: rgba(16, 185, 129, 0.14); color: #059669; }
.ehr-loc-card__stat-icon--room     { background: rgba(245, 158, 11, 0.16); color: #d97706; }
.ehr-loc-card__stat-body {
    display: flex;
    align-items: baseline;
    gap: 0.3rem;
    line-height: 1.05;
    min-width: 0;
    margin: 0;
    width: 100%;
}
.ehr-loc-card__stat-value {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--ehr-text);
    letter-spacing: -0.028em;
    font-variant-numeric: tabular-nums;
}
.ehr-loc-card__stat-label {
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
    color: var(--ehr-text-muted);
    line-height: 1.1;
    word-break: break-word;
    flex: 1 1 auto;
}

.ehr-loc-card__address {
    color: var(--ehr-text-sub);
    font-size: 0.82rem;
    line-height: 1.5;
}

.ehr-loc-card__addr-line1 {
    color: var(--ehr-text);
    font-weight: 600;
    display: inline-flex;
    align-items: flex-start;
    gap: 0.4rem;
}
.ehr-loc-card__addr-line1 i {
    color: #6366f1;
    font-size: 0.85rem;
    margin-top: 2px;
    flex-shrink: 0;
}

.ehr-loc-card__addr-line2 {
    color: var(--ehr-text-sub);
    padding-left: 1.25rem;
}

.ehr-loc-card__addr-empty {
    color: var(--ehr-text-muted);
    font-style: italic;
}

.ehr-loc-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.85rem;
    color: var(--ehr-text-sub);
    font-size: 0.76rem;
}

.ehr-loc-card__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--ehr-text-sub);
    text-decoration: none;
}

.ehr-loc-card__meta-item i {
    color: #6366f1;
    font-size: 0.78rem;
}

.ehr-loc-card__meta-item--link {
    position: relative;
    z-index: 2;
    font-weight: 600;
    color: var(--ehr-text);
}
.ehr-loc-card__meta-item--link:hover { color: var(--ehr-primary); }

.ehr-loc-card__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.ehr-loc-card__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.22rem 0.65rem;
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1.3;
    border-radius: var(--ehr-radius-pill);
    border: 1px solid transparent;
}

.ehr-loc-card__chip i {
    font-size: 0.7rem;
}

.ehr-loc-card__chip--tax {
    background: rgba(124, 58, 237, 0.10);
    color: #7c3aed;
    border-color: rgba(124, 58, 237, 0.18);
}

.ehr-loc-card__chip--more {
    background: var(--ehr-bg-soft);
    border-color: var(--ehr-border);
    color: var(--ehr-text-muted);
    font-style: italic;
}

/* Footer — softer separator (faded gradient line, not a hard border)
   and a milky tint that fades from card body to a slightly cooler
   bottom edge. Reads as "this card is one continuous surface" instead
   of "header + body + footer stacked as 3 zones". */
.ehr-loc-card__footer {
    margin-top: auto;
    padding: 0.95rem 1.4rem 1.1rem;
    background: linear-gradient(180deg, transparent 0%, rgba(241, 245, 249, 0.5) 100%);
    position: relative;
}
.ehr-loc-card__footer::before {
    content: '';
    position: absolute;
    left: 1.4rem;
    right: 1.4rem;
    top: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--ehr-border), transparent);
}

.ehr-loc-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #6366f1;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.005em;
    transition: gap 220ms ease;
}
.ehr-loc-card__cta i { font-size: 0.85rem; }
.ehr-loc-card__cta-arrow { transition: transform 220ms ease; }

.ehr-loc-card:hover .ehr-loc-card__cta {
    gap: 0.65rem;
}
.ehr-loc-card:hover .ehr-loc-card__cta-arrow {
    transform: translateX(2px);
}

/* Compact stat strip on small cards / narrow viewports. */
@media (max-width: 575.98px) {
    .ehr-loc-card__stats { gap: 0.4rem; }
    .ehr-loc-card__stat  { padding: 0.55rem 0.55rem; gap: 0.35rem; }
    .ehr-loc-card__stat-icon { width: 24px; height: 24px; font-size: 0.72rem; }
    .ehr-loc-card__stat-value { font-size: 1rem; }
    .ehr-loc-card__stat-label { font-size: 0.62rem; }
}

/* Dark-mode safety net for the milky-cream body + cream stat tiles. */
[data-bs-theme="dark"] .ehr-loc-card,
[data-theme="dark"] .ehr-loc-card {
    background:
        radial-gradient(140% 90% at 100% 0%, rgba(78, 167, 216, 0.05) 0%, transparent 55%),
        linear-gradient(180deg, #1a2333 0%, #161e2c 100%);
}
[data-bs-theme="dark"] .ehr-loc-card__stat,
[data-theme="dark"] .ehr-loc-card__stat {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.025) 0%, rgba(255, 255, 255, 0.01) 100%);
    border-color: rgba(148, 163, 184, 0.10);
}
[data-bs-theme="dark"] .ehr-loc-card__avatar-pin,
[data-theme="dark"] .ehr-loc-card__avatar-pin {
    background: #1a2333;
    border-color: #1a2333;
}
[data-bs-theme="dark"] .ehr-loc-card__footer,
[data-theme="dark"] .ehr-loc-card__footer {
    background: linear-gradient(180deg, transparent 0%, rgba(15, 23, 42, 0.40) 100%);
}

/* ── Location list: 2027-modern unified toolbar ─────────────────────
   One row, four zones: scope chip · search (flex) · filter pills ·
   density segmented control. Wraps on tablets/mobile. The embedded
   clinic switcher is restyled inside this scope to feel like a peer
   of the other controls, not a card-within-a-card. */
.ehr-loc-toolbar {
    padding: .65rem .75rem;
    border-radius: 14px;
}
.ehr-loc-toolbar__row {
    align-items: center;
    gap: .6rem;
    flex-wrap: wrap;
}
.ehr-loc-toolbar__scope {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    min-width: 0;
}
.ehr-loc-toolbar__search {
    flex: 1 1 280px;
    min-width: 220px;
}
.ehr-loc-toolbar__filters {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    flex-shrink: 0;
}
.ehr-loc-toolbar__dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--ehr-text-muted);
    box-shadow: 0 0 0 3px var(--ehr-bg-muted);
    flex-shrink: 0;
}
.ehr-loc-toolbar__filters .cdir-toolbar-btn.is-active .ehr-loc-toolbar__dot {
    background: var(--ehr-primary);
    box-shadow: 0 0 0 3px var(--ehr-primary-soft);
}

/* Segmented control for grid/list view. Linear/Vercel-style — single
   pill divided into two icon buttons sharing a border, with a subtle
   active fill. Visually distinct from the status filter pills so the
   two adjacent groups don't read as one undifferentiated cluster. */
.ehr-loc-toolbar__density {
    display: inline-flex;
    align-items: center;
    background: var(--ehr-bg-soft);
    border: 1px solid var(--ehr-border);
    border-radius: 999px;
    padding: 2px;
    flex-shrink: 0;
    margin-left: .35rem;
    position: relative;
}
.ehr-loc-toolbar__density::before {
    content: '';
    position: absolute;
    left: -.4rem;
    top: 25%;
    bottom: 25%;
    width: 1px;
    background: var(--ehr-border);
}
.ehr-loc-toolbar__density-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 30px;
    border-radius: 999px;
    color: var(--ehr-text-muted);
    text-decoration: none;
    transition: color .15s ease, background .15s ease, transform .15s ease;
}
.ehr-loc-toolbar__density-btn:hover {
    color: var(--ehr-text);
    background: var(--ehr-bg);
}
.ehr-loc-toolbar__density-btn.is-active {
    color: var(--ehr-primary);
    background: var(--ehr-bg);
    box-shadow: var(--ehr-shadow-sm);
}
.ehr-loc-toolbar__density-btn i { font-size: .9rem; }

/* ── Embedded clinic switcher (override defaults inside this toolbar) ──
   The standalone switcher is a centered ceremonial bar with eyebrow +
   trail. Inside the unified toolbar, that ceremony is noise — the
   surrounding row already declares "this is a filter bar". So:
     • Hide the eyebrow lead (the dot + "CLINIC" label).
     • Drop the centered margin so the trigger sits flush left.
     • Slim the trigger height to match search input.
     • Reduce the trigger's internal "Active clinic" label to a tiny
       prefix so the clinic name carries the visual weight.
     • Render the trail (Hub + clear) as icon-only neighbors. */
.ehr-loc-toolbar .ehr-clinic-switcher--embedded {
    flex: 0 0 auto;
    gap: .35rem;
}
.ehr-loc-toolbar .ehr-clinic-switcher__lead { display: none; }
.ehr-loc-toolbar .ehr-clinic-switcher__dropdown {
    flex: 0 0 auto;
    margin: 0;
    --ehr-clinic-trigger-max: 360px;
    min-width: 240px;
}
.ehr-loc-toolbar .ehr-clinic-switcher__trigger {
    padding: 0.25rem 0.5rem 0.25rem 0.35rem;
    height: 38px;
    min-width: 240px;
    border-radius: 999px;
    background: var(--ehr-bg-soft);
    border-color: var(--ehr-border);
}
.ehr-loc-toolbar .ehr-clinic-switcher__trigger:hover {
    background: var(--ehr-bg);
    transform: none;
}
.ehr-loc-toolbar .ehr-clinic-switcher__avatar {
    width: 1.6rem;
    height: 1.6rem;
    font-size: 0.78rem;
}
.ehr-loc-toolbar .ehr-clinic-switcher__label { display: none; }
.ehr-loc-toolbar .ehr-clinic-switcher__name {
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.1;
}
.ehr-loc-toolbar .ehr-clinic-switcher__meta { gap: .3rem; }
.ehr-loc-toolbar .ehr-clinic-switcher__count {
    min-width: 1.3rem;
    height: 1.3rem;
    font-size: 0.65rem;
    padding: 0 0.4rem;
}
.ehr-loc-toolbar .ehr-clinic-switcher__chevron {
    width: 1.2rem;
    height: 1.2rem;
}
.ehr-loc-toolbar .ehr-clinic-switcher__chevron i { font-size: .7rem; }

/* Hub + clear become icon-only neighbors of the chip. */
.ehr-loc-toolbar .ehr-clinic-switcher__trail {
    gap: .25rem;
}
.ehr-loc-toolbar .ehr-clinic-switcher__hub {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 999px;
    color: var(--ehr-primary);
    background: var(--ehr-primary-soft);
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.ehr-loc-toolbar .ehr-clinic-switcher__hub:hover {
    background: var(--ehr-primary);
    color: #fff;
}
.ehr-loc-toolbar .ehr-clinic-switcher__hub span { display: none; }
.ehr-loc-toolbar .ehr-clinic-switcher__hub i { font-size: .85rem; }
.ehr-loc-toolbar .ehr-clinic-switcher__clear {
    width: 32px; height: 32px;
    border-radius: 999px;
    color: var(--ehr-text-muted);
    background: transparent;
    border: 1px solid var(--ehr-border);
    transition: color .15s ease, background .15s ease, border-color .15s ease;
}
.ehr-loc-toolbar .ehr-clinic-switcher__clear:hover {
    color: var(--ehr-danger, #dc2626);
    border-color: rgba(220, 38, 38, 0.30);
    background: rgba(220, 38, 38, 0.06);
}
.ehr-loc-toolbar .ehr-clinic-switcher__hint {
    font-size: 0.72rem;
    color: var(--ehr-text-muted);
    padding: 0 .25rem;
}

/* Narrow-viewport gracefulness — let everything wrap, keep search wide. */
@media (max-width: 767.98px) {
    .ehr-loc-toolbar__search { flex-basis: 100%; order: 2; }
    .ehr-loc-toolbar__scope { order: 1; }
    .ehr-loc-status-dd { order: 3; }
    .ehr-loc-toolbar__density { order: 4; margin-left: auto; }
    .ehr-loc-toolbar__density::before { display: none; }
}

/* ── Status filter dropdown — Linear/Notion-style segmented selector
   replacing the three pill buttons. Single trigger shows the active
   state name + count + chevron; menu opens with three options each
   showing icon, label, sub-line, count, and a check on the active
   row. Tonal trigger background reflects the active filter so the
   overall toolbar instantly conveys which slice is being viewed. */
.ehr-loc-status-dd { flex-shrink: 0; }
.ehr-loc-status-dd__trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 38px;
    padding: 0 0.85rem 0 0.65rem;
    border-radius: 999px;
    border: 1px solid var(--ehr-border);
    background: var(--ehr-bg);
    color: var(--ehr-text);
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .15s ease;
    white-space: nowrap;
}
.ehr-loc-status-dd__trigger:hover {
    border-color: var(--ehr-primary);
    box-shadow: 0 4px 12px rgba(0, 105, 166, 0.10);
}
.ehr-loc-status-dd__trigger[aria-expanded="true"] {
    border-color: var(--ehr-primary);
    box-shadow: 0 0 0 4px var(--ehr-primary-soft);
    transform: none;
}
.ehr-loc-status-dd__trigger-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    flex-shrink: 0;
}
.ehr-loc-status-dd__trigger-icon i { font-size: 0.95rem; }
.ehr-loc-status-dd__trigger-icon .ehr-loc-toolbar__dot {
    width: 9px; height: 9px;
}
.ehr-loc-status-dd__trigger-label { letter-spacing: -0.005em; }
.ehr-loc-status-dd__trigger-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.4rem;
    height: 1.4rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    background: var(--ehr-bg-muted);
    color: var(--ehr-text-sub);
    font-size: 0.7rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.ehr-loc-status-dd__trigger-chev {
    font-size: 0.7rem;
    color: var(--ehr-text-muted);
    transition: transform .2s ease;
}
.ehr-loc-status-dd__trigger[aria-expanded="true"] .ehr-loc-status-dd__trigger-chev {
    transform: rotate(180deg);
    color: var(--ehr-primary);
}

/* Tonal active-state on the trigger so the toolbar reflects the slice. */
.ehr-loc-status-dd__trigger--active {
    border-color: rgba(22, 163, 74, 0.30);
    background: rgba(22, 163, 74, 0.08);
    color: var(--ehr-success);
}
.ehr-loc-status-dd__trigger--active .ehr-loc-status-dd__trigger-count {
    background: rgba(22, 163, 74, 0.15);
    color: var(--ehr-success);
}
.ehr-loc-status-dd__trigger--inactive {
    border-color: rgba(220, 38, 38, 0.30);
    background: rgba(220, 38, 38, 0.06);
    color: var(--ehr-danger, #dc2626);
}
.ehr-loc-status-dd__trigger--inactive .ehr-loc-status-dd__trigger-count {
    background: rgba(220, 38, 38, 0.12);
    color: var(--ehr-danger, #dc2626);
}
.ehr-loc-status-dd__trigger--all .ehr-loc-status-dd__trigger-icon .ehr-loc-toolbar__dot {
    background: var(--ehr-primary);
    box-shadow: 0 0 0 3px var(--ehr-primary-soft);
}

/* Menu — same idiom as the clinic switcher menu so the toolbar feels
   like one cohesive system (rounded card, item rows, check-on-active).

   The trigger ships ``data-bs-display="static"`` so Popper.js never
   sets an inline transform that fights our open animation — that was
   the cause of the visible jump on first click. The 10px margin-top
   recreates the gap that Popper's default offset used to provide. */
.ehr-loc-status-dd__menu.dropdown-menu {
    margin-top: 10px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    box-shadow: 0 12px 32px -10px rgba(15, 23, 42, 0.18),
                0 4px 12px -4px rgba(15, 23, 42, 0.08),
                0 0 0 1px rgba(15, 23, 42, 0.02);
    padding: 0.45rem;
    min-width: 280px;
    background: var(--ehr-bg);
    background-clip: padding-box;
    transform-origin: top right;
    animation: ehrLocStatusDdIn .14s cubic-bezier(.22, 1, .36, 1);
}
.ehr-loc-status-dd__menu.dropdown-menu::before {
    content: '';
    position: absolute;
    top: -5px;
    right: 14px;
    width: 10px;
    height: 10px;
    background: var(--ehr-bg);
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 1px solid rgba(15, 23, 42, 0.08);
    transform: rotate(45deg);
    border-top-left-radius: 2px;
}
@keyframes ehrLocStatusDdIn {
    from { opacity: 0; transform: translateY(-4px) scale(.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
    .ehr-loc-status-dd__menu.dropdown-menu { animation: none; }
}
.ehr-loc-status-dd__item {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.55rem 0.65rem;
    border-radius: 10px;
    color: var(--ehr-text);
    text-decoration: none;
    transition: background .12s ease;
}
.ehr-loc-status-dd__item:hover,
.ehr-loc-status-dd__item:focus-visible {
    background: var(--ehr-bg-soft);
    outline: none;
}
.ehr-loc-status-dd__item.is-active {
    background: var(--ehr-primary-soft);
}
.ehr-loc-status-dd__item-icon {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 0.85rem;
    flex-shrink: 0;
}
.ehr-loc-status-dd__item-icon--all {
    background: linear-gradient(135deg, var(--ehr-primary), var(--ehr-info));
}
.ehr-loc-status-dd__item-icon--all .ehr-loc-toolbar__dot {
    background: #fff;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.30);
}
.ehr-loc-status-dd__item-icon--active {
    background: linear-gradient(135deg, var(--ehr-success), #34d399);
}
.ehr-loc-status-dd__item-icon--inactive {
    background: linear-gradient(135deg, #f43f5e, var(--ehr-danger, #dc2626));
}
.ehr-loc-status-dd__item-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    line-height: 1.2;
}
.ehr-loc-status-dd__item-name {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--ehr-text);
}
.ehr-loc-status-dd__item-sub {
    font-size: 0.72rem;
    color: var(--ehr-text-muted);
    margin-top: 1px;
}
.ehr-loc-status-dd__item.is-active .ehr-loc-status-dd__item-name { color: var(--ehr-primary); }
.ehr-loc-status-dd__item-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 0.5rem;
    border-radius: 999px;
    background: var(--ehr-bg-soft);
    border: 1px solid var(--ehr-border);
    color: var(--ehr-text-sub);
    font-size: 0.72rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}
.ehr-loc-status-dd__item.is-active .ehr-loc-status-dd__item-count {
    background: #fff;
    border-color: var(--ehr-primary);
    color: var(--ehr-primary);
}
.ehr-loc-status-dd__item-check {
    color: var(--ehr-primary);
    font-size: 0.95rem;
    opacity: 0;
    flex-shrink: 0;
    transition: opacity .15s ease;
}
.ehr-loc-status-dd__item.is-active .ehr-loc-status-dd__item-check { opacity: 1; }


/* Location detail: fallback room indicator dot when room.color is unset */
.ehr-loc-room-dot { width: 12px; height: 12px; }

/* ── Provider Position Map (location detail page) ────────── */
.ehr-position-map { width: 100%; }

.ehr-position-group {
    background: var(--ehr-bg);
    border-radius: var(--ehr-radius-sm);
}

.ehr-position-group__header {
    color: var(--ehr-text);
    border-bottom-color: var(--ehr-border) !important;
}

.ehr-position-group__header h6 {
    color: var(--ehr-text);
}

.ehr-position-card {
    border: 1px solid var(--ehr-border) !important;
    border-radius: var(--ehr-radius-sm) !important;
    transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.ehr-position-card:hover {
    border-color: var(--ehr-primary) !important;
    box-shadow: var(--ehr-shadow-sm);
    transform: translateY(-1px);
}

.ehr-position-card__name {
    color: var(--ehr-text);
    font-size: 0.95rem;
}

.ehr-position-card__schedule {
    margin-top: 0.25rem;
}

.ehr-schedule-chip {
    font-weight: 400;
    background: var(--ehr-bg-soft) !important;
    color: var(--ehr-text-sub) !important;
    border-color: var(--ehr-border) !important;
    padding: 0.28rem 0.55rem;
    border-radius: var(--ehr-radius-pill) !important;
    font-size: 0.72rem;
}

/* Provider detail: weekday label column on the schedule grid
   (extracted from inline style="min-width: 96px") */
.ehr-schedule-row__day { min-width: 96px; }

/* ── Patient list: page-specific tweaks layered on .ehr-loc-* idiom
   so the patient page reuses the milky-soft card + compact table
   styling without duplicating CSS. Only the deltas live here. */

/* Generic toolbar chip (used for has-email toggle).
   Pill, soft surface, primary tint when active. */
.ehr-pat-toolbar__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.75rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ehr-text-sub);
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: 999px;
    text-decoration: none;
    transition: color .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
    white-space: nowrap;
}
.ehr-pat-toolbar__chip:hover {
    color: var(--ehr-text);
    border-color: var(--ehr-border-strong);
    background: var(--ehr-bg-soft);
}
.ehr-pat-toolbar__chip i { font-size: 0.78rem; opacity: 0.75; }
.ehr-pat-toolbar__chip.is-active {
    color: var(--ehr-primary);
    background: var(--ehr-primary-soft);
    border-color: rgba(0, 105, 166, 0.35);
}
.ehr-pat-toolbar__chip.is-active i {
    opacity: 1;
    color: var(--ehr-primary);
}

/* Patient card — reuses .ehr-loc-card chrome, tuned for a compact
   directory grid: small avatar, tight padding, body section dropped
   entirely when there's no chip data (template gate). */
.ehr-pat-card.ehr-loc-card { border-radius: 0.85rem !important; }
.ehr-pat-card .ehr-loc-card__header {
    padding: 0.7rem 0.85rem 0.6rem;
    gap: 0.65rem;
}
.ehr-pat-card .ehr-loc-card__header::after {
    left: 0.85rem;
    right: 0.85rem;
}
.ehr-pat-card .ehr-loc-card__body {
    padding: 0.55rem 0.85rem 0.5rem;
    gap: 0.45rem;
}
.ehr-pat-card .ehr-loc-card__footer { display: none; }

.ehr-pat-card.ehr-loc-card { padding-bottom: 0.55rem; }

.ehr-pat-card:not(:has(.ehr-loc-card__body)) .ehr-loc-card__header::after {
    display: none;
}

.ehr-pat-card .ehr-loc-card__avatar {
    width: 36px;
    height: 36px;
    border-radius: 0.7rem;
}
.ehr-pat-card .ehr-loc-card__avatar-initial { font-size: 0.88rem; }
.ehr-pat-card .ehr-loc-card__avatar-pin {
    width: 15px;
    height: 15px;
    font-size: 0.5rem;
}
.ehr-pat-card .ehr-loc-card__title-wrap { gap: 0.25rem; padding-top: 0; }
.ehr-pat-card .ehr-loc-card__title { font-size: 0.88rem; }
.ehr-pat-card .ehr-loc-card__subline { font-size: 0.7rem; gap: 0.4rem; }

.ehr-pat-card__open {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 0.6rem;
    background: var(--ehr-bg-soft);
    color: var(--ehr-text-sub);
    border: 1px solid var(--ehr-border);
    font-size: 0.85rem;
    transition: background-color 160ms ease, color 160ms ease,
                border-color 160ms ease, transform 160ms ease;
    pointer-events: none;
}

.ehr-pat-card:hover .ehr-pat-card__open {
    background: var(--ehr-primary);
    color: #ffffff;
    border-color: var(--ehr-primary);
    transform: translate(2px, -2px);
}

.ehr-pat-card__avatar {
    background: linear-gradient(135deg, #a78bfa 0%, #60a5fa 100%) !important;
    box-shadow: 0 4px 12px -4px rgba(167, 139, 250, 0.35),
                inset 0 1px 0 rgba(255, 255, 255, 0.30) !important;
    color: #ffffff;
}

/* Contact rows — only render when there's actual data, so this
   section is not vertical dead-space. */
.ehr-pat-card__contact {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.ehr-pat-card__contact-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--ehr-text);
    text-decoration: none;
    font-size: 0.8rem;
    min-width: 0;
    transition: color .15s ease;
    position: relative;
    z-index: 2;
}
.ehr-pat-card__contact-row:hover { color: var(--ehr-primary); }
.ehr-pat-card__contact-icon {
    width: 24px;
    height: 24px;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ehr-bg-soft);
    color: var(--ehr-primary);
    font-size: 0.72rem;
    flex-shrink: 0;
}
.ehr-pat-card__contact-value {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}

.ehr-pat-card .ehr-loc-card__status {
    padding: 0.12rem 0.5rem;
    font-size: 0.6rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    border: 1px solid transparent;
}
.ehr-pat-card .ehr-loc-card__status i {
    font-size: 0.58rem;
}
.ehr-pat-card .ehr-loc-card__status-dot {
    width: 5px;
    height: 5px;
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.18);
}
.ehr-pat-card .ehr-loc-card__status--active {
    background: rgba(34, 197, 94, 0.10);
    color: #15803d;
    border-color: rgba(34, 197, 94, 0.22);
}
.ehr-pat-card .ehr-loc-card__status--inactive {
    background: rgba(248, 113, 113, 0.10);
    color: #dc2626;
    border-color: rgba(248, 113, 113, 0.22);
}

.ehr-pat-card__chips {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}
.ehr-pat-card__inline-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.18rem 0.55rem;
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1.25;
    color: #475569;
    background: #f8fafc;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 999px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ehr-pat-card__inline-chip i {
    font-size: 0.64rem;
    color: #94a3b8;
}
.ehr-pat-card__inline-chip--loc {
    background: rgba(96, 165, 250, 0.08);
    color: #2563eb;
    border-color: rgba(96, 165, 250, 0.22);
}
.ehr-pat-card__inline-chip--loc i { color: #60a5fa; }
.ehr-pat-card__inline-chip--prov {
    background: rgba(167, 139, 250, 0.08);
    color: #7c3aed;
    border-color: rgba(167, 139, 250, 0.22);
}
.ehr-pat-card__inline-chip--prov i { color: #a78bfa; }

/* Status flag pills (Deceased / Archived / Hardship). */
.ehr-pat-card__flags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}
.ehr-pat-card__flag {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.18rem 0.55rem;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    border-radius: 999px;
}
.ehr-pat-card__flag i { font-size: 0.66rem; }
.ehr-pat-card__flag--deceased {
    background: rgba(100, 116, 139, 0.10);
    color: #475569;
    border: 1px solid rgba(100, 116, 139, 0.25);
}
.ehr-pat-card__flag--archived {
    background: rgba(217, 119, 6, 0.10);
    color: var(--ehr-warning);
    border: 1px solid rgba(217, 119, 6, 0.25);
}
.ehr-pat-card__flag--hardship {
    background: rgba(8, 145, 178, 0.10);
    color: var(--ehr-info);
    border: 1px solid rgba(8, 145, 178, 0.25);
}

/* Patient table — keep the .ehr-loc-table layout, retint the avatar
   so patient and location rows are distinguishable at a glance. */
.ehr-pat-table__avatar {
    background: linear-gradient(135deg, #a78bfa 0%, #60a5fa 100%) !important;
    box-shadow: 0 3px 8px rgba(167, 139, 250, 0.22),
                inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
.ehr-pat-table__provider {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--ehr-text);
    font-size: 0.83rem;
    font-weight: 500;
}
.ehr-pat-table__provider i {
    color: var(--ehr-primary);
    font-size: 0.78rem;
}

/* Locked-PII placeholder — shown when a value is encrypted ciphertext
   we can't safely render. A tiny lock icon hints at *why* the cell is
   blank, distinguishing "encrypted" from "missing". */
.ehr-pat-table__pii-locked {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.78rem;
    color: var(--ehr-text-muted);
    font-style: italic;
}
.ehr-pat-table__pii-locked i {
    font-size: 0.7rem;
    color: var(--ehr-text-muted);
    opacity: 0.6;
}

/* Patient table density — tighter vertical rhythm than the location
   table because patient lists are typically denser and we want more
   rows visible without scrolling. */
.ehr-loc-tablecard:has(.ehr-pat-table__avatar) .ehr-loc-table thead th,
.ehr-loc-tablecard:has(.ehr-pat-table__avatar) .ehr-loc-table tbody td {
    padding: 0.7rem 0.95rem;
}

/* ── Location list: 2027-modern compact table ─────────────────────
   Replaces the bootstrap `.table` with a richer, info-dense table
   that mirrors the card grid's affordances: avatar + name + city
   sub-line, address with zip, schedule chip, tabular-num counts,
   colored status pill. Sticky header, soft zebra, hover lift. */
.ehr-loc-tablecard { overflow: hidden; }

.ehr-loc-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.85rem;
}
.ehr-loc-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--ehr-bg-soft);
    color: var(--ehr-text-muted);
    font-weight: 600;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--ehr-border);
    white-space: nowrap;
}
.ehr-loc-table tbody td {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--ehr-border);
    color: var(--ehr-text);
    vertical-align: middle;
}
.ehr-loc-table tbody tr:last-child td { border-bottom: none; }
.ehr-loc-table__row {
    transition: background .15s ease;
}
.ehr-loc-table__row:hover {
    background: var(--ehr-primary-soft);
}

/* Name cell: avatar + name + city subline. */
.ehr-loc-table__name {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    text-decoration: none;
    color: inherit;
    min-width: 0;
}
.ehr-loc-table__avatar {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 800;
    font-size: 0.85rem;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--ehr-primary), var(--ehr-info));
    box-shadow: 0 4px 10px rgba(0, 105, 166, 0.18),
                inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
.ehr-loc-table__name-body {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    min-width: 0;
}
.ehr-loc-table__name-text {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--ehr-text);
    letter-spacing: -0.01em;
}
.ehr-loc-table__name-sub {
    font-size: 0.72rem;
    color: var(--ehr-text-muted);
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 2px;
}
.ehr-loc-table__name-sub i {
    color: var(--ehr-primary);
    font-size: 0.7rem;
}
.ehr-loc-table__row:hover .ehr-loc-table__name-text { color: var(--ehr-primary); }

/* Address column: line 1 above zip, both compact. */
.ehr-loc-table__addr { line-height: 1.25; }
.ehr-loc-table__addr-1 {
    display: block;
    color: var(--ehr-text);
    font-weight: 500;
    font-size: 0.83rem;
}
.ehr-loc-table__addr-zip {
    display: block;
    font-size: 0.72rem;
    color: var(--ehr-text-muted);
    font-variant-numeric: tabular-nums;
}

.ehr-loc-table__phone {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--ehr-text);
    text-decoration: none;
    font-variant-numeric: tabular-nums;
    font-size: 0.83rem;
}
.ehr-loc-table__phone i {
    color: var(--ehr-primary);
    font-size: 0.75rem;
}
.ehr-loc-table__phone:hover { color: var(--ehr-primary); }

/* Inline chip for schedule mode. */
.ehr-loc-table__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.22rem 0.6rem;
    border-radius: var(--ehr-radius-pill);
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.3;
}
.ehr-loc-table__chip i { font-size: 0.7rem; }
.ehr-loc-table__chip--mode {
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
}

/* Numeric columns — tabular figures so digits align cleanly. */
.ehr-loc-table__num {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    color: var(--ehr-text);
    font-size: 0.9rem;
    letter-spacing: -0.01em;
}

/* Clinic link cell — humanized label with building icon. */
.ehr-loc-table__clinic {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--ehr-text-sub);
    text-decoration: none;
    font-size: 0.8rem;
    padding: 0.18rem 0.55rem;
    border-radius: var(--ehr-radius-pill);
    background: var(--ehr-bg-soft);
    border: 1px solid var(--ehr-border);
    transition: color .15s ease, border-color .15s ease, background .15s ease;
    white-space: nowrap;
}
.ehr-loc-table__clinic:hover {
    color: var(--ehr-primary);
    border-color: var(--ehr-primary);
    background: var(--ehr-primary-soft);
}
.ehr-loc-table__clinic i { font-size: 0.72rem; color: var(--ehr-text-muted); }
.ehr-loc-table__clinic:hover i { color: var(--ehr-primary); }

/* Status pill — matches the card's pulse-dot affordance vocabulary. */
.ehr-loc-table__status {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.25rem 0.7rem;
    border-radius: var(--ehr-radius-pill);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1;
}
.ehr-loc-table__status-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.18);
}
.ehr-loc-table__status--active {
    background: rgba(22, 163, 74, 0.12);
    color: var(--ehr-success);
}
.ehr-loc-table__status--inactive {
    background: rgba(220, 38, 38, 0.10);
    color: var(--ehr-danger, #dc2626);
}
.ehr-loc-table__status--inactive i { font-size: 0.72rem; }

.ehr-detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.15rem 1.35rem;
    margin-bottom: 1.25rem;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius);
    box-shadow: var(--ehr-shadow-sm);
}
.ehr-detail-header__main {
    min-width: 0;
    flex: 1 1 auto;
}
.ehr-detail-header__title {
    font-size: 1.6rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    line-height: 1.2;
    margin: 0 0 0.6rem;
    color: var(--ehr-text);
    word-break: break-word;
}
.ehr-detail-header__pills {
    display: flex; flex-wrap: wrap; gap: 0.4rem;
    align-items: center;
}
.ehr-detail-header__clinic {
    display: inline-flex; align-items: center; gap: 0.35rem;
    font-size: 0.78rem; font-weight: 600;
    color: var(--ehr-text-sub);
    padding: 0.3rem 0.65rem;
    border-radius: var(--ehr-radius-pill);
    background: var(--ehr-bg-soft);
    border: 1px solid var(--ehr-border);
    white-space: nowrap;
}
.ehr-detail-header__clinic > i { color: var(--ehr-primary); font-size: 0.78rem; }
.ehr-detail-header__actions {
    display: flex; gap: 0.45rem; flex-wrap: wrap;
    flex: 0 0 auto;
    padding-top: 0.15rem;
}
.ehr-detail-header__back,
.ehr-detail-header__action {
    display: inline-flex; align-items: center; gap: 0.4rem;
    height: 36px;
    padding: 0 0.85rem;
    border-radius: var(--ehr-radius-pill);
    font-size: 0.82rem; font-weight: 600;
    text-decoration: none;
    border: 1px solid var(--ehr-border);
    background: var(--ehr-bg);
    color: var(--ehr-text);
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.ehr-detail-header__back {
    width: 36px;
    padding: 0;
    justify-content: center;
    color: var(--ehr-text-muted);
    background: var(--ehr-bg-soft);
}
.ehr-detail-header__back:hover {
    color: var(--ehr-text);
    background: var(--ehr-bg);
    border-color: var(--ehr-border-strong, var(--ehr-border));
}
.ehr-detail-header__action > i { font-size: 0.85rem; opacity: 0.85; }
.ehr-detail-header__action:hover {
    color: var(--ehr-text);
    border-color: var(--ehr-primary-soft);
    background: var(--ehr-bg-soft);
    box-shadow: var(--ehr-shadow-sm);
}
.ehr-detail-header__action--primary {
    color: var(--ehr-primary);
    border-color: var(--ehr-primary-soft);
    background: var(--ehr-bg);
}
.ehr-detail-header__action--primary:hover {
    color: #fff;
    background: var(--ehr-primary);
    border-color: var(--ehr-primary);
    box-shadow: 0 6px 14px rgba(37, 99, 235, 0.18);
}
.ehr-detail-header__action--primary > i { opacity: 1; }

@media (max-width: 767.98px) {
    .ehr-detail-header { flex-direction: column; align-items: stretch; gap: 0.85rem; }
    .ehr-detail-header__title { font-size: 1.35rem; }
    .ehr-detail-header__actions { width: 100%; }
    .ehr-detail-header__action { flex: 1 1 0; justify-content: center; }
}

/* Re-declares dashboard.css `--d-*` tokens at .details-hero scope — EHR
   patient/provider pages don't wrap the hero in .clinic-details, so the
   shared rules would otherwise resolve var() to initial. */
.details-hero {
    --d-surface: var(--ehr-bg);
    --d-surface-soft: var(--ehr-bg-soft);
    --d-border: var(--ehr-border);
    --d-border-strong: var(--ehr-border-strong);
    --d-text: var(--ehr-text);
    --d-sub: var(--ehr-text-sub);
    --d-muted: var(--ehr-text-muted);
    --d-accent: var(--ehr-primary);
    --d-accent-soft: var(--ehr-primary-soft);
    --d-success: var(--ehr-success);
    --d-success-soft: rgba(22, 163, 74, 0.10);
    --d-warning: var(--ehr-warning);
    --d-warning-soft: rgba(217, 119, 6, 0.10);
    --d-info: var(--ehr-info);
    --d-info-soft: rgba(8, 145, 178, 0.10);
    --d-danger: var(--ehr-danger);
    --d-danger-soft: rgba(220, 38, 38, 0.10);
}

.details-hero-avatar {
    position: relative;
    width: 100px;
    height: 100px;
    border-radius: 22px;
    background:
        radial-gradient(120% 120% at 0% 0%, rgba(255, 255, 255, 0.28) 0%, transparent 55%),
        linear-gradient(135deg, var(--ehr-primary) 0%, var(--ehr-info) 100%);
    color: #fff;
    font-size: 5rem;
    font-weight: 800;
    letter-spacing: -0.04em;
    border: 2px solid var(--ehr-bg);
    box-shadow:
        0 0 0 1px var(--ehr-border),
        0 10px 22px -8px rgba(0, 105, 166, 0.45);
    transition: transform .18s ease, box-shadow .18s ease;
}
.details-hero-avatar::after {
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: inherit;
    border: 2px solid var(--ehr-primary-soft);
    opacity: 0;
    transition: opacity .25s ease, transform .25s ease;
    pointer-events: none;
}
.details-hero-avatar:hover {
    transform: translateY(-1px);
    box-shadow:
        0 0 0 1px var(--ehr-border),
        0 14px 28px -8px rgba(0, 105, 166, 0.55);
}
.details-hero-avatar:hover::after {
    opacity: 1;
    transform: scale(1.02);
}
.details-hero-avatar > span {
    position: relative;
    z-index: 1;
    text-shadow: 0 1px 1px rgba(15, 23, 42, 0.18);
}

/* EHR KPI strip — at-a-glance metrics row that anchors the top of the
   patient + provider detail pages. Auto-fits 2-6 tiles per row, each tile
   a contained card with icon + value + label + optional sub. */
.ehr-kpi-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}
.ehr-kpi {
    --kpi-tint: var(--ehr-text-sub);
    --kpi-tint-soft: var(--ehr-bg-soft);
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 0.95rem 1rem;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius);
    box-shadow: var(--ehr-shadow-sm);
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
    position: relative;
    overflow: hidden;
}
.ehr-kpi::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--kpi-tint);
    opacity: 0.55;
}
.ehr-kpi:hover {
    border-color: var(--kpi-tint);
    box-shadow: var(--ehr-shadow-md);
    transform: translateY(-1px);
}
.ehr-kpi__icon {
    width: 38px; height: 38px;
    border-radius: 11px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--kpi-tint-soft);
    color: var(--kpi-tint);
    flex-shrink: 0;
    font-size: 1.05rem;
}
.ehr-kpi__body { min-width: 0; }
.ehr-kpi__value {
    font-size: 1.45rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.05;
    color: var(--ehr-text);
}
.ehr-kpi__value-sub {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ehr-text-muted);
    margin-left: 0.1rem;
}
.ehr-kpi__label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ehr-text-sub);
    margin-top: 0.2rem;
}
.ehr-kpi__sub {
    font-size: 0.7rem;
    color: var(--ehr-text-muted);
    margin-top: 0.15rem;
}
.ehr-kpi--primary { --kpi-tint: var(--ehr-primary); --kpi-tint-soft: var(--ehr-primary-soft); }
.ehr-kpi--info    { --kpi-tint: var(--ehr-info); --kpi-tint-soft: rgba(8, 145, 178, 0.10); }
.ehr-kpi--success { --kpi-tint: var(--ehr-success); --kpi-tint-soft: rgba(22, 163, 74, 0.10); }
.ehr-kpi--warn    { --kpi-tint: var(--ehr-warning); --kpi-tint-soft: rgba(217, 119, 6, 0.10); }
.ehr-kpi--danger  { --kpi-tint: var(--ehr-danger); --kpi-tint-soft: rgba(220, 38, 38, 0.10); }
.ehr-kpi--accent  { --kpi-tint: #6366f1; --kpi-tint-soft: rgba(99, 102, 241, 0.10); }
.ehr-kpi--muted   { --kpi-tint: var(--ehr-text-muted); --kpi-tint-soft: var(--ehr-bg-muted); }

/* Tag strip — colored chips pulled from EHRPatientTag.color so the patient
   page surfaces clinic-defined cohort labels at a glance. */
.ehr-tag-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 1rem;
}
.ehr-tag {
    --tag-color: var(--ehr-text-sub);
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.7rem;
    border-radius: var(--ehr-radius-pill);
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1;
    color: var(--tag-color);
    background: color-mix(in srgb, var(--tag-color) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--tag-color) 28%, transparent);
}
.ehr-tag > i { font-size: 0.7rem; opacity: 0.85; }
.ehr-tag--group {
    --tag-color: var(--ehr-primary);
}

/* Card variant tints + admin-note row + small section eyebrow used across
   the patient/provider detail right-column panels. */
.ehr-detail-panel--warn {
    border-color: rgba(217, 119, 6, 0.30) !important;
    background: linear-gradient(180deg, rgba(217, 119, 6, 0.04) 0%, var(--ehr-bg) 100%) !important;
}
.ehr-admin-note {
    --note-color: transparent;
    border-left: 3px solid var(--note-color);
    padding-left: 0.65rem !important;
    margin-left: -0.15rem;
}
.ehr-detail-eyebrow {
    font-size: 0.62rem;
    letter-spacing: 0.08em;
}

@media (max-width: 575.98px) {
    .ehr-kpi-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ehr-kpi__value { font-size: 1.2rem; }
}

/* Status pills — gradient + icon, semantic variants. */
.ehr-loc-status {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.35rem 0.75rem;
    border-radius: var(--ehr-radius-pill);
    font-size: 0.72rem; font-weight: 700; line-height: 1;
    white-space: nowrap;
    box-shadow: var(--ehr-shadow-sm);
    text-decoration: none;
}
.ehr-loc-status > i { font-size: 0.72rem; }
.ehr-loc-status-dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 3px currentColor;
    opacity: 0.9;
}
.ehr-loc-status--active {
    background: linear-gradient(135deg, rgba(22, 163, 74, 0.18), rgba(22, 163, 74, 0.06));
    color: var(--ehr-success);
    border: 1px solid rgba(22, 163, 74, 0.30);
}
.ehr-loc-status--inactive {
    background: linear-gradient(135deg, rgba(148, 163, 184, 0.16), rgba(148, 163, 184, 0.04));
    color: var(--ehr-text-sub);
    border: 1px solid var(--ehr-border-strong);
}
.ehr-loc-status--info {
    background: linear-gradient(135deg, rgba(8, 145, 178, 0.18), rgba(8, 145, 178, 0.06));
    color: var(--ehr-info);
    border: 1px solid rgba(8, 145, 178, 0.30);
}
.ehr-loc-status--warn {
    background: linear-gradient(135deg, rgba(217, 119, 6, 0.20), rgba(217, 119, 6, 0.06));
    color: var(--ehr-warning);
    border: 1px solid rgba(217, 119, 6, 0.30);
}
.ehr-loc-status--muted {
    background: var(--ehr-bg-soft);
    color: var(--ehr-text-sub);
    border: 1px dashed var(--ehr-border-strong);
}

/* Overview row: address chip + map preview, glance grid. */
.ehr-loc-overview {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 1.1rem;
}
@media (max-width: 767.98px) {
    .ehr-loc-overview { grid-template-columns: 1fr; }
}

.ehr-loc-info-chip {
    display: flex; align-items: flex-start; gap: 0.85rem;
    padding: 0.95rem 1.05rem;
    border-radius: 14px;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    min-width: 0;
    color: inherit;
}
.ehr-loc-info-chip:hover {
    transform: translateY(-2px);
    border-color: var(--ehr-primary);
    box-shadow: var(--ehr-shadow-md);
}
.ehr-loc-info-chip__icon {
    width: 38px; height: 38px;
    border-radius: 11px;
    display: flex; align-items: center; justify-content: center;
    color: #fff;
    font-size: 0.95rem;
    flex-shrink: 0;
    background: linear-gradient(135deg, var(--ehr-primary), var(--ehr-info));
    box-shadow: 0 4px 10px var(--ehr-primary-soft);
}
.ehr-loc-info-chip__icon--success {
    background: linear-gradient(135deg, var(--ehr-success), #34d399);
    box-shadow: 0 4px 10px rgba(22, 163, 74, 0.25);
}
.ehr-loc-info-chip__icon--warn {
    background: linear-gradient(135deg, var(--ehr-warning), #f59e0b);
    box-shadow: 0 4px 10px rgba(217, 119, 6, 0.25);
}
.ehr-loc-info-chip__body { flex: 1; min-width: 0; }
.ehr-loc-info-chip__label {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--ehr-text-muted);
    font-weight: 700;
    margin-bottom: 3px;
}
.ehr-loc-info-chip__value {
    font-size: 0.9rem;
    color: var(--ehr-text);
    font-weight: 600;
    line-height: 1.45;
    word-break: break-word;
}
.ehr-loc-info-chip__hint {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ehr-text-muted);
    margin-top: 4px;
    display: inline-flex; align-items: center; gap: 0.25rem;
}
.ehr-loc-info-chip:hover .ehr-loc-info-chip__hint { color: var(--ehr-primary); }
.ehr-loc-info-chip__arrow {
    font-size: 0.8rem;
    color: var(--ehr-text-muted);
    margin-top: 6px;
    flex-shrink: 0;
    transition: transform 0.2s ease, color 0.2s ease;
}
.ehr-loc-info-chip:hover .ehr-loc-info-chip__arrow {
    color: var(--ehr-primary);
    transform: translate(2px, -2px);
}

/* Map preview iframe wrapper — shared between overview and contact card. */
.ehr-loc-map {
    height: 170px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--ehr-border);
}
.ehr-loc-map iframe { width: 100%; height: 100%; border: 0; display: block; }

/* At-a-Glance list rows (right rail). */
.ehr-loc-glance { list-style: none; margin: 0; padding: 0; }
.ehr-loc-glance > li {
    display: flex; align-items: center; justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--ehr-border);
    font-size: 0.82rem;
}
.ehr-loc-glance > li:last-child { border-bottom: none; }
.ehr-loc-glance__label {
    color: var(--ehr-text-sub);
    display: inline-flex; align-items: center; gap: 0.45rem;
}
.ehr-loc-glance__value {
    color: var(--ehr-text);
    font-weight: 600;
    text-align: right;
    word-break: break-word;
}

/* Rich rooms grid — replaces the cramped list for visual richness. */
.ehr-loc-rooms-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.6rem;
}
.ehr-loc-room {
    display: flex; align-items: center; gap: 0.6rem;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-sm);
    background: var(--ehr-bg);
    transition: border-color 0.15s ease, transform 0.15s ease;
    min-width: 0;
}
.ehr-loc-room:hover { border-color: var(--ehr-primary); transform: translateY(-1px); }
.ehr-loc-room__swatch {
    width: 14px; height: 14px;
    border-radius: 4px;
    flex-shrink: 0;
    border: 1px solid var(--ehr-border-strong);
}
.ehr-loc-room__name {
    flex: 1; min-width: 0;
    font-weight: 600; font-size: 0.85rem;
    color: var(--ehr-text);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ehr-loc-room__lock {
    color: var(--ehr-warning);
    font-size: 0.85rem;
}

/* Quick-link tile (right rail). Visually richer than btn-soft. */
.ehr-loc-quicklink {
    display: flex; align-items: center; gap: 0.7rem;
    padding: 0.7rem 0.85rem;
    border-radius: var(--ehr-radius-sm);
    border: 1px solid var(--ehr-border);
    background: var(--ehr-bg);
    text-decoration: none;
    color: var(--ehr-text);
    font-weight: 600; font-size: 0.85rem;
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.ehr-loc-quicklink:hover {
    transform: translateX(2px);
    border-color: var(--ehr-primary);
    box-shadow: var(--ehr-shadow-sm);
    color: var(--ehr-text);
}
.ehr-loc-quicklink__icon {
    width: 32px; height: 32px;
    border-radius: 9px;
    display: inline-flex; align-items: center; justify-content: center;
    color: #fff; flex-shrink: 0;
    background: linear-gradient(135deg, var(--ehr-primary), var(--ehr-info));
}
.ehr-loc-quicklink__icon--success { background: linear-gradient(135deg, var(--ehr-success), #34d399); }
.ehr-loc-quicklink__icon--warn    { background: linear-gradient(135deg, var(--ehr-warning), #f59e0b); }
.ehr-loc-quicklink__arrow {
    margin-left: auto;
    color: var(--ehr-text-muted);
    transition: color 0.15s ease, transform 0.15s ease;
}
.ehr-loc-quicklink:hover .ehr-loc-quicklink__arrow {
    color: var(--ehr-primary);
    transform: translateX(2px);
}

/* Section eyebrow — small uppercase label above a column block. */
.ehr-loc-section-eyebrow {
    letter-spacing: 0.04em;
    font-size: 0.6875rem;
}

/* Fixed-width inline-icon column (replaces inline style="width:16px"). */
.ehr-icon-fixed { width: 16px; flex-shrink: 0; }

/* Multiline address inside the contact card. */
.ehr-loc-address { line-height: 1.7; }

/* Mono UID values inside the EHR Integration card. */
.ehr-loc-uid {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
    font-size: 0.78rem;
    background: var(--ehr-bg-soft);
    border: 1px solid var(--ehr-border);
    padding: 0.15rem 0.45rem;
    border-radius: 6px;
    color: var(--ehr-text);
}

/* ── Provider list — page-specific deltas layered on .ehr-loc-* idiom.
   Tighter than the location card: smaller avatar, no footer, top-right
   open arrow, location/clinic name as a subline under the title. */
.ehr-prov-card.ehr-loc-card {
    border-radius: 0.95rem !important;
    padding-bottom: 0.55rem;
}
.ehr-prov-card .ehr-loc-card__footer { display: none; }
.ehr-prov-card:not(:has(.ehr-loc-card__body)) .ehr-loc-card__header::after {
    display: none;
}

.ehr-prov-card .ehr-loc-card__header {
    padding: 0.85rem 0.95rem 0.75rem;
    gap: 0.7rem;
}
.ehr-prov-card .ehr-loc-card__header::after {
    left: 0.95rem;
    right: 0.95rem;
}

/* Avatar — slightly smaller than the location card, indigo→violet
   default that the inline style override re-tints with prov.color. */
.ehr-prov-card .ehr-loc-card__avatar {
    width: 40px;
    height: 40px;
    border-radius: 0.75rem;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    box-shadow: 0 6px 14px -6px rgba(99, 102, 241, 0.30),
                inset 0 1px 0 rgba(255, 255, 255, 0.22);
}
.ehr-prov-card .ehr-loc-card__avatar-initial { font-size: 0.95rem; }
.ehr-prov-card .ehr-loc-card__avatar-pin {
    width: 16px;
    height: 16px;
    font-size: 0.55rem;
    bottom: -4px;
    right: -4px;
    color: #6366f1;
}

.ehr-prov-card .ehr-loc-card__title-wrap {
    gap: 0.3rem;
    padding-top: 0;
}
.ehr-prov-card .ehr-loc-card__title { font-size: 0.95rem; }
.ehr-prov-card .ehr-loc-card__subline { gap: 0.3rem; }
.ehr-prov-card .ehr-loc-card__status,
.ehr-prov-card .ehr-loc-card__mode,
.ehr-prov-card .ehr-loc-card__city {
    padding: 0.14rem 0.5rem;
    font-size: 0.62rem;
    border-radius: 999px;
}
.ehr-prov-card .ehr-loc-card__status i,
.ehr-prov-card .ehr-loc-card__mode i,
.ehr-prov-card .ehr-loc-card__city i { font-size: 0.6rem; }
.ehr-prov-card .ehr-loc-card__status-dot {
    width: 5px;
    height: 5px;
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.18);
}

/* Top-right open arrow — same idiom as the patient card. */
.ehr-prov-card__open {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 0.55rem;
    background: var(--ehr-bg-soft);
    color: var(--ehr-text-sub);
    border: 1px solid var(--ehr-border);
    font-size: 0.8rem;
    transition: background-color 160ms ease, color 160ms ease,
                border-color 160ms ease, transform 160ms ease;
    pointer-events: none;
}
.ehr-prov-card:hover .ehr-prov-card__open {
    background: #6366f1;
    color: #ffffff;
    border-color: #6366f1;
    transform: translate(2px, -2px);
}

/* Location + clinic subline — sits between title and chip row. */
.ehr-prov-card__where {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.65rem;
    font-size: 0.72rem;
    color: var(--ehr-text-sub);
    line-height: 1.3;
    min-width: 0;
}
.ehr-prov-card__where-loc,
.ehr-prov-card__where-clinic {
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}
.ehr-prov-card__where-loc { color: var(--ehr-text); }
.ehr-prov-card__where-loc i {
    color: var(--ehr-primary);
    font-size: 0.72rem;
}
.ehr-prov-card__where-clinic {
    color: var(--ehr-text-muted);
    font-weight: 600;
}
.ehr-prov-card__where-clinic i {
    color: var(--ehr-text-muted);
    font-size: 0.7rem;
    opacity: 0.8;
}
.ehr-prov-card__where-more {
    margin-left: 0.2rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
    font-size: 0.6rem;
    font-weight: 700;
    line-height: 1.5;
    font-variant-numeric: tabular-nums;
}

/* Specialty chip — purple-tinted. */
.ehr-prov-card__specialty {
    background: rgba(124, 58, 237, 0.08) !important;
    border: 1px solid rgba(124, 58, 237, 0.22) !important;
    color: #7c3aed !important;
    text-transform: none !important;
    font-weight: 600 !important;
}
.ehr-prov-card__specialty i { color: #a78bfa !important; }

/* Schedule pill — emerald tint. */
.ehr-prov-card__sched {
    background: rgba(16, 185, 129, 0.10) !important;
    color: #047857 !important;
    text-transform: none !important;
}
.ehr-prov-card__sched i { color: #10b981 !important; }

/* Body — tighter padding, smaller stat tiles. */
.ehr-prov-card .ehr-loc-card__body {
    padding: 0.7rem 0.95rem 0.75rem;
    gap: 0.65rem;
}
.ehr-prov-card .ehr-loc-card__stats { gap: 0.4rem; }
.ehr-prov-card .ehr-loc-card__stat {
    padding: 0.5rem 0.55rem;
    gap: 0.35rem;
    border-radius: 0.7rem;
}
.ehr-prov-card .ehr-loc-card__stat-icon {
    width: 22px; height: 22px;
    font-size: 0.66rem;
    border-radius: 6px;
}
.ehr-prov-card .ehr-loc-card__stat-value { font-size: 0.95rem; }
.ehr-prov-card .ehr-loc-card__stat-label { font-size: 0.6rem; }

/* Credentials — slim inline pills, no surrounding card box. */
.ehr-prov-card__credentials {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem 0.45rem;
}
.ehr-prov-card__cred {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    padding: 0.2rem 0.55rem;
    background: var(--ehr-bg-soft);
    border: 1px solid var(--ehr-border);
    border-radius: 0.5rem;
    line-height: 1.25;
    max-width: 100%;
    overflow: hidden;
}
.ehr-prov-card__cred-label {
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.6rem;
    font-weight: 700;
    color: var(--ehr-text-muted);
    flex-shrink: 0;
}
.ehr-prov-card__cred-value {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--ehr-text);
    letter-spacing: -0.01em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Provider card — de-emphasize zero-value stats so non-zero data pops. */
.ehr-prov-card .ehr-loc-card__stat.is-zero {
    background: var(--ehr-bg-soft);
    opacity: .72;
}
.ehr-prov-card .ehr-loc-card__stat.is-zero .ehr-loc-card__stat-icon {
    background: rgba(148, 163, 184, .14) !important;
    color: var(--ehr-text-muted) !important;
}
.ehr-prov-card .ehr-loc-card__stat.is-zero .ehr-loc-card__stat-value {
    color: var(--ehr-text-muted);
    font-weight: 600;
}

/* Provider card — sync footer chip (replaces the loose grey text line). */
.prov-row-card__footer {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .5rem;
    padding-top: .55rem;
    border-top: 1px dashed var(--ehr-border);
}
.prov-row-card__sync-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .22rem .6rem;
    font-size: .68rem;
    font-weight: 600;
    color: #047857;
    background: rgba(16, 185, 129, .09);
    border: 1px solid rgba(16, 185, 129, .22);
    border-radius: 999px;
    line-height: 1.4;
}
.prov-row-card__sync-chip i { font-size: .7rem; opacity: .9; }
.prov-row-card__sync-chip.is-warn {
    color: #b45309;
    background: rgba(245, 158, 11, .10);
    border-color: rgba(245, 158, 11, .25);
}
.prov-row-card__sync-chip.is-muted {
    color: var(--ehr-text-muted);
    background: var(--ehr-bg-soft);
    border-color: var(--ehr-border);
}
[data-bs-theme="dark"] .prov-row-card__sync-chip,
[data-theme="dark"] .prov-row-card__sync-chip {
    color: #6ee7b7;
    background: rgba(16, 185, 129, .14);
    border-color: rgba(16, 185, 129, .28);
}
[data-bs-theme="dark"] .prov-row-card__sync-chip.is-warn,
[data-theme="dark"] .prov-row-card__sync-chip.is-warn {
    color: #fcd34d;
    background: rgba(245, 158, 11, .14);
    border-color: rgba(245, 158, 11, .28);
}

/* ============================================================
   SUBMISSION CARD — overlays the ehr-loc-card / ehr-prov-card
   skeleton with submission-only affordances: bulk checkbox, star
   toggle, status-tinted avatar, unread/starred ribbons, action
   menu. Layout, spacing, typography all inherit from ehr-loc-card.
   ============================================================ */
.sub-card { position: relative; padding-bottom: 0; }
.sub-card .ehr-loc-card__header {
    padding: 0.95rem 1.05rem 0.75rem;
    gap: 0.75rem;
}
.sub-card .ehr-loc-card__header::after { display: none; }
.sub-card .ehr-loc-card__avatar {
    width: 36px; height: 36px;
    border-radius: 0.6rem;
    box-shadow: 0 4px 10px -5px rgba(99, 102, 241, 0.28),
                inset 0 1px 0 rgba(255, 255, 255, 0.20);
}
.sub-card .ehr-loc-card__avatar-initial { font-size: 0.85rem; }
.sub-card .ehr-loc-card__avatar-pin { display: none; }
.sub-card .ehr-loc-card__title { font-size: 0.9rem; line-height: 1.25; }
.sub-card .ehr-loc-card__subline { gap: 0.3rem; font-size: 0.66rem; }

.sub-card .ehr-loc-card__body {
    padding: 0 1.05rem 0;
    gap: 0.75rem;
}
.sub-card .ehr-loc-card__stats {
    gap: 0;
    padding: 0.75rem 0;
    border-top: 1px solid var(--ehr-border);
    border-bottom: 1px solid var(--ehr-border);
    background: transparent;
    align-items: stretch;
}
.sub-card .ehr-loc-card__stat {
    background: transparent !important;
    border: 0 !important;
    padding: 0.2rem 0.75rem !important;
    border-radius: 0 !important;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.2rem !important;
    position: relative;
    min-width: 0;
}
.sub-card .ehr-loc-card__stat + .ehr-loc-card__stat::before {
    content: "";
    position: absolute;
    left: 0; top: 12%; bottom: 12%;
    width: 1px;
    background: var(--ehr-border);
    opacity: 0.7;
}
.sub-card .ehr-loc-card__stat-icon { display: none; }
.sub-card .ehr-loc-card__stat-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.18rem;
    width: 100%;
    min-width: 0;
}
.sub-card .ehr-loc-card__stat-value {
    display: block;
    width: 100%;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.15;
    color: var(--ehr-text);
    letter-spacing: -0.018em;
    max-width: 100%;
    word-break: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sub-card .ehr-loc-card__stat:nth-child(2) .ehr-loc-card__stat-value,
.sub-card .ehr-loc-card__stat:nth-child(3) .ehr-loc-card__stat-value {
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0;
}
.sub-card .ehr-loc-card__stat-label {
    display: block;
    width: 100%;
    font-size: 0.58rem;
    letter-spacing: 0.08em;
    color: var(--ehr-text-muted);
    text-transform: uppercase;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 0 0 auto;
}
.sub-card .ehr-loc-card__stat.is-zero .ehr-loc-card__stat-value {
    color: var(--ehr-text-muted);
    font-weight: 600;
}

[data-bs-theme="dark"] .sub-card .ehr-loc-card__stats,
[data-theme="dark"] .sub-card .ehr-loc-card__stats {
    border-top-color: rgba(255, 255, 255, 0.06);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

.sub-card.sub-card--unread { border-color: rgba(217, 119, 6, .35); }
.sub-card.sub-card--unread::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, #f59e0b 0%, #d97706 100%);
    border-radius: var(--ehr-radius) 0 0 var(--ehr-radius);
}
.sub-card.sub-card--starred {
    box-shadow: 0 0 0 1px rgba(245, 158, 11, .25), var(--ehr-shadow-sm);
}

/* Status-tinted avatar — overrides the default card avatar gradient
   so the visual "tone" of each submission reads at a glance. */
.sub-card__avatar[data-status="received"]   { background: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 100%) !important; }
.sub-card__avatar[data-status="processing"] { background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%) !important; }
.sub-card__avatar[data-status="reviewed"]   { background: linear-gradient(135deg, #818cf8 0%, #6366f1 100%) !important; }
.sub-card__avatar[data-status="converted"]  { background: linear-gradient(135deg, #34d399 0%, #059669 100%) !important; }
.sub-card__avatar[data-status="archived"]   { background: linear-gradient(135deg, #94a3b8 0%, #64748b 100%) !important; }
.sub-card__avatar[data-status="spam"]       { background: linear-gradient(135deg, #fb7185 0%, #dc2626 100%) !important; }

.sub-card__actions {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-left: auto;
    position: relative;
    z-index: 5;
}

.sub-card__check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin: 0;
    cursor: pointer;
    border: 1px solid var(--ehr-border);
    background: transparent;
    border-radius: 6px;
    opacity: 0;
    transition: opacity 120ms ease, border-color 120ms ease, background 120ms ease;
    position: relative;
    z-index: 5;
}
.sub-card__check:hover { border-color: rgba(99, 102, 241, .35); background: var(--ehr-primary-soft); }
.sub-card:hover .sub-card__check,
.sub-card__check:focus-within,
.sub-card .submission-row-check:checked + *,
.sub-card:has(.submission-row-check:checked) .sub-card__check {
    opacity: 1;
}
.sub-card__check input { width: 14px; height: 14px; margin: 0; cursor: pointer; }

/* Star toggle — replaces the bottom-right "open arrow" affordance
   from the provider card. Sized to match .ehr-prov-card__open. */
.sub-card__star-form { margin: 0; padding: 0; }
.sub-card__star-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    color: var(--ehr-text-muted);
    border-radius: 8px;
    cursor: pointer;
    transition: color 120ms ease, background 120ms ease, transform 120ms ease;
    z-index: 5;
    position: relative;
}
.sub-card__star-btn:hover { color: #f59e0b; background: rgba(245, 158, 11, .10); transform: scale(1.08); }
.sub-card__star-btn.is-on { color: #f59e0b; background: rgba(245, 158, 11, .12); }
.sub-card__star-btn.is-on i { filter: drop-shadow(0 0 4px rgba(245, 158, 11, .35)); }

/* Status-pill palette inside the subline — tints the dot to match
   the submission's lifecycle stage. */
.sub-card__status .ehr-loc-card__status-dot { background: var(--ehr-text-muted); }
.sub-card__status--received   .ehr-loc-card__status-dot { background: #0ea5e9; }
.sub-card__status--processing .ehr-loc-card__status-dot { background: #d97706; }
.sub-card__status--reviewed   .ehr-loc-card__status-dot { background: #6366f1; }
.sub-card__status--converted  .ehr-loc-card__status-dot { background: #059669; }
.sub-card__status--archived   .ehr-loc-card__status-dot { background: #64748b; }
.sub-card__status--spam       .ehr-loc-card__status-dot { background: #dc2626; }

.sub-card__pill {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .15rem .5rem;
    font-size: .68rem;
    font-weight: 600;
    border-radius: 999px;
    border: 1px solid transparent;
    line-height: 1.4;
}
.sub-card__pill i { font-size: .68rem; }
.sub-card__pill--unread {
    color: #b45309;
    background: rgba(245, 158, 11, .10);
    border-color: rgba(245, 158, 11, .25);
}
.sub-card__pill--lead {
    color: #047857;
    background: rgba(16, 185, 129, .10);
    border-color: rgba(16, 185, 129, .25);
}

.sub-card__menu {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--ehr-border);
    background: transparent;
    color: var(--ehr-text-muted);
    border-radius: 6px;
    cursor: pointer;
    transition: color 120ms ease, background 120ms ease, border-color 120ms ease;
}
.sub-card__menu i { font-size: 0.7rem; line-height: 1; }
.sub-card__menu:hover {
    color: var(--ehr-primary);
    background: var(--ehr-primary-soft);
    border-color: rgba(99, 102, 241, .25);
}

[data-bs-theme="dark"] .sub-card__check,
[data-theme="dark"] .sub-card__check {
    background: rgba(15, 23, 42, .8);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}

/* Submission detail — sidebar Actions card.
   Mirrors the grouping used in the bulk dropdown so a clinic staff
   member sees the same lifecycle ladder on both list and detail pages. */
.sub-actions-card .sub-actions-group + .sub-actions-group {
    margin-top: .9rem;
    padding-top: .9rem;
    border-top: 1px dashed var(--ehr-border, #e5e7eb);
}
.sub-actions-group__label {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--text-sub, #64748b);
    margin-bottom: .5rem;
}
.sub-actions-group__label i { font-size: .8rem; opacity: .8; }
.sub-actions-group__items {
    display: flex;
    flex-direction: column;
    gap: .35rem;
}
.sub-actions-group__items .btn { text-align: left; }
.sub-actions-group__items .btn > span { flex: 1; }
.sub-actions-group__items .btn > i {
    width: 16px;
    text-align: center;
    font-size: .9rem;
}
.sub-actions-group__items .btn.is-disabled,
.sub-actions-group__items .btn[disabled],
.sub-actions-group__items .btn[aria-disabled="true"] {
    opacity: .5;
    cursor: not-allowed;
    pointer-events: auto;
    box-shadow: none;
}
.sub-actions-group__items .btn.is-disabled:hover,
.sub-actions-group__items .btn[disabled]:hover,
.sub-actions-group__items .btn[aria-disabled="true"]:hover {
    filter: none;
    transform: none;
}

/* ============================================================
   LEAD CARD — overlays the ehr-loc-card / ehr-prov-card skeleton
   with lead-only affordances: status-tinted avatar, score badge,
   priority/converted pills, owner chip in footer. Layout matches
   .sub-card so leads + submissions feel unified.
   ============================================================ */
.lead-card { position: relative; padding-bottom: 0; }
.lead-card .ehr-loc-card__header {
    padding: 0.95rem 1.05rem 0.75rem;
    gap: 0.75rem;
}
.lead-card .ehr-loc-card__header::after { display: none; }
.lead-card .ehr-loc-card__avatar {
    width: 36px; height: 36px;
    border-radius: 0.6rem;
    box-shadow: 0 4px 10px -5px rgba(99, 102, 241, 0.28),
                inset 0 1px 0 rgba(255, 255, 255, 0.20);
}
.lead-card .ehr-loc-card__avatar-initial { font-size: 0.85rem; }
.lead-card .ehr-loc-card__avatar-pin { display: none; }
.lead-card .ehr-loc-card__title { font-size: 0.9rem; line-height: 1.25; }
.lead-card .ehr-loc-card__subline { gap: 0.3rem; font-size: 0.66rem; }

.lead-card .ehr-loc-card__body {
    padding: 0 1.05rem 0;
    gap: 0.75rem;
}
.lead-card .ehr-loc-card__stats {
    gap: 0;
    padding: 0.75rem 0;
    border-top: 1px solid var(--ehr-border);
    border-bottom: 1px solid var(--ehr-border);
    background: transparent;
    align-items: stretch;
}
.lead-card .ehr-loc-card__stat {
    background: transparent !important;
    border: 0 !important;
    padding: 0.2rem 0.75rem !important;
    border-radius: 0 !important;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.2rem !important;
    position: relative;
    min-width: 0;
}
.lead-card .ehr-loc-card__stat + .ehr-loc-card__stat::before {
    content: "";
    position: absolute;
    left: 0; top: 12%; bottom: 12%;
    width: 1px;
    background: var(--ehr-border);
    opacity: 0.7;
}
.lead-card .ehr-loc-card__stat-icon { display: none; }
.lead-card .ehr-loc-card__stat-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.18rem;
    width: 100%;
    min-width: 0;
}
.lead-card .ehr-loc-card__stat-value {
    display: block;
    width: 100%;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.15;
    color: var(--ehr-text);
    letter-spacing: -0.018em;
    max-width: 100%;
    word-break: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.lead-card .ehr-loc-card__stat:nth-child(2) .ehr-loc-card__stat-value,
.lead-card .ehr-loc-card__stat:nth-child(3) .ehr-loc-card__stat-value {
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0;
}
.lead-card .ehr-loc-card__stat-label {
    display: block;
    width: 100%;
    font-size: 0.58rem;
    letter-spacing: 0.08em;
    color: var(--ehr-text-muted);
    text-transform: uppercase;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 0 0 auto;
}
.lead-card .ehr-loc-card__stat.is-zero .ehr-loc-card__stat-value {
    color: var(--ehr-text-muted);
    font-weight: 600;
}

[data-bs-theme="dark"] .lead-card .ehr-loc-card__stats,
[data-theme="dark"] .lead-card .ehr-loc-card__stats {
    border-top-color: rgba(255, 255, 255, 0.06);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

.lead-card.lead-card--urgent { border-color: rgba(220, 38, 38, .35); }
.lead-card.lead-card--urgent::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, #ef4444 0%, #b91c1c 100%);
    border-radius: var(--ehr-radius) 0 0 var(--ehr-radius);
}
.lead-card.lead-card--high { border-color: rgba(217, 119, 6, .35); }
.lead-card.lead-card--high::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, #f59e0b 0%, #d97706 100%);
    border-radius: var(--ehr-radius) 0 0 var(--ehr-radius);
}
.lead-card.lead-card--converted {
    box-shadow: 0 0 0 1px rgba(16, 185, 129, .25), var(--ehr-shadow-sm);
}

.lead-card__avatar[data-status="new"]         { background: linear-gradient(135deg, #94a3b8 0%, #64748b 100%) !important; }
.lead-card__avatar[data-status="contacted"]   { background: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 100%) !important; }
.lead-card__avatar[data-status="qualified"]   { background: linear-gradient(135deg, #818cf8 0%, #4f46e5 100%) !important; }
.lead-card__avatar[data-status="nurturing"]   { background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%) !important; }
.lead-card__avatar[data-status="booked"]      { background: linear-gradient(135deg, #34d399 0%, #10b981 100%) !important; }
.lead-card__avatar[data-status="converted"]   { background: linear-gradient(135deg, #34d399 0%, #059669 100%) !important; }
.lead-card__avatar[data-status="unqualified"] { background: linear-gradient(135deg, #94a3b8 0%, #64748b 100%) !important; }
.lead-card__avatar[data-status="lost"]        { background: linear-gradient(135deg, #fb7185 0%, #dc2626 100%) !important; }
.lead-card__avatar[data-status="duplicate"]   { background: linear-gradient(135deg, #94a3b8 0%, #475569 100%) !important; }

.lead-card__status .ehr-loc-card__status-dot { background: var(--ehr-text-muted); }
.lead-card__status--new         .ehr-loc-card__status-dot { background: #64748b; }
.lead-card__status--contacted   .ehr-loc-card__status-dot { background: #0ea5e9; }
.lead-card__status--qualified   .ehr-loc-card__status-dot { background: #4f46e5; }
.lead-card__status--nurturing   .ehr-loc-card__status-dot { background: #d97706; }
.lead-card__status--booked      .ehr-loc-card__status-dot { background: #10b981; }
.lead-card__status--converted   .ehr-loc-card__status-dot { background: #059669; }
.lead-card__status--unqualified .ehr-loc-card__status-dot { background: #64748b; }
.lead-card__status--lost        .ehr-loc-card__status-dot { background: #dc2626; }
.lead-card__status--duplicate   .ehr-loc-card__status-dot { background: #475569; }

.lead-card__pill {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .15rem .5rem;
    font-size: .68rem;
    font-weight: 600;
    border-radius: 999px;
    border: 1px solid transparent;
    line-height: 1.4;
}
.lead-card__pill i { font-size: .68rem; }
.lead-card__pill--urgent {
    color: #b91c1c;
    background: rgba(239, 68, 68, .10);
    border-color: rgba(239, 68, 68, .25);
}
.lead-card__pill--high {
    color: #b45309;
    background: rgba(245, 158, 11, .10);
    border-color: rgba(245, 158, 11, .25);
}
.lead-card__pill--low {
    color: #475569;
    background: rgba(100, 116, 139, .08);
    border-color: rgba(100, 116, 139, .20);
}
.lead-card__pill--converted {
    color: #047857;
    background: rgba(16, 185, 129, .10);
    border-color: rgba(16, 185, 129, .25);
}

.lead-card__score {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    font-size: .68rem;
    font-weight: 700;
    color: #6d28d9;
    background: rgba(124, 58, 237, .10);
    border: 1px solid rgba(124, 58, 237, .22);
    padding: .15rem .45rem;
    border-radius: 999px;
    flex-shrink: 0;
    align-self: flex-start;
}
.lead-card__score i { font-size: .7rem; }

/* Stacked meta rows: source/email/owner each on own line under title.
   Used when `.ehr-prov-card__where--stacked` is added to the wrap element. */
.ehr-prov-card__where--stacked {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.22rem;
}
.ehr-prov-card__where--stacked > span {
    max-width: 100%;
}

/* Soft pill variant for inline owner/timestamp meta — paired with
   `.ehr-prov-card__where-clinic` to share muted color + ellipsis behavior. */
.lead-card__owner-soft {
    padding: .08rem .45rem;
    border-radius: 999px;
    background: var(--ehr-surface-soft, rgba(15, 23, 42, .04));
    border: 1px solid var(--ehr-border);
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--ehr-text-muted);
}
.lead-card__owner-soft i { font-size: .68rem; opacity: .8; }

/* Specialty dropdown — wider menu, scroll cap so long taxonomy lists
   don't blow past viewport height. */
.ehr-prov-spec-dd__menu.dropdown-menu {
    min-width: 320px;
    max-width: 380px;
}
.ehr-prov-spec-dd__divider {
    height: 1px;
    background: var(--ehr-border);
    margin: 0.45rem 0.4rem;
}
.ehr-prov-spec-dd__scroll {
    max-height: 320px;
    overflow-y: auto;
    padding-right: 0.15rem;
}
.ehr-prov-spec-dd__item-icon {
    background: linear-gradient(135deg, #a78bfa 0%, #6366f1 100%);
}
.ehr-loc-status-dd__trigger--accent {
    border-color: rgba(124, 58, 237, 0.30);
    background: rgba(124, 58, 237, 0.06);
    color: #7c3aed;
}
.ehr-loc-status-dd__trigger--accent .ehr-loc-status-dd__trigger-count {
    background: rgba(124, 58, 237, 0.14);
    color: #7c3aed;
}
.ehr-loc-status-dd__trigger--accent .ehr-loc-status-dd__trigger-icon i {
    color: #7c3aed;
}

/* Compact table — provider avatar takes the brand color via inline
   style; this rule keeps the default gradient when no color is set. */
.ehr-prov-table__avatar {
    background: linear-gradient(135deg, #a78bfa 0%, #6366f1 100%) !important;
    box-shadow: 0 3px 8px rgba(99, 102, 241, 0.25),
                inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
.ehr-prov-table__cred {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ehr-text);
    letter-spacing: -0.01em;
}
.ehr-prov-table__loc-chip {
    background: rgba(96, 165, 250, 0.10) !important;
    color: #1d4ed8 !important;
    border-color: rgba(96, 165, 250, 0.25) !important;
}
.ehr-prov-table__loc-chip i { color: #3b82f6 !important; }
.ehr-prov-table__loc-more {
    margin-left: 0.4rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(96, 165, 250, 0.30);
    color: #1d4ed8;
    font-size: 0.66rem;
    font-weight: 700;
    line-height: 1.5;
    font-variant-numeric: tabular-nums;
}

/* Tighter density for the compact provider table. */
.ehr-loc-tablecard:has(.ehr-prov-table__avatar) .ehr-loc-table thead th,
.ehr-loc-tablecard:has(.ehr-prov-table__avatar) .ehr-loc-table tbody td {
    padding: 0.7rem 0.95rem;
}

/* Dark-mode tints for provider deltas. */
[data-bs-theme="dark"] .ehr-prov-card__cred,
[data-theme="dark"] .ehr-prov-card__cred {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.08);
}
[data-bs-theme="dark"] .ehr-prov-card__open,
[data-theme="dark"] .ehr-prov-card__open {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.10);
}
[data-bs-theme="dark"] .ehr-prov-card__specialty,
[data-theme="dark"] .ehr-prov-card__specialty {
    background: rgba(167, 139, 250, 0.10) !important;
    color: #c4b5fd !important;
    border-color: rgba(167, 139, 250, 0.22) !important;
}
[data-bs-theme="dark"] .ehr-prov-card__sched,
[data-theme="dark"] .ehr-prov-card__sched {
    background: rgba(16, 185, 129, 0.10) !important;
    color: #6ee7b7 !important;
}

/* Digital-form card — sibling of .ehr-prov-card. Tuned for dense, calm
   browsing: a single status chip, a flat 3-up stat row (no boxed tiles),
   and a quiet meta footer. No description block, no duplicate "last
   submission" chip — that fact already lives in the third stat. */
.dform-card.ehr-prov-card { padding-bottom: 0; }
.dform-card .ehr-loc-card__header {
    padding: 0.95rem 1.05rem 0.75rem;
    gap: 0.75rem;
}
.dform-card .ehr-loc-card__header::after { display: none; }
.dform-card .ehr-loc-card__avatar {
    width: 36px; height: 36px;
    border-radius: 0.6rem;
    box-shadow: 0 4px 10px -5px rgba(99, 102, 241, 0.28),
                inset 0 1px 0 rgba(255, 255, 255, 0.20);
}
.dform-card .ehr-loc-card__avatar-initial { font-size: 0.85rem; }
.dform-card .ehr-loc-card__avatar-pin { display: none; }
.dform-card .ehr-loc-card__title { font-size: 0.9rem; line-height: 1.25; }
.dform-card .ehr-loc-card__subline { gap: 0.3rem; font-size: 0.66rem; }
.dform-card .ehr-loc-card__subline .ehr-prov-card__specialty {
    padding: 0.1rem 0.45rem !important;
    font-size: 0.6rem !important;
}

/* Right-edge meta line — replaces the second/third badges in the subline.
   One quiet pill carrying audience (public/private). Type moved here too. */
.dform-card__meta {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.1rem;
    font-size: 0.66rem;
    color: var(--ehr-text-sub);
}
.dform-card__meta-dot {
    width: 3px; height: 3px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.45;
}

/* Body — flat stat row, no surrounding pills. */
.dform-card .ehr-loc-card__body {
    padding: 0 1.05rem 0;
    gap: 0.7rem;
}
.dform-card .ehr-loc-card__stats {
    gap: 0;
    padding: 0.75rem 0;
    border-top: 1px solid var(--ehr-border);
    border-bottom: 1px solid var(--ehr-border);
    background: transparent;
    align-items: stretch;
}
.dform-card .ehr-loc-card__stat {
    background: transparent !important;
    border: 0 !important;
    padding: 0.2rem 0.75rem !important;
    border-radius: 0 !important;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.2rem !important;
    position: relative;
    min-width: 0;
}
.dform-card .ehr-loc-card__stat + .ehr-loc-card__stat::before {
    content: "";
    position: absolute;
    left: 0; top: 12%; bottom: 12%;
    width: 1px;
    background: var(--ehr-border);
    opacity: 0.7;
}
.dform-card .ehr-loc-card__stat-icon { display: none; }
.dform-card .ehr-loc-card__stat-body {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.18rem;
    min-width: 0;
}
.dform-card .ehr-loc-card__stat-value {
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.15;
    color: var(--ehr-text);
    letter-spacing: -0.018em;
    max-width: 100%;
    word-break: normal;
    overflow-wrap: anywhere;
}
.dform-card .ehr-loc-card__stat:nth-child(3) .ehr-loc-card__stat-value {
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0;
}
.dform-card .ehr-loc-card__stat-label {
    font-size: 0.58rem;
    letter-spacing: 0.08em;
    color: var(--ehr-text-muted);
    text-transform: uppercase;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    flex: 0 0 auto;
}
.dform-card .ehr-loc-card__stat.is-zero .ehr-loc-card__stat-value {
    color: var(--ehr-text-muted);
}

/* Quiet footer line — slug only when present, else nothing. No dashed
   divider, no redundant "last submission" chip. */
.dform-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    min-height: 1.4rem;
    font-size: 0.68rem;
    color: var(--ehr-text-muted);
}
.dform-card__slug {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--ehr-text-sub);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}
.dform-card__auto {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.08rem 0.4rem;
    border-radius: 999px;
    background: rgba(99, 102, 241, 0.10);
    color: #4f46e5;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    flex-shrink: 0;
}
.dform-card__auto i { font-size: 0.62rem; }

/* Paused / private state — desaturate the avatar gradient. */
.dform-card--paused .ehr-loc-card__avatar { filter: grayscale(0.55) opacity(0.85); }

[data-bs-theme="dark"] .dform-card .ehr-loc-card__stats,
[data-theme="dark"] .dform-card .ehr-loc-card__stats {
    border-top-color: rgba(255, 255, 255, 0.06);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}
[data-bs-theme="dark"] .dform-card .ehr-loc-card__stat + .ehr-loc-card__stat::before,
[data-theme="dark"] .dform-card .ehr-loc-card__stat + .ehr-loc-card__stat::before {
    background: rgba(255, 255, 255, 0.06);
}
[data-bs-theme="dark"] .dform-card__auto,
[data-theme="dark"] .dform-card__auto {
    background: rgba(129, 140, 248, 0.14);
    color: #a5b4fc;
}

.dform-card-grid,
.sub-card-grid {
    --bs-gutter-x: 1.25rem;
    --bs-gutter-y: 1.25rem;
}
@media (min-width: 1200px) {
    .dform-card-grid,
    .sub-card-grid {
        --bs-gutter-x: 1.5rem;
        --bs-gutter-y: 1.5rem;
    }
}
@media (max-width: 575.98px) {
    .dform-card-grid,
    .sub-card-grid {
        --bs-gutter-x: 0.85rem;
        --bs-gutter-y: 0.85rem;
    }
}

.provider-toolbar { row-gap: 0.5rem; }
.provider-toolbar__sync-group {
    align-items: center;
}
.provider-toolbar__synced {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    color: var(--ds-text-muted, #6b7280);
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    background: rgba(99, 102, 241, 0.06);
    border: 1px solid rgba(99, 102, 241, 0.14);
}
.provider-toolbar__synced i { font-size: 0.75rem; color: #6366f1; }

.provider-row-synced {
    font-size: 0.78rem;
    color: var(--ds-text-muted, #6b7280);
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-variant-numeric: tabular-nums;
}
.provider-row-synced i { font-size: 0.7rem; opacity: 0.75; }

[data-bs-theme="dark"] .provider-toolbar__synced,
[data-theme="dark"] .provider-toolbar__synced {
    background: rgba(99, 102, 241, 0.10);
    border-color: rgba(99, 102, 241, 0.22);
    color: #cbd5e1;
}
[data-bs-theme="dark"] .provider-toolbar__synced i,
[data-theme="dark"] .provider-toolbar__synced i { color: #a5b4fc; }
[data-bs-theme="dark"] .provider-row-synced,
[data-theme="dark"] .provider-row-synced { color: #94a3b8; }

/* ── Location row card (provider-card sibling) ─────────────── */
.loc-row-card { position: relative; }
.loc-row-card .ehr-loc-card__avatar {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
}
.loc-row-card .ehr-loc-card__avatar img,
.loc-row-card__avatar-img {
    width: 100%; height: 100%;
    object-fit: cover;
    border-radius: inherit;
    display: block;
}
.ehr-loc-card__status--closed {
    background: rgba(239, 68, 68, 0.10);
    color: #b91c1c;
}
[data-bs-theme="dark"] .ehr-loc-card__status--closed,
[data-theme="dark"] .ehr-loc-card__status--closed {
    background: rgba(239, 68, 68, 0.16);
    color: #fca5a5;
}
.loc-row-card__actions {
    position: absolute;
    bottom: 0.6rem;
    right: 0.7rem;
    display: inline-flex;
    gap: 0.3rem;
    opacity: 0;
    transform: translateY(2px);
    transition: opacity 160ms ease, transform 160ms ease;
    z-index: 3;
}
.loc-row-card:hover .loc-row-card__actions,
.loc-row-card:focus-within .loc-row-card__actions {
    opacity: 1;
    transform: translateY(0);
}
.loc-row-card__action {
    width: 26px; height: 26px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(15, 23, 42, 0.08);
    color: #475569;
    font-size: 0.78rem;
    text-decoration: none;
    box-shadow: 0 4px 10px -4px rgba(15, 23, 42, 0.18);
    transition: background-color 140ms ease, color 140ms ease, border-color 140ms ease, transform 140ms ease;
}
.loc-row-card__action:hover {
    background: #6366f1;
    color: #ffffff;
    border-color: #6366f1;
    transform: translateY(-1px);
}
.loc-row-card__action--danger:hover {
    background: #ef4444;
    border-color: #ef4444;
}
[data-bs-theme="dark"] .loc-row-card__action,
[data-theme="dark"] .loc-row-card__action {
    background: rgba(30, 35, 50, 0.94);
    border-color: rgba(255, 255, 255, 0.10);
    color: #cbd5e1;
}
[data-bs-theme="dark"] .loc-row-card__action:hover,
[data-theme="dark"] .loc-row-card__action:hover {
    background: #6366f1;
    color: #ffffff;
    border-color: #6366f1;
}
[data-bs-theme="dark"] .loc-row-card__action--danger:hover,
[data-theme="dark"] .loc-row-card__action--danger:hover {
    background: #ef4444;
    border-color: #ef4444;
}
@media (max-width: 359.98px) {
    .ehr-loc-card__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.3rem; }
    .ehr-loc-card__stat { padding: 0.45rem 0.4rem; }
    .ehr-loc-card__stat-value { font-size: 0.92rem; }
    .ehr-loc-card__stat-label { font-size: 0.58rem; letter-spacing: 0.04em; }
}

/* ── Patient table tweaks ────────────────────────────────── */
.ehr-patient-table tbody tr {
    transition: background-color 100ms ease;
}

.ehr-patient-table tbody tr:hover {
    background: var(--ehr-bg-soft);
}

/* Patient detail: label column on the demographics table
   (extracted from inline style="width: 180px") */
.ehr-patient-detail__label { width: 180px; }

.ehr-patient-detail__table td {
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    vertical-align: middle;
}

.ehr-patient-detail__email {
    color: var(--ehr-primary);
    text-decoration: none;
    word-break: break-all;
}

.ehr-patient-detail__email:hover {
    text-decoration: underline;
}

.ehr-patient-detail__empty {
    color: var(--ehr-text-muted);
    font-size: 1rem;
    line-height: 1;
}

/* ── Appointment list (comfortable rows) ─────────────────── */
.ehr-appt-list {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.ehr-appt-row {
    border: 1px solid var(--ehr-border) !important;
    border-radius: var(--ehr-radius-sm) !important;
    transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.ehr-appt-row:hover {
    border-color: var(--ehr-border-strong) !important;
    box-shadow: var(--ehr-shadow-sm);
    transform: translateY(-1px);
}

.ehr-appt-row__when {
    background: var(--ehr-bg-soft);
    border-radius: var(--ehr-radius-sm);
    padding: 0.55rem 0.6rem;
    line-height: 1.2;
    border: 1px solid var(--ehr-border);
}

.ehr-appt-row__entities a {
    border-bottom: 1px dotted transparent;
    transition: border-color 100ms ease;
}

.ehr-appt-row__entities a:hover {
    border-bottom-color: var(--ehr-primary);
}

.ehr-appt-row__reason {
    color: var(--ehr-text-muted);
}

/* ── Empty states ────────────────────────────────────────── */
.ehr-empty {
    color: var(--ehr-text-sub);
}

.ehr-empty .display-4,
.ehr-empty .display-5,
.ehr-empty .display-6 {
    color: var(--ehr-text-muted);
}

/* ── Appointment list specific tweaks ────────────────────── */
.ehr-appt-row__when { min-width: 96px; }

/* ============================================================
   APPOINTMENT CALENDAR — day / week / month / year layouts
   ============================================================ */

/* Status colour palette (matches appointment_status_options) */
:root {
    --ehr-cal-primary:   #0069a6;
    --ehr-cal-info:      #0891b2;
    --ehr-cal-success:   #16a34a;
    --ehr-cal-danger:    #dc2626;
    --ehr-cal-warning:   #d97706;
    --ehr-cal-secondary: #64748b;
}

/* ── Calendar shell ─────────────────────────────────────── */
.ehr-cal {
    border: 1px solid var(--ehr-border) !important;
    border-radius: var(--ehr-radius) !important;
    overflow: hidden;
}

.ehr-cal__header {
    background: var(--ehr-bg-soft);
    border-bottom: 1px solid var(--ehr-border);
}

.ehr-cal__label {
    font-size: 1.1rem;
    letter-spacing: -0.01em;
}

.ehr-cal__nav .btn {
    border-color: var(--ehr-border-strong);
    color: var(--ehr-text-sub);
}

.ehr-cal__nav .btn.active {
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
    border-color: var(--ehr-primary);
}

.ehr-chip--period.is-active {
    background: var(--ehr-primary);
    border-color: var(--ehr-primary);
    color: #fff;
}

/* Status legend dot — also reused by status chip rows */
.ehr-cal-dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
}

.ehr-cal__legend { background: var(--ehr-bg); }

/* ── Month grid ─────────────────────────────────────────── */
.ehr-cal-month {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-sm);
    overflow: hidden;
    background: var(--ehr-bg);
}

.ehr-cal-month__head {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    background: var(--ehr-bg-soft);
    border-bottom: 1px solid var(--ehr-border);
}

.ehr-cal-month__head-cell {
    padding: 0.5rem 0.6rem;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ehr-text-muted);
    text-align: left;
    border-right: 1px solid var(--ehr-border);
}

.ehr-cal-month__head-cell:last-child { border-right: 0; }

.ehr-cal-month__body {
    display: flex;
    flex-direction: column;
}

.ehr-cal-month__row {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    border-top: 1px solid var(--ehr-border);
}

.ehr-cal-month__row:first-child { border-top: 0; }

.ehr-cal-month__day {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-height: 116px;
    padding: 0.5rem 0.55rem;
    background: var(--ehr-bg);
    color: var(--ehr-text);
    text-decoration: none;
    border-right: 1px solid var(--ehr-border);
    transition: background-color 120ms ease, box-shadow 120ms ease;
    position: relative;
}

.ehr-cal-month__day:last-child { border-right: 0; }

.ehr-cal-month__day:hover {
    background: var(--ehr-bg-soft);
    box-shadow: inset 0 0 0 2px var(--ehr-primary);
    z-index: 1;
}

.ehr-cal-month__day.is-other-month {
    background: var(--ehr-bg-muted);
    color: var(--ehr-text-muted);
}

.ehr-cal-month__day.is-today {
    background: var(--ehr-primary-soft);
}

.ehr-cal-month__day.is-today .ehr-cal-month__day-num {
    background: var(--ehr-primary);
    color: #fff;
    border-radius: 999px;
    padding: 0 0.45rem;
}

.ehr-cal-month__day.is-empty:hover { box-shadow: inset 0 0 0 1px var(--ehr-border-strong); }

.ehr-cal-month__day-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
}

.ehr-cal-month__day-num {
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.2;
}

.ehr-cal-month__day-count {
    font-size: 0.65rem;
    padding: 0.1rem 0.4rem;
    font-weight: 500;
}

.ehr-cal-month__day-events {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-height: 0;
}

.ehr-cal-event {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    padding: 1px 0.35rem;
    border-radius: 4px;
    font-size: 0.68rem;
    line-height: 1.4;
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.ehr-cal-event__time {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.ehr-cal-event__label {
    overflow: hidden;
    text-overflow: ellipsis;
}

.ehr-cal-event--more {
    color: var(--ehr-text-muted);
    background: transparent;
    padding: 1px 0;
    font-weight: 600;
}

/* Per-status fills — used by .ehr-cal-event AND .ehr-cal-event-block */
.ehr-cal-event--primary,   .ehr-cal-event-block--primary   { background: var(--ehr-cal-primary); }
.ehr-cal-event--info,      .ehr-cal-event-block--info      { background: var(--ehr-cal-info); }
.ehr-cal-event--success,   .ehr-cal-event-block--success   { background: var(--ehr-cal-success); }
.ehr-cal-event--danger,    .ehr-cal-event-block--danger    { background: var(--ehr-cal-danger); }
.ehr-cal-event--warning,   .ehr-cal-event-block--warning   { background: var(--ehr-cal-warning); }
.ehr-cal-event--secondary, .ehr-cal-event-block--secondary { background: var(--ehr-cal-secondary); }

/* ── Week grid ──────────────────────────────────────────── */
.ehr-cal-week {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-sm);
    overflow: hidden;
    background: var(--ehr-bg);
}

.ehr-cal-week__head {
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr);
    background: var(--ehr-bg-soft);
    border-bottom: 1px solid var(--ehr-border);
}

.ehr-cal-week__head-cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 0.55rem 0.35rem;
    border-right: 1px solid var(--ehr-border);
    color: var(--ehr-text-sub);
    text-decoration: none;
    transition: background-color 120ms ease;
}

.ehr-cal-week__head-cell:last-child { border-right: 0; }
.ehr-cal-week__head-cell:hover { background: var(--ehr-primary-soft); color: var(--ehr-primary); }

.ehr-cal-week__head-cell.is-today {
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
}

.ehr-cal-week__head-day {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
}

.ehr-cal-week__head-num {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--ehr-text);
    line-height: 1;
}

.ehr-cal-week__head-cell.is-today .ehr-cal-week__head-num { color: var(--ehr-primary); }

.ehr-cal-week__head-count { line-height: 1; font-size: 0.65rem; }

.ehr-cal-week__hour-gutter { background: transparent; }

.ehr-cal-week__body {
    position: relative;
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr);
    height: 660px;
}

.ehr-cal-week__hours {
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--ehr-border);
}

.ehr-cal-week__hour-cell {
    flex: 1 1 0;
    border-bottom: 1px dashed var(--ehr-border);
    position: relative;
    padding-right: 0.4rem;
}

.ehr-cal-week__hour-label {
    position: absolute;
    top: -8px;
    right: 6px;
    font-size: 0.65rem;
    color: var(--ehr-text-muted);
    background: var(--ehr-bg);
    padding: 0 4px;
}

.ehr-cal-week__col {
    position: relative;
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--ehr-border);
}

.ehr-cal-week__col:last-child { border-right: 0; }

.ehr-cal-week__col.is-today { background: rgba(0, 105, 166, 0.04); }

.ehr-cal-week__slot {
    flex: 1 1 0;
    border-bottom: 1px dashed var(--ehr-border);
}

/* Event blocks (week + day) */
.ehr-cal-event-block {
    position: absolute;
    left: 4px;
    right: 4px;
    border-radius: 6px;
    padding: 4px 6px;
    color: #fff;
    text-decoration: none;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
    font-size: 0.7rem;
    line-height: 1.3;
    transition: transform 120ms ease, box-shadow 120ms ease;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ehr-cal-event-block:hover {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(15, 23, 42, 0.18);
    z-index: 2;
}

.ehr-cal-event-block__time {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.ehr-cal-event-block__label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ehr-cal-event-block__meta {
    opacity: 0.9;
    font-size: 0.65rem;
}

/* ── Day timeline ───────────────────────────────────────── */
.ehr-cal-day {
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-sm);
    overflow: hidden;
    background: var(--ehr-bg);
}

.ehr-cal-day__head {
    padding: 0.85rem 1rem;
    background: var(--ehr-bg-soft);
    border-bottom: 1px solid var(--ehr-border);
}

.ehr-cal-day__head.is-today {
    background: var(--ehr-primary-soft);
}

.ehr-cal-day__body {
    position: relative;
    display: grid;
    grid-template-columns: 60px 1fr;
    height: 720px;
}

.ehr-cal-day__hours {
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--ehr-border);
}

.ehr-cal-day__hour-cell {
    flex: 1 1 0;
    border-bottom: 1px dashed var(--ehr-border);
    position: relative;
}

.ehr-cal-day__hour-label {
    position: absolute;
    top: -8px;
    right: 6px;
    font-size: 0.7rem;
    color: var(--ehr-text-muted);
    background: var(--ehr-bg);
    padding: 0 4px;
}

.ehr-cal-day__col {
    position: relative;
    display: flex;
    flex-direction: column;
}

.ehr-cal-day__slot {
    flex: 1 1 0;
    border-bottom: 1px dashed var(--ehr-border);
}

.ehr-cal-event-block--day {
    left: 12px;
    right: 12px;
    padding: 8px 12px;
    font-size: 0.78rem;
}

/* ── Year heatmap ───────────────────────────────────────── */
.ehr-cal-year {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 1rem;
}

.ehr-cal-year__month {
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-sm);
    background: var(--ehr-bg);
    padding: 0.65rem 0.7rem;
}

.ehr-cal-year__month-head {
    margin-bottom: 0.4rem;
}

.ehr-cal-year__weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    font-size: 0.55rem;
    color: var(--ehr-text-muted);
    text-align: center;
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
}

.ehr-cal-year__days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}

.ehr-cal-year__day {
    aspect-ratio: 1 / 1;
    border-radius: 3px;
    background: var(--ehr-bg-muted);
    transition: transform 100ms ease, box-shadow 100ms ease;
    text-decoration: none;
}

.ehr-cal-year__day:hover {
    transform: scale(1.4);
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.18);
    z-index: 1;
}

.ehr-cal-year__day.is-faded { opacity: 0.25; }
.ehr-cal-year__day.is-today { box-shadow: inset 0 0 0 2px var(--ehr-primary); }

/* Heatmap intensities (GitHub-style) */
.ehr-cal-year__day--lvl0 { background: var(--ehr-bg-muted); }
.ehr-cal-year__day--lvl1 { background: rgba(0, 105, 166, 0.20); }
.ehr-cal-year__day--lvl2 { background: rgba(0, 105, 166, 0.45); }
.ehr-cal-year__day--lvl3 { background: rgba(0, 105, 166, 0.70); }
.ehr-cal-year__day--lvl4 { background: rgba(0, 105, 166, 1.00); }

/* ── Calendar skeleton (lazy-load placeholder) ───────────── */
.ehr-cal-skeleton-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 1rem;
}

.ehr-cal-skeleton-month {
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-sm);
    background: var(--ehr-bg);
    padding: 0.65rem 0.7rem;
}

.ehr-cal-skeleton-cells {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    margin-top: 0.5rem;
}

.ehr-cal-skeleton-cell {
    aspect-ratio: 1 / 1;
    border-radius: 3px;
    background: linear-gradient(110deg, rgba(15, 23, 42, 0.06) 8%, rgba(15, 23, 42, 0.12) 18%, rgba(15, 23, 42, 0.06) 33%);
    background-size: 200% 100%;
    animation: patient-skeleton-shimmer 1.5s linear infinite;
}

[data-bs-theme="dark"] .ehr-cal-skeleton-cell,
[data-theme="dark"] .ehr-cal-skeleton-cell {
    background: linear-gradient(110deg, rgba(148, 163, 184, 0.10) 8%, rgba(148, 163, 184, 0.20) 18%, rgba(148, 163, 184, 0.10) 33%);
    background-size: 200% 100%;
}

.ehr-cal-skeleton-month-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.ehr-cal-skeleton-day {
    aspect-ratio: 7 / 5;
    border-radius: 6px;
    background: linear-gradient(110deg, rgba(15, 23, 42, 0.06) 8%, rgba(15, 23, 42, 0.12) 18%, rgba(15, 23, 42, 0.06) 33%);
    background-size: 200% 100%;
    animation: patient-skeleton-shimmer 1.5s linear infinite;
}

[data-bs-theme="dark"] .ehr-cal-skeleton-day,
[data-theme="dark"] .ehr-cal-skeleton-day {
    background: linear-gradient(110deg, rgba(148, 163, 184, 0.10) 8%, rgba(148, 163, 184, 0.20) 18%, rgba(148, 163, 184, 0.10) 33%);
    background-size: 200% 100%;
}

.ehr-cal-skeleton-timeline {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ehr-cal-skeleton-hour {
    display: grid;
    grid-template-columns: 56px 1fr;
    align-items: center;
    gap: 0.75rem;
    min-height: 28px;
}

.ehr-cal-skeleton-hour .patient-skeleton__bar {
    height: 20px;
    border-radius: 4px;
}

@media (prefers-reduced-motion: reduce) {
    .ehr-cal-skeleton-cell,
    .ehr-cal-skeleton-day { animation: none; }
}

/* ============================================================
   APPOINTMENT PAGE LAYOUT — 2027 SaaS-style command bar
   Filters (cmdbar) → Active strip → Controls → Result line → Body
   ============================================================ */

/* ── Filter command bar (Clinic / Location / Status rows) ─ */
.ehr-cmdbar {
    border: 1px solid var(--ehr-border) !important;
    border-radius: var(--ehr-radius) !important;
    overflow: hidden;
    box-shadow: var(--ehr-shadow-sm);
    position: sticky;
    top: 0.5rem;
    z-index: 5;
    backdrop-filter: blur(8px);
    background: rgba(255, 255, 255, 0.92) !important;
}

[data-bs-theme="dark"] .ehr-cmdbar,
[data-theme="dark"] .ehr-cmdbar {
    background: rgba(30, 41, 59, 0.92) !important;
}

.ehr-cmdbar__row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 0.85rem;
    border-bottom: 1px solid var(--ehr-border);
    flex-wrap: wrap;
    min-height: 52px;
}

.ehr-cmdbar__row:last-child { border-bottom: 0; }
.ehr-cmdbar__row:hover { background: var(--ehr-bg-soft); }

.ehr-cmdbar__row-label {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ehr-text-muted);
    flex-shrink: 0;
    min-width: 72px;
}

.ehr-cmdbar__row-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    flex: 1 1 auto;
    min-width: 0;
}

/* The embedded clinic chip strip lives inside cmdbar__row, so it inherits
   the row's flex layout — no own background or padding needed. */
.ehr-cmdbar__row > .ehr-chip-strip-label {
    /* Promote the clinic strip's inline label to match cmdbar's column rhythm */
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ehr-text-muted);
    flex-shrink: 0;
    min-width: 72px;
    margin-right: 0;
}

/* ── Active filters summary bar ──────────────────────────── */
.ehr-active-filters {
    padding: 0.5rem 0.85rem;
    background: linear-gradient(180deg, var(--ehr-bg-soft) 0%, var(--ehr-bg) 100%);
    border: 1px dashed var(--ehr-border-strong);
    border-radius: var(--ehr-radius-sm);
}

.ehr-active-filters__label {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ehr-text-muted);
}

.ehr-active-filter {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.28rem 0.65rem;
    font-size: 0.74rem;
    font-weight: 500;
    line-height: 1.2;
    color: var(--ehr-text);
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border-strong);
    border-radius: var(--ehr-radius-pill);
    text-decoration: none;
    transition: background-color 100ms ease, color 100ms ease, border-color 100ms ease, transform 100ms ease;
}

.ehr-active-filter:hover {
    background: rgba(220, 38, 38, 0.08);
    color: var(--ehr-danger);
    border-color: rgba(220, 38, 38, 0.35);
    transform: translateY(-1px);
}

.ehr-active-filter:hover .ehr-active-filter__value { color: var(--ehr-danger); }

.ehr-active-filter__label {
    color: var(--ehr-text-muted);
    font-weight: 500;
}

.ehr-active-filter__value {
    color: var(--ehr-text);
    font-weight: 600;
}

.ehr-active-filter--clear {
    background: transparent;
    border-color: transparent;
    color: var(--ehr-text-muted);
    font-weight: 600;
}

.ehr-active-filter--clear:hover {
    background: var(--ehr-danger);
    color: #fff;
    border-color: var(--ehr-danger);
}

/* ── Controls bar (View · Density · Search · Advanced) ───── */
.ehr-controls-bar {
    border: 1px solid var(--ehr-border) !important;
    border-radius: var(--ehr-radius-sm) !important;
    overflow: hidden;
}

.ehr-controls-bar__row {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.65rem 0.85rem;
    flex-wrap: wrap;
}

.ehr-controls-bar__group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ehr-controls-bar__group .btn-group .btn {
    border-color: var(--ehr-border-strong);
    color: var(--ehr-text-sub);
    font-weight: 500;
}

.ehr-controls-bar__group .btn-group .btn.active {
    background: var(--ehr-primary);
    color: #fff;
    border-color: var(--ehr-primary);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.ehr-controls-bar__search {
    flex: 1 1 280px;
    margin: 0;
    min-width: 220px;
    margin-left: auto;
}

.ehr-controls-bar__search .input-group-text {
    border-color: var(--ehr-border-strong);
}

.ehr-controls-bar__search .form-control {
    border-color: var(--ehr-border-strong);
}

.ehr-controls-bar__search .form-control:focus {
    border-color: var(--ehr-primary);
    box-shadow: 0 0 0 0.15rem var(--ehr-primary-soft);
    z-index: 3;
}

/* Native disclosure for advanced UID lookups */
.ehr-controls-bar__advanced {
    border-top: 1px dashed var(--ehr-border);
    background: var(--ehr-bg-soft);
}

.ehr-controls-bar__advanced-summary {
    cursor: pointer;
    padding: 0.5rem 0.85rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ehr-text-sub);
    user-select: none;
    list-style: none;
    transition: background-color 100ms ease, color 100ms ease;
}

.ehr-controls-bar__advanced-summary::-webkit-details-marker { display: none; }

.ehr-controls-bar__advanced-summary::before {
    content: '▸';
    display: inline-block;
    margin-right: 0.4rem;
    transition: transform 150ms ease;
    color: var(--ehr-text-muted);
}

.ehr-controls-bar__advanced[open] > .ehr-controls-bar__advanced-summary::before {
    transform: rotate(90deg);
}

.ehr-controls-bar__advanced-summary:hover {
    color: var(--ehr-primary);
    background: var(--ehr-bg);
}

.ehr-controls-bar__advanced-form {
    padding: 0.5rem 0.85rem 0.85rem;
}

/* ── Result summary line ─────────────────────────────────── */
.ehr-result-summary {
    padding: 0.4rem 0.25rem;
    font-size: 0.85rem;
    color: var(--ehr-text-sub);
}

.ehr-result-summary strong {
    font-size: 1rem;
    font-weight: 700;
    color: var(--ehr-text);
    font-variant-numeric: tabular-nums;
}

.ehr-result-summary__sep {
    color: var(--ehr-text-muted);
    opacity: 0.5;
}

/* ── Calendar header: date picker + nav wrap ─────────────── */
.ehr-cal__nav-wrap { row-gap: 0.4rem; }

.ehr-cal__date-form { margin: 0; }

.ehr-cal-datepicker {
    width: auto;
    min-width: 150px;
    font-variant-numeric: tabular-nums;
    border-color: var(--ehr-border-strong);
    cursor: pointer;
}

.ehr-cal-datepicker:hover { border-color: var(--ehr-primary); }
.ehr-cal-datepicker:focus { border-color: var(--ehr-primary); box-shadow: 0 0 0 0.15rem var(--ehr-primary-soft); }

/* ── Calendar status legend with counts ──────────────────── */
.ehr-cal-legend-item {
    padding: 0.18rem 0.45rem;
    border-radius: var(--ehr-radius-pill);
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    line-height: 1.2;
}

.ehr-cal-legend-item__label { font-weight: 500; }

.ehr-cal-legend-item__count {
    font-size: 0.68rem;
    padding: 0.05rem 0.35rem;
    margin-left: 0.1rem;
    font-weight: 600;
}

.ehr-cal-legend-total {
    padding: 0.32rem 0.65rem;
    border-radius: var(--ehr-radius-pill);
    font-weight: 600;
    font-size: 0.78rem;
}

.ehr-cal-legend-total i { margin-right: 0.35rem; }

/* ── Provider swatch (month grid) + initial badge (week/day) ─ */
.ehr-cal-event__provider-swatch {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.45);
}

.ehr-cal-event-block__provider {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.65rem;
    overflow: hidden;
}

.ehr-cal-event-block__provider-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    background: var(--ehr-cal-secondary);
    color: #fff;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}

.ehr-cal-event-block__type {
    font-size: 0.62rem !important;
    padding: 0.15rem 0.4rem !important;
}

.ehr-cal-event-block__reason {
    color: rgba(255, 255, 255, 0.85) !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ehr-cal-event-block__meta {
    color: rgba(255, 255, 255, 0.85) !important;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 575.98px) {
    .ehr-chip-strip { flex-wrap: wrap; padding: 0.5rem; }
    .ehr-chip-row { padding: 0.35rem 0.1rem; }
    .ehr-chip { font-size: 0.72rem; padding: 0.28rem 0.55rem; }
    .ehr-prov-grid { grid-template-columns: 1fr; }
    .ehr-appt-row__when { width: 100%; text-align: left !important; }
    .ehr-cal-month__day { min-height: 76px; padding: 0.35rem; }
    .ehr-cal-event { font-size: 0.6rem; }
    .ehr-cal-week__body, .ehr-cal-day__body { height: 520px; }
    .ehr-cal-week__head { grid-template-columns: 38px repeat(7, 1fr); }
    .ehr-cal-week__body { grid-template-columns: 38px repeat(7, 1fr); }
    .ehr-cal-day__body { grid-template-columns: 44px 1fr; }
    .ehr-cal-datepicker { min-width: 130px; }
    .ehr-active-filters { padding: 0.4rem 0.5rem; }
    .ehr-active-filter { font-size: 0.68rem; padding: 0.2rem 0.5rem; }
    .ehr-cmdbar { position: static; backdrop-filter: none; }
    .ehr-cmdbar__row { padding: 0.5rem 0.6rem; min-height: 44px; }
    .ehr-cmdbar__row-label,
    .ehr-cmdbar__row > .ehr-chip-strip-label { min-width: 60px; font-size: 0.65rem; }
    .ehr-controls-bar__row { padding: 0.5rem 0.6rem; gap: 0.6rem; }
    .ehr-controls-bar__search { flex: 1 1 100%; margin-left: 0; }
}

/* ── HTMX loading indicator ───────────────────────────────────
   The ``.htmx-request`` class is added by HTMX (via ``hx-indicator``)
   to whichever element points at this spinner while a request is in
   flight. Default state is hidden so the indicator only appears
   during chip / pagination / search swaps.
   ──────────────────────────────────────────────────────────── */
.ehr-loading-indicator {
    display: none;
    margin-left: 0.5rem;
    vertical-align: middle;
}
.htmx-request .ehr-loading-indicator,
.htmx-request.ehr-loading-indicator {
    display: inline-block;
}
#ehr-results-region.htmx-swapping {
    opacity: 0.55;
    transition: opacity 120ms ease-in-out;
}

/* ============ ACTIVE CLINIC CONTEXT ============
   Surfaces the currently scoped ?clinic=<slug> on every EHR page.
   Two surfaces share this language:
     1. ``.ehr-active-clinic-badge`` — rendered just under the title card by
        the ``{% ehr_active_clinic_badge %}`` template tag. Acts as the
        primary "you are filtered to X" indicator.
     2. ``.ehr-active-clinic-pill`` — rendered inside the unified filter
        bar by ``_clinic_chip_strip.html`` when a clinic is already active,
        replacing the full chip picker (which is now redundant with the
        sidebar's clinic switcher).

   Both reuse the existing ``ehr-chip--clinic.is-active`` color so the
   "selected clinic" visual stays consistent. Small × dismiss link clears
   the ``?clinic=`` query param while preserving every other filter. */

.ehr-active-clinic-badge-row {
    margin: 0.5rem 0 0.75rem;
}

.ehr-active-clinic-badge,
.ehr-active-clinic-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.32rem 0.5rem 0.32rem 0.75rem;
    font-size: 0.78rem;
    font-weight: 500;
    color: #fff;
    background: #0069a6; /* matches .ehr-chip--clinic.is-active */
    border: 1px solid #0069a6;
    border-radius: var(--ehr-radius-pill);
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(0, 105, 166, 0.15);
}

.ehr-active-clinic-badge i,
.ehr-active-clinic-pill i {
    font-size: 0.9em;
    opacity: 0.9;
}

.ehr-active-clinic-badge__label,
.ehr-active-clinic-pill__label {
    opacity: 0.75;
    font-weight: 400;
    letter-spacing: 0.01em;
}

.ehr-active-clinic-badge__name,
.ehr-active-clinic-pill__name {
    font-weight: 600;
}

.ehr-active-clinic-badge__dismiss,
.ehr-active-clinic-pill__dismiss {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.15rem;
    height: 1.15rem;
    margin-left: 0.25rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    text-decoration: none;
    line-height: 1;
    transition: background-color 120ms ease, transform 120ms ease;
}

.ehr-active-clinic-badge__dismiss:hover,
.ehr-active-clinic-pill__dismiss:hover {
    background: rgba(255, 255, 255, 0.32);
    color: #fff;
    transform: scale(1.06);
}

.ehr-active-clinic-badge__dismiss i,
.ehr-active-clinic-pill__dismiss i {
    font-size: 0.65rem;
    opacity: 1;
}

/* Collapsed chip-strip variant — when the strip is showing only the active
   pill (no chip picker), drop the row chrome down to match the pill height
   so it sits flush with the surrounding filter bar. */
.ehr-chip-strip--collapsed {
    align-items: center;
}

/* ============================================================
   EHR Clinic Switcher — modern centered dropdown selector.
   Conceptual neighbor of the active-clinic pill above: this is
   the surface users actually click to scope every EHR page.
   Rendered by ``templates/ehr_mirror/partials/_clinic_chip_strip.html``
   (filename kept for backward compat with all 14 list templates).

   Two layout modes share the same trigger / menu:
     • Standalone (``.ehr-clinic-switcher``) — centered pill bar that
       sits above the filter card on clinic_list / location_list.
     • Embedded (``.ehr-clinic-switcher--embedded``) — flush inline
       row dropped inside the unified filter bar on patient_list,
       transaction_list, etc. via ``embedded=True``.
   ============================================================ */
.ehr-clinic-switcher {
    --ehr-clinic-trigger-max: 520px;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.55rem 0.85rem;
    margin: 0.25rem 0 1rem;
    background: linear-gradient(180deg, var(--ehr-bg) 0%, var(--ehr-bg-soft) 100%);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius);
    box-shadow: var(--ehr-shadow-sm);
    position: relative;
}

.ehr-clinic-switcher::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: radial-gradient(120% 200% at 50% -40%, rgba(0, 105, 166, 0.08), transparent 60%);
    opacity: 0.9;
}

.ehr-clinic-switcher.is-scoped {
    border-color: rgba(0, 105, 166, 0.30);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 6px 18px rgba(0, 105, 166, 0.08);
}

.ehr-clinic-switcher--embedded {
    --ehr-clinic-trigger-max: 320px;
    margin: 0;
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
    border-radius: 0;
    flex: 0 0 auto;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.ehr-clinic-switcher--embedded::before { display: none; }

.ehr-clinic-switcher__lead,
.ehr-clinic-switcher__trail {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
    z-index: 1;
}

.ehr-clinic-switcher__eyebrow-dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #94a3b8;
    box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.18);
}

.ehr-clinic-switcher.is-scoped .ehr-clinic-switcher__eyebrow-dot {
    background: var(--ehr-primary);
    box-shadow: 0 0 0 3px var(--ehr-primary-soft);
    animation: ehr-clinic-pulse 2.4s ease-in-out infinite;
}

@keyframes ehr-clinic-pulse {
    0%, 100% { box-shadow: 0 0 0 3px var(--ehr-primary-soft); }
    50%      { box-shadow: 0 0 0 5px rgba(0, 105, 166, 0.10); }
}

.ehr-clinic-switcher__eyebrow {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.10em;
    color: var(--ehr-text-muted);
}

/* ── Trigger button (the visible centered pill) ──────────── */
/* Wrapper shrinks to the trigger's max width and centers itself in the
   row via margin auto. This keeps the Popper reference (the toggle) and
   the menu the same width on every viewport, so the menu's left/right
   edges always align with the trigger's. */
.ehr-clinic-switcher__dropdown {
    flex: 0 1 var(--ehr-clinic-trigger-max);
    min-width: 0;
    margin: 0 auto;
    z-index: 1;
}

.ehr-clinic-switcher__trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    width: 100%;
    max-width: var(--ehr-clinic-trigger-max);
    padding: 0.5rem 0.55rem 0.5rem 0.55rem;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border-strong);
    border-radius: 999px;
    color: var(--ehr-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease, background-color 140ms ease;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.ehr-clinic-switcher__trigger:hover {
    border-color: var(--ehr-primary);
    box-shadow: 0 6px 16px rgba(0, 105, 166, 0.12);
    transform: translateY(-1px);
}

.ehr-clinic-switcher__trigger:focus-visible {
    outline: none;
    border-color: var(--ehr-primary);
    box-shadow: 0 0 0 4px var(--ehr-primary-soft);
}

.ehr-clinic-switcher__trigger[aria-expanded="true"] {
    border-color: var(--ehr-primary);
    box-shadow: 0 0 0 4px var(--ehr-primary-soft);
}

.ehr-clinic-switcher__avatar {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #0069a6 0%, #0891b2 100%);
    color: #fff;
    font-size: 0.95rem;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15);
}

.ehr-clinic-switcher.is-all .ehr-clinic-switcher__avatar {
    background: linear-gradient(135deg, #475569 0%, #94a3b8 100%);
}

.ehr-clinic-switcher__body {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
    flex: 1 1 auto;
}

.ehr-clinic-switcher__label {
    font-size: 0.65rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ehr-text-muted);
    line-height: 1;
}

.ehr-clinic-switcher__name {
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--ehr-text);
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ehr-clinic-switcher__meta {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    flex-shrink: 0;
    margin-left: auto;
    padding-left: 0.25rem;
}

.ehr-clinic-switcher__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.55rem;
    height: 1.55rem;
    padding: 0 0.5rem;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--ehr-primary);
    background: var(--ehr-primary-soft);
    border-radius: 999px;
    line-height: 1;
}

.ehr-clinic-switcher.is-all .ehr-clinic-switcher__count {
    color: var(--ehr-text-sub);
    background: var(--ehr-bg-muted);
}

.ehr-clinic-switcher__chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.55rem;
    height: 1.55rem;
    color: var(--ehr-text-muted);
    transition: transform 180ms ease, color 180ms ease;
}

.ehr-clinic-switcher__trigger[aria-expanded="true"] .ehr-clinic-switcher__chevron {
    transform: rotate(180deg);
    color: var(--ehr-primary);
}

/* ── Dropdown menu panel ─────────────────────────────────── */
/* width: 100% of the dropdown wrapper, which is itself sized to the
   trigger's max-width, so menu and trigger share identical edges. The
   max-width clamp prevents overflow if the wrapper ever exceeds the
   viewport (e.g. while flex layout settles on initial paint). */
.ehr-clinic-switcher__menu.dropdown-menu {
    --bs-dropdown-min-width: 0;
    width: 100%;
    max-width: calc(100vw - 1.5rem);
    padding: 0;
    margin-top: 0.5rem;
    border: 1px solid var(--ehr-border-strong);
    border-radius: var(--ehr-radius);
    box-shadow: var(--ehr-shadow-lg);
    background: var(--ehr-bg);
    overflow: hidden;
    z-index: 1080;
}

.ehr-clinic-switcher__menu-head {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--ehr-border);
    background: var(--ehr-bg-soft);
}

.ehr-clinic-switcher__search-icon {
    color: var(--ehr-text-muted);
    font-size: 0.85rem;
}

.ehr-clinic-switcher__search {
    flex: 1 1 auto;
    border: none;
    background: transparent;
    color: var(--ehr-text);
    font-size: 0.85rem;
    padding: 0.25rem 0;
    outline: none;
    min-width: 0;
}

.ehr-clinic-switcher__search::placeholder {
    color: var(--ehr-text-muted);
}

.ehr-clinic-switcher__kbd {
    font-size: 0.62rem;
    font-weight: 600;
    color: var(--ehr-text-muted);
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: 0.35rem;
    padding: 0.1rem 0.35rem;
    line-height: 1;
}

.ehr-clinic-switcher__list {
    list-style: none;
    margin: 0;
    padding: 0.35rem;
    max-height: 22rem;
    overflow-y: auto;
}

.ehr-clinic-switcher__divider {
    height: 1px;
    margin: 0.35rem 0.25rem;
    background: var(--ehr-border);
}

.ehr-clinic-switcher__item {
    display: grid;
    grid-template-columns: 2.1rem 1fr auto auto;
    align-items: center;
    gap: 0.65rem;
    padding: 0.55rem 0.6rem;
    border-radius: var(--ehr-radius-sm);
    text-decoration: none;
    color: var(--ehr-text);
    transition: background-color 100ms ease, color 100ms ease, transform 100ms ease;
    cursor: pointer;
}

.ehr-clinic-switcher__item:hover,
.ehr-clinic-switcher__item:focus-visible {
    background: var(--ehr-bg-soft);
    color: var(--ehr-text);
    outline: none;
}

.ehr-clinic-switcher__item.is-active {
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
}

.ehr-clinic-switcher__item-icon {
    width: 2.1rem;
    height: 2.1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.6rem;
    background: var(--ehr-bg-muted);
    color: var(--ehr-text-sub);
    font-size: 0.95rem;
}

.ehr-clinic-switcher__item-icon--all {
    background: rgba(148, 163, 184, 0.18);
    color: #475569;
}

.ehr-clinic-switcher__item.is-active .ehr-clinic-switcher__item-icon {
    background: #fff;
    color: var(--ehr-primary);
    box-shadow: inset 0 0 0 1px rgba(0, 105, 166, 0.2);
}

.ehr-clinic-switcher__item-body {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.ehr-clinic-switcher__item-name {
    font-size: 0.88rem;
    font-weight: 600;
    line-height: 1.2;
    color: inherit;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ehr-clinic-switcher__item-sub {
    font-size: 0.72rem;
    color: var(--ehr-text-muted);
    line-height: 1.25;
    margin-top: 0.1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ehr-clinic-switcher__item.is-active .ehr-clinic-switcher__item-sub {
    color: var(--ehr-primary);
    opacity: 0.8;
}

.ehr-clinic-switcher__item-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.4rem;
    height: 1.4rem;
    padding: 0 0.45rem;
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--ehr-text-sub);
    background: var(--ehr-bg-muted);
    border-radius: 999px;
    line-height: 1;
}

.ehr-clinic-switcher__item.is-active .ehr-clinic-switcher__item-count {
    color: var(--ehr-primary);
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(0, 105, 166, 0.18);
}

.ehr-clinic-switcher__item-check {
    width: 1.1rem;
    height: 1.1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ehr-primary);
    opacity: 0;
    transform: scale(0.7);
    transition: opacity 120ms ease, transform 120ms ease;
}

.ehr-clinic-switcher__item.is-active .ehr-clinic-switcher__item-check {
    opacity: 1;
    transform: scale(1);
}

.ehr-clinic-switcher__menu-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 1.1rem 0.75rem;
    color: var(--ehr-text-muted);
    font-size: 0.8rem;
}

.ehr-clinic-switcher__menu-foot {
    padding: 0.5rem 0.75rem;
    border-top: 1px solid var(--ehr-border);
    background: var(--ehr-bg-soft);
}

.ehr-clinic-switcher__foot-hint {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.7rem;
    color: var(--ehr-text-muted);
}

/* ── Trail (Hub button + clear) / Hint when no clinic ───── */
.ehr-clinic-switcher__hub {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.7rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ehr-primary);
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border-strong);
    border-radius: 999px;
    text-decoration: none;
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, transform 140ms ease;
}

.ehr-clinic-switcher__hub:hover {
    color: #fff;
    background: var(--ehr-primary);
    border-color: var(--ehr-primary);
    transform: translateY(-1px);
}

.ehr-clinic-switcher__hub i { font-size: 0.85em; }

.ehr-clinic-switcher__clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.7rem;
    height: 1.7rem;
    color: var(--ehr-text-muted);
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border-strong);
    border-radius: 50%;
    text-decoration: none;
    transition: color 120ms ease, border-color 120ms ease, background-color 120ms ease, transform 120ms ease;
}

.ehr-clinic-switcher__clear:hover {
    color: var(--ehr-danger);
    border-color: var(--ehr-danger);
    background: rgba(220, 38, 38, 0.08);
    transform: scale(1.05);
}

.ehr-clinic-switcher__clear i { font-size: 0.7rem; }

.ehr-clinic-switcher__hint {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 500;
    color: var(--ehr-text-muted);
    padding: 0.3rem 0.55rem;
    border-radius: 999px;
    background: var(--ehr-bg-muted);
}

.ehr-clinic-switcher__hint i { font-size: 0.85em; }

/* ── Responsive: stack on small screens ──────────────────── */
@media (max-width: 575.98px) {
    .ehr-clinic-switcher {
        flex-wrap: wrap;
        gap: 0.55rem;
        padding: 0.6rem 0.7rem;
    }
    .ehr-clinic-switcher__dropdown {
        flex: 1 1 100%;
        order: 2;
    }
    .ehr-clinic-switcher__lead { order: 1; }
    .ehr-clinic-switcher__trail {
        order: 3;
        margin-left: auto;
    }
    .ehr-clinic-switcher__trigger {
        max-width: none;
        padding: 0.45rem 0.55rem;
    }
    .ehr-clinic-switcher__name { font-size: 0.85rem; }
    .ehr-clinic-switcher__menu.dropdown-menu {
        width: calc(100vw - 1rem);
    }
}

/* ── Dark-mode polish ────────────────────────────────────── */
[data-bs-theme="dark"] .ehr-clinic-switcher,
[data-theme="dark"] .ehr-clinic-switcher {
    background: linear-gradient(180deg, var(--ehr-bg) 0%, rgba(15, 23, 42, 0.4) 100%);
}

[data-bs-theme="dark"] .ehr-clinic-switcher::before,
[data-theme="dark"] .ehr-clinic-switcher::before {
    background: radial-gradient(120% 200% at 50% -40%, rgba(78, 167, 216, 0.10), transparent 60%);
}

[data-bs-theme="dark"] .ehr-clinic-switcher__trigger,
[data-theme="dark"] .ehr-clinic-switcher__trigger {
    background: rgba(15, 23, 42, 0.6);
    color: var(--ehr-text);
}

[data-bs-theme="dark"] .ehr-clinic-switcher__menu.dropdown-menu,
[data-theme="dark"] .ehr-clinic-switcher__menu.dropdown-menu {
    background: #1e293b;
    border-color: var(--ehr-border-strong);
}

[data-bs-theme="dark"] .ehr-clinic-switcher__item.is-active .ehr-clinic-switcher__item-icon,
[data-theme="dark"] .ehr-clinic-switcher__item.is-active .ehr-clinic-switcher__item-icon,
[data-bs-theme="dark"] .ehr-clinic-switcher__item.is-active .ehr-clinic-switcher__item-count,
[data-theme="dark"] .ehr-clinic-switcher__item.is-active .ehr-clinic-switcher__item-count {
    background: rgba(78, 167, 216, 0.15);
    color: var(--ehr-primary);
    box-shadow: none;
}

[data-bs-theme="dark"] .ehr-clinic-switcher__hub,
[data-theme="dark"] .ehr-clinic-switcher__hub {
    background: rgba(15, 23, 42, 0.6);
}

[data-bs-theme="dark"] .ehr-clinic-switcher__clear,
[data-theme="dark"] .ehr-clinic-switcher__clear {
    background: rgba(15, 23, 42, 0.6);
}

/* ============================================================
   UNIFIED LIST-PAGE FILTER SYSTEM (2027 SaaS-style)
   Filter bar = clinic switcher row + dropdown row + search + view/density
   Used by: appointment / soap-note / health-plan / exam list pages.
   ============================================================ */

.ehr-filterbar {
    border: 1px solid var(--ehr-border) !important;
    border-radius: var(--ehr-radius) !important;
    overflow: visible !important;
    box-shadow: var(--ehr-shadow-sm);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, var(--ehr-bg) 100%) !important;
    position: relative;
    z-index: 30;
}

/* Lift any active dropdown above sibling stat cards / sparkline / results.
   Bootstrap's dropdown-menu defaults to z-index 1000, but Popper.js applies
   a transform that creates a stacking context relative to the trigger's
   parent — without an explicit lift on that parent, sibling cards with
   position:relative can render on top. ``.is-open`` is added by the JS in
   _ehr_filter_bar.html as a fallback for browsers without :has() support. */
.ehr-filter-dd:has(.dropdown.show),
.ehr-filter-dd.is-open,
.ehr-clinic-switcher:has(.dropdown.show) {
    z-index: 1080;
}

.ehr-filterbar__clinic {
    padding: 0.7rem 0.85rem 0.4rem;
    border-bottom: 1px dashed var(--ehr-border);
}

.ehr-filterbar__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.7rem 0.85rem;
}

.ehr-filterbar__filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    flex: 1 1 auto;
    min-width: 0;
}

.ehr-filterbar__search {
    flex: 1 1 240px;
    min-width: 200px;
    margin: 0;
}

.ehr-filterbar__search .input-group-text,
.ehr-filterbar__search .form-control {
    border-color: var(--ehr-border-strong);
}

.ehr-filterbar__search .form-control:focus {
    border-color: var(--ehr-primary);
    box-shadow: 0 0 0 0.15rem var(--ehr-primary-soft);
    z-index: 3;
}

.ehr-filterbar__view {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
}

.ehr-filterbar__view .btn-group .btn {
    border-color: var(--ehr-border-strong);
    color: var(--ehr-text-sub);
    font-weight: 500;
}

.ehr-filterbar__view .btn-group .btn.active {
    background: var(--ehr-primary);
    color: #fff;
    border-color: var(--ehr-primary);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

/* ── Single filter dropdown trigger ─────────────────────── */
.ehr-filter-dd {
    position: relative;
}

.ehr-filter-dd__trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    height: 2.4rem;
    padding: 0.25rem 0.65rem 0.25rem 0.5rem;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border-strong);
    border-radius: var(--ehr-radius-sm);
    color: var(--ehr-text);
    font-weight: 500;
    text-decoration: none;
    line-height: 1.1;
    transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease, background-color 120ms ease;
    max-width: 100%;
}

.ehr-filter-dd__trigger:hover {
    border-color: var(--ehr-primary);
    box-shadow: 0 0 0 0.15rem var(--ehr-primary-soft);
    transform: translateY(-1px);
}

.ehr-filter-dd:has(.dropdown.show) .ehr-filter-dd__trigger,
.ehr-filter-dd.is-open .ehr-filter-dd__trigger {
    border-color: var(--ehr-primary);
    background: var(--ehr-bg);
    box-shadow:
        0 0 0 3px var(--ehr-primary-soft),
        0 6px 14px -6px rgba(0, 105, 166, 0.30);
}

.ehr-filter-dd.is-active .ehr-filter-dd__trigger {
    border-color: var(--ehr-primary);
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
}

.ehr-filter-dd__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 6px;
    background: var(--ehr-bg-muted);
    color: var(--ehr-text-sub);
    font-size: 0.85rem;
    flex-shrink: 0;
}

.ehr-filter-dd.is-active .ehr-filter-dd__icon {
    background: #fff;
    color: var(--ehr-primary);
}

.ehr-filter-dd__body {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
    text-align: left;
    min-width: 0;
}

.ehr-filter-dd__eyebrow {
    font-size: 0.6rem;
    font-weight: 700;
    color: var(--ehr-text-muted);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1;
    margin-bottom: 0.2rem;
}

.ehr-filter-dd.is-active .ehr-filter-dd__eyebrow {
    color: var(--ehr-primary);
    opacity: 0.8;
}

.ehr-filter-dd__value {
    font-size: 0.82rem;
    font-weight: 600;
    color: inherit;
    line-height: 1.1;
    max-width: 14ch;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ehr-filter-dd__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    background: #fff;
    color: var(--ehr-primary);
    font-size: 0.65rem;
    font-weight: 700;
    box-shadow: inset 0 0 0 1px var(--ehr-primary-soft);
    flex-shrink: 0;
}

.ehr-filter-dd__chevron {
    color: var(--ehr-text-muted);
    transition: transform 150ms ease;
    flex-shrink: 0;
    font-size: 0.7rem;
}

.ehr-filter-dd .dropdown.show .ehr-filter-dd__chevron { transform: rotate(180deg); }

/* ── Filter dropdown menu (shared with clinic switcher idiom) ── */
.ehr-filter-dd__menu {
    min-width: 280px;
    max-width: 360px;
    padding: 0;
    margin-top: 0.4rem !important;
    border-radius: 14px;
    border: 1px solid rgba(0, 105, 166, 0.10);
    background: var(--ehr-bg);
    box-shadow:
        0 1px 0 0 rgba(15, 23, 42, 0.04),
        0 12px 24px -8px rgba(0, 105, 166, 0.18),
        0 28px 56px -16px rgba(15, 23, 42, 0.18);
    overflow: hidden;
    z-index: 1080;
}
.ehr-filter-dd__menu.show {
    animation: ehr-filter-dd-in 180ms ease-out both;
}
@keyframes ehr-filter-dd-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.ehr-filter-dd__menu-head {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 0.8rem;
    border-bottom: 1px solid var(--ehr-border);
    background: linear-gradient(180deg, var(--ehr-bg-soft) 0%, var(--ehr-bg) 100%);
}

.ehr-filter-dd__search-icon {
    color: var(--ehr-text-muted);
    font-size: 0.85rem;
    flex-shrink: 0;
}

.ehr-filter-dd__search {
    flex: 1 1 auto;
    border: 0;
    background: transparent;
    outline: none;
    padding: 0.2rem 0;
    font-size: 0.85rem;
    color: var(--ehr-text);
    min-width: 0;
}

.ehr-filter-dd__clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 50%;
    background: transparent;
    color: var(--ehr-text-muted);
    transition: background-color 100ms ease, color 100ms ease;
    flex-shrink: 0;
    text-decoration: none;
    font-size: 0.7rem;
}

.ehr-filter-dd__clear:hover {
    background: rgba(220, 38, 38, 0.12);
    color: var(--ehr-danger);
}

.ehr-filter-dd__list {
    list-style: none;
    margin: 0;
    padding: 0.35rem 0.3rem;
    max-height: 340px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--ehr-border-strong) transparent;
}
.ehr-filter-dd__list::-webkit-scrollbar { width: 6px; }
.ehr-filter-dd__list::-webkit-scrollbar-thumb {
    background: var(--ehr-border-strong);
    border-radius: 999px;
}

.ehr-filter-dd__divider {
    border-top: 1px solid var(--ehr-border);
    margin: 0.2rem 0;
}

.ehr-filter-dd__item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 0.7rem;
    margin: 0 0.15rem;
    border-radius: 8px;
    color: var(--ehr-text);
    text-decoration: none;
    transition: background-color 120ms ease, color 120ms ease, transform 120ms ease;
    line-height: 1.25;
}

.ehr-filter-dd__item:hover {
    background: var(--ehr-bg-soft);
    color: var(--ehr-text);
    transform: translateX(1px);
}

.ehr-filter-dd__item.is-active {
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
    font-weight: 600;
}

.ehr-filter-dd__item-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 5px;
    background: var(--ehr-bg-muted);
    color: var(--ehr-text-sub);
    font-size: 0.7rem;
    flex-shrink: 0;
}

.ehr-filter-dd__item.is-active .ehr-filter-dd__item-icon {
    background: #fff;
    color: var(--ehr-primary);
}

.ehr-filter-dd__item-dot {
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
}

.ehr-filter-dd__item-body {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 auto;
    line-height: 1.15;
}

.ehr-filter-dd__item-name {
    font-size: 0.82rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ehr-filter-dd__item-sub {
    font-size: 0.7rem;
    color: var(--ehr-text-muted);
    margin-top: 0.1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ehr-filter-dd__item-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.4rem;
    height: 1.4rem;
    padding: 0 0.4rem;
    font-size: 0.66rem;
    font-weight: 700;
    color: var(--ehr-text-sub);
    background: var(--ehr-bg-muted);
    border-radius: 999px;
    line-height: 1;
}

.ehr-filter-dd__item.is-active .ehr-filter-dd__item-count {
    color: var(--ehr-primary);
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(0, 105, 166, 0.18);
}

.ehr-filter-dd__item-check {
    width: 1rem;
    height: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ehr-primary);
    opacity: 0;
    transform: scale(0.7);
    transition: opacity 120ms ease, transform 120ms ease;
}

.ehr-filter-dd__item.is-active .ehr-filter-dd__item-check {
    opacity: 1;
    transform: scale(1);
}

.ehr-filter-dd__menu-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 1rem 0.75rem;
    color: var(--ehr-text-muted);
    font-size: 0.78rem;
}

[data-bs-theme="dark"] .ehr-filter-dd__menu.dropdown-menu,
[data-theme="dark"] .ehr-filter-dd__menu.dropdown-menu {
    background: #1e293b;
    border-color: var(--ehr-border-strong);
}

[data-bs-theme="dark"] .ehr-filter-dd__trigger,
[data-theme="dark"] .ehr-filter-dd__trigger {
    background: rgba(15, 23, 42, 0.6);
    color: var(--ehr-text);
}

[data-bs-theme="dark"] .ehr-filter-dd.is-active .ehr-filter-dd__icon,
[data-theme="dark"] .ehr-filter-dd.is-active .ehr-filter-dd__icon,
[data-bs-theme="dark"] .ehr-filter-dd.is-active .ehr-filter-dd__item-count,
[data-theme="dark"] .ehr-filter-dd.is-active .ehr-filter-dd__item-count {
    background: rgba(78, 167, 216, 0.15);
    color: var(--ehr-primary);
    box-shadow: none;
}

/* ============================================================
   STAT CARD STRIP — Today / This Week / This Month / This Year
   ============================================================ */
.ehr-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.65rem;
}

.ehr-stat-card {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius);
    background: var(--ehr-bg);
    box-shadow: var(--ehr-shadow-sm);
    text-decoration: none;
    color: var(--ehr-text);
    position: relative;
    z-index: 1;
    transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.ehr-stat-card.is-clickable:hover {
    border-color: var(--ehr-primary);
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}

.ehr-stat-card__icon {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 0.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05rem;
    flex-shrink: 0;
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
}

.ehr-stat-card--info    .ehr-stat-card__icon { background: rgba(8, 145, 178, 0.12); color: #0891b2; }
.ehr-stat-card--success .ehr-stat-card__icon { background: rgba(22, 163, 74, 0.12); color: #16a34a; }
.ehr-stat-card--warning .ehr-stat-card__icon { background: rgba(217, 119, 6, 0.14); color: #d97706; }
.ehr-stat-card--danger  .ehr-stat-card__icon { background: rgba(220, 38, 38, 0.12); color: #dc2626; }
.ehr-stat-card--secondary .ehr-stat-card__icon { background: rgba(100, 116, 139, 0.14); color: #64748b; }
.ehr-stat-card--accent  .ehr-stat-card__icon { background: rgba(102, 16, 242, 0.10); color: #6610f2; }

.ehr-stat-card__body {
    flex: 1 1 auto;
    min-width: 0;
}

.ehr-stat-card__label {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ehr-text-muted);
    line-height: 1;
    margin-bottom: 0.3rem;
}

.ehr-stat-card__value {
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1.05;
    color: var(--ehr-text);
    font-variant-numeric: tabular-nums;
}

.ehr-stat-card__sub {
    font-size: 0.72rem;
    color: var(--ehr-text-sub);
    margin-top: 0.2rem;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ehr-stat-card__chevron {
    position: absolute;
    top: 0.55rem;
    right: 0.6rem;
    color: var(--ehr-text-muted);
    opacity: 0;
    transition: opacity 120ms ease, transform 120ms ease;
}

.ehr-stat-card.is-clickable:hover .ehr-stat-card__chevron {
    opacity: 1;
    transform: translate(2px, -2px);
    color: var(--ehr-primary);
}

[data-bs-theme="dark"] .ehr-stat-card,
[data-theme="dark"] .ehr-stat-card {
    background: var(--dark-bg-surface);
    border-color: var(--dark-border);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .ehr-stat-card__label {
    color: var(--dark-text-secondary);
}

[data-theme="dark"] .ehr-stat-card__value {
    color: var(--dark-text-primary);
}

[data-theme="dark"] .ehr-stat-card__icon {
    background: var(--dark-bg-elevated);
}

[data-theme="dark"] .ehr-stat-card--info    .ehr-stat-card__icon { background: rgba(56, 189, 248, 0.14); color: #38bdf8; }
[data-theme="dark"] .ehr-stat-card--success .ehr-stat-card__icon { background: rgba(34, 197, 94, 0.15); color: #4ade80; }
[data-theme="dark"] .ehr-stat-card--warning .ehr-stat-card__icon { background: rgba(251, 191, 36, 0.15); color: #fbbf24; }
[data-theme="dark"] .ehr-stat-card--danger  .ehr-stat-card__icon { background: rgba(248, 113, 113, 0.15); color: #f87171; }
[data-theme="dark"] .ehr-stat-card--secondary .ehr-stat-card__icon { background: rgba(148, 163, 184, 0.14); color: #cbd5e1; }
[data-theme="dark"] .ehr-stat-card--accent  .ehr-stat-card__icon { background: rgba(167, 139, 250, 0.14); color: #a78bfa; }

/* ============================================================
   APPOINTMENT TREND CHART — toggleable Day / Week / Month / Year
   ============================================================ */
.ehr-trend {
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius);
    background: linear-gradient(180deg, var(--ehr-bg) 0%, var(--ehr-bg-soft) 100%);
    padding: 1rem 1.1rem 1.1rem;
    position: relative;
    z-index: 1;
    box-shadow: var(--ehr-shadow-sm);
}

.ehr-trend__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem 1rem;
    margin-bottom: 0.85rem;
}

.ehr-trend__title-group {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    line-height: 1.1;
}

.ehr-trend__title {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ehr-text-muted);
}

.ehr-trend__subtitle {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ehr-text);
    letter-spacing: -0.01em;
}

.ehr-trend__tabs.btn-group .btn {
    border-color: var(--ehr-border-strong);
    color: var(--ehr-text-sub);
    font-weight: 500;
    font-size: 0.78rem;
    padding: 0.32rem 0.7rem;
}

.ehr-trend__tabs.btn-group .btn.active {
    background: var(--ehr-primary);
    color: #fff;
    border-color: var(--ehr-primary);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.ehr-trend__total {
    font-size: 0.85rem;
    color: var(--ehr-text-sub);
    font-variant-numeric: tabular-nums;
    margin-left: auto;
}

.ehr-trend__total strong {
    color: var(--ehr-text);
    font-weight: 700;
    font-size: 1.05rem;
    margin-right: 0.3rem;
}

.ehr-trend__panel {
    display: none;
}

.ehr-trend__panel.is-active {
    display: block;
}

.ehr-trend__chart {
    display: grid;
    grid-template-columns: 2.4rem 1fr;
    gap: 0.5rem;
    height: 168px;
}

.ehr-trend__yaxis {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--ehr-text-muted);
    font-variant-numeric: tabular-nums;
    padding-right: 0.3rem;
    border-right: 1px dashed var(--ehr-border);
}

.ehr-trend__bars {
    display: flex;
    align-items: stretch;
    gap: 4px;
    padding-bottom: 22px; /* leave room for x-axis labels */
    position: relative;
    background-image:
        linear-gradient(to top, transparent 0, transparent calc(50% - 1px), var(--ehr-border) calc(50% - 1px), var(--ehr-border) 50%, transparent 50%),
        linear-gradient(to top, transparent 0, transparent calc(100% - 22px - 1px), var(--ehr-border) calc(100% - 22px - 1px), var(--ehr-border) calc(100% - 22px), transparent calc(100% - 22px));
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.ehr-trend__bar {
    flex: 1 1 0;
    min-width: 14px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    gap: 4px;
    text-decoration: none;
    color: var(--ehr-text-sub);
    position: relative;
    cursor: pointer;
    padding-bottom: 22px;
    margin-bottom: -22px; /* allow bar fill to span full chart, label sits in reserved gutter */
}

.ehr-trend__bar-fill {
    position: relative;
    width: 100%;
    height: var(--h, 0%);
    min-height: 2px;
    background: linear-gradient(180deg, var(--ehr-primary) 0%, rgba(0, 105, 166, 0.55) 100%);
    border-radius: 4px 4px 0 0;
    transition: height 200ms ease, background 120ms ease, box-shadow 120ms ease, transform 120ms ease;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.35);
}

.ehr-trend__bar.is-zero .ehr-trend__bar-fill {
    height: 3px !important;
    background: var(--ehr-bg-muted);
    box-shadow: none;
}

.ehr-trend__bar.is-current .ehr-trend__bar-fill {
    background: linear-gradient(180deg, #06b6d4 0%, var(--ehr-primary) 100%);
    box-shadow: 0 0 0 1px rgba(6, 182, 212, 0.35), inset 0 -1px 0 rgba(255, 255, 255, 0.45);
}

.ehr-trend__bar:hover .ehr-trend__bar-fill {
    background: linear-gradient(180deg, #06b6d4 0%, var(--ehr-primary) 100%);
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(0, 105, 166, 0.18);
}

.ehr-trend__bar-value {
    position: absolute;
    top: -1.05rem;
    font-size: 0.62rem;
    font-weight: 700;
    color: var(--ehr-text);
    font-variant-numeric: tabular-nums;
    background: var(--ehr-bg);
    padding: 0 4px;
    border-radius: 3px;
    opacity: 0;
    transform: translateY(4px);
    pointer-events: none;
    transition: opacity 120ms ease, transform 120ms ease;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.1);
}

.ehr-trend__bar.is-current .ehr-trend__bar-value,
.ehr-trend__bar:hover .ehr-trend__bar-value {
    opacity: 1;
    transform: translateY(0);
}

.ehr-trend__bar-label {
    position: absolute;
    bottom: 0;
    font-size: 0.62rem;
    font-weight: 500;
    color: var(--ehr-text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    text-align: center;
    line-height: 1;
}

.ehr-trend__bar.is-current .ehr-trend__bar-label {
    color: var(--ehr-primary);
    font-weight: 700;
}

[data-bs-theme="dark"] .ehr-trend,
[data-theme="dark"] .ehr-trend {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.6) 0%, rgba(15, 23, 42, 0.4) 100%);
}

[data-bs-theme="dark"] .ehr-trend__bar-value,
[data-theme="dark"] .ehr-trend__bar-value {
    background: #1e293b;
    color: #fff;
}

@media (max-width: 767px) {
    .ehr-trend__chart { height: 140px; grid-template-columns: 2rem 1fr; }
    .ehr-trend__bar { min-width: 10px; }
    .ehr-trend__bar-label { font-size: 0.56rem; }
    .ehr-trend__total { width: 100%; text-align: right; }
}

@media (max-width: 575px) {
    .ehr-stat-card { padding: 0.7rem; }
    .ehr-stat-card__value { font-size: 1.2rem; }
    .ehr-filter-dd__menu { min-width: 240px; }
    .ehr-filter-dd__value { max-width: 10ch; }
    .ehr-trend__chart { height: 120px; }
}

/* ============================================================
   APPOINTMENT GRID CARD — compact, modern, patient-card aesthetic
   ============================================================ */
.ehr-appt-card {
    border: 1px solid var(--ehr-border) !important;
    border-radius: var(--ehr-radius) !important;
    background: var(--ehr-bg) !important;
    transition: border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
    position: relative;
    display: flex !important;
    flex-direction: column !important;
}

.ehr-appt-card:hover {
    border-color: var(--ehr-primary);
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
    transform: translateY(-2px);
}

/* Date "avatar" — calendar-tile look (replaces patient initials block) */
.ehr-appt-card__date {
    width: 56px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 0.3rem;
    border-radius: 0.6rem;
    background: linear-gradient(180deg, var(--ehr-primary-soft) 0%, rgba(0, 105, 166, 0.04) 100%);
    border: 1px solid rgba(0, 105, 166, 0.18);
    text-align: center;
    line-height: 1.1;
}

.ehr-appt-card__date-day {
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--ehr-primary);
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}

.ehr-appt-card__date-mon {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--ehr-text-sub);
    letter-spacing: 0.05em;
    margin-top: 0.05rem;
}

.ehr-appt-card__date-time {
    font-size: 0.62rem;
    font-weight: 600;
    color: var(--ehr-text-muted);
    margin-top: 0.15rem;
    font-variant-numeric: tabular-nums;
}

/* Status pill (consumes the appointment_status_options color) */
.ehr-appt-card__status {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    font-size: 0.66rem;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.ehr-appt-card__status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}

.ehr-appt-card__status--primary   { background: rgba(0, 105, 166, 0.10);  color: #0069a6; }
.ehr-appt-card__status--info      { background: rgba(8, 145, 178, 0.10);  color: #0891b2; }
.ehr-appt-card__status--success   { background: rgba(22, 163, 74, 0.10);  color: #16a34a; }
.ehr-appt-card__status--danger    { background: rgba(220, 38, 38, 0.10);  color: #dc2626; }
.ehr-appt-card__status--warning   { background: rgba(217, 119, 6, 0.12);  color: #b45309; }
.ehr-appt-card__status--secondary { background: rgba(100, 116, 139, 0.14); color: #475569; }

/* Reason preview — truncated, subtle */
.ehr-appt-card__reason {
    margin-top: 0.4rem;
    padding-top: 0.4rem;
    border-top: 1px dashed var(--ehr-border);
    font-size: 0.74rem;
    line-height: 1.4;
    color: var(--ehr-text-muted) !important;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Footer with Import button — pulls free of stretched-link click area */
.ehr-appt-card__foot {
    margin-top: auto;
    padding: 0.5rem 0.85rem 0.7rem;
    border-top: 1px dashed var(--ehr-border);
    background: var(--ehr-bg-soft);
    border-radius: 0 0 var(--ehr-radius) var(--ehr-radius);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: relative;
    z-index: 2;
}

.ehr-appt-card__import-form { margin: 0; }

.ehr-appt-card__import-btn {
    font-size: 0.7rem;
    padding: 0.25rem 0.6rem;
    border-radius: 999px;
}

.ehr-appt-card__import-btn span { margin-left: 0.25rem; }

[data-bs-theme="dark"] .ehr-appt-card__date,
[data-theme="dark"] .ehr-appt-card__date {
    background: linear-gradient(180deg, rgba(78, 167, 216, 0.18) 0%, rgba(78, 167, 216, 0.04) 100%);
    border-color: rgba(78, 167, 216, 0.28);
}

[data-bs-theme="dark"] .ehr-appt-card__foot,
[data-theme="dark"] .ehr-appt-card__foot {
    background: rgba(15, 23, 42, 0.4);
}

/* ============================================================
   Patient detail tabs — segmented sticky tab bar + tab panels
   for templates/ehr_mirror/patient_detail.html. Reuses ehr-*
   tokens (bg, border, primary). Conceptual neighbor of the
   ehr-kpi-strip / ehr-tag-strip directly above.
   ============================================================ */
.patient-tabs-shell {
    position: sticky;
    top: 0;
    z-index: 5;
    margin: 0 -0.25rem 1.25rem;
    padding: 0.4rem 0.25rem;
    background: linear-gradient(180deg, var(--ehr-bg-soft) 0%, transparent 100%);
    backdrop-filter: blur(6px);
}
.patient-tabs {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.3rem;
    margin: 0;
    list-style: none;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: 0.875rem;
    box-shadow: var(--ehr-shadow-sm);
    flex-wrap: nowrap;
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
}
.patient-tabs::-webkit-scrollbar { height: 6px; }
.patient-tabs::-webkit-scrollbar-thumb {
    background: var(--ehr-border-strong);
    border-radius: 999px;
}
.patient-tabs .nav-item { display: flex; }
.patient-tabs__group {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0 0.4rem 0 0.55rem;
    margin: 0 0.1rem;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--ehr-text-muted);
    border-left: 1px solid var(--ehr-border-strong);
    height: 1.6rem;
    flex-shrink: 0;
    user-select: none;
}
.patient-tabs__group:first-child { border-left: 0; padding-left: 0.25rem; }
.patient-tabs__group i { font-size: 0.85rem; opacity: 0.85; color: var(--ehr-primary); }
.patient-tabs__group span { line-height: 1; }
.patient-tabs .nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.95rem;
    border: 0;
    border-radius: 0.65rem;
    background: transparent;
    color: var(--ehr-text-sub);
    font-weight: 600;
    font-size: 0.85rem;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    transition: color .15s ease, background-color .15s ease, box-shadow .2s ease, transform .15s ease;
}
.patient-tabs .nav-link i {
    font-size: 1rem;
    opacity: 0.7;
    transition: opacity .15s ease, transform .2s ease, color .15s ease;
}
.patient-tabs .nav-link:hover {
    color: var(--ehr-text);
    background: var(--ehr-bg-soft);
}
.patient-tabs .nav-link:hover i { opacity: 1; }
.patient-tabs .nav-link:focus-visible {
    outline: 2px solid var(--ehr-primary);
    outline-offset: 2px;
}
.patient-tabs .nav-link.active {
    color: var(--ehr-text);
    background: var(--ehr-bg);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, .05),
        0 6px 16px -4px rgba(15, 23, 42, .08),
        0 0 0 1px var(--ehr-border-strong);
}
.patient-tabs .nav-link.active i {
    opacity: 1;
    color: var(--ehr-primary);
    transform: scale(1.06);
}
.patient-tab-count {
    display: inline-flex;
    align-items: center;
    padding: 0.05rem 0.5rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.5;
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
    margin-left: 0.15rem;
}
.patient-tabs .nav-link:not(.active) .patient-tab-count {
    background: var(--ehr-bg-muted);
    color: var(--ehr-text-sub);
}
.patient-tab-count--warn {
    background: rgba(217, 119, 6, 0.14) !important;
    color: var(--ehr-warning) !important;
}
.patient-tab-label { letter-spacing: -.005em; }
@media (max-width: 767.98px) {
    .patient-tabs .nav-link { padding: 0.5rem 0.65rem; font-size: 0.78rem; }
    .patient-tab-label { display: none; }
    .patient-tabs .nav-link.active .patient-tab-label { display: inline; }
}

.patient-tab-content {
    animation: patient-tab-fade .25s ease;
}
@keyframes patient-tab-fade {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: none; }
}

/* ── Tab panel layout primitives ───────────────────────────── */
.patient-tab-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: 1.1rem;
}
.patient-tab-grid--balanced { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.patient-tab-grid__main { display: flex; flex-direction: column; gap: 1.1rem; min-width: 0; }
.patient-tab-grid__side { display: flex; flex-direction: column; gap: 1.1rem; min-width: 0; }
@media (max-width: 991.98px) {
    .patient-tab-grid,
    .patient-tab-grid--balanced { grid-template-columns: 1fr; }
}

/* ── Section card — modern rounded panel used across every tab ── */
.patient-section-card {
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius);
    box-shadow: var(--ehr-shadow-sm);
    overflow: hidden;
    transition: box-shadow .2s ease, border-color .2s ease;
}
.patient-section-card:hover { box-shadow: var(--ehr-shadow-md); }
.patient-section-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 1.1rem;
    border-bottom: 1px solid var(--ehr-border);
    background: linear-gradient(180deg, var(--ehr-bg) 0%, var(--ehr-bg-soft) 100%);
}
.patient-section-card__title {
    margin: 0;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--ehr-text);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    letter-spacing: -.01em;
}
.patient-section-card__title i {
    color: var(--ehr-primary);
    font-size: 1rem;
}
.patient-section-card__link {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ehr-primary);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}
.patient-section-card__link:hover { text-decoration: underline; }
.patient-section-card__link i { transition: transform .15s ease; }
.patient-section-card__link:hover i { transform: translateX(2px); }
.patient-section-card__hi {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ehr-warning);
}
.patient-section-card__body { padding: 1.1rem 1.15rem; }
.patient-section-card__body--tight { padding: 0.75rem 1rem; }
.patient-section-card__body--flush { padding: 0; }
.patient-section-card--warn {
    border-color: rgba(217, 119, 6, 0.30);
    background: linear-gradient(180deg, rgba(217, 119, 6, 0.04) 0%, var(--ehr-bg) 30%);
}
.patient-section-card--warn .patient-section-card__title i { color: var(--ehr-warning); }

/* Personal-info grid — 2 / 3 columns of label-value cells. */
.patient-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0.85rem 1.4rem;
    margin: 0;
}
.patient-info-grid__cell {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}
.patient-info-grid__cell dt {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ehr-text-muted);
}
.patient-info-grid__cell dd {
    margin: 0;
    font-size: 0.92rem;
    color: var(--ehr-text);
    font-weight: 500;
    word-break: break-word;
}
.patient-info-grid__sub {
    color: var(--ehr-text-muted);
    font-weight: 500;
    font-size: 0.82rem;
    margin-left: 0.25rem;
}

/* Contact row inside Demographics tab. */
.patient-contact-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.85rem;
}
.patient-contact-cell {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    padding: 0.85rem;
    background: var(--ehr-bg-soft);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-sm);
}
.patient-contact-cell--wide { grid-column: 1 / -1; }
.patient-contact-cell__icon {
    width: 36px; height: 36px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1rem;
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
}
.patient-contact-cell__icon--success { background: rgba(22, 163, 74, 0.10); color: var(--ehr-success); }
.patient-contact-cell__icon--info    { background: rgba(8, 145, 178, 0.10);  color: var(--ehr-info); }
.patient-contact-cell__label {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ehr-text-muted);
    font-weight: 700;
}
.patient-contact-cell__value {
    font-size: 0.9rem;
    color: var(--ehr-text);
    margin-top: 0.1rem;
    word-break: break-word;
}
.patient-contact-cell__value a { color: inherit; text-decoration: none; }
.patient-contact-cell__value a:hover { color: var(--ehr-primary); text-decoration: underline; }

.patient-subsection {
    margin-top: 1.1rem;
    padding-top: 1.1rem;
    border-top: 1px dashed var(--ehr-border);
}
.patient-subsection__head {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    font-weight: 700;
    color: var(--ehr-text-sub);
    margin-bottom: 0.55rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}
.patient-subsection__head i { color: var(--ehr-text-muted); }

.patient-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}
.patient-list__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--ehr-border);
}
.patient-list__row:last-child { border-bottom: 0; }
.patient-list__row--block {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
}
.patient-list__primary {
    font-weight: 600;
    color: var(--ehr-text);
    font-size: 0.88rem;
}
.patient-list__primary a { color: inherit; text-decoration: none; }
.patient-list__primary a:hover { color: var(--ehr-primary); }
.patient-list__sub {
    display: block;
    font-size: 0.78rem;
    color: var(--ehr-text-muted);
    margin-top: 0.1rem;
    text-decoration: none;
}

/* Insurance policy mini-cards. */
.patient-policy-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.7rem;
}
.patient-policy-card {
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius-sm);
    padding: 0.75rem 0.85rem;
    background: var(--ehr-bg-soft);
    transition: border-color .15s ease, transform .15s ease;
}
.patient-policy-card:hover { border-color: var(--ehr-primary); transform: translateY(-1px); }
.patient-policy-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
    font-size: 0.85rem;
    color: var(--ehr-text);
}
.patient-policy-card__row {
    display: flex;
    justify-content: space-between;
    font-size: 0.78rem;
    color: var(--ehr-text-sub);
    padding: 0.15rem 0;
}
.patient-policy-card__row > span:first-child { color: var(--ehr-text-muted); }
.patient-policy-card__row > span:last-child { font-weight: 600; color: var(--ehr-text); }

/* Notes / tasks card. */
.patient-note {
    --note-color: var(--ehr-border-strong);
    border-left: 3px solid var(--note-color);
    padding: 0.5rem 0 0.5rem 0.7rem;
    margin-left: -0.2rem;
}
.patient-note--divided { border-bottom: 1px dashed var(--ehr-border); }
.patient-note__msg {
    margin: 0.3rem 0 0.25rem;
    font-size: 0.85rem;
    color: var(--ehr-text);
    line-height: 1.4;
}
.patient-note__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    font-size: 0.72rem;
    color: var(--ehr-text-muted);
}
.patient-note__meta i { margin-right: 0.2rem; }
.patient-note__more {
    display: block;
    text-align: center;
    color: var(--ehr-text-muted);
    padding-top: 0.4rem;
}

/* Generic line-item row used in side panels (snapshot, uncollected). */
.patient-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    padding: 0.5rem 0;
}
.patient-line--divided { border-bottom: 1px dashed var(--ehr-border); }
.patient-line__sub {
    display: block;
    font-size: 0.72rem;
    color: var(--ehr-text-muted);
    margin-top: 0.1rem;
}
.patient-line__more {
    display: block;
    text-align: center;
    color: var(--ehr-text-muted);
    padding-top: 0.45rem;
    font-size: 0.75rem;
}

/* Stat tiles row above the tables in each tab. */
.patient-stat-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.7rem;
    margin-bottom: 1.1rem;
}
.patient-stat-tile {
    --tile-tint: var(--ehr-text-sub);
    --tile-tint-soft: var(--ehr-bg-soft);
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-left: 3px solid var(--tile-tint);
    border-radius: var(--ehr-radius-sm);
    padding: 0.7rem 0.9rem;
    box-shadow: var(--ehr-shadow-sm);
    transition: transform .15s ease, box-shadow .15s ease;
}
.patient-stat-tile:hover {
    transform: translateY(-1px);
    box-shadow: var(--ehr-shadow-md);
}
.patient-stat-tile__value {
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--ehr-text);
    line-height: 1.05;
}
.patient-stat-tile__sub {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ehr-text-muted);
    margin-left: 0.15rem;
}
.patient-stat-tile__label {
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--ehr-text-sub);
    margin-top: 0.25rem;
    font-weight: 700;
}
.patient-stat-tile--primary { --tile-tint: var(--ehr-primary); }
.patient-stat-tile--info    { --tile-tint: var(--ehr-info); }
.patient-stat-tile--success { --tile-tint: var(--ehr-success); }
.patient-stat-tile--warn    { --tile-tint: var(--ehr-warning); }
.patient-stat-tile--danger  { --tile-tint: var(--ehr-danger); }
.patient-stat-tile--accent  { --tile-tint: #6366f1; }
.patient-stat-tile--muted   { --tile-tint: var(--ehr-text-muted); }

/* Tables inside section cards — flush, hover affordance, slim padding. */
.patient-table thead th {
    background: var(--ehr-bg-soft);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
    color: var(--ehr-text-sub);
    border-bottom: 1px solid var(--ehr-border) !important;
    padding: 0.65rem 0.85rem;
    white-space: nowrap;
}
.patient-table tbody td {
    padding: 0.6rem 0.85rem;
    color: var(--ehr-text);
    font-size: 0.85rem;
    border-bottom: 1px solid var(--ehr-border);
    vertical-align: middle;
}
.patient-table tbody tr:last-child td { border-bottom: 0; }
.patient-table tbody tr:hover { background: var(--ehr-bg-soft); }
.patient-link {
    color: var(--ehr-text);
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px dashed transparent;
}
.patient-link:hover { color: var(--ehr-primary); border-bottom-color: var(--ehr-primary); }
.patient-empty { color: var(--ehr-text-muted); font-style: italic; font-weight: 400; }
.patient-empty--center {
    display: block;
    text-align: center;
    padding: 1rem 0;
}
.patient-empty-row {
    text-align: center;
    color: var(--ehr-text-muted);
    padding: 1.4rem 0.5rem;
    font-size: 0.85rem;
}

/* Lifetime attendance bar — stacked horizontal bar in Visit Statistics. */
.patient-bar {
    display: flex;
    height: 14px;
    background: var(--ehr-bg-soft);
    border-radius: 999px;
    overflow: hidden;
    border: 1px solid var(--ehr-border);
}
.patient-bar__seg {
    transition: width .4s ease;
    min-width: 2px;
}
.patient-bar__seg--success { background: linear-gradient(90deg, #22c55e, #16a34a); }
.patient-bar__seg--warn    { background: linear-gradient(90deg, #f59e0b, #d97706); }
.patient-bar__seg--danger  { background: linear-gradient(90deg, #ef4444, #dc2626); }
.patient-bar__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 0.7rem;
    font-size: 0.78rem;
    color: var(--ehr-text-sub);
}
.patient-bar__dot {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 50%;
    margin-right: 0.35rem;
    vertical-align: -1px;
}
.patient-bar__dot--success { background: var(--ehr-success); }
.patient-bar__dot--warn    { background: var(--ehr-warning); }
.patient-bar__dot--danger  { background: var(--ehr-danger); }
.patient-bar__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 0.7rem;
    font-size: 0.78rem;
    color: var(--ehr-text-muted);
}
.patient-bar__meta i { margin-right: 0.3rem; color: var(--ehr-text-sub); }

/* Dark-theme tweaks. */
[data-bs-theme="dark"] .patient-tabs-shell,
[data-theme="dark"] .patient-tabs-shell {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.65) 0%, transparent 100%);
}
[data-bs-theme="dark"] .patient-tabs .nav-link.active,
[data-theme="dark"] .patient-tabs .nav-link.active {
    background: rgba(78, 167, 216, 0.10);
    box-shadow: 0 0 0 1px rgba(78, 167, 216, 0.30);
}
[data-bs-theme="dark"] .patient-tab-count,
[data-theme="dark"] .patient-tab-count { background: rgba(78, 167, 216, 0.16); }
[data-bs-theme="dark"] .patient-section-card__head,
[data-theme="dark"] .patient-section-card__head {
    background: linear-gradient(180deg, rgba(30, 41, 59, 0.6) 0%, rgba(15, 23, 42, 0.4) 100%);
}
[data-bs-theme="dark"] .patient-policy-card,
[data-theme="dark"] .patient-policy-card { background: rgba(15, 23, 42, 0.4); }
[data-bs-theme="dark"] .patient-table thead th,
[data-theme="dark"] .patient-table thead th { background: rgba(15, 23, 42, 0.5); }

/* Financial-plan cards used in the Financial Plans tab — visit-progress
   bar + 8-cell glance grid + footer. Mirrors the modern "plan tile" used
   on the dedicated financial-plan list page. */
.patient-fp-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1rem;
}
.patient-fp-card {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius);
    padding: 1rem 1.1rem;
    transition: box-shadow .2s ease, transform .15s ease, border-color .15s ease;
}
.patient-fp-card:hover {
    box-shadow: var(--ehr-shadow-md);
    border-color: color-mix(in srgb, var(--ehr-primary) 30%, var(--ehr-border));
    transform: translateY(-1px);
}
.patient-fp-card__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}
.patient-fp-card__title {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--ehr-text);
    line-height: 1.25;
}
.patient-fp-card__head .badge { margin-top: 0.3rem; }
.patient-fp-card__progress { margin: 0.1rem 0; }
.patient-fp-card__progress-track {
    height: 8px;
    border-radius: 999px;
    background: var(--ehr-bg-muted);
    overflow: hidden;
    position: relative;
}
.patient-fp-card__progress-fill {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--ehr-primary), #6366f1);
    border-radius: 999px;
    transition: width .4s ease;
}
.patient-fp-card__progress-meta {
    display: flex;
    justify-content: space-between;
    font-size: 0.74rem;
    color: var(--ehr-text-sub);
    margin-top: 0.35rem;
}
.patient-fp-card__progress-meta strong { color: var(--ehr-text); }
.patient-fp-card__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem 1rem;
    margin: 0;
}
.patient-fp-card__grid > div { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.patient-fp-card__grid dt {
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ehr-text-muted);
    font-weight: 700;
}
.patient-fp-card__grid dd {
    margin: 0;
    font-size: 0.85rem;
    color: var(--ehr-text);
    font-weight: 600;
}
.patient-fp-card__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 0.55rem;
    border-top: 1px dashed var(--ehr-border);
}
.patient-fp-card__uid {
    font-family: var(--bs-font-monospace, monospace);
    font-size: 0.72rem;
    color: var(--ehr-text-muted);
}

/* Carrier cards — clickable insurer tiles in the Carriers tab. */
.patient-carrier-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 0.85rem;
}
.patient-carrier-card {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    padding: 1rem 1.1rem;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    border-radius: var(--ehr-radius);
    text-decoration: none;
    color: inherit;
    transition: box-shadow .2s ease, transform .15s ease, border-color .15s ease;
}
.patient-carrier-card:hover {
    box-shadow: var(--ehr-shadow-md);
    transform: translateY(-1px);
    border-color: var(--ehr-primary);
    color: inherit;
}
.patient-carrier-card__head {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}
.patient-carrier-card__avatar {
    width: 40px; height: 40px;
    border-radius: 11px;
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}
.patient-carrier-card__name {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--ehr-text);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.patient-carrier-card__sub {
    display: block;
    font-size: 0.72rem;
    color: var(--ehr-text-muted);
    margin-top: 0.15rem;
    font-family: var(--bs-font-monospace, monospace);
}
.patient-carrier-card__addr {
    font-size: 0.78rem;
    color: var(--ehr-text-sub);
    line-height: 1.4;
    display: flex;
    gap: 0.4rem;
    align-items: flex-start;
}
.patient-carrier-card__addr i { color: var(--ehr-text-muted); margin-top: 0.15rem; }
.patient-carrier-card__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 0.55rem;
    border-top: 1px dashed var(--ehr-border);
    font-size: 0.78rem;
    color: var(--ehr-text-sub);
}
.patient-carrier-card__cta {
    color: var(--ehr-primary);
    font-weight: 600;
}
.patient-carrier-card__cta i { transition: transform .15s ease; }
.patient-carrier-card:hover .patient-carrier-card__cta i { transform: translateX(2px); }

[data-bs-theme="dark"] .patient-fp-card,
[data-theme="dark"] .patient-fp-card,
[data-bs-theme="dark"] .patient-carrier-card,
[data-theme="dark"] .patient-carrier-card { background: rgba(15, 23, 42, 0.4); }
[data-bs-theme="dark"] .patient-fp-card__progress-track,
[data-theme="dark"] .patient-fp-card__progress-track { background: rgba(148, 163, 184, 0.15); }

.patient-row-synced {
    font-size: 0.78rem;
    color: var(--ehr-text-sub);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.patient-row-synced__never {
    color: var(--ehr-text-muted);
    font-style: italic;
}
.ehr-loc-card__footer.patient-row-synced {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.875rem;
    border-top: 1px solid var(--ehr-border);
    margin-top: auto;
}
.ehr-loc-card__footer.patient-row-synced i {
    font-size: 0.85rem;
    opacity: 0.7;
}

.patient-list-tabs {
    display: flex;
    align-items: center;
}
.patient-list-tabs__strip {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding: 0.3125rem;
    margin: 0;
    list-style: none;
    background: linear-gradient(180deg, var(--ehr-bg-muted) 0%, var(--ehr-bg-soft) 100%);
    border: 1px solid var(--ehr-border);
    border-radius: 0.875rem;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.85),
        0 1px 2px rgba(15, 23, 42, 0.04);
    max-width: 100%;
}
.patient-list-tabs__strip .nav-item { display: flex; }
.patient-list-tab {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.95rem;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.005em;
    color: var(--ehr-text-sub);
    background: transparent;
    border: 0;
    border-radius: 0.625rem;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition:
        color 150ms ease,
        background-color 150ms ease,
        box-shadow 250ms cubic-bezier(.4, 0, .2, 1),
        transform 150ms ease;
}
.patient-list-tab i {
    font-size: 0.95rem;
    opacity: 0.75;
    transition: color 150ms ease, opacity 150ms ease, transform 250ms cubic-bezier(.4, 0, .2, 1);
}
.patient-list-tab:hover {
    color: var(--ehr-text);
    background: rgba(255, 255, 255, 0.6);
}
.patient-list-tab:hover i { opacity: 1; }
.patient-list-tab:focus-visible {
    outline: 2px solid var(--ehr-primary);
    outline-offset: 2px;
}
.patient-list-tab.active {
    color: var(--ehr-text);
    background: var(--ehr-bg);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.05),
        0 6px 16px -4px rgba(15, 23, 42, 0.08),
        0 0 0 1px rgba(15, 23, 42, 0.04);
}
.patient-list-tab.active i {
    color: var(--ehr-primary);
    opacity: 1;
    transform: scale(1.05);
}
.patient-list-tab__label { display: inline-block; }
.patient-list-tab__badge {
    display: inline-flex;
    align-items: center;
    padding: 0.0625rem 0.5rem;
    margin-left: 0.1rem;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.5;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.85);
    color: var(--ehr-text-sub);
    border: 1px solid var(--ehr-border);
    transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}
.patient-list-tab.active .patient-list-tab__badge {
    background: var(--ehr-primary-soft);
    color: var(--ehr-primary);
    border-color: transparent;
}

@media (max-width: 575.98px) {
    .patient-list-tabs__strip { width: 100%; display: flex; }
    .patient-list-tabs__strip .nav-item { flex: 1 1 0; }
    .patient-list-tab { flex: 1 1 0; justify-content: center; padding: 0.5rem 0.6rem; }
    .patient-list-tab__label { font-size: 0.8125rem; }
}

.patient-list-indicator {
    position: relative;
    height: 2px;
    margin-bottom: 0.5rem;
    overflow: hidden;
    border-radius: 2px;
    background: transparent;
    opacity: 0;
    pointer-events: none;
    transition: opacity 150ms ease 200ms;
}
.patient-list-indicator.htmx-request,
.htmx-request .patient-list-indicator {
    opacity: 1;
}
.patient-list-indicator__bar {
    position: absolute;
    inset: 0 auto 0 0;
    width: 35%;
    background: linear-gradient(90deg, transparent 0%, var(--ehr-primary) 50%, transparent 100%);
    border-radius: inherit;
    animation: patient-list-indicator-slide 1.1s cubic-bezier(.4, 0, .2, 1) infinite;
}
@keyframes patient-list-indicator-slide {
    0%   { transform: translateX(-120%); }
    100% { transform: translateX(320%); }
}

.patient-list-fragment {
    animation: patient-list-fade-in 220ms cubic-bezier(.4, 0, .2, 1);
}
.patient-list-fragment > .table-responsive,
.patient-list-fragment > .ehr-loc-grid,
.patient-list-fragment > .card,
.patient-list-fragment > .ehr-empty-state {
    animation: patient-list-fade-in 240ms cubic-bezier(.4, 0, .2, 1);
}
@keyframes patient-list-fade-in {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: none; }
}

.patient-skeleton__bar,
.patient-skeleton__pill,
.patient-skeleton__line,
.patient-skeleton__icon,
.patient-skeleton__avatar,
.patient-skeleton__toggle-seg {
    background: linear-gradient(90deg,
        var(--ehr-bg-soft) 0%,
        var(--ehr-border) 50%,
        var(--ehr-bg-soft) 100%);
    background-size: 200% 100%;
    animation: patient-skeleton-shimmer 1.4s ease-in-out infinite;
    border-radius: 0.5rem;
    display: inline-block;
}
@keyframes patient-skeleton-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
.patient-skeleton__bar {
    flex: 1 1 18rem;
    height: 2.4rem;
    border-radius: 0.6rem;
}
.patient-skeleton__pill {
    width: 5.5rem;
    height: 2.1rem;
    border-radius: 999px;
}
.patient-skeleton__pill--small {
    width: 3.5rem;
    height: 1.4rem;
}
.patient-skeleton__pill--wide {
    width: 7rem;
}
.patient-skeleton__toggle {
    display: inline-flex;
    gap: 0.2rem;
    padding: 0.2rem;
    border: 1px solid var(--ehr-border);
    border-radius: 0.6rem;
    background: var(--ehr-bg);
}
.patient-skeleton__toggle-seg {
    width: 3.4rem;
    height: 1.7rem;
    border-radius: 0.45rem;
}
.patient-skeleton__card {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.85rem 1rem;
    border-radius: var(--ehr-radius);
    min-height: 4.7rem;
    background: var(--ehr-bg);
    border: 1px solid var(--ehr-border);
    box-shadow: var(--ehr-shadow-sm);
    animation: none;
}
.patient-skeleton__card-body {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}
.patient-skeleton__icon {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 0.6rem;
    flex-shrink: 0;
}
.patient-skeleton__line {
    height: 0.7rem;
    border-radius: 999px;
}
.patient-skeleton__line--label { width: 45%; height: 0.6rem; }
.patient-skeleton__line--value { width: 65%; height: 1.15rem; }
.patient-skeleton__line--head { width: 5rem; height: 0.65rem; }
.patient-skeleton__line--head-sm { width: 3rem; }
.patient-skeleton__line--name { flex: 1 1 9rem; }
.patient-skeleton__line--meta { flex: 1 1 6rem; }
.patient-skeleton__line--meta-sm { flex: 0 1 3.5rem; }
.patient-skeleton__row {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid var(--ehr-border);
}
.patient-skeleton__row:last-child { border-bottom: 0; }
.patient-skeleton__row--head {
    background: var(--ehr-bg-soft);
    padding-block: 0.55rem;
    gap: 1.1rem;
}
.patient-skeleton__avatar {
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 50%;
    flex: 0 0 2.1rem;
}

[data-bs-theme="dark"] .patient-list-tabs__strip,
[data-theme="dark"] .patient-list-tabs__strip {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.6) 0%, rgba(15, 23, 42, 0.35) 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 1px 2px rgba(0, 0, 0, 0.25);
}
[data-bs-theme="dark"] .patient-list-tab:hover,
[data-theme="dark"] .patient-list-tab:hover {
    background: rgba(30, 41, 59, 0.5);
}
[data-bs-theme="dark"] .patient-list-tab.active,
[data-theme="dark"] .patient-list-tab.active {
    background: var(--ehr-bg);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.35),
        0 6px 16px -4px rgba(0, 0, 0, 0.45),
        0 0 0 1px rgba(148, 163, 184, 0.15);
}
[data-bs-theme="dark"] .patient-list-tab__badge,
[data-theme="dark"] .patient-list-tab__badge {
    background: rgba(15, 23, 42, 0.5);
    border-color: var(--ehr-border-strong);
}
[data-bs-theme="dark"] .patient-skeleton__bar,
[data-theme="dark"] .patient-skeleton__bar,
[data-bs-theme="dark"] .patient-skeleton__pill,
[data-theme="dark"] .patient-skeleton__pill,
[data-bs-theme="dark"] .patient-skeleton__line,
[data-theme="dark"] .patient-skeleton__line,
[data-bs-theme="dark"] .patient-skeleton__icon,
[data-theme="dark"] .patient-skeleton__icon,
[data-bs-theme="dark"] .patient-skeleton__avatar,
[data-theme="dark"] .patient-skeleton__avatar,
[data-bs-theme="dark"] .patient-skeleton__toggle-seg,
[data-theme="dark"] .patient-skeleton__toggle-seg {
    background: linear-gradient(90deg,
        rgba(30, 41, 59, 0.55) 0%,
        rgba(51, 65, 85, 0.7) 50%,
        rgba(30, 41, 59, 0.55) 100%);
    background-size: 200% 100%;
}
[data-bs-theme="dark"] .patient-skeleton__card,
[data-theme="dark"] .patient-skeleton__card {
    background: rgba(15, 23, 42, 0.6);
}

@media (prefers-reduced-motion: reduce) {
    .patient-list-fragment,
    .patient-list-fragment > * { animation: none; }
    .patient-list-indicator__bar { animation: none; }
    .patient-skeleton__bar,
    .patient-skeleton__pill,
    .patient-skeleton__line,
    .patient-skeleton__icon,
    .patient-skeleton__avatar,
    .patient-skeleton__toggle-seg { animation: none; }
}

.ehr-loc-table-soft thead th {
    background: var(--ehr-bg-soft, #fafbfc);
    color: var(--text-sub, #64748b);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
}
.ehr-loc-table-soft tbody td {
    border-top: 1px solid rgba(15, 23, 42, 0.04);
    border-bottom: 0;
}
.ehr-loc-table-soft tbody tr:first-child td { border-top: 0; }
.ehr-loc-table-soft tbody tr {
    transition: background-color 120ms ease;
}
.ehr-loc-table-soft tbody tr:hover {
    background: rgba(99, 102, 241, 0.035);
}

.ehr-loc-table-soft__avatar {
    width: 34px; height: 34px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    border: 1px solid rgba(15, 23, 42, 0.05);
}
.ehr-loc-table-soft__avatar--img {
    object-fit: cover;
    border-color: rgba(15, 23, 42, 0.08);
    background: #fff;
}
.ehr-loc-table-soft__avatar--indigo { background: rgba(99, 102, 241, 0.10); color: #4f46e5; }
.ehr-loc-table-soft__avatar--mint   { background: rgba(16, 185, 129, 0.10); color: #047857; }
.ehr-loc-table-soft__avatar--sky    { background: rgba(14, 165, 233, 0.10); color: #0369a1; }
.ehr-loc-table-soft__avatar--amber  { background: rgba(245, 158, 11, 0.10); color: #b45309; }
.ehr-loc-table-soft__avatar--rose   { background: rgba(244, 63, 94, 0.09);  color: #be123c; }
.ehr-loc-table-soft__avatar--violet { background: rgba(139, 92, 246, 0.10); color: #6d28d9; }
.ehr-loc-table-soft__avatar--teal   { background: rgba(20, 184, 166, 0.10); color: #0f766e; }
.ehr-loc-table-soft__avatar--slate  { background: rgba(100, 116, 139, 0.10); color: #475569; }
[data-bs-theme="dark"] .ehr-loc-table-soft__avatar--indigo,
[data-theme="dark"] .ehr-loc-table-soft__avatar--indigo { color: #a5b4fc; }
[data-bs-theme="dark"] .ehr-loc-table-soft__avatar--mint,
[data-theme="dark"] .ehr-loc-table-soft__avatar--mint   { color: #6ee7b7; }
[data-bs-theme="dark"] .ehr-loc-table-soft__avatar--sky,
[data-theme="dark"] .ehr-loc-table-soft__avatar--sky    { color: #7dd3fc; }
[data-bs-theme="dark"] .ehr-loc-table-soft__avatar--amber,
[data-theme="dark"] .ehr-loc-table-soft__avatar--amber  { color: #fcd34d; }
[data-bs-theme="dark"] .ehr-loc-table-soft__avatar--rose,
[data-theme="dark"] .ehr-loc-table-soft__avatar--rose   { color: #fda4af; }
[data-bs-theme="dark"] .ehr-loc-table-soft__avatar--violet,
[data-theme="dark"] .ehr-loc-table-soft__avatar--violet { color: #c4b5fd; }
[data-bs-theme="dark"] .ehr-loc-table-soft__avatar--teal,
[data-theme="dark"] .ehr-loc-table-soft__avatar--teal   { color: #5eead4; }
[data-bs-theme="dark"] .ehr-loc-table-soft__avatar--slate,
[data-theme="dark"] .ehr-loc-table-soft__avatar--slate  { color: #cbd5e1; }

.ehr-loc-table-soft__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.18rem 0.55rem;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.2;
}
.ehr-loc-table-soft__chip i { font-size: 0.7rem; }
.ehr-loc-table-soft__chip--ok    { background: rgba(16, 185, 129, 0.10); color: #047857; }
.ehr-loc-table-soft__chip--muted { background: rgba(100, 116, 139, 0.08); color: #64748b; }
[data-bs-theme="dark"] .ehr-loc-table-soft__chip--ok,
[data-theme="dark"] .ehr-loc-table-soft__chip--ok    { color: #6ee7b7; }
[data-bs-theme="dark"] .ehr-loc-table-soft__chip--muted,
[data-theme="dark"] .ehr-loc-table-soft__chip--muted { color: #94a3b8; }

.ehr-loc-table-soft__star {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px; height: 22px;
    border-radius: 50%;
    background: rgba(245, 158, 11, 0.12);
    color: #b45309;
    font-size: 0.7rem;
}
[data-bs-theme="dark"] .ehr-loc-table-soft__star,
[data-theme="dark"] .ehr-loc-table-soft__star { color: #fcd34d; }

.ehr-results-pagination {
    --epg-fg: #475569;
    --epg-fg-muted: #94a3b8;
    --epg-active-bg: rgba(99, 102, 241, 0.10);
    --epg-active-fg: #4f46e5;
    --epg-hover-bg: rgba(15, 23, 42, 0.04);
}
.ehr-results-pagination .pagination { gap: 0.18rem; }
.ehr-results-pagination .page-link {
    border: 0;
    background: transparent;
    color: var(--epg-fg);
    border-radius: 8px;
    padding: 0.32rem 0.6rem;
    min-width: 30px;
    font-size: 0.78rem;
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
    transition: background-color 120ms ease, color 120ms ease;
}
.ehr-results-pagination .page-link:hover,
.ehr-results-pagination .page-link:focus-visible {
    background: var(--epg-hover-bg);
    color: #0f172a;
    box-shadow: none;
}
.ehr-results-pagination .page-item.active .page-link {
    background: var(--epg-active-bg);
    color: var(--epg-active-fg);
    font-weight: 600;
}
.ehr-results-pagination .page-item.disabled .page-link {
    color: var(--epg-fg-muted);
    background: transparent;
    opacity: 0.6;
}
.ehr-results-pagination nav { padding: 0.6rem 0; }
.ehr-results-pagination small { font-size: 0.72rem; color: var(--text-sub, #64748b); }
[data-bs-theme="dark"] .ehr-results-pagination,
[data-theme="dark"] .ehr-results-pagination {
    --epg-fg: #cbd5e1;
    --epg-fg-muted: #64748b;
    --epg-active-bg: rgba(99, 102, 241, 0.18);
    --epg-active-fg: #a5b4fc;
    --epg-hover-bg: rgba(255, 255, 255, 0.05);
}
[data-bs-theme="dark"] .ehr-results-pagination .page-link:hover,
[data-theme="dark"] .ehr-results-pagination .page-link:hover,
[data-bs-theme="dark"] .ehr-results-pagination .page-link:focus-visible,
[data-theme="dark"] .ehr-results-pagination .page-link:focus-visible {
    color: #f1f5f9;
}

.locations-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
    padding: 0.55rem 0.85rem;
    background: #fff;
    border: 1px solid #eef0f3;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .03);
}
.locations-toolbar__lead {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-width: 0;
    flex: 1 1 auto;
}
.locations-toolbar__clinic {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: #0f172a;
}
.locations-toolbar__clinic i { color: #6366f1; font-size: 0.85rem; }
.locations-toolbar__count {
    font-size: 0.72rem;
    color: #64748b;
    padding: 0.15rem 0.55rem;
    background: rgba(15, 23, 42, 0.04);
    border-radius: 999px;
    font-weight: 500;
}
.locations-toolbar__synced {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    color: #64748b;
}
.locations-toolbar__synced i { font-size: 0.78rem; color: #94a3b8; }
.locations-toolbar__actions {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-left: auto;
    flex-wrap: wrap;
}
.locations-toolbar__pill {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    border: 1px solid transparent;
    line-height: 1.2;
}
.locations-toolbar__pill--warning {
    color: #b45309;
    background: #fffbeb;
    border-color: rgba(245, 158, 11, .25);
}
.locations-toolbar__pill i { font-size: 0.85rem; }

.location-row-synced { color: #475569; }
.location-row-synced span { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.7rem; }
.location-row-synced i { color: #94a3b8; font-size: 0.75rem; }
.location-row-synced__never { color: #94a3b8; font-style: italic; font-size: 0.7rem; }

[data-bs-theme="dark"] .locations-toolbar,
[data-theme="dark"] .locations-toolbar {
    background: #0f172a;
    border-color: #1e293b;
    box-shadow: none;
}
[data-bs-theme="dark"] .locations-toolbar__clinic,
[data-theme="dark"] .locations-toolbar__clinic { color: #e2e8f0; }
[data-bs-theme="dark"] .locations-toolbar__clinic i,
[data-theme="dark"] .locations-toolbar__clinic i { color: #a5b4fc; }
[data-bs-theme="dark"] .locations-toolbar__count,
[data-theme="dark"] .locations-toolbar__count {
    color: #94a3b8;
    background: rgba(255, 255, 255, 0.05);
}
[data-bs-theme="dark"] .locations-toolbar__synced,
[data-theme="dark"] .locations-toolbar__synced { color: #94a3b8; }
[data-bs-theme="dark"] .locations-toolbar__synced i,
[data-theme="dark"] .locations-toolbar__synced i { color: #64748b; }
[data-bs-theme="dark"] .locations-toolbar__pill--warning,
[data-theme="dark"] .locations-toolbar__pill--warning {
    color: #fcd34d;
    background: rgba(245, 158, 11, 0.10);
    border-color: rgba(245, 158, 11, .35);
}
[data-bs-theme="dark"] .location-row-synced,
[data-theme="dark"] .location-row-synced { color: #cbd5e1; }
[data-bs-theme="dark"] .location-row-synced i,
[data-theme="dark"] .location-row-synced i { color: #64748b; }
[data-bs-theme="dark"] .location-row-synced__never,
[data-theme="dark"] .location-row-synced__never { color: #64748b; }