/* ══════════════════════════════════════════════════════════════════════
   DELVE ANALYTICS — PREMIUM HEALTHCARE REDESIGN LAYER
   ----------------------------------------------------------------------
   Loaded LAST (after style.css, improvements.css, skeleton.css).
   Purpose: refresh ONLY the visual language — colours, typography,
   spacing, cards, tables, buttons, forms, pills, motion — to a calm,
   minimal, premium clinical aesthetic. No structural / behavioural
   changes. Light theme is the primary target; the existing dark theme
   (body.theme-dark) is preserved and left functional.
   ══════════════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────
   1. DESIGN TOKENS
   ───────────────────────────────────────────── */
:root {
    /* Brand / accent — soft lavender replaces the enterprise blue */
    --color-primary:      #A78BFA;
    --color-primary-strong:#8B6DF0;
    --nav-accent:          #A78BFA;
    --nav-accent-rgb:      167, 139, 250;
    --nav-accent-subtle:   rgba(167, 139, 250, 0.14);

    /* Semantic — kept readable but softened toward pastel */
    --color-success:      #3F9E77;
    --color-warning:      #C98A2B;
    --color-danger:       #D65C7A;
    --color-neutral:      #8A8A93;

    /* Surfaces & text — warm white / ivory */
    --color-surface:      #FFFFFF;
    --color-border:       #ECECEC;
    --color-text:         #26262B;
    --color-text-muted:   #6B6B72;

    /* Pastel pill fills */
    --pill-critical-bg:   #FBE1E8;   --pill-critical-fg: #B14A63;
    --pill-warning-bg:    #FCEFD6;   --pill-warning-fg:  #99671A;
    --pill-good-bg:       #E7F4EC;   --pill-good-fg:     #2F7D5B;
    --pill-info-bg:       #EFEAFB;   --pill-info-fg:     #6D4FC7;
    --pill-neutral-bg:    #F1F0ED;   --pill-neutral-fg:  #6B6B72;

    /* Shape / depth / motion */
    --radius-card:        18px;
    --radius-control:     12px;
    --radius-pill:        999px;
    --shadow-card:        0 1px 2px rgba(38, 34, 28, 0.03), 0 10px 30px -18px rgba(38, 34, 28, 0.10);
    --shadow-card-hover:  0 2px 6px rgba(38, 34, 28, 0.05), 0 18px 42px -20px rgba(38, 34, 28, 0.16);
    --transition:         0.24s cubic-bezier(0.4, 0, 0.2, 1);

    /* Fonts */
    --font-serif: 'Newsreader', 'Georgia', 'Times New Roman', serif;
    --font-sans:  'Geist', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    /* Dashboard surface tokens (consumed across pages) */
    --dash-canvas:        #FAFAF8;
    --dash-surface:       #FFFFFF;
    --dash-surface-muted: #F7F5F1;
    --dash-border:        #ECECEC;
    --dash-border-subtle: #F2F0EC;
    --dash-text:          #26262B;
    --dash-text-muted:    #6B6B72;
    --dash-text-soft:     #9A9AA2;
    --dash-tint-primary:  rgba(167, 139, 250, 0.10);
    --dash-tint-success:  rgba(63, 158, 119, 0.10);
    --dash-tint-warning:  rgba(255, 213, 138, 0.22);
    --dash-tint-danger:   rgba(246, 199, 210, 0.34);
    --dash-hover-row:     rgba(167, 139, 250, 0.06);
    --dash-control-hover: rgba(38, 34, 28, 0.05);
}

/* ─────────────────────────────────────────────
   2. CANVAS / BODY — warm white, no purple gradient
   ───────────────────────────────────────────── */
body:not(.theme-dark) {
    background: #FAFAF8;
    color: var(--color-text);
}

body:not(.theme-dark) .main-content {
    background: #FAFAF8;
}

/* Elegant native scrollbars (light) */
body:not(.theme-dark) * {
    scrollbar-color: #DCDCD6 transparent;
    scrollbar-width: thin;
}
body:not(.theme-dark) ::-webkit-scrollbar { width: 10px; height: 10px; }
body:not(.theme-dark) ::-webkit-scrollbar-thumb {
    background: #E0E0DA;
    border: 3px solid transparent;
    background-clip: content-box;
    border-radius: 999px;
}
body:not(.theme-dark) ::-webkit-scrollbar-thumb:hover { background: #CFCFC8; }
body:not(.theme-dark) ::-webkit-scrollbar-track { background: transparent; }

/* ─────────────────────────────────────────────
   3. TYPOGRAPHY — serif page titles, refined sans
   ───────────────────────────────────────────── */
body {
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 0.005em;
}

.content-header-greeting,
.page-title-h1,
.compliance-title-block h1,
.device-status-title h1,
.alerts-header h1,
.site-report-title-main h1,
#sr-title,
.monitoring-title h1,
.investigation-title h1,
.data-export-title h1,
.settings-title h1,
.analyses-functions-title h1 {
    font-family: var(--font-serif);
    font-weight: 400;
    letter-spacing: -0.015em;
    line-height: 1.15;
}

body:not(.theme-dark) .content-header-greeting,
body:not(.theme-dark) .page-title-h1,
body:not(.theme-dark) #sr-title {
    color: #26262B;
}

.content-header-greeting {
    font-size: 1.55rem;
}

.home-metrics.site-report-page .sr-ai-btn-label {
    font-family: var(--font-serif);
    font-weight: 400;
    letter-spacing: -0.015em;
    line-height: 1.15;
}

.home-metrics.site-report-page .sr-ai-btn-icon {
    display: none;
}

/* Large, light metric numbers */
.sr-card-value,
.compliance-overall-score .score-main {
    font-weight: 400 !important;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}

/* Section labels — quiet uppercase */
.site-report-section-title {
    color: var(--dash-text-soft);
    letter-spacing: 0.12em;
}

/* ─────────────────────────────────────────────
   4. SIDEBAR — thin, warm white, pastel selection
   ───────────────────────────────────────────── */
body:not(.theme-dark) .sidebar {
    background: #FFFFFF;
    border-right: 1px solid var(--color-border);
    box-shadow: none;
}

body:not(.theme-dark) .sidebar-header,
body:not(.theme-dark) .sidebar-nav,
body:not(.theme-dark) .sidebar-footer {
    background: #FFFFFF;
    border-color: #edf1f6;
}

body:not(.theme-dark) .sidebar-header {
    border: 1px solid #edf1f6;
    border-bottom: none;
}
body:not(.theme-dark) .sidebar-nav {
    border: 1px solid #edf1f6;
    border-top: none;
    border-bottom: none;
}
body:not(.theme-dark) .sidebar-footer {
    border: 1px solid #edf1f6;
    border-top: 1px solid #edf1f6;
}

/* Generous breathing room + rounded pills */
.sidebar-nav {
    gap: 6px;
    padding-left: 8px;
    padding-right: 8px;
}

.sidebar-nav-item {
    border-radius: var(--radius-control);
    transition: background var(--transition), color var(--transition);
}

body:not(.theme-dark) .sidebar-nav-item {
    background: transparent;
    color: #aab3c1;
    font-weight: 400;
    letter-spacing: 0.005em;
    border-left: none !important;
    box-shadow: none;
}

body:not(.theme-dark) .sidebar-nav-text {
    color: #aab3c1;
    font-size: 0.89rem;
    font-weight: 400;
}

body:not(.theme-dark) .sidebar-nav-icon {
    opacity: 0.42;
    filter: grayscale(0.45);
}

body:not(.theme-dark) .sidebar-nav-item:hover {
    background: rgba(248, 250, 252, 0.72);
    color: #8b96a8;
}

body:not(.theme-dark) .sidebar-nav-item:hover .sidebar-nav-text {
    color: #8b96a8;
}

body:not(.theme-dark) .sidebar-nav-item:hover .sidebar-nav-icon {
    opacity: 0.58;
    filter: grayscale(0.25);
}

body:not(.theme-dark) .sidebar-nav-item.active {
    background: rgba(245, 247, 251, 0.82) !important;
    color: #7b8798 !important;
    border-left: none !important;
    padding-left: 12px;
}

body:not(.theme-dark) .sidebar-nav-item.active::before {
    display: none;
}

body:not(.theme-dark) .sidebar-nav-item.active .sidebar-nav-text {
    color: #7b8798 !important;
    font-weight: 400;
}

body:not(.theme-dark) .sidebar-nav-item.active .sidebar-nav-icon {
    opacity: 0.62;
    filter: grayscale(0.2);
}

body:not(.theme-dark) .sidebar-toggle-btn {
    color: #a6afbd;
}

body:not(.theme-dark) .sidebar-toggle-btn:hover {
    background: #f6f7fb;
    color: #758195;
}

/* Folded sidebar: center the icon-only buttons within the 52px rail. */
.sidebar:not(.expanded) .sidebar-nav {
    width: 100%;
    box-sizing: border-box;
    align-items: center;
    padding-left: 6px;
    padding-right: 6px;
    overflow-x: hidden;
}

.sidebar:not(.expanded) .sidebar-nav-item {
    width: 36px;
    max-width: 36px;
    flex: 0 0 auto;
    min-height: 40px;
    box-sizing: border-box;
    justify-content: center;
    gap: 0;
    padding: 10px 0 !important;
    overflow: hidden;
}

.sidebar:not(.expanded) .sidebar-nav-item.active {
    padding-left: 0 !important;
}

.sidebar:not(.expanded) .sidebar-nav-icon {
    flex: 0 0 20px;
    margin: 0 auto;
}

.sidebar:not(.expanded) .sidebar-nav-text {
    display: none;
}

.sidebar:not(.expanded) #analyses-functions.sidebar-nav-item::before {
    left: 4px;
    right: 4px;
}

.sidebar:not(.expanded) #monitoring-station .sidebar-live-dot {
    right: 3px;
}

#compliance.sidebar-nav-item {
    display: none;
}

#alerts.sidebar-nav-item {
    order: 3;
}

/* Logo — charcoal-ise the white line artwork on light bg */
body:not(.theme-dark) .logo {
    filter: brightness(0) opacity(0.46);
}

/* Monochrome line icons */
body:not(.theme-dark) .sidebar-nav-icon {
    filter: brightness(0);
    opacity: 0.78;
    transition: opacity var(--transition);
}
body:not(.theme-dark) .sidebar-nav-item:hover .sidebar-nav-icon,
body:not(.theme-dark) .sidebar-nav-item.active .sidebar-nav-icon {
    filter: brightness(0);
    opacity: 1;
}

/* Text colour */
body:not(.theme-dark) .sidebar-nav-item,
body:not(.theme-dark) .sidebar-nav-text {
    color: #26262B;
}

body:not(.theme-dark) .sidebar-nav-text {
    font-family: var(--font-sans);
    font-weight: 500;
    letter-spacing: 0;
}

#patient-insight-graph .sidebar-nav-text {
    font-size: 0;
}

#patient-insight-graph .sidebar-nav-text::after {
    content: "eCOA";
    font-size: 0.95rem;
}

#patient-insight-graph .sidebar-nav-icon {
    content: url("/assets/insights.png");
}

/* Hover — soft lavender wash */
body:not(.theme-dark) .sidebar-nav-item:hover {
    background: rgba(167, 139, 250, 0.09);
    color: #111114;
}
body:not(.theme-dark) .sidebar-nav-item:hover .sidebar-nav-text {
    color: #111114;
}

/* Active — full rounded pastel pill, no bright bar */
body:not(.theme-dark) .sidebar-nav-item.active {
    background: rgba(167, 139, 250, 0.16) !important;
    color: #4A3C7A !important;
    border-left: 0 !important;
    padding-left: 12px !important;
}

body:not(.theme-dark) .sidebar:not(.expanded) .sidebar-nav-item.active {
    padding-left: 0 !important;
}

body:not(.theme-dark) .sidebar-nav-item.active .sidebar-nav-text {
    color: #4A3C7A !important;
    font-weight: 600;
}

/* Toggle chevron + footer text */
body:not(.theme-dark) .sidebar-toggle-btn { color: #8A8A93; }
body:not(.theme-dark) .sidebar-toggle-btn:hover { color: #26262B; }
body:not(.theme-dark) .sidebar-footer-text { color: #A0A0A8 !important; }

.sidebar:not(.expanded) .sidebar-footer-text {
    display: inline-flex;
    font-size: 0;
    opacity: 1;
}

.sidebar:not(.expanded) .sidebar-footer-text::after {
    content: "2.0";
    font-size: 0.72rem;
}

/* Section separator above secondary items */
body:not(.theme-dark) #analyses-functions.sidebar-nav-item::before {
    background: linear-gradient(90deg, transparent, rgba(38, 34, 28, 0.07) 12%, rgba(38, 34, 28, 0.07) 88%, transparent);
}

/* Collapsed tooltip — soften */
body:not(.theme-dark) .sidebar:not(.expanded) .sidebar-nav-item[title]:hover::after {
    background: #2A2A2E;
    box-shadow: 0 6px 20px rgba(38, 34, 28, 0.18);
    border-radius: 8px;
}

/* ─────────────────────────────────────────────
   5. TOP BAR (content-header) — soft blush frost
   ───────────────────────────────────────────── */
body:not(.theme-dark) .content-header {
    background: linear-gradient(180deg, #FBF6F3 0%, #FAFAF8 100%);
    border-bottom: 0;
}

body:not(.theme-dark) .content-header-greeting {
    color: #26262B;
}

body:not(.theme-dark) .content-header-datetime::before {
    content: "";
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    background: center / contain no-repeat;
    opacity: 0.72;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2326262B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M8 2v4'/><path d='M16 2v4'/><rect x='3' y='4' width='18' height='18' rx='4'/><path d='M3 10h18'/></svg>");
}

body:not(.theme-dark) .content-header-datetime__date { color: #9A9AA2; }
body:not(.theme-dark) .content-header-datetime__date::after { color: #C9C9C2; }
body:not(.theme-dark) .content-header-datetime__time { color: #4A4A50; }

/* User chip — quiet neutral */
body:not(.theme-dark) .user-info-card {
    background: #FFFFFF;
    border: 1px solid var(--color-border);
    color: #26262B;
    border-radius: var(--radius-control);
    box-shadow: var(--shadow-card);
}
body:not(.theme-dark) .user-info-name,
body:not(.theme-dark) .user-info-role,
body:not(.theme-dark) .user-info-customer { color: #26262B; }

body:not(.theme-dark) .user-info-name::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2326262B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21a8 8 0 0 0-16 0'/><circle cx='12' cy='7' r='4'/></svg>");
}

body:not(.theme-dark) .user-info-separator {
    background: rgba(38, 38, 43, 0.18);
}

body:not(.theme-dark) .header-notifications__button {
    background: transparent;
    border: 0;
    color: #26262B;
    box-shadow: none;
}

body:not(.theme-dark) .header-notifications__button:hover,
body:not(.theme-dark) .header-notifications.is-open .header-notifications__button {
    background: transparent;
    color: #26262B;
    box-shadow: none;
    transform: none;
}

/* Floating theme toggle — rounded, subtle */
.settings-theme-toggle {
    border-radius: var(--radius-pill) !important;
    transition: background var(--transition), color var(--transition), border-color var(--transition), transform var(--transition) !important;
}
body:not(.theme-dark) .settings-theme-toggle {
    background: #FFFFFF;
    border: 1px solid var(--color-border);
    color: #6B6B72;
}
body:not(.theme-dark) .settings-theme-toggle:hover {
    color: #26262B;
    border-color: #DCDCD6;
    transform: translateY(-1px);
}

/* ─────────────────────────────────────────────
   6. CARDS — large radius, hairline border, whisper shadow
   ───────────────────────────────────────────── */
.sr-card,
.analytics-card,
.dash-study-card,
.investigation-box,
.monitoring-empty-card,
.investigation-empty-card,
.compliance-card,
.compliance-metric-card,
.compliance-device-card,
.compliance-overall-card,
.alarms-table-section,
.data-export-card,
.settings-card,
.device-status-card {
    border-radius: var(--radius-card);
    border: 1px solid var(--dash-border);
    box-shadow: var(--shadow-card);
    background: var(--dash-surface);
    transition: box-shadow var(--transition), transform var(--transition), border-color var(--transition);
}

.sr-card:hover,
.analytics-card:hover,
.dash-study-card:hover,
.investigation-box:hover {
    box-shadow: var(--shadow-card-hover);
    border-color: #E4E4DE;
}

.sr-card--clickable:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-card-hover);
}

/* KPI tiles — airy, large, quiet tints */
.site-report-cards {
    gap: 16px;
}
.home-metrics.site-report-page .sr-card {
    height: auto;
    min-height: 110px;
    padding: 20px 22px;
    position: relative;
    border: 0;
    box-shadow: var(--shadow-card);
}
.home-metrics.site-report-page .sr-card-value {
    font-size: 1.9rem;
}

.home-metrics.site-report-page .sr-card-label > .report-info-tip {
    position: absolute;
    top: 14px;
    right: 14px;
    margin-left: 0;
}

.home-metrics.site-report-page .sr-card-label > .report-info-tip .report-info-tip-btn {
    width: 18px;
    height: 18px;
    border: 0;
    background: rgba(255, 255, 255, 0.82);
    color: var(--dash-text-soft);
}

.home-metrics.site-report-page .sr-card-label > .report-info-tip .report-info-tip-text {
    left: auto;
    right: 0;
    transform: none;
}

.home-metrics.site-report-page .sr-card-label > .report-info-tip .report-info-tip-text::after {
    left: auto;
    right: 4px;
    transform: none;
}

/* Restore rounded corners the dashboard page had squared off */
.home-metrics.site-report-page {
    --radius-card: 16px;
}
.home-metrics.site-report-page .site-report-table-wrap,
.home-metrics.site-report-page .dash-study-selector-input,
.home-metrics.site-report-page .monitoring-empty-card,
.home-metrics.site-report-page .investigation-empty-card,
.home-metrics.site-report-page .delve-skel,
.home-metrics.site-report-page .delve-skel-card,
.home-metrics.site-report-page .sr-att-toggle,
.home-metrics.site-report-page .sr-att-row {
    border-radius: 14px;
}
.home-metrics.site-report-page .sr-pill,
.home-metrics.site-report-page .sr-status-pill,
.home-metrics.site-report-page .sr-drill-btn {
    border-radius: var(--radius-pill);
}

/* Attention blocks — flatten heavy left bar into a soft card */
.sr-att-block {
    border-radius: var(--radius-card);
    border: 1px solid var(--dash-border);
    box-shadow: var(--shadow-card);
    overflow: hidden;
}

.home-metrics.site-report-page .sr-att-block {
    background: #FFFFFF;
    border: 0;
    box-shadow: var(--shadow-card);
}

.home-metrics.site-report-page .sr-att-block-title,
.home-metrics.site-report-page .sr-att-block--stale .sr-att-block-title,
.home-metrics.site-report-page .sr-att-block--battery .sr-att-block-title,
.home-metrics.site-report-page .sr-att-block--anomaly .sr-att-block-title {
    padding: 14px 18px;
    background: transparent;
    border-bottom: 0;
    color: #26262B;
    font-family: var(--font-serif);
    font-size: 1.02rem;
    font-weight: 400;
    letter-spacing: -0.01em;
}

.home-metrics.site-report-page .sr-att-block-body {
    padding: 14px;
    gap: 10px;
    border: 0;
}

.home-metrics.site-report-page .sr-att-row {
    padding: 13px 14px;
    background: #FFFFFF;
    border: 0;
    box-shadow: var(--shadow-card);
}

.home-metrics.site-report-page .sr-att-row:hover {
    background: #FAFAF8;
    box-shadow: var(--shadow-card-hover);
}

.home-metrics.site-report-page .sr-att-patient {
    color: #26262B;
    font-weight: 600;
    letter-spacing: -0.005em;
}

.home-metrics.site-report-page .sr-att-detail {
    color: var(--dash-text-muted);
}

.home-metrics.site-report-page .sr-att-toggle {
    margin: 2px 0 0;
    border: 1px solid var(--dash-border);
    background: #FFFFFF;
    color: var(--dash-text-muted);
    font-weight: 500;
}

.home-metrics.site-report-page .sr-att-toggle:hover {
    background: #FAFAF8;
    border-color: #DCDCD6;
    color: #26262B;
}

/* Rows with inline metric actions need the status pill aligned to the action,
   not centered against the full patient/detail stack. */
.sr-att-row:has(.sr-att-metric-line--active-today) .sr-att-mid {
    align-self: end;
    margin-bottom: 6px;
}

.sr-att-row:has(.sr-att-metric-line--active-today) .sr-drill-btn,
.sr-att-row:has(.sr-att-metric-line--active-today) .sr-pill {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
}

/* ─────────────────────────────────────────────
   7. TABLES — airy, minimal separators
   ───────────────────────────────────────────── */
body:not(.theme-dark) .site-report-table thead th,
body:not(.theme-dark) .alarms-table th,
body:not(.theme-dark) .device-status-table th,
body:not(.theme-dark) .device-table th,
body:not(.theme-dark) .sr-drill-table th {
    background: transparent;
    color: var(--dash-text-soft);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    font-size: 0.7rem;
    font-weight: 600;
    border-bottom: 1px solid var(--dash-border);
    padding-top: 14px;
    padding-bottom: 12px;
}

body:not(.theme-dark) .site-report-table tbody td,
body:not(.theme-dark) .alarms-table td,
body:not(.theme-dark) .device-status-table td,
body:not(.theme-dark) .device-table td,
body:not(.theme-dark) .sr-drill-table td {
    border-bottom: 1px solid var(--dash-border-subtle);
    padding-top: 15px;
    padding-bottom: 15px;
    color: var(--dash-text-muted);
}

.site-report-table tbody tr:hover,
.alarms-table tbody tr:hover,
.device-status-table tbody tr:hover,
.device-table tbody tr:hover {
    background: var(--dash-hover-row);
}

.site-report-table-wrap {
    border-radius: var(--radius-card);
    border: 1px solid var(--dash-border);
    box-shadow: var(--shadow-card);
    overflow: hidden;
}

.home-metrics.site-report-page .site-report-table-wrap {
    border: 0;
    box-shadow: var(--shadow-card);
}

/* ─────────────────────────────────────────────
   8. STATUS PILLS & BADGES — soft pastel
   ───────────────────────────────────────────── */
.sr-status-pill,
.sr-pill {
    border-radius: var(--radius-pill);
    padding: 6px 15px;
    border: none;
    box-shadow: none;
    font-weight: 600;
    letter-spacing: 0.01em;
}

body:not(.theme-dark) .sr-status-pill--ok,
body:not(.theme-dark) .sr-pill--ok {
    background: var(--pill-good-bg);
    color: var(--pill-good-fg);
}
body:not(.theme-dark) .sr-status-pill--watch,
body:not(.theme-dark) .sr-pill--watch {
    background: var(--pill-warning-bg);
    color: var(--pill-warning-fg);
}
body:not(.theme-dark) .sr-status-pill--alert,
body:not(.theme-dark) .sr-pill--alert {
    background: var(--pill-critical-bg);
    color: var(--pill-critical-fg);
}
body:not(.theme-dark) .sr-pill {
    background: var(--pill-neutral-bg);
    color: var(--pill-neutral-fg);
}

/* Compliance / patient chips */
body:not(.theme-dark) .compliance-chip,
body:not(.theme-dark) .dash-badge {
    background: var(--pill-neutral-bg);
    color: var(--pill-neutral-fg);
    border-radius: var(--radius-pill);
    padding: 4px 12px;
}
body:not(.theme-dark) .compliance-chip-secondary {
    background: var(--pill-critical-bg);
    color: var(--pill-critical-fg);
}
body:not(.theme-dark) .compliance-patient-chip {
    background: var(--pill-info-bg);
    color: var(--pill-info-fg);
    border-radius: var(--radius-pill);
}

/* Progress bars — rounded, semantic */
.sr-progress-bar { border-radius: var(--radius-pill); height: 7px; }
.sr-progress-fill { border-radius: var(--radius-pill); }

/* ─────────────────────────────────────────────
   9. BUTTONS — pill, charcoal primary / white secondary
   ───────────────────────────────────────────── */
.btn-primary,
.report-composer-btn-primary,
.monitoring-add-btn,
.monitoring-actions .btn-outline-teal {
    background: #2A2A2E !important;
    color: #FFFFFF !important;
    border: 1px solid #2A2A2E !important;
    border-radius: var(--radius-pill) !important;
    box-shadow: none !important;
    font-weight: 500;
    background-image: none !important;
    transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
}
.btn-primary:hover,
.report-composer-btn-primary:hover,
.monitoring-add-btn:hover {
    background: #3D3D45 !important;
    box-shadow: 0 6px 18px -8px rgba(38, 34, 28, 0.5) !important;
    transform: translateY(-1px);
}

.btn-secondary,
.sr-drill-btn,
.home-reload-btn,
.report-composer-btn-secondary,
.chart-tool-btn,
.compliance-metric-chart-toggle {
    border-radius: var(--radius-pill) !important;
    transition: background var(--transition), border-color var(--transition), color var(--transition);
}

body:not(.theme-dark) .btn-secondary,
body:not(.theme-dark) .sr-drill-btn,
body:not(.theme-dark) .home-reload-btn {
    background: #FFFFFF;
    border: 1px solid var(--dash-border);
    color: var(--dash-text);
}
body:not(.theme-dark) .btn-secondary:hover,
body:not(.theme-dark) .sr-drill-btn:hover,
body:not(.theme-dark) .home-reload-btn:hover {
    background: #FAFAF8;
    border-color: #DCDCD6;
    color: #26262B;
}

/* Generic add-alarm / outline buttons */
.btn-add-alarm,
.btn-outline-green,
.btn-outline-teal {
    border-radius: var(--radius-pill) !important;
    font-weight: 500 !important;
}

/* ─────────────────────────────────────────────
   10. INPUTS / SEARCH — soft filled, minimal border
   ───────────────────────────────────────────── */
body:not(.theme-dark) input[type="text"],
body:not(.theme-dark) input[type="search"],
body:not(.theme-dark) input[type="email"],
body:not(.theme-dark) input[type="number"],
body:not(.theme-dark) select,
body:not(.theme-dark) textarea,
body:not(.theme-dark) .dash-patient-search,
body:not(.theme-dark) .device-status-search,
body:not(.theme-dark) .monitoring-filter-input,
body:not(.theme-dark) .compliance-study-select,
body:not(.theme-dark) .dash-study-selector-input,
body:not(.theme-dark) .signal-range-input,
body:not(.theme-dark) .signal-duration-input {
    background: #F4F3F0;
    border: 1px solid transparent;
    border-radius: var(--radius-control);
    color: var(--color-text);
    transition: background var(--transition), border-color var(--transition), box-shadow var(--transition);
}

body:not(.theme-dark) input[type="text"]:focus,
body:not(.theme-dark) input[type="search"]:focus,
body:not(.theme-dark) input[type="number"]:focus,
body:not(.theme-dark) select:focus,
body:not(.theme-dark) textarea:focus,
body:not(.theme-dark) .dash-patient-search:focus,
body:not(.theme-dark) .device-status-search:focus,
body:not(.theme-dark) .monitoring-filter-input:focus,
body:not(.theme-dark) .compliance-study-select:focus,
body:not(.theme-dark) .dash-study-selector-input:focus {
    background: #FFFFFF;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(167, 139, 250, 0.15);
    outline: none;
}

body:not(.theme-dark) input::placeholder,
body:not(.theme-dark) textarea::placeholder {
    color: #A8A8AF;
}

/* ─────────────────────────────────────────────
   11. ACCENT NORMALISATION — retire enterprise blue
   ───────────────────────────────────────────── */
.monitoring-menu-tab.active {
    color: var(--color-primary);
    border-right-color: var(--color-primary);
}
.monitoring-display-option {
    border-radius: var(--radius-pill);
}

body:not(.theme-dark) .monitoring-display-option {
    background: #FFFFFF;
    border-color: var(--dash-border);
    color: var(--dash-text-muted);
}

body:not(.theme-dark) .monitoring-display-option:hover {
    background: #FAFAF8;
    border-color: #DCDCD6;
    color: #26262B;
}

.monitoring-display-option.active {
    background: #26262B;
    border-color: #26262B;
    color: #FFFFFF;
    box-shadow: none;
}

body:not(.theme-dark) .monitoring-display-option.active,
body:not(.theme-dark) .monitoring-display-option.active:hover {
    background: #26262B;
    border-color: #26262B;
    color: #FFFFFF;
    box-shadow: none;
}

.monitoring-display-option.active:focus,
.monitoring-display-option.active:focus-visible {
    box-shadow: none;
}

body:not(.theme-dark) .monitoring-status-summary,
body:not(.theme-dark) .patient-box {
    background: #FFFFFF;
    border: 0;
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
}

body:not(.theme-dark) .monitoring-status-summary {
    padding: 14px 16px;
}

body:not(.theme-dark) .monitoring-status-summary-item {
    border: 0;
    border-radius: var(--radius-pill);
    box-shadow: none;
}

body:not(.theme-dark) .monitoring-status-summary-item--no-data {
    background: var(--pill-critical-bg);
}

body:not(.theme-dark) .monitoring-status-summary-item--stale {
    background: var(--pill-warning-bg);
}

body:not(.theme-dark) .monitoring-status-summary-item--live {
    background: var(--pill-good-bg);
}

body:not(.theme-dark) .monitoring-status-summary-value {
    color: #26262B;
    font-weight: 500;
}

body:not(.theme-dark) .monitoring-status-summary-label {
    color: var(--dash-text-muted);
    font-weight: 500;
}

body:not(.theme-dark) .patient-box {
    border-radius: var(--radius-card);
    transition: box-shadow var(--transition), transform var(--transition);
}

body:not(.theme-dark) .patient-box:hover {
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-1px);
}

body:not(.theme-dark) .patient-header {
    border-bottom: 1px solid var(--dash-border-subtle);
}

body:not(.theme-dark) .patient-device-group {
    border: 0;
    border-radius: var(--radius-card);
    background: #FFFFFF;
    box-shadow: var(--shadow-card);
}

body:not(.theme-dark) .patient-device-group-header {
    border-bottom: 1px solid var(--dash-border-subtle);
}

body:not(.theme-dark) .parameter-item {
    border: 0;
    border-radius: 14px;
    background: #FFFFFF;
    box-shadow: var(--shadow-card);
}

body:not(.theme-dark) .parameter-item.parameter-item--stale,
body:not(.theme-dark) .parameter-item.parameter-item--no-data {
    border: 0;
    box-shadow: var(--shadow-card);
}

body:not(.theme-dark) .parameter-item.parameter-item--no-data {
    background: #FFFFFF;
}

body:not(.theme-dark) .patient-status-note--no-data,
body:not(.theme-dark) .parameter-item .parameter-status-note.patient-status-note--no-data {
    border: 0;
    background: var(--pill-critical-bg);
    color: var(--pill-critical-fg);
    border-radius: 12px;
}

body:not(.theme-dark) .parameter-item .parameter-status-note.patient-status-note--no-data {
    width: 32px;
    height: 32px;
    margin: 6px 0 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    font-size: 0;
}

body:not(.theme-dark) .parameter-item .parameter-status-note.patient-status-note--no-data::before {
    content: "";
    width: 17px;
    height: 17px;
    background: center / contain no-repeat;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B14A63' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><path d='M3 3l18 18'/><path d='M9.6 5.2A9.4 9.4 0 0 1 21 12'/><path d='M3 12a9.3 9.3 0 0 1 2.6-5.9'/><path d='M7.8 15.2a5.8 5.8 0 0 1 8.4 0'/><path d='M10.7 18.1a1.9 1.9 0 0 1 2.6 0'/></svg>");
}

body:not(.theme-dark) .patient-status-note--stale,
body:not(.theme-dark) .parameter-item .parameter-status-note.patient-status-note--stale {
    border: 0;
    background: var(--pill-warning-bg);
    color: var(--pill-warning-fg);
    border-radius: 12px;
}

.data-export-hero {
    display: none;
}

.device-profile-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 18px;
}

.device-profiles-toolbar {
    max-width: 360px;
    margin: 0 0 18px;
}

.device-profile-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 18px;
    background: #FFFFFF;
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
}

.device-profile-card__media {
    height: 190px;
    min-height: 190px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: linear-gradient(180deg, #FBF6F3 0%, #FAFAF8 100%);
    overflow: hidden;
}

.device-profile-card__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 16px;
}

.device-profile-card__image-placeholder {
    width: 72px;
    height: 72px;
    border-radius: 22px;
    background: var(--pill-neutral-bg);
}

.device-profile-card__content {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.device-profile-card__eyebrow {
    margin-bottom: 8px;
    color: var(--dash-text-soft);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.device-profile-card__title {
    margin: 0;
    color: #26262B;
    font-family: var(--font-serif);
    font-size: 1.35rem;
    font-weight: 400;
    line-height: 1.08;
    letter-spacing: -0.02em;
}

.device-profile-card__meta,
.device-profile-card__patients {
    width: fit-content;
    margin-top: 12px;
    padding: 7px 12px;
    border-radius: var(--radius-pill);
    background: var(--pill-neutral-bg);
    color: var(--pill-neutral-fg);
    font-size: 0.82rem;
    font-weight: 500;
}

.device-profile-card__patients {
    background: var(--pill-info-bg);
    color: var(--pill-info-fg);
}

.device-profile-card__description {
    display: none;
    margin-top: 18px;
    color: var(--dash-text-muted);
    font-size: 0.9rem;
    line-height: 1.75;
    white-space: pre-wrap;
}

.device-profile-card.is-expanded .device-profile-card__description {
    display: block;
}

.device-profile-card__read-more {
    width: fit-content;
    margin-top: 14px;
    padding: 9px 14px;
    border: 0;
    border-radius: var(--radius-pill);
    background: #26262B;
    color: #FFFFFF;
    cursor: pointer;
    font: inherit;
    font-size: 0.86rem;
    font-weight: 500;
}

.device-profile-card__read-more:hover {
    background: #3D3D45;
}

.device-profile-card__muted {
    color: var(--dash-text-soft);
    font-style: italic;
}

@media (max-width: 900px) {
    .device-profile-card-grid {
        grid-template-columns: 1fr;
    }
}

body:not(.theme-dark) .data-export-date-grid {
    align-items: end;
}

body:not(.theme-dark) .data-export-date-grid .data-export-field {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
}

body:not(.theme-dark) .data-export-date-grid .data-export-field label {
    flex: 0 0 auto;
    margin: 0;
    line-height: 1;
    width: auto;
}

body:not(.theme-dark) .data-export-date-grid .data-export-field input[type="date"] {
    flex: 1 1 auto;
    min-width: 0;
    height: 41px;
    box-sizing: border-box;
}

body:not(.theme-dark) .investigation-preset-button.is-active {
    background: #26262B;
    border-color: #26262B;
    color: #FFFFFF;
}

body:not(.theme-dark) .investigation-preset-button:focus-visible {
    outline-color: #26262B;
}

body:not(.theme-dark) .investigation-range-selection {
    background: #26262B;
}

body:not(.theme-dark) .investigation-range-input::-webkit-slider-thumb {
    background: #26262B;
}

body:not(.theme-dark) .investigation-range-input::-moz-range-thumb {
    background: #26262B;
}

body:not(.theme-dark) .investigation-range-input:focus-visible::-webkit-slider-thumb {
    outline-color: #26262B;
}

body:not(.theme-dark) .investigation-range-input:focus-visible::-moz-range-thumb {
    outline-color: #26262B;
}

body:not(.theme-dark) .investigation-end-last-data-toggle input {
    accent-color: #26262B;
}

.investigation-update-btn {
    display: none;
}

body:not(.theme-dark) .investigation-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: var(--radius-pill);
    color: #26262B;
}

body:not(.theme-dark) .investigation-close:hover {
    background: var(--pill-critical-bg);
    color: var(--pill-critical-fg);
}

.investigation-close-icon {
    display: block;
}

.parameter-range-option.active {
    color: var(--color-primary);
}

.analysis-section-grid,
.analysis-cards-grid {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
}

.analysis-card-wrapper {
    width: auto;
    height: auto;
}

.dashboard-button.analysis-card,
.analysis-card {
    width: 100%;
    min-width: 0;
    max-width: none;
    height: 72px;
    min-height: 72px;
    max-height: none;
    justify-content: flex-start;
    text-align: left;
    padding: 14px 16px;
    border: 0;
    border-radius: var(--radius-card);
    background: #FFFFFF;
    box-shadow: var(--shadow-card);
}

.dashboard-button.analysis-card:hover,
.analysis-card:hover {
    border-color: transparent;
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-1px);
}

.analysis-card .button-content {
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
}

.analysis-card .function-icon {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    margin-bottom: 0;
    border-radius: 10px;
}

.analysis-card .button-content h2 {
    margin: 0;
    color: #26262B;
    font-family: var(--font-serif);
    font-size: 0.98rem;
    font-weight: 400;
    line-height: 1.2;
    text-align: left;
    word-break: normal;
    hyphens: none;
}

.settings-tab.active {
    color: var(--color-primary-strong);
    border-left-color: var(--color-primary);
    background: var(--nav-accent-subtle);
}
.insight-graph-switch__tab.active {
    background: #26262B;
    color: #FFFFFF;
}
.dash-alarm-toast-action,
.dash-badge--patients:hover {
    background: var(--color-primary) !important;
}
.add-analysis-card:hover,
.analysis-card:hover,
.analytics-function-item:hover,
.dash-study-card--open,
.dash-study-card--open .dash-study-toggle {
    border-color: var(--color-primary);
    color: var(--color-primary);
}
.dash-study-card--open {
    color: inherit;
}
.dash-loading .spinner-dot,
.dash-badge--patients:hover {
    background: var(--color-primary);
}

/* Focus ring accent */
:focus-visible {
    outline-color: var(--color-primary);
}

/* ─────────────────────────────────────────────
   12. CHARTS — soft framing (internals are JS-driven)
   ───────────────────────────────────────────── */
.chart-tool-btn.active {
    background: var(--nav-accent-subtle);
    border-color: var(--color-primary);
    color: var(--color-primary-strong);
}

/* ─────────────────────────────────────────────
   13. TURING AI PANEL — warm premium assistant rail
   ───────────────────────────────────────────── */
body:not(.theme-dark) #sr-ai-panel {
    background: #FFFFFF;
    border-left: 1px solid var(--color-border);
    box-shadow: -16px 0 44px -36px rgba(38, 34, 28, 0.22);
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-panel-header {
    min-height: 61px;
    padding: 10px 16px;
    background: linear-gradient(180deg, #FBF6F3 0%, #FAFAF8 100%);
    border-bottom: 1px solid var(--color-border);
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-panel-title {
    font-family: var(--font-serif);
    font-size: 1.05rem;
    font-weight: 400;
    letter-spacing: -0.01em;
    color: #26262B;
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-panel-toggle-btn {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-pill);
    color: #77767C;
    background: rgba(255, 255, 255, 0.68);
    border: 1px solid transparent;
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-panel-toggle-btn:hover {
    color: #26262B;
    background: #FFFFFF;
    border-color: var(--color-border);
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-panel-body {
    padding: 18px 18px 16px;
    background: #FFFFFF;
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-panel-status {
    border-radius: var(--radius-card);
    padding: 12px 14px;
    background: var(--pill-info-bg);
    border: 1px solid rgba(167, 139, 250, 0.22);
    color: var(--pill-info-fg);
    font-weight: 600;
    box-shadow: var(--shadow-card);
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-panel-status--error {
    background: var(--pill-critical-bg);
    border-color: rgba(246, 199, 210, 0.7);
    color: var(--pill-critical-fg);
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-panel-content {
    color: var(--dash-text-muted);
    font-size: 0.92rem;
    line-height: 1.65;
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-panel-footer {
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--dash-border-subtle);
    color: var(--dash-text-soft);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-md-h3 {
    font-family: var(--font-serif);
    font-size: 1.08rem;
    font-weight: 400;
    color: var(--dash-text);
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-md-p {
    color: var(--dash-text-muted);
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-md-pre {
    border-radius: var(--radius-card);
    border: 1px solid var(--dash-border);
    background: #F7F5F1;
    color: #3A3A42;
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-btn {
    border-radius: var(--radius-pill);
    color: var(--dash-text-muted);
}

body:not(.theme-dark) #sr-ai-panel .sr-ai-btn:hover {
    background: var(--dash-control-hover);
    color: var(--dash-text);
}

body:not(.theme-dark).sr-ai-collapsed #sr-ai-panel .sr-ai-panel-header {
    padding: 10px 2px;
    background: #FFFFFF;
}

/* ─────────────────────────────────────────────
   14. MOTION — gentle, consistent
   ───────────────────────────────────────────── */
.sr-status-pill,
.sr-pill,
.compliance-chip,
.dash-badge,
.user-info-card {
    transition: background var(--transition), color var(--transition), border-color var(--transition), box-shadow var(--transition);
}

@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; animation: none !important; }
}