/* ==========================================================================
   SOMANOTES — CENSUS HEADER TERMINAL / PHOSPHOR THEME OVERRIDE
   ==========================================================================

   Location:  /static/css/census-header-terminal.css
   Activator: data-theme="terminal" on .sol-top-nav element
   Version:   1.0.0

   Additive theme layer. Every rule scoped under
   .sol-top-nav[data-theme="terminal"] so base styles in sol-layout.css
   remain untouched when the attribute is absent.

   Design DNA:
   Matches Transfer Center (transfer-center.css) and Progress Note
   (progress-oneshot.css) Phosphor Theatre aesthetic — warm void,
   electric mint accents, gold decorative line, sharp corners, compact
   single-row layout.

   Font Dependencies (loaded via Google Fonts in census.html):
     - JetBrains Mono 300..700       (labels, metadata, status, tabs)
     - Outfit 200..600               (logo, section switcher)
     - DM Sans 300..500              (body text)

   ========================================================================== */


/* ==========================================================================
   S1  DESIGN TOKENS — extracted to terminal-core.css (2026-02-20)
   All --term-* variables now defined globally on body[data-theme="terminal"].
   ========================================================================== */


/* ==========================================================================
   S2  HEADER CONTAINER (.sol-top-nav)
   ========================================================================== */

.sol-top-nav[data-theme="terminal"] {
    background: var(--term-bg-header);
    border-bottom: 1px solid var(--term-border-default);
    padding: 8px 24px;
    min-height: 52px;
    align-items: center;
    position: relative;
    /* Kill the base radial gradients */
    background-image: none;
}

/* Gold accent line — gradient from transparent > gold-dim > transparent */
.sol-top-nav[data-theme="terminal"]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 15%;
    right: 15%;
    height: 1px;
    background: linear-gradient(
        to right,
        transparent,
        var(--term-gold-dim),
        transparent
    );
    pointer-events: none;
    z-index: 1;
}

/* Nav left — keep aligned on single row */
.sol-top-nav[data-theme="terminal"] .sol-nav-left {
    align-items: center;
    gap: 16px;
}


/* ==========================================================================
   S3  BRAND BLOCK
   ========================================================================== */

/* Hide the 44x44 crest square entirely */
.sol-top-nav[data-theme="terminal"] .sol-brand-crest {
    display: none;
}

/* Kill the .glow radial gradient and box-shadow on logo wrapper */
.sol-top-nav[data-theme="terminal"] .sol-logo.glow {
    background: none;
    box-shadow: none;
    padding: 0;
    border-radius: 0;
}

/* Logo text — Outfit, weight 300, subtle tracking */
.sol-top-nav[data-theme="terminal"] .sol-logo {
    font-family: var(--term-font-display);
    font-size: 1.25rem;
    font-weight: 300;
    letter-spacing: 0.04em;
    color: var(--term-fg-primary);
}

.sol-top-nav[data-theme="terminal"] .sol-logo-text {
    font-weight: 300;
    color: var(--term-fg-primary);
}

/* "Notes" accent in mint */
.sol-top-nav[data-theme="terminal"] .sol-logo-accent {
    color: var(--term-accent);
}

/* The diamond mark — mint with glow */
.sol-top-nav[data-theme="terminal"] .sol-logo-mark {
    color: var(--term-accent);
    text-shadow: 0 0 10px rgba(0, 255, 208, 0.30);
    font-size: 1.1rem;
}

/* Brand stack alignment */
.sol-top-nav[data-theme="terminal"] .sol-brand-stack {
    gap: 8px;
}

/* Brand block compact spacing */
.sol-top-nav[data-theme="terminal"] .sol-brand-block {
    gap: 12px;
}


/* ==========================================================================
   S4  SUBSTATS (patient count / critical count)
   ========================================================================== */

.sol-top-nav[data-theme="terminal"] .sol-nav-greeting {
    min-width: auto;
}

/* Stack substats vertically — critical on top, total below — saves horizontal space.
   The bare "•" text node between spans is hidden via font-size: 0 on the container. */
.sol-top-nav[data-theme="terminal"] .sol-nav-substats {
    border-radius: 0;
    background: var(--term-accent-ghost);
    border: 1px solid var(--term-border-subtle);
    font-family: var(--term-font-mono);
    font-weight: 500;
    color: var(--term-fg-secondary);
    padding: 3px 8px;
    letter-spacing: 0.02em;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    line-height: 1.4;
    font-size: 0;  /* hides the bare "•" text node */
}

.sol-top-nav[data-theme="terminal"] .sol-nav-substats > span {
    font-size: 0.65rem;  /* restore size on child spans */
}

/* Keep critical count red — terminal red */
.sol-top-nav[data-theme="terminal"] .sol-nav-substats #navCriticalCount {
    color: var(--term-status-error);
    font-weight: 600;
}

/* Total count in muted */
.sol-top-nav[data-theme="terminal"] .sol-nav-substats #navTotalCount {
    color: var(--term-fg-muted);
}


/* ==========================================================================
   S5  STATUS CHIP (Census live / EKG)
   ========================================================================== */

/* Remove gradient background, replace with transparent terminal look */
.sol-top-nav[data-theme="terminal"] .sol-nav-status-chip {
    border-radius: 0;
    background: rgba(0, 255, 208, 0.03);
    border: 1px solid var(--term-border-subtle);
    box-shadow: none;
    color: var(--term-fg-primary);
    padding: 4px 10px;
    gap: 6px;
}

/* Status text in mint with glow */
.sol-top-nav[data-theme="terminal"] .sol-status-text {
    color: var(--term-accent);
    font-family: var(--term-font-mono);
    font-size: 0.75rem;
    font-weight: 600;
    text-shadow: 0 0 8px rgba(0, 255, 208, 0.30);
    letter-spacing: 0.03em;
}

/* Separator muted */
.sol-top-nav[data-theme="terminal"] .sol-status-sep {
    color: var(--term-fg-muted);
    opacity: 0.5;
}

/* Sub-status (timestamp) in muted */
.sol-top-nav[data-theme="terminal"] .sol-status-sub {
    color: var(--term-fg-muted);
    font-family: var(--term-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.02em;
}

/* Status dot — mint instead of green */
.sol-top-nav[data-theme="terminal"] .sol-status-dot {
    background: var(--term-accent);
    box-shadow: 0 0 0 4px rgba(0, 255, 208, 0.12);
}

/* Pulse animation — mint */
.sol-top-nav[data-theme="terminal"] .sol-status-dot.live {
    animation: term-pulse-live 2s ease-in-out infinite;
}

@keyframes term-pulse-live {
    0%   { box-shadow: 0 0 0 4px rgba(0, 255, 208, 0.15); }
    50%  { box-shadow: 0 0 0 10px rgba(0, 255, 208, 0); }
    100% { box-shadow: 0 0 0 4px rgba(0, 255, 208, 0.15); }
}

/* EKG SVG stroke — mint instead of green */
.sol-top-nav[data-theme="terminal"] .sol-header-ekg-svg .header-ekg-path,
.sol-top-nav[data-theme="terminal"] .header-ekg-path {
    stroke: var(--term-accent);
    --ekg-color: var(--term-accent);
}


/* ==========================================================================
   S6  SECTION SWITCHER (Census / Transfer Center / Progress Note)
   ========================================================================== */

/* Container — flex row with generous gap */
.sol-top-nav[data-theme="terminal"] .sol-section-switcher {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-left: 24px;
}

/* Links — Outfit, uppercase, underline-on-active */
.sol-top-nav[data-theme="terminal"] .sol-section-link {
    font-family: var(--term-font-display);
    font-size: 0.8125rem;
    font-weight: 400;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--term-fg-muted);
    padding: 8px 0;
    border-bottom: 2px solid transparent;
    transition: color var(--term-duration) var(--term-easing),
                border-color var(--term-duration) var(--term-easing),
                text-shadow var(--term-duration) var(--term-easing);
}

.sol-top-nav[data-theme="terminal"] .sol-section-link:hover {
    color: var(--term-fg-secondary);
    border-bottom-color: var(--term-border-default);
}

/* Active state — bright text, mint underline, subtle glow */
.sol-top-nav[data-theme="terminal"] .sol-section-link--active,
.sol-top-nav[data-theme="terminal"] .sol-section-link.sol-section-link--active {
    color: var(--term-fg-primary);
    border-bottom: 2px solid var(--term-accent);
    text-shadow: var(--term-glow-accent);
}

/* Section prefix arrow — mint, monospace, with glow */
.sol-top-nav[data-theme="terminal"] .sol-section-prefix {
    color: var(--term-accent);
    font-family: var(--term-font-mono);
    font-weight: 700;
    text-shadow: 0 0 10px rgba(0, 255, 208, 0.30);
    margin-right: 2px;
}


/* ==========================================================================
   S7  TRANSFER BADGE
   ========================================================================== */

/* Override green to mint — inline styles set background, so use !important */
.sol-top-nav[data-theme="terminal"] .sol-transfer-badge {
    background-color: var(--term-accent) !important;
    background: var(--term-accent) !important;
    box-shadow: 0 0 6px rgba(0, 255, 208, 0.30);
}


/* ==========================================================================
   S8  NAV TABS (Census / Trends / Alerts / Debug)
   ========================================================================== */

/* Hide redundant tabs — Census/Trends/Alerts already covered by section switcher or unused.
   Keep only Debug (data-view="debug"). */
.sol-top-nav[data-theme="terminal"] .sol-nav-tab[data-view="census"],
.sol-top-nav[data-theme="terminal"] .sol-nav-tab[data-view="trends"],
.sol-top-nav[data-theme="terminal"] .sol-nav-tab[data-view="alerts"] {
    display: none;
}

/* Tab container */
.sol-top-nav[data-theme="terminal"] .sol-nav-tabs {
    gap: 2px;
}

/* Individual tab — monospace, sharp, transparent */
.sol-top-nav[data-theme="terminal"] .sol-nav-tab {
    font-family: var(--term-font-mono);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.03em;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: var(--term-fg-muted);
    padding: 8px 12px;
    transition: color var(--term-duration) var(--term-easing),
                border-color var(--term-duration) var(--term-easing);
}

.sol-top-nav[data-theme="terminal"] .sol-nav-tab:hover {
    background: transparent;
    color: var(--term-fg-secondary);
    transform: none;
    border-bottom-color: var(--term-border-default);
}

/* Active tab — mint underline, no blue gradient */
.sol-top-nav[data-theme="terminal"] .sol-nav-tab.active {
    background: transparent;
    color: var(--term-fg-primary);
    border-bottom: 2px solid var(--term-accent);
    box-shadow: none;
}

/* Tab icons — smaller, match text color */
.sol-top-nav[data-theme="terminal"] .sol-tab-icon {
    width: 14px;
    height: 14px;
    color: inherit;
}

/* Alert badge — keep red, sharpen */
.sol-top-nav[data-theme="terminal"] .sol-alert-badge {
    border-radius: 0;
    background: var(--term-status-error);
    font-family: var(--term-font-mono);
    font-size: 0.625rem;
    padding: 1px 5px;
}

/* Debug badge — terminal style */
.sol-top-nav[data-theme="terminal"] .sol-debug-badge {
    border-radius: 0;
    font-family: var(--term-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.05em;
}


/* ==========================================================================
   S9  QUICK ACTIONS (Add Patient / Refresh / Divider)
   ========================================================================== */

/* Quick actions row */
.sol-top-nav[data-theme="terminal"] .sol-quick-actions {
    margin-top: 0;
    gap: 6px;
    align-items: center;
}

/* Base action button — terminal: sharp, monospace, transparent */
.sol-top-nav[data-theme="terminal"] .sol-quick-action-btn {
    font-family: var(--term-font-mono);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.03em;
    border-radius: 0;
    background: transparent;
    border: 1px solid var(--term-border-subtle);
    color: var(--term-fg-secondary);
    padding: 6px 12px;
    box-shadow: none;
    transition: color var(--term-duration) var(--term-easing),
                border-color var(--term-duration) var(--term-easing),
                background var(--term-duration) var(--term-easing);
}

/* Hover — flat, no translateY, subtle mint border hint */
.sol-top-nav[data-theme="terminal"] .sol-quick-action-btn:hover {
    transform: none;
    box-shadow: none;
    border-color: var(--term-accent-dim);
    color: var(--term-fg-primary);
    background: var(--term-accent-ghost);
}

.sol-top-nav[data-theme="terminal"] .sol-quick-action-btn:active {
    transform: none;
}

/* Primary button — mint background, dark text */
.sol-top-nav[data-theme="terminal"] .sol-quick-action-btn.primary,
.sol-top-nav[data-theme="terminal"] #navAddPatientBtn {
    background: var(--term-accent);
    border-color: var(--term-accent);
    color: var(--term-fg-inverse);
    font-weight: 600;
    box-shadow: none;
}

.sol-top-nav[data-theme="terminal"] .sol-quick-action-btn.primary:hover,
.sol-top-nav[data-theme="terminal"] #navAddPatientBtn:hover {
    background: #33FFD9;
    border-color: #33FFD9;
    color: var(--term-fg-inverse);
    transform: none;
    box-shadow: var(--term-glow-accent);
}

/* Secondary button — bordered, no gradient */
.sol-top-nav[data-theme="terminal"] .sol-quick-action-btn.secondary,
.sol-top-nav[data-theme="terminal"] #navRefreshBtn {
    background: transparent;
    border: 1px solid var(--term-border-default);
    color: var(--term-fg-secondary);
    box-shadow: none;
}

.sol-top-nav[data-theme="terminal"] .sol-quick-action-btn.secondary:hover,
.sol-top-nav[data-theme="terminal"] #navRefreshBtn:hover {
    border-color: var(--term-accent-dim);
    color: var(--term-fg-primary);
    background: var(--term-accent-ghost);
    transform: none;
    box-shadow: none;
}

/* Ghost button — minimal */
.sol-top-nav[data-theme="terminal"] .sol-quick-action-btn.ghost {
    background: transparent;
    border: none;
    border-left: 1px solid var(--term-border-subtle);
    color: var(--term-fg-muted);
}

.sol-top-nav[data-theme="terminal"] .sol-quick-action-btn.ghost:hover {
    color: var(--term-fg-secondary);
    background: var(--term-accent-ghost);
    border-color: var(--term-border-subtle);
}

/* Divider */
.sol-top-nav[data-theme="terminal"] .sol-quick-actions-divider {
    background: var(--term-border-subtle);
}


/* ==========================================================================
   S10  QUICK NOTES GROUP
   ========================================================================== */

/* Remove pill shape, gradient, heavy shadows */
.sol-top-nav[data-theme="terminal"] .sol-quick-notes-group {
    border-radius: 0;
    border: 1px solid var(--term-border-subtle);
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

/* Kill the radial gradient pseudo */
.sol-top-nav[data-theme="terminal"] .sol-quick-notes-group::before {
    display: none;
}

/* Hover — no translateY, no scale, subtle border */
.sol-top-nav[data-theme="terminal"] .sol-quick-notes-group:hover {
    transform: none;
    border-color: var(--term-accent-dim);
    background: var(--term-accent-ghost);
    box-shadow: none;
}

.sol-top-nav[data-theme="terminal"] .sol-quick-notes-group:active {
    transform: none;
}

/* Badge label area */
.sol-top-nav[data-theme="terminal"] .sol-quick-notes-badge {
    font-family: var(--term-font-mono);
    background: transparent;
    color: var(--term-fg-secondary);
    font-size: 0.75rem;
}

.sol-top-nav[data-theme="terminal"] .sol-quick-notes-badge i {
    color: var(--term-accent);
    font-size: 0.9rem;
}

.sol-top-nav[data-theme="terminal"] .sol-quick-notes-title {
    font-family: var(--term-font-mono);
    font-weight: 700;
    color: var(--term-fg-primary);
    font-size: 0.75rem;
    letter-spacing: 0.02em;
}

.sol-top-nav[data-theme="terminal"] .sol-quick-notes-sub {
    font-family: var(--term-font-mono);
    color: var(--term-fg-muted);
    font-size: 0.625rem;
    font-weight: 500;
}

/* Ghost buttons inside group — sharp, terminal */
.sol-top-nav[data-theme="terminal"] .sol-quick-notes-group .sol-quick-action-btn {
    border-radius: 0;
    border: none;
    border-left: 1px solid var(--term-border-subtle);
    font-family: var(--term-font-mono);
    font-size: 0.75rem;
    color: var(--term-fg-muted);
}

.sol-top-nav[data-theme="terminal"] .sol-quick-notes-group .sol-quick-action-btn:hover {
    background: var(--term-accent-ghost);
    color: var(--term-fg-primary);
    transform: none;
    box-shadow: none;
}

.sol-top-nav[data-theme="terminal"] .sol-quick-notes-group .sol-quick-action-btn:hover i {
    transform: none;
    filter: none;
    color: var(--term-accent);
}


/* ==========================================================================
   S11  NAV RIGHT (Search / Refresh / Settings / User)
   ========================================================================== */

/* Right side alignment */
.sol-top-nav[data-theme="terminal"] .sol-nav-right {
    gap: 8px;
}

/* Search box — dark void bg, sharp corners, monospace */
.sol-top-nav[data-theme="terminal"] .sol-search-box input {
    background: var(--term-bg-void);
    border: 1px solid var(--term-border-subtle);
    border-radius: 0;
    color: var(--term-fg-primary);
    font-family: var(--term-font-mono);
    font-size: 0.8125rem;
    box-shadow: none;
}

.sol-top-nav[data-theme="terminal"] .sol-search-box input::placeholder {
    color: var(--term-fg-muted);
    font-family: var(--term-font-mono);
}

.sol-top-nav[data-theme="terminal"] .sol-search-box input:focus {
    outline: none;
    border-color: var(--term-accent);
    background: var(--term-bg-void);
    box-shadow: 0 0 8px rgba(0, 255, 208, 0.12);
}

/* Search icon */
.sol-top-nav[data-theme="terminal"] .sol-search-icon {
    color: var(--term-fg-muted);
}

.sol-top-nav[data-theme="terminal"] .sol-search-box:focus-within .sol-search-icon {
    color: var(--term-accent);
}

/* Refresh button — terminal style */
.sol-top-nav[data-theme="terminal"] .sol-refresh-btn {
    background: transparent;
    border: 1px solid var(--term-border-subtle);
    border-radius: 0;
    color: var(--term-fg-muted);
}

.sol-top-nav[data-theme="terminal"] .sol-refresh-btn:hover {
    background: var(--term-accent-ghost);
    color: var(--term-accent);
    border-color: var(--term-accent-dim);
}

/* Settings button — terminal style */
.sol-top-nav[data-theme="terminal"] .sol-settings-btn {
    background: transparent;
    border: 1px solid var(--term-border-subtle);
    border-radius: 0;
    color: var(--term-fg-muted);
}

.sol-top-nav[data-theme="terminal"] .sol-settings-btn:hover {
    background: var(--term-accent-ghost);
    color: var(--term-accent);
    border-color: var(--term-accent-dim);
}


/* ==========================================================================
   S12  SIGN-IN BUTTON
   ========================================================================== */

.sol-top-nav[data-theme="terminal"] .sol-sign-in-btn {
    background: var(--term-accent);
    color: var(--term-fg-inverse);
    border: none;
    border-radius: 0;
    font-family: var(--term-font-mono);
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    padding: 8px 16px;
    box-shadow: none;
}

.sol-top-nav[data-theme="terminal"] .sol-sign-in-btn:hover {
    background: #33FFD9;
    box-shadow: var(--term-glow-accent);
    transform: none;
}

.sol-top-nav[data-theme="terminal"] .sol-sign-in-btn:active {
    transform: none;
}

.sol-top-nav[data-theme="terminal"] .sol-sign-in-btn i {
    color: var(--term-fg-inverse);
}


/* ==========================================================================
   S13  USER MENU (when authenticated)
   ========================================================================== */

.sol-top-nav[data-theme="terminal"] .sol-user-menu {
    align-self: center;
}

.sol-top-nav[data-theme="terminal"] .sol-user-avatar {
    border-radius: 0;
    background: var(--term-accent-subtle);
    color: var(--term-accent);
    font-family: var(--term-font-mono);
    border: 1px solid var(--term-border-subtle);
}

.sol-top-nav[data-theme="terminal"] .sol-user-name {
    font-family: var(--term-font-mono);
    font-size: 0.8125rem;
    color: var(--term-fg-secondary);
}


/* ==========================================================================
   S14  REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    .sol-top-nav[data-theme="terminal"],
    .sol-top-nav[data-theme="terminal"] *,
    .sol-top-nav[data-theme="terminal"] *::before,
    .sol-top-nav[data-theme="terminal"] *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}
