/* =========================================================
   MEDICAL SOAP
   MODERN CLINICAL INTERFACE
   ========================================================= */


/* =========================================================
   DESIGN TOKENS
   ========================================================= */

:root {

    /* Brand */
    --primary: #1677ff;
    --primary-dark: #0b5ed7;
    --primary-soft: #eaf3ff;
    --primary-ultra-soft: #f5f9ff;

    /* Backgrounds */
    --background: #f5f7fb;
    --surface: #ffffff;
    --surface-secondary: #f8fafc;
    --surface-tertiary: #f1f5f9;

    /* Text */
    --text: #182230;
    --text-secondary: #526071;
    --text-muted: #8491a3;
    --text-light: #a6b0bf;

    /* Borders */
    --border: #dfe5ec;
    --border-light: #edf1f5;
    --border-focus: #1677ff;

    /* Clinical states */
    --normal: #16a66a;
    --normal-dark: #087a4a;
    --normal-soft: #e9f8f1;

    --attention: #e0a000;
    --attention-dark: #9b6b00;
    --attention-soft: #fff7da;

    --abnormal: #ef7d22;
    --abnormal-dark: #b85008;
    --abnormal-soft: #fff0e5;

    --critical: #dc3545;
    --critical-dark: #a71d2a;
    --critical-soft: #fdecef;

    /* Pregnancy / contextual */
    --pregnancy: #8756d8;
    --pregnancy-soft: #f4efff;

    /* Shadows */
    --shadow-xs:
        0 1px 2px rgba(15, 23, 42, 0.04);

    --shadow-sm:
        0 2px 8px rgba(15, 23, 42, 0.06);

    --shadow-md:
        0 8px 24px rgba(15, 23, 42, 0.08);

    --shadow-lg:
        0 20px 50px rgba(15, 23, 42, 0.12);

    /* Radius */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 18px;
    --radius-xl: 24px;

    /* Animation */
    --transition-fast: 150ms ease;
    --transition: 220ms ease;
}


/* =========================================================
   RESET
   ========================================================= */

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Helvetica,
        Arial,
        sans-serif;

    background:
        linear-gradient(
            180deg,
            #f8faff 0%,
            var(--background) 420px
        );

    color: var(--text);

    line-height: 1.5;

    min-height: 100vh;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

button,
input,
select,
textarea {
    font: inherit;
}

button {
    -webkit-tap-highlight-color: transparent;
}

.hidden {
    display: none !important;
}


/* =========================================================
   APP HEADER
   ========================================================= */

.app-header {

    min-height: 74px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding:
        14px
        clamp(20px, 5vw, 64px);

    background:
        rgba(255, 255, 255, 0.92);

    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);

    border-bottom:
        1px solid rgba(223, 229, 236, 0.8);

    position: sticky;
    top: 0;

    z-index: 100;

    box-shadow:
        0 1px 10px rgba(15, 23, 42, 0.03);
}


.brand {

    display: flex;
    align-items: center;

    gap: 12px;
}


.brand-icon {

    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    color: white;

    font-size: 22px;
    font-weight: 800;

    background:
        linear-gradient(
            135deg,
            #1785ff,
            #0b5ed7
        );

    box-shadow:
        0 7px 18px rgba(22, 119, 255, 0.22);
}


.brand h1 {

    margin: 0;

    font-size: 18px;
    font-weight: 750;

    letter-spacing: -0.02em;
}


.brand p {

    margin: 1px 0 0;

    color: var(--text-muted);

    font-size: 12px;
}


.icon-button {

    width: 42px;
    height: 42px;

    border: 1px solid var(--border);

    border-radius: 12px;

    background: white;

    color: var(--text-secondary);

    cursor: pointer;

    font-size: 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    transition: var(--transition);
}


.icon-button:hover {

    border-color: #b9c9dd;

    color: var(--primary);

    background: var(--primary-ultra-soft);

    transform: translateY(-1px);
}


/* =========================================================
   MAIN CONTAINER
   ========================================================= */

.app-container {

    width:
        min(
            calc(100% - 32px),
            1120px
        );

    margin: 0 auto;

    padding:
        42px
        0
        80px;
}


/* =========================================================
   WELCOME
   ========================================================= */

.welcome-section {

    margin-bottom: 26px;
}


.eyebrow,
.section-label {

    margin:
        0
        0
        5px;

    color: var(--primary);

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 0.11em;
}


.welcome-section h2 {

    margin: 0;

    font-size:
        clamp(28px, 5vw, 40px);

    line-height: 1.15;

    letter-spacing: -0.035em;

    font-weight: 780;
}


.subtitle {

    margin:
        10px
        0
        0;

    max-width: 680px;

    color: var(--text-secondary);

    font-size: 15px;
}


/* =========================================================
   PROGRESS
   ========================================================= */

.progress-card {

    background:
        rgba(255, 255, 255, 0.94);

    border:
        1px solid var(--border-light);

    border-radius:
        var(--radius-lg);

    padding:
        18px
        20px;

    margin-bottom: 22px;

    box-shadow:
        var(--shadow-sm);
}


.progress-header {

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 16px;

    margin-bottom: 11px;

    font-size: 12px;

    color: var(--text-muted);
}


#progressText {

    color: var(--text-secondary);

    font-weight: 650;
}


.progress-bar {

    height: 5px;

    overflow: hidden;

    background:
        var(--surface-tertiary);

    border-radius: 999px;
}


.progress-fill {

    height: 100%;

    width: 8%;

    border-radius: inherit;

    background:
        linear-gradient(
            90deg,
            #1684ff,
            #42a5ff
        );

    transition:
        width
        350ms ease;
}


.steps {

    display: grid;

    grid-template-columns:
        repeat(6, 1fr);

    gap: 8px;

    margin-top: 15px;
}


.step {

    display: flex;
    flex-direction: column;
    align-items: center;

    gap: 5px;

    color: var(--text-light);

    text-align: center;
}


.step span {

    width: 27px;
    height: 27px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: var(--surface-tertiary);

    border: 1px solid var(--border);

    font-size: 11px;
    font-weight: 750;

    transition: var(--transition);
}


.step small {

    font-size: 10px;

    font-weight: 600;
}


.step.active {

    color: var(--primary);
}


.step.active span {

    background: var(--primary);

    border-color: var(--primary);

    color: white;

    box-shadow:
        0 4px 12px rgba(22, 119, 255, 0.22);
}


/* =========================================================
   MAIN FORM CARDS
   ========================================================= */

.form-card {

    background: var(--surface);

    border:
        1px solid var(--border-light);

    border-radius:
        var(--radius-xl);

    padding:
        clamp(22px, 4vw, 36px);

    box-shadow:
        var(--shadow-md);

    animation:
        cardEntrance
        280ms ease;
}


@keyframes cardEntrance {

    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.section-heading {

    display: flex;
    align-items: center;

    gap: 14px;

    margin-bottom: 28px;
}


.section-icon {

    width: 44px;
    height: 44px;

    flex: 0 0 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background: var(--primary-soft);

    color: var(--primary);

    font-weight: 800;

    font-size: 15px;
}


.section-heading h3 {

    margin: 0;

    font-size: 22px;

    letter-spacing: -0.025em;
}


/* =========================================================
   CLINICAL BLOCKS
   ========================================================= */

.clinical-block {

    padding:
        25px
        0;

    border-top:
        1px solid var(--border-light);
}


.clinical-block:first-of-type {

    border-top: 0;
}


.block-title {

    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 20px;

    margin-bottom: 20px;
}


.block-title h4 {

    margin: 0;

    font-size: 17px;

    letter-spacing: -0.015em;
}


.block-title p {

    margin:
        4px
        0
        0;

    color: var(--text-muted);

    font-size: 12px;
}


.core-badge,
.optional-badge,
.important-badge {

    display: inline-flex;
    align-items: center;

    min-height: 24px;

    padding:
        4px
        9px;

    border-radius: 999px;

    font-size: 9px;
    font-weight: 800;

    letter-spacing: 0.07em;

    white-space: nowrap;
}


.core-badge {

    color: #0967cf;

    background: #eaf4ff;
}


.optional-badge {

    color: #667085;

    background: #f1f4f8;
}


.important-badge {

    color: #a35b00;

    background: #fff3d7;
}


/* =========================================================
   FORMS
   ========================================================= */

.form-grid {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        20px
        22px;
}


.field {

    min-width: 0;
}


.field label {

    display: block;

    margin-bottom: 7px;

    color: #354052;

    font-size: 12px;
    font-weight: 650;
}


.field-help {

    display: block;

    margin-top: 6px;

    color: var(--text-muted);

    font-size: 10px;
}


input,
select,
textarea {

    width: 100%;

    color: var(--text);

    background: white;

    border:
        1px solid var(--border);

    border-radius:
        var(--radius-md);

    outline: none;

    transition:
        border-color var(--transition-fast),
        box-shadow var(--transition-fast),
        background var(--transition-fast);
}


input,
select {

    min-height: 44px;

    padding:
        0
        12px;
}


textarea {

    padding:
        11px
        12px;

    resize: vertical;

    min-height: 92px;
}


input::placeholder,
textarea::placeholder {

    color: #b1bbc8;
}


input:hover,
select:hover,
textarea:hover {

    border-color: #c7d1dd;
}


input:focus,
select:focus,
textarea:focus {

    border-color: var(--border-focus);

    box-shadow:
        0 0 0 3px rgba(22, 119, 255, 0.11);
}


input[readonly] {

    background:
        var(--surface-secondary);

    color:
        var(--text-secondary);

    cursor:
        default;
}


.top-space {

    margin-top: 18px;
}


/* =========================================================
   INPUT WITH UNIT
   ========================================================= */

.input-suffix {

    display: flex;

    width: 100%;

    border:
        1px solid var(--border);

    border-radius:
        var(--radius-md);

    overflow: hidden;

    background: white;

    transition: var(--transition-fast);
}


.input-suffix:focus-within {

    border-color: var(--primary);

    box-shadow:
        0 0 0 3px rgba(22, 119, 255, 0.11);
}


.input-suffix input {

    border: 0;

    border-radius: 0;

    box-shadow: none !important;

    flex: 1;

    min-width: 0;
}


.input-suffix span {

    display: flex;
    align-items: center;

    padding:
        0
        12px;

    background:
        var(--surface-secondary);

    border-left:
        1px solid var(--border-light);

    color:
        var(--text-muted);

    font-size: 11px;

    white-space: nowrap;
}


/* =========================================================
   MEASUREMENT ROWS
   ========================================================= */

.measurement-row {

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto;

    gap: 8px;
}


.measurement-row select {

    width: auto;

    min-width: 80px;
}


.height-imperial-grid,
.gestational-age-grid {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}


/* =========================================================
   BLOOD PRESSURE INPUT
   ========================================================= */

.bp-input-group {

    display: grid;

    grid-template-columns:
        minmax(70px, 1fr)
        auto
        minmax(70px, 1fr)
        auto;

    align-items: center;

    overflow: hidden;

    border:
        1px solid var(--border);

    border-radius:
        var(--radius-md);

    background: white;

    transition: var(--transition-fast);
}


.bp-input-group:focus-within {

    border-color: var(--primary);

    box-shadow:
        0 0 0 3px rgba(22, 119, 255, 0.11);
}


.bp-input-group input {

    border: 0;

    border-radius: 0;

    text-align: center;

    box-shadow: none !important;
}


.bp-divider {

    color: var(--text-muted);

    font-weight: 700;

    font-size: 18px;
}


.unit-box {

    align-self: stretch;

    display: flex;
    align-items: center;

    padding:
        0
        12px;

    background:
        var(--surface-secondary);

    border-left:
        1px solid var(--border-light);

    color:
        var(--text-muted);

    font-size: 11px;
}


/* =========================================================
   VITALS GRID
   ========================================================= */

.vitals-grid {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        20px
        22px;
}


.vital-field {

    min-width: 0;

    padding: 14px;

    border:
        1px solid transparent;

    border-radius:
        var(--radius-lg);

    transition:
        background var(--transition),
        border-color var(--transition),
        box-shadow var(--transition);
}


/* =========================================================
   MODULE BUTTONS
   ========================================================= */

.module-grid,
.exam-module-grid {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;
}


.module-button {

    min-height: 48px;

    padding:
        10px
        13px;

    display: flex;
    align-items: center;

    gap: 9px;

    border:
        1px solid var(--border);

    border-radius:
        var(--radius-md);

    background:
        var(--surface);

    color:
        var(--text-secondary);

    cursor: pointer;

    text-align: left;

    font-size: 12px;
    font-weight: 650;

    transition: var(--transition);
}


.module-button > span:first-child {

    color: var(--primary);

    font-size: 17px;
}


.module-button:hover {

    border-color:
        #aacbfa;

    background:
        var(--primary-ultra-soft);

    color:
        var(--primary);

    transform:
        translateY(-1px);
}


.module-button.active {

    border-color:
        var(--primary);

    background:
        var(--primary-soft);

    color:
        var(--primary);
}


/* =========================================================
   DYNAMIC MODULES
   ========================================================= */

.dynamic-modules {

    display: grid;

    gap: 14px;

    margin-top: 18px;
}


.history-module {

    padding: 20px;

    border:
        1px solid var(--border);

    border-radius:
        var(--radius-lg);

    background:
        var(--surface-secondary);

    animation:
        moduleEntrance
        220ms ease;
}


@keyframes moduleEntrance {

    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.history-module-header {

    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 16px;

    margin-bottom: 16px;
}


.history-module-header h4 {

    margin: 0;

    font-size: 16px;
}


.remove-module,
.remove-exam-module,
.remove-diagnostic-module,
.text-button {

    border: 0;

    background: transparent;

    color: var(--primary);

    cursor: pointer;

    padding: 4px;

    font-size: 11px;

    font-weight: 700;
}


.remove-module:hover,
.remove-exam-module:hover,
.remove-diagnostic-module:hover {

    color: var(--critical);
}


/* =========================================================
   OLDCARTS
   ========================================================= */

.oldcarts-panel {

    margin-top: 16px;

    padding: 20px;

    border:
        1px solid #cfe2ff;

    border-radius:
        var(--radius-lg);

    background:
        var(--primary-ultra-soft);

    animation:
        moduleEntrance
        220ms ease;
}


.mini-header {

    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 16px;

    margin-bottom: 18px;
}


.mini-header strong {

    font-size: 14px;
}


.mini-header p {

    margin:
        3px
        0
        0;

    color:
        var(--text-muted);

    font-size: 11px;
}


/* =========================================================
   ROS
   ========================================================= */

.ros-grid {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        16px
        18px;
}


.module-description {

    color:
        var(--text-muted);

    font-size:
        12px;

    margin:
        -4px
        0
        18px;
}


/* =========================================================
   PRIVACY NOTE
   ========================================================= */

.privacy-note {

    display: flex;
    align-items: flex-start;

    gap: 11px;

    margin-top: 24px;

    padding:
        14px
        15px;

    border:
        1px solid #dbe9fb;

    border-radius:
        var(--radius-md);

    background:
        #f6faff;
}


.privacy-icon {

    color:
        var(--primary);

    font-size:
        13px;
}


.privacy-note strong {

    display: block;

    margin-bottom: 2px;

    font-size:
        11px;
}


.privacy-note p {

    margin: 0;

    color:
        var(--text-muted);

    font-size:
        10px;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.primary-button,
.secondary-button,
.back-button,
.context-review-button {

    min-height: 44px;

    border-radius:
        var(--radius-md);

    padding:
        0
        17px;

    cursor: pointer;

    font-weight: 700;

    font-size: 12px;

    transition:
        transform var(--transition-fast),
        box-shadow var(--transition-fast),
        border-color var(--transition-fast),
        background var(--transition-fast);
}


.primary-button {

    border:
        1px solid var(--primary);

    background:
        linear-gradient(
            135deg,
            #1684ff,
            #0c6de5
        );

    color: white;

    box-shadow:
        0 6px 16px rgba(22, 119, 255, 0.18);
}


.primary-button:hover {

    transform:
        translateY(-1px);

    box-shadow:
        0 9px 20px rgba(22, 119, 255, 0.24);
}


.primary-button:active {

    transform:
        translateY(0);
}


.secondary-button,
.back-button {

    border:
        1px solid var(--border);

    background: white;

    color:
        var(--text-secondary);
}


.secondary-button:hover,
.back-button:hover {

    border-color:
        #a9c9f4;

    background:
        var(--primary-ultra-soft);

    color:
        var(--primary);
}


.add-entry-button {

    margin-top: 12px;
}


.form-actions {

    display: flex;

    justify-content: flex-end;

    margin-top: 28px;
}


.navigation-actions {

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 14px;

    padding-top: 28px;

    margin-top: 12px;

    border-top:
        1px solid var(--border-light);
}


/* =========================================================
   SETTINGS
   ========================================================= */

.settings-overlay {

    position: fixed;

    inset: 0;

    z-index: 500;

    display: flex;
    justify-content: flex-end;

    background:
        rgba(15, 23, 42, 0.36);

    backdrop-filter:
        blur(4px);

    -webkit-backdrop-filter:
        blur(4px);
}


.settings-panel {

    width:
        min(100%, 480px);

    height: 100%;

    overflow-y: auto;

    background: white;

    padding:
        28px;

    box-shadow:
        -18px 0 50px rgba(15, 23, 42, 0.15);

    animation:
        settingsEntrance
        250ms ease;
}


@keyframes settingsEntrance {

    from {
        transform: translateX(35px);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}


.settings-header {

    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 20px;

    padding-bottom: 20px;

    border-bottom:
        1px solid var(--border-light);
}


.settings-header h2 {

    margin: 0;

    font-size: 24px;
}


.close-settings {

    width: 38px;
    height: 38px;

    border:
        1px solid var(--border);

    border-radius:
        10px;

    background:
        white;

    color:
        var(--text-secondary);

    cursor: pointer;

    font-size: 23px;
}


.settings-group {

    padding:
        22px
        0;

    border-bottom:
        1px solid var(--border-light);
}


.settings-group-title {

    margin-bottom:
        16px;
}


.settings-group-title h3 {

    margin: 0;

    font-size: 15px;
}


.settings-group-title p {

    margin:
        4px
        0
        0;

    color:
        var(--text-muted);

    font-size:
        11px;
}


.custom-units {

    margin-top:
        16px;
}


.setting-toggle {

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 18px;

    padding:
        13px
        0;

    cursor: pointer;
}


.setting-toggle strong {

    display: block;

    color:
        var(--text);

    font-size:
        12px;
}


.setting-toggle small {

    display: block;

    margin-top:
        2px;

    color:
        var(--text-muted);

    font-size:
        10px;
}


.setting-toggle input[type="checkbox"] {

    width: 42px;
    min-width: 42px;
    height: 23px;
    min-height: 23px;

    appearance: none;
    -webkit-appearance: none;

    position: relative;

    border: 0;

    border-radius:
        999px;

    background:
        #d9e0e8;

    cursor: pointer;

    transition:
        var(--transition);
}


.setting-toggle input[type="checkbox"]::after {

    content: "";

    position: absolute;

    width: 17px;
    height: 17px;

    left: 3px;
    top: 3px;

    border-radius: 50%;

    background: white;

    box-shadow:
        0 1px 4px rgba(0, 0, 0, 0.18);

    transition:
        var(--transition);
}


.setting-toggle input[type="checkbox"]:checked {

    background:
        var(--primary);
}


.setting-toggle input[type="checkbox"]:checked::after {

    transform:
        translateX(19px);
}


.settings-done {

    width: 100%;

    margin-top: 24px;
}


/* =========================================================
   FOOTER
   ========================================================= */

footer {

    padding:
        22px
        20px
        34px;

    text-align: center;

    color:
        var(--text-muted);

    font-size:
        10px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 800px) {

    .app-container {

        width:
            min(
                calc(100% - 24px),
                1120px
            );

        padding-top:
            28px;
    }


    .form-grid,
    .vitals-grid,
    .ros-grid {

        grid-template-columns:
            1fr;
    }


    .module-grid,
    .exam-module-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .form-card {

        border-radius:
            20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 560px) {

    .app-header {

        min-height: 66px;

        padding:
            11px
            16px;
    }


    .brand-icon {

        width: 38px;
        height: 38px;

        font-size: 19px;
    }


    .brand h1 {

        font-size: 16px;
    }


    .brand p {

        font-size: 10px;
    }


    .app-container {

        width:
            calc(100% - 18px);

        padding:
            22px
            0
            55px;
    }


    .welcome-section h2 {

        font-size: 29px;
    }


    .form-card {

        padding:
            20px
            16px;

        border-radius:
            18px;
    }


    .progress-card {

        padding:
            15px
            12px;
    }


    .steps {

        gap: 3px;
    }


    .step small {

        font-size: 8px;
    }


    .step span {

        width: 24px;
        height: 24px;

        font-size: 9px;
    }


    .module-grid,
    .exam-module-grid {

        grid-template-columns:
            1fr;
    }


    .block-title {

        gap: 10px;
    }


    .height-imperial-grid,
    .gestational-age-grid {

        grid-template-columns:
            1fr;
    }


    .bp-input-group {

        grid-template-columns:
            minmax(58px, 1fr)
            auto
            minmax(58px, 1fr)
            auto;
    }


    .unit-box {

        padding:
            0
            8px;

        font-size:
            9px;
    }


    .navigation-actions {

        flex-direction:
            column-reverse;

        align-items:
            stretch;
    }


    .navigation-actions button,
    .form-actions button {

        width: 100%;
    }


    .form-actions {

        display: block;
    }


    .settings-panel {

        width: 100%;

        padding:
            22px
            18px;
    }

}
/* =========================================================
   STYLE.CSS — PART 2
   CLINICAL CONTEXT + CLINICAL STATUS ENGINE
   ========================================================= */


/* =========================================================
   CLINICAL CONTEXT CARD
   ========================================================= */

.clinical-context-card {

    position: relative;

    margin-bottom: 28px;

    padding: 22px;

    overflow: hidden;

    border:
        1px solid #d6e6fb;

    border-radius:
        var(--radius-lg);

    background:
        linear-gradient(
            145deg,
            #f9fcff 0%,
            #f3f8ff 100%
        );

    box-shadow:
        0 6px 20px rgba(22, 119, 255, 0.06);

    transition:
        border-color var(--transition),
        background var(--transition),
        box-shadow var(--transition);
}


/* subtle accent line */

.clinical-context-card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;
    right: 0;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            #1677ff,
            #56a8ff
        );
}


/* =========================================================
   CONTEXT HEADER
   ========================================================= */

.clinical-context-header {

    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 20px;

    margin-bottom: 20px;
}


.clinical-context-heading {

    display: flex;
    align-items: flex-start;

    gap: 13px;
}


.context-icon {

    width: 40px;
    height: 40px;

    flex:
        0
        0
        40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    color: var(--primary);

    background: white;

    border:
        1px solid #d9e8fb;

    box-shadow:
        var(--shadow-xs);

    font-size: 17px;
}


.clinical-context-heading h4 {

    margin: 0;

    font-size: 17px;

    letter-spacing: -0.015em;
}


.clinical-context-heading p:not(.section-label) {

    margin:
        4px
        0
        0;

    max-width: 650px;

    color:
        var(--text-muted);

    font-size:
        11px;
}


/* =========================================================
   CONTEXT BADGE
   ========================================================= */

.context-status-badge {

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 25px;

    padding:
        4px
        10px;

    border-radius: 999px;

    background:
        #e5f1ff;

    color:
        #0967cf;

    font-size:
        9px;

    font-weight: 800;

    letter-spacing: 0.08em;

    white-space: nowrap;
}


/* =========================================================
   CONTEXT SUMMARY
   ========================================================= */

.context-summary-grid {

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 10px;

    margin-bottom: 16px;
}


.context-summary-item {

    min-width: 0;

    padding:
        12px
        13px;

    border:
        1px solid #e1eaf4;

    border-radius:
        var(--radius-md);

    background:
        rgba(255, 255, 255, 0.86);
}


.context-summary-label {

    display: block;

    margin-bottom: 3px;

    color:
        var(--text-muted);

    font-size:
        9px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.055em;
}


.context-summary-item strong {

    display: block;

    overflow: hidden;

    color:
        var(--text);

    font-size:
        12px;

    font-weight:
        700;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;
}


/* =========================================================
   CONTEXT ENGINE NOTE
   ========================================================= */

.context-engine-note {

    display: flex;
    align-items: flex-start;

    gap: 10px;

    padding:
        12px
        13px;

    margin-top: 14px;

    border-radius:
        var(--radius-md);

    background:
        rgba(255, 255, 255, 0.68);

    border:
        1px solid #e5edf6;
}


.context-engine-note-icon {

    color:
        var(--primary);

    font-size:
        14px;
}


.context-engine-note strong {

    display: block;

    margin-bottom:
        2px;

    font-size:
        10px;
}


.context-engine-note p {

    margin: 0;

    color:
        var(--text-muted);

    font-size:
        9px;

    line-height:
        1.5;
}


/* =========================================================
   REVIEW CONTEXT BUTTON
   ========================================================= */

.context-review-button {

    display: inline-flex;
    align-items: center;

    gap: 7px;

    min-height: 37px;

    margin-top: 14px;

    padding:
        0
        12px;

    border:
        1px solid #cbdcf2;

    background:
        rgba(255, 255, 255, 0.82);

    color:
        var(--primary);

    box-shadow:
        none;
}


.context-review-button:hover {

    border-color:
        #9bc5f8;

    background:
        white;

    transform:
        translateY(-1px);
}


/* =========================================================
   CONTEXT OVERRIDE
   ========================================================= */

.context-override-panel {

    margin-top:
        14px;

    padding:
        16px;

    border:
        1px solid #d8e1eb;

    border-radius:
        var(--radius-md);

    background:
        white;

    animation:
        moduleEntrance
        200ms ease;
}


.context-override-header {

    margin-bottom:
        14px;
}


.context-override-header strong {

    display: block;

    font-size:
        12px;
}


.context-override-header p {

    margin:
        3px
        0
        0;

    color:
        var(--text-muted);

    font-size:
        10px;
}


.context-override-warning {

    display: flex;
    align-items: flex-start;

    gap: 7px;

    margin-top:
        11px;

    padding:
        9px
        10px;

    border-radius:
        9px;

    background:
        var(--attention-soft);

    color:
        var(--attention-dark);

    font-size:
        9px;
}


.context-override-warning strong {

    white-space:
        nowrap;
}


/* =========================================================
   PREGNANCY CONTEXT
   ========================================================= */

.pregnancy-context {

    margin:
        14px
        0;

    padding:
        16px;

    border:
        1px solid #ded0f8;

    border-radius:
        var(--radius-md);

    background:
        linear-gradient(
            145deg,
            #fbf9ff,
            var(--pregnancy-soft)
        );

    animation:
        moduleEntrance
        220ms ease;
}


.pregnancy-context-header {

    margin-bottom:
        14px;
}


.pregnancy-context-header strong {

    color:
        #6840a8;

    font-size:
        12px;
}


.pregnancy-context-header p {

    margin:
        3px
        0
        0;

    color:
        #796b8d;

    font-size:
        10px;
}


.postpartum-fields {

    margin-top:
        14px;
}


/* =========================================================
   CONTEXT PROFILE VARIANTS

   JavaScript can add these classes automatically:
   context-pediatric
   context-adolescent
   context-adult
   context-geriatric
   context-pregnancy
   ========================================================= */


/* PEDIATRIC */

.clinical-context-card.context-pediatric {

    border-color:
        #cde4ff;

    background:
        linear-gradient(
            145deg,
            #fbfdff,
            #eef7ff
        );
}


.clinical-context-card.context-pediatric::before {

    background:
        linear-gradient(
            90deg,
            #1e88e5,
            #64b5f6
        );
}


/* ADOLESCENT */

.clinical-context-card.context-adolescent {

    border-color:
        #d7dcff;

    background:
        linear-gradient(
            145deg,
            #fbfcff,
            #f1f3ff
        );
}


.clinical-context-card.context-adolescent::before {

    background:
        linear-gradient(
            90deg,
            #536dfe,
            #8c9eff
        );
}


/* ADULT */

.clinical-context-card.context-adult {

    border-color:
        #d6e6fb;
}


/* GERIATRIC */

.clinical-context-card.context-geriatric {

    border-color:
        #d9e2e8;

    background:
        linear-gradient(
            145deg,
            #fcfdfd,
            #f3f6f8
        );
}


.clinical-context-card.context-geriatric::before {

    background:
        linear-gradient(
            90deg,
            #607d8b,
            #90a4ae
        );
}


/* PREGNANCY */

.clinical-context-card.context-pregnancy {

    border-color:
        #dac9f5;

    background:
        linear-gradient(
            145deg,
            #fdfbff,
            #f6f1ff
        );
}


.clinical-context-card.context-pregnancy::before {

    background:
        linear-gradient(
            90deg,
            #8756d8,
            #b794f6
        );
}


.clinical-context-card.context-pregnancy
.context-icon {

    color:
        var(--pregnancy);

    border-color:
        #dfd2f4;

    background:
        #fcfaff;
}


/* =========================================================
   CLINICAL INTERPRETATION
   ========================================================= */

.clinical-interpretation {

    margin-top:
        10px;

    padding:
        10px
        11px;

    border:
        1px solid var(--border-light);

    border-radius:
        10px;

    background:
        var(--surface-secondary);

    animation:
        interpretationEntrance
        180ms ease;
}


@keyframes interpretationEntrance {

    from {
        opacity: 0;
        transform: translateY(-3px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.interpretation-status {

    display: flex;
    align-items: center;

    gap: 7px;

    margin-bottom:
        3px;
}


.interpretation-status strong {

    font-size:
        10px;

    font-weight:
        800;
}


.clinical-interpretation p,
.bmi-clinical-detail p {

    margin:
        3px
        0
        4px;

    color:
        var(--text-secondary);

    font-size:
        10px;

    line-height:
        1.45;
}


.clinical-interpretation small,
.bmi-clinical-detail small {

    display: block;

    color:
        var(--text-muted);

    font-size:
        8px;

    line-height:
        1.4;
}


/* =========================================================
   CLINICAL STATUS DOT
   ========================================================= */

.clinical-status-dot,
.legend-dot {

    display: inline-block;

    width: 9px;
    height: 9px;

    flex:
        0
        0
        9px;

    border-radius:
        50%;

    background:
        #c5ced8;
}


/* =========================================================
   NORMAL — GREEN
   ========================================================= */

.status-normal {

    background:
        var(--normal) !important;
}


.vital-field.clinical-normal {

    border-color:
        #bce7d3;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f4fcf8
        );
}


.vital-field.clinical-normal
.clinical-interpretation {

    border-color:
        #c7ead9;

    background:
        var(--normal-soft);
}


.vital-field.clinical-normal
.interpretation-status strong {

    color:
        var(--normal-dark);
}


/* =========================================================
   ATTENTION — YELLOW
   ========================================================= */

.status-attention {

    background:
        var(--attention) !important;
}


.vital-field.clinical-attention {

    border-color:
        #f0d785;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fffaf0
        );
}


.vital-field.clinical-attention
.clinical-interpretation {

    border-color:
        #efd887;

    background:
        var(--attention-soft);
}


.vital-field.clinical-attention
.interpretation-status strong {

    color:
        var(--attention-dark);
}


/* =========================================================
   ABNORMAL — ORANGE
   ========================================================= */

.status-abnormal {

    background:
        var(--abnormal) !important;
}


.vital-field.clinical-abnormal {

    border-color:
        #f2bd91;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fff6ef
        );
}


.vital-field.clinical-abnormal
.clinical-interpretation {

    border-color:
        #f1c39e;

    background:
        var(--abnormal-soft);
}


.vital-field.clinical-abnormal
.interpretation-status strong {

    color:
        var(--abnormal-dark);
}


/* =========================================================
   CRITICAL — RED
   ========================================================= */

.status-critical {

    background:
        var(--critical) !important;
}


.vital-field.clinical-critical {

    border-color:
        #efa8b0;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fff3f4
        );

    box-shadow:
        0 0 0 1px rgba(220, 53, 69, 0.03);
}


.vital-field.clinical-critical
.clinical-interpretation {

    border-color:
        #efb1b8;

    background:
        var(--critical-soft);
}


.vital-field.clinical-critical
.interpretation-status strong {

    color:
        var(--critical-dark);
}


/* =========================================================
   CLINICAL LEGEND
   ========================================================= */

.clinical-legend {

    margin-top:
        20px;

    padding:
        13px
        14px;

    border:
        1px solid var(--border-light);

    border-radius:
        var(--radius-md);

    background:
        var(--surface-secondary);
}


.clinical-legend-header {

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;

    margin-bottom:
        10px;
}


.clinical-legend-header strong {

    font-size:
        10px;
}


.clinical-legend-header span {

    color:
        var(--text-muted);

    font-size:
        8px;

    text-transform:
        uppercase;

    letter-spacing:
        0.06em;
}


.clinical-legend-items {

    display: flex;
    align-items: center;

    flex-wrap: wrap;

    gap:
        10px
        18px;
}


.clinical-legend-item {

    display: flex;
    align-items: center;

    gap: 6px;

    color:
        var(--text-secondary);

    font-size:
        9px;
}


.clinical-legend-disclaimer {

    margin:
        10px
        0
        0;

    padding-top:
        9px;

    border-top:
        1px solid var(--border-light);

    color:
        var(--text-muted);

    font-size:
        8px;

    line-height:
        1.45;
}


/* =========================================================
   BODY MEASUREMENT TOGGLES
   ========================================================= */

.measurement-toggle-grid {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        10px
        18px;

    margin-bottom:
        16px;

    padding:
        4px
        14px;

    border:
        1px solid var(--border-light);

    border-radius:
        var(--radius-md);

    background:
        var(--surface-secondary);
}


.measurement-section {

    margin-top:
        14px;

    padding:
        14px;

    border:
        1px solid var(--border-light);

    border-radius:
        var(--radius-md);

    background:
        #fbfcfe;

    animation:
        moduleEntrance
        200ms ease;
}


/* =========================================================
   BMI CARD
   ========================================================= */

.bmi-card {

    margin-top:
        16px;

    overflow:
        hidden;

    border:
        1px solid #d8e5f5;

    border-radius:
        var(--radius-lg);

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f7faff
        );

    box-shadow:
        var(--shadow-xs);

    animation:
        moduleEntrance
        220ms ease;

    transition:
        border-color var(--transition),
        background var(--transition),
        box-shadow var(--transition);
}


.bmi-header {

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 18px;

    padding:
        16px;
}


.bmi-label {

    display: block;

    margin-bottom:
        2px;

    color:
        var(--text-muted);

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        0.07em;
}


#bmiValue {

    display: block;

    font-size:
        28px;

    line-height:
        1.1;

    letter-spacing:
        -0.04em;
}


.bmi-status {

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height:
        28px;

    padding:
        5px
        11px;

    border-radius:
        999px;

    background:
        var(--surface-tertiary);

    color:
        var(--text-secondary);

    font-size:
        9px;

    font-weight:
        800;

    text-align:
        center;
}


.bmi-clinical-detail {

    padding:
        12px
        16px;

    border-top:
        1px solid var(--border-light);
}


.bmi-context-note {

    margin:
        0;

    padding:
        0
        16px
        14px;

    color:
        var(--text-muted);

    font-size:
        8px;

    line-height:
        1.45;
}


/* =========================================================
   BMI NORMAL
   ========================================================= */

.bmi-card.clinical-normal {

    border-color:
        #bce7d3;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f3fcf7
        );
}


.bmi-card.clinical-normal
.bmi-status {

    background:
        var(--normal-soft);

    color:
        var(--normal-dark);
}


.bmi-card.clinical-normal
.bmi-clinical-detail {

    background:
        var(--normal-soft);

    border-color:
        #c7ead9;
}


/* =========================================================
   BMI ATTENTION
   ========================================================= */

.bmi-card.clinical-attention {

    border-color:
        #ecd37c;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fffaf0
        );
}


.bmi-card.clinical-attention
.bmi-status {

    background:
        var(--attention-soft);

    color:
        var(--attention-dark);
}


.bmi-card.clinical-attention
.bmi-clinical-detail {

    background:
        var(--attention-soft);

    border-color:
        #efd887;
}


/* =========================================================
   BMI ABNORMAL
   ========================================================= */

.bmi-card.clinical-abnormal {

    border-color:
        #f1bd92;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fff6ef
        );
}


.bmi-card.clinical-abnormal
.bmi-status {

    background:
        var(--abnormal-soft);

    color:
        var(--abnormal-dark);
}


.bmi-card.clinical-abnormal
.bmi-clinical-detail {

    background:
        var(--abnormal-soft);

    border-color:
        #f1c39e;
}


/* =========================================================
   BMI CRITICAL
   ========================================================= */

.bmi-card.clinical-critical {

    border-color:
        #efadb5;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fff3f4
        );
}


.bmi-card.clinical-critical
.bmi-status {

    background:
        var(--critical-soft);

    color:
        var(--critical-dark);
}


.bmi-card.clinical-critical
.bmi-clinical-detail {

    background:
        var(--critical-soft);

    border-color:
        #efb1b8;
}


/* =========================================================
   INPUT STATUS ACCENTS

   These classes can also be applied directly by JS
   when we want a subtle colored input outline.
   ========================================================= */

.input-clinical-normal {

    border-color:
        #93d5b5 !important;
}


.input-clinical-attention {

    border-color:
        #e5c352 !important;
}


.input-clinical-abnormal {

    border-color:
        #ed9a57 !important;
}


.input-clinical-critical {

    border-color:
        #e47783 !important;
}


/* =========================================================
   CRITICAL PULSE
   Subtle, not alarm-like.
   ========================================================= */

@keyframes criticalPulse {

    0% {
        box-shadow:
            0 0 0 0 rgba(220, 53, 69, 0.12);
    }

    70% {
        box-shadow:
            0 0 0 5px rgba(220, 53, 69, 0);
    }

    100% {
        box-shadow:
            0 0 0 0 rgba(220, 53, 69, 0);
    }

}


.vital-field.clinical-critical
.clinical-status-dot {

    animation:
        criticalPulse
        2s
        ease-out
        1;
}


/* =========================================================
   INVALID CLINICAL VALUE
   Used for impossible input rather than disease severity.
   ========================================================= */

.clinical-invalid {

    border-color:
        #d64545 !important;

    background:
        #fff8f8 !important;
}


.clinical-input-message {

    display: block;

    margin-top:
        6px;

    color:
        var(--critical);

    font-size:
        9px;

    font-weight:
        650;
}


/* =========================================================
   EMPTY / WAITING CONTEXT
   ========================================================= */

.clinical-context-card.context-pending
.context-summary-item strong {

    color:
        var(--text-light);
}


.clinical-context-card.context-pending
.context-status-badge {

    background:
        #f0f3f6;

    color:
        var(--text-muted);
}


/* =========================================================
   REFERENCE TEXT
   ========================================================= */

.clinical-reference {

    display: inline-flex;
    align-items: center;

    gap:
        4px;

    margin-top:
        4px;

    color:
        var(--text-muted);

    font-size:
        8px;
}


.clinical-reference::before {

    content: "↳";

    color:
        var(--text-light);
}


/* =========================================================
   ACCESSIBILITY / FOCUS
   ========================================================= */

.context-review-button:focus-visible,
.module-button:focus-visible,
.primary-button:focus-visible,
.secondary-button:focus-visible,
.back-button:focus-visible,
.icon-button:focus-visible {

    outline:
        3px solid rgba(22, 119, 255, 0.22);

    outline-offset:
        2px;
}


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

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {

        scroll-behavior:
            auto !important;

        animation-duration:
            0.01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            0.01ms !important;
    }

}


/* =========================================================
   TABLET — CLINICAL CONTEXT
   ========================================================= */

@media (max-width: 900px) {

    .context-summary-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   MOBILE — CLINICAL ENGINE
   ========================================================= */

@media (max-width: 560px) {

    .clinical-context-card {

        padding:
            18px
            14px;
    }


    .clinical-context-header {

        flex-direction:
            column;

        gap:
            12px;
    }


    .context-status-badge {

        align-self:
            flex-start;
    }


    .context-summary-grid {

        grid-template-columns:
            1fr
            1fr;

        gap:
            8px;
    }


    .context-summary-item {

        padding:
            10px;
    }


    .context-summary-item strong {

        white-space:
            normal;
    }


    .clinical-legend-items {

        display:
            grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .measurement-toggle-grid {

        grid-template-columns:
            1fr;
    }


    .bmi-header {

        align-items:
            flex-start;

        flex-direction:
            column;
    }


    .bmi-status {

        align-self:
            flex-start;
    }


    .clinical-context-heading {

        gap:
            10px;
    }


    .context-icon {

        width:
            36px;

        height:
            36px;

        flex-basis:
            36px;
    }

}


/* =========================================================
   VERY SMALL MOBILE
   ========================================================= */

@media (max-width: 380px) {

    .context-summary-grid {

        grid-template-columns:
            1fr;
    }


    .clinical-legend-items {

        grid-template-columns:
            1fr;
    }


    .bp-input-group {

        grid-template-columns:
            minmax(48px, 1fr)
            auto
            minmax(48px, 1fr);
    }


    .bp-input-group .unit-box {

        grid-column:
            1 / -1;

        justify-content:
            center;

        min-height:
            28px;

        border-left:
            0;

        border-top:
            1px solid var(--border-light);
    }

}


/* =========================================================
   PRINT
   Keep browser printing clean if used later.
   ========================================================= */

@media print {

    body {

        background:
            white;
    }


    .app-header,
    .progress-card,
    .navigation-actions,
    .form-actions,
    .context-review-button,
    .module-button,
    .remove-module,
    .remove-exam-module,
    .remove-diagnostic-module,
    footer {

        display:
            none !important;
    }


    .app-container {

        width:
            100%;

        padding:
            0;
    }


    .form-card {

        border:
            0;

        box-shadow:
            none;

        padding:
            0;
    }


    .clinical-context-card,
    .clinical-block,
    .history-module {

        break-inside:
            avoid;
    }

}

/* =========================================================
   DOCUMENTATION MODE
   Full / Focused / Essential / Custom SOAP
   ========================================================= */

.documentation-mode-card {
    background: #ffffff;
    border: 1px solid #dbe5f1;
    border-radius: 24px;
    padding: 28px 30px;
    margin-bottom: 28px;
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.02),
        0 8px 24px rgba(15, 23, 42, 0.025);
}


/* =========================================================
   HEADER
   ========================================================= */

.documentation-mode-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

.documentation-mode-header h3 {
    margin: 4px 0 7px;
    font-size: 22px;
    line-height: 1.25;
    font-weight: 750;
    color: #0f2747;
}

.documentation-mode-description {
    max-width: 760px;
    margin: 0;
    color: #6b7b93;
    font-size: 14px;
    line-height: 1.6;
}

.documentation-mode-card .section-label {
    margin: 0;
    color: #2563eb;
    font-size: 11px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.12em;
}


/* SMART BADGE */

.documentation-mode-card .context-status-badge {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #eff6ff;
    border: 1px solid #dbeafe;
    color: #2563eb;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.09em;
}


/* =========================================================
   FOUR MODE GRID
   ========================================================= */

.documentation-mode-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    width: 100%;
}


/* =========================================================
   MODE OPTION
   ========================================================= */

.documentation-mode-option {
    position: relative;
    display: block;
    min-width: 0;
    cursor: pointer;
}


/*
   Hide native radio visually,
   but keep it accessible.
*/

.documentation-mode-option > input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}


/* CARD */

.documentation-mode-content {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 218px;
    height: 100%;
    padding: 19px;
    border: 1.5px solid #dce5f0;
    border-radius: 18px;
    background: #ffffff;

    transition:
        border-color 0.18s ease,
        background-color 0.18s ease,
        box-shadow 0.18s ease,
        transform 0.18s ease;
}


/* HOVER */

.documentation-mode-option:hover
.documentation-mode-content {
    border-color: #a9c7f8;
    background: #fbfdff;
    transform: translateY(-1px);
    box-shadow:
        0 8px 22px rgba(37, 99, 235, 0.07);
}


/* KEYBOARD FOCUS */

.documentation-mode-option > input:focus-visible
+ .documentation-mode-content {
    outline: 3px solid rgba(37, 99, 235, 0.20);
    outline-offset: 3px;
}


/* =========================================================
   SELECTED MODE
   ========================================================= */

.documentation-mode-option > input:checked
+ .documentation-mode-content {
    border-color: #2563eb;
    background:
        linear-gradient(
            180deg,
            #f8fbff 0%,
            #f3f8ff 100%
        );
    box-shadow:
        0 0 0 1px rgba(37, 99, 235, 0.08),
        0 10px 26px rgba(37, 99, 235, 0.09);
}


/* =========================================================
   CARD TOP
   ========================================================= */

.documentation-mode-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}


/* MODE ICON */

.documentation-mode-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 11px;
    background: #f1f5f9;
    color: #52637a;
    font-size: 18px;
    font-weight: 800;

    transition:
        background-color 0.18s ease,
        color 0.18s ease;
}


.documentation-mode-option > input:checked
+ .documentation-mode-content
.documentation-mode-icon {
    background: #2563eb;
    color: #ffffff;
}


/* CHECK */

.documentation-mode-check {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: 1.5px solid #d5dfeb;
    border-radius: 50%;
    background: #ffffff;
    color: transparent;
    font-size: 13px;
    font-weight: 900;

    transition:
        background-color 0.18s ease,
        border-color 0.18s ease,
        color 0.18s ease;
}


.documentation-mode-option > input:checked
+ .documentation-mode-content
.documentation-mode-check {
    background: #2563eb;
    border-color: #2563eb;
    color: #ffffff;
}


/* =========================================================
   CARD TYPOGRAPHY
   ========================================================= */

.documentation-mode-content > strong {
    display: block;
    margin-bottom: 7px;
    color: #10233f;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 800;
}


.documentation-mode-content > p {
    flex-grow: 1;
    margin: 0 0 16px;
    color: #718096;
    font-size: 12.5px;
    line-height: 1.55;
}


/* =========================================================
   TAGS
   ========================================================= */

.documentation-mode-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: auto;
}


.documentation-mode-tags span {
    display: inline-flex;
    align-items: center;
    min-height: 23px;
    padding: 4px 8px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #64748b;
    font-size: 9.5px;
    line-height: 1;
    font-weight: 750;
    letter-spacing: 0.015em;
}


.documentation-mode-option > input:checked
+ .documentation-mode-content
.documentation-mode-tags span {
    background: #e5efff;
    color: #2459ae;
}


/* =========================================================
   ACTIVE MODE SUMMARY
   ========================================================= */

.documentation-mode-summary {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-top: 20px;
    padding: 15px 17px;
    border: 1px solid #cfe0fa;
    border-radius: 15px;
    background: #f7faff;
}


.documentation-mode-summary-icon {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    margin-top: 1px;
    border-radius: 9px;
    background: #e5efff;
    color: #2563eb;
    font-size: 14px;
    font-weight: 900;
}


.documentation-mode-summary strong {
    display: block;
    margin: 0 0 3px;
    color: #15325a;
    font-size: 12.5px;
    line-height: 1.4;
    font-weight: 800;
}


.documentation-mode-summary p {
    margin: 0;
    color: #64748b;
    font-size: 11.5px;
    line-height: 1.55;
}


/* =========================================================
   CUSTOM SOAP OPTIONS
   ========================================================= */

.custom-documentation-options {
    margin-top: 20px;
    padding: 20px;
    border: 1px solid #dbe5f1;
    border-radius: 17px;
    background: #fafcff;
}


/*
   Preserve compatibility with the application's
   existing .hidden utility.
*/

.custom-documentation-options.hidden {
    display: none !important;
}


.custom-documentation-header {
    margin-bottom: 15px;
}


.custom-documentation-header strong {
    display: block;
    margin-bottom: 3px;
    color: #10233f;
    font-size: 13px;
    font-weight: 800;
}


.custom-documentation-header p {
    margin: 0;
    color: #718096;
    font-size: 11.5px;
    line-height: 1.5;
}


/* CUSTOM GRID */

.custom-documentation-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}


/* CUSTOM TOGGLE */

.custom-documentation-toggle {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 45px;
    padding: 10px 12px;
    border: 1px solid #dce5f0;
    border-radius: 11px;
    background: #ffffff;
    color: #334155;
    cursor: pointer;
    user-select: none;

    transition:
        border-color 0.16s ease,
        background-color 0.16s ease;
}


.custom-documentation-toggle:hover {
    border-color: #b8cff3;
    background: #fbfdff;
}


.custom-documentation-toggle input {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: #2563eb;
    cursor: pointer;
}


.custom-documentation-toggle span {
    font-size: 11.5px;
    line-height: 1.35;
    font-weight: 650;
}


/* =========================================================
   SAFETY / DOCUMENTATION NOTE
   ========================================================= */

.documentation-mode-safety {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 16px;
    padding-top: 15px;
    border-top: 1px solid #e8eef5;
    color: #7b899c;
}


.documentation-mode-safety > span {
    flex: 0 0 auto;
    color: #64748b;
    font-size: 14px;
    line-height: 1.4;
}


.documentation-mode-safety p {
    margin: 0;
    font-size: 10.5px;
    line-height: 1.55;
}


/* =========================================================
   DOCUMENTATION MODE — RESPONSIVE
   ========================================================= */

/* Medium screens */

@media (max-width: 1100px) {

    .documentation-mode-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .documentation-mode-content {
        min-height: 190px;
    }

}


/* Tablets */

@media (max-width: 760px) {

    .documentation-mode-card {
        padding: 22px 18px;
        border-radius: 19px;
    }

    .documentation-mode-header {
        gap: 14px;
    }

    .documentation-mode-header h3 {
        font-size: 19px;
    }

    .custom-documentation-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* Phones */

@media (max-width: 560px) {

    .documentation-mode-header {
        flex-direction: column;
    }

    .documentation-mode-grid {
        grid-template-columns: 1fr;
    }

    .documentation-mode-content {
        min-height: auto;
    }

    .custom-documentation-grid {
        grid-template-columns: 1fr;
    }

    .documentation-mode-summary {
        padding: 14px;
    }

}

/* ============================================================
   PART 5B — ASSESSMENT UI
   Medical SOAP
   ============================================================ */


/* ============================================================
   ASSESSMENT HEADER
   ============================================================ */

#assessmentSection {
    width: 100%;
}

#assessmentSection .section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

#assessmentSection .section-kicker,
.assessment-block-kicker {
    margin-bottom: 6px;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #1677ff;
}

#assessmentSection .section-header h2 {
    margin: 0 0 8px;
    font-size: 1.65rem;
    line-height: 1.25;
}

#assessmentSection .section-description {
    margin: 0;
    max-width: 760px;
    line-height: 1.55;
    color: #64748b;
}


/* ============================================================
   CLINICAL CONTEXT BADGE
   ============================================================ */

#assessmentContextBadge {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 13px;
    border: 1px solid #dbeafe;
    border-radius: 999px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}


/* ============================================================
   PATIENT CONTEXT CARD
   ============================================================ */

.assessment-context-card {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 18px;
    padding: 18px 20px;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    background: #f8fbff;
}

.assessment-context-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #e8f1ff;
    font-size: 1.2rem;
}

.assessment-context-content {
    min-width: 0;
}

.assessment-context-label {
    margin-bottom: 4px;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #2563eb;
}

.assessment-context-summary {
    color: #334155;
    font-size: 0.94rem;
    line-height: 1.55;
}


/* ============================================================
   CLINICAL REASONING NOTICE
   ============================================================ */

.assessment-clinical-notice {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 26px;
    padding: 16px 18px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #f8fafc;
    color: #334155;
}

.assessment-notice-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #e2e8f0;
    font-size: 0.9rem;
}

.assessment-clinical-notice strong {
    display: block;
    margin-bottom: 4px;
    color: #0f172a;
}

.assessment-clinical-notice p {
    margin: 0;
    line-height: 1.5;
    font-size: 0.9rem;
}


/* ============================================================
   MAIN ASSESSMENT BLOCKS
   ============================================================ */

.assessment-block {
    margin-top: 24px;
    padding: 24px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #ffffff;
}

.assessment-block-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 22px;
}

.assessment-block-header h3,
.assessment-block h3 {
    margin: 0 0 6px;
    color: #0f172a;
    font-size: 1.18rem;
}

.assessment-block-header p,
.assessment-block .assessment-subsection-title p {
    margin: 0;
    color: #64748b;
    font-size: 0.9rem;
    line-height: 1.5;
}

.assessment-add-button {
    flex-shrink: 0;
    white-space: nowrap;
}


/* ============================================================
   PROBLEM LIST
   ============================================================ */

.assessment-problem-list {
    display: flex;
    flex-direction: column;
    gap: 22px;
}


/* ============================================================
   INDIVIDUAL PROBLEM CARD
   ============================================================ */

.assessment-problem-card {
    position: relative;
    overflow: hidden;
    padding: 22px;
    border: 1px solid #dbe3ee;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.035);
}

.assessment-problem-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: #3b82f6;
}


/* ============================================================
   PROBLEM HEADER
   ============================================================ */

.assessment-problem-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
}

.assessment-problem-number {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 11px;
    background: #1677ff;
    color: #ffffff;
    font-weight: 800;
}

.assessment-problem-heading {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.assessment-problem-label {
    color: #0f172a;
    font-size: 1rem;
    font-weight: 800;
}

.assessment-problem-status {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 4px 9px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}


/* ============================================================
   ASSESSMENT FORM ELEMENTS
   ============================================================ */

#assessmentSection .form-group {
    min-width: 0;
}

#assessmentSection .form-label {
    display: block;
    margin-bottom: 7px;
    color: #1e293b;
    font-size: 0.87rem;
    font-weight: 700;
}

#assessmentSection .form-control {
    width: 100%;
    box-sizing: border-box;
}

#assessmentSection input.form-control,
#assessmentSection select.form-control,
#assessmentSection textarea.form-control {
    border: 1px solid #d8e1ec;
    border-radius: 12px;
    background: #ffffff;
    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        background-color 0.18s ease;
}

#assessmentSection input.form-control,
#assessmentSection select.form-control {
    min-height: 46px;
    padding: 10px 13px;
}

#assessmentSection textarea.form-control {
    padding: 12px 14px;
    line-height: 1.5;
}

#assessmentSection input.form-control:focus,
#assessmentSection select.form-control:focus,
#assessmentSection textarea.form-control:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.11);
}

#assessmentSection .field-helper {
    margin-top: 6px;
    color: #94a3b8;
    font-size: 0.76rem;
    line-height: 1.4;
}

#assessmentSection .optional-label {
    margin-left: 5px;
    color: #94a3b8;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
}


/* ============================================================
   SUBSECTIONS
   ============================================================ */

.assessment-subsection {
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid #edf1f5;
}

.assessment-subsection-title {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin-bottom: 17px;
}

.assessment-subsection-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #f1f5f9;
    font-size: 0.95rem;
}

.assessment-subsection-title h4 {
    margin: 0 0 3px;
    color: #0f172a;
    font-size: 0.98rem;
}

.assessment-subsection-title h3 {
    margin: 0 0 4px;
}

.assessment-subsection-title p {
    margin: 0;
    color: #64748b;
    font-size: 0.84rem;
    line-height: 1.45;
}


/* ============================================================
   GRIDS
   ============================================================ */

.assessment-grid {
    display: grid;
    gap: 16px;
}

.assessment-grid-two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.assessment-grid-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.assessment-grid + .assessment-grid {
    margin-top: 16px;
}


/* ============================================================
   TEXTAREAS
   ============================================================ */

.assessment-textarea {
    width: 100%;
    min-height: 125px;
    resize: vertical;
}

.clinical-reasoning-input {
    min-height: 150px;
}


/* ============================================================
   DIFFERENTIAL DIAGNOSIS
   ============================================================ */

.differential-list {
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.differential-row {
    display: grid;
    grid-template-columns: 34px minmax(0, 0.9fr) minmax(0, 1.3fr);
    align-items: center;
    gap: 10px;
}

.differential-rank {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: #eef4ff;
    color: #2563eb;
    font-size: 0.78rem;
    font-weight: 800;
}

.assessment-inline-button {
    margin-top: 12px;
    padding: 8px 11px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #2563eb;
    cursor: pointer;
    font: inherit;
    font-size: 0.82rem;
    font-weight: 800;
}

.assessment-inline-button:hover {
    background: #eff6ff;
}


/* ============================================================
   REFERENCE CARD
   ============================================================ */

.assessment-reference-card {
    margin-top: 22px;
    padding: 15px 17px;
    border: 1px solid #dbeafe;
    border-radius: 13px;
    background: #f8fbff;
}

.assessment-reference-card.hidden {
    display: none;
}

.assessment-reference-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    color: #1e40af;
    font-size: 0.87rem;
}

.assessment-reference-source,
.assessment-reference-guideline,
.assessment-reference-applicability {
    margin-top: 4px;
    color: #475569;
    font-size: 0.78rem;
    line-height: 1.45;
}


/* ============================================================
   CLINICAL STANDARDS SUMMARY
   ============================================================ */

.clinical-standards-summary {
    margin-top: 24px;
    padding: 17px 19px;
    border: 1px solid #dce5ef;
    border-radius: 14px;
    background: #f8fafc;
}

.clinical-standards-summary-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 7px;
    color: #334155;
}

.clinical-standards-summary p {
    margin: 0;
    color: #64748b;
    font-size: 0.82rem;
    line-height: 1.5;
}

.clinical-standards-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}


/* ============================================================
   ASSESSMENT NAVIGATION
   ============================================================ */

#assessmentSection .section-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid #e2e8f0;
}


/* ============================================================
   RESPONSIVE — TABLET
   ============================================================ */

@media (max-width: 900px) {

    .assessment-grid-three {
        grid-template-columns: 1fr;
    }

    .differential-row {
        grid-template-columns: 34px 1fr;
    }

    .differential-reason-input {
        grid-column: 2;
    }

}


/* ============================================================
   RESPONSIVE — MOBILE
   ============================================================ */

@media (max-width: 700px) {

    #assessmentSection .section-header,
    .assessment-block-header {
        flex-direction: column;
    }

    .assessment-grid-two,
    .assessment-grid-three {
        grid-template-columns: 1fr;
    }

    .assessment-block {
        padding: 17px;
        border-radius: 15px;
    }

    .assessment-problem-card {
        padding: 17px;
    }

    .assessment-context-card,
    .assessment-clinical-notice {
        padding: 15px;
    }

    .assessment-add-button {
        width: 100%;
    }

    .differential-row {
        grid-template-columns: 30px minmax(0, 1fr);
    }

    .differential-reason-input {
        grid-column: 2;
    }

    #assessmentSection .section-navigation {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    #assessmentSection .section-navigation button {
        width: 100%;
    }

}


/* ============================================================
   PRINT
   ============================================================ */

@media print {

    #assessmentSection .section-navigation,
    #assessmentSection .assessment-add-button,
    #assessmentSection .assessment-inline-button {
        display: none !important;
    }

    .assessment-block,
    .assessment-problem-card,
    .assessment-context-card,
    .assessment-clinical-notice,
    .clinical-standards-summary {
        box-shadow: none !important;
        break-inside: avoid;
    }

}


/* ============================================================
   END PART 5B — ASSESSMENT UI
   ============================================================ */

/* ============================================================
   PART 6B — PLAN UI
   Medical SOAP
   ============================================================ */


/* ============================================================
   PLAN SECTION
   ============================================================ */

#planSection {
    position: relative;
}


/* ============================================================
   PLAN CONTEXT CARD
   ============================================================ */

.plan-context-card {
    display: flex;
    align-items: flex-start;
    gap: 16px;

    margin-bottom: 22px;
    padding: 18px 20px;

    background: #f8fbff;
    border: 1px solid #dbeafe;
    border-radius: 16px;
}

.plan-context-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    background: #e8f1ff;
    border-radius: 12px;

    font-size: 20px;
}

.plan-context-content {
    min-width: 0;
}

.plan-context-label {
    margin-bottom: 4px;

    color: #2563eb;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.plan-context-summary {
    color: #475569;
    font-size: 14px;
    line-height: 1.55;
}


/* ============================================================
   CLINICAL NOTICE
   ============================================================ */

.plan-clinical-notice {
    display: flex;
    align-items: flex-start;
    gap: 14px;

    margin-bottom: 26px;
    padding: 16px 18px;

    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 14px;

    color: #78350f;
}

.plan-notice-icon {
    flex: 0 0 auto;

    font-size: 18px;
    line-height: 1.4;
}

.plan-clinical-notice strong {
    display: block;

    margin-bottom: 4px;

    font-size: 14px;
}

.plan-clinical-notice p {
    margin: 0;

    color: #92400e;
    font-size: 13px;
    line-height: 1.55;
}


/* ============================================================
   PLAN BLOCK
   ============================================================ */

.plan-block {
    margin-bottom: 28px;
    padding: 24px;

    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
}

.plan-block-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 22px;
}

.plan-block-kicker {
    margin-bottom: 5px;

    color: #2563eb;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.plan-block-header h3 {
    margin: 0 0 6px;

    color: #0f172a;
    font-size: 19px;
}

.plan-block-header p {
    margin: 0;

    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
}


/* ============================================================
   PROBLEM LIST
   ============================================================ */

.plan-problem-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}


/* ============================================================
   PROBLEM CARD
   ============================================================ */

.plan-problem-card {
    overflow: hidden;

    background: #ffffff;
    border: 1px solid #dbe3ee;
    border-radius: 16px;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.plan-problem-card:focus-within {
    border-color: #93c5fd;

    box-shadow:
        0 0 0 3px rgba(59, 130, 246, 0.08);
}


/* ============================================================
   PROBLEM HEADER
   ============================================================ */

.plan-problem-header {
    display: flex;
    align-items: center;
    gap: 14px;

    padding: 16px 18px;

    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.plan-problem-number {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;

    flex: 0 0 36px;

    background: #2563eb;
    border-radius: 50%;

    color: #ffffff;
    font-size: 14px;
    font-weight: 800;
}

.plan-problem-heading {
    display: flex;
    flex: 1;
    flex-direction: column;

    min-width: 0;
}

.plan-problem-label {
    margin-bottom: 2px;

    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.plan-problem-diagnosis {
    overflow: hidden;

    color: #0f172a;
    font-size: 15px;
    line-height: 1.35;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* ============================================================
   PLAN STATUS
   ============================================================ */

.plan-problem-status {
    flex: 0 0 auto;

    padding: 6px 10px;

    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 999px;

    color: #64748b;
    font-size: 11px;
    font-weight: 700;
}

.plan-problem-status[data-status="progress"] {
    background: #fff7ed;
    border-color: #fed7aa;

    color: #c2410c;
}

.plan-problem-status[data-status="complete"] {
    background: #ecfdf5;
    border-color: #a7f3d0;

    color: #047857;
}


/* ============================================================
   PLAN SUBSECTIONS
   ============================================================ */

.plan-subsection {
    padding: 22px 20px;

    border-bottom: 1px solid #edf2f7;
}

.plan-subsection:last-of-type {
    border-bottom: 0;
}

.plan-subsection-title {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    margin-bottom: 16px;
}

.plan-subsection-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    background: #f1f5f9;
    border-radius: 9px;

    font-size: 16px;
}

.plan-subsection-title h3,
.plan-subsection-title h4 {
    margin: 0 0 3px;

    color: #0f172a;
}

.plan-subsection-title h3 {
    font-size: 18px;
}

.plan-subsection-title h4 {
    font-size: 15px;
}

.plan-subsection-title p {
    margin: 0;

    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}


/* ============================================================
   TEXTAREAS
   ============================================================ */

.plan-textarea {
    width: 100%;
    min-height: 90px;

    resize: vertical;
}


/* ============================================================
   GENERAL PLAN GRIDS
   ============================================================ */

.plan-grid {
    display: grid;
    gap: 14px;
}

.plan-grid-two {
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}


/* ============================================================
   NUMBERED ITEMS
   ============================================================ */

.plan-item-number {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;

    flex: 0 0 28px;

    margin-top: 25px;

    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 8px;

    color: #2563eb;
    font-size: 12px;
    font-weight: 800;
}


/* ============================================================
   MEDICATION LIST
   ============================================================ */

.plan-medication-list {
    display: flex;
    flex-direction: column;
    gap: 14px;

    margin-bottom: 12px;
}

.plan-medication-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    padding: 14px;

    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.plan-medication-grid {
    display: grid;
    flex: 1;

    grid-template-columns:
        minmax(180px, 1.5fr)
        minmax(100px, 0.7fr)
        minmax(110px, 0.7fr)
        minmax(110px, 0.8fr)
        minmax(110px, 0.8fr);

    gap: 10px;
}

.plan-medication-instructions-group {
    flex-basis: 100%;
}


/*
   Medication row wraps because it contains the main grid
   plus optional instructions.
*/

.plan-medication-row {
    flex-wrap: wrap;
}

.plan-medication-row > .plan-item-number {
    order: 1;
}

.plan-medication-row > .plan-medication-grid {
    order: 2;
}

.plan-medication-row > .plan-medication-instructions-group {
    order: 3;

    margin-left: 40px;
    width: calc(100% - 40px);
}


/* ============================================================
   DIAGNOSTIC ORDERS
   ============================================================ */

.plan-order-list {
    display: flex;
    flex-direction: column;
    gap: 12px;

    margin-bottom: 12px;
}

.plan-order-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    padding: 14px;

    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.plan-order-grid {
    display: grid;
    flex: 1;

    grid-template-columns:
        minmax(220px, 1fr)
        minmax(220px, 1fr);

    gap: 12px;
}


/* ============================================================
   REFERRALS
   ============================================================ */

.plan-referral-list {
    display: flex;
    flex-direction: column;
    gap: 12px;

    margin-bottom: 12px;
}

.plan-referral-row {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    padding: 14px;

    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.plan-referral-grid {
    display: grid;
    flex: 1;

    grid-template-columns:
        minmax(180px, 0.8fr)
        minmax(240px, 1.2fr);

    gap: 12px;
}


/* ============================================================
   INLINE ADD BUTTONS
   ============================================================ */

.plan-inline-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 38px;

    padding: 8px 13px;

    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 9px;

    color: #2563eb;
    cursor: pointer;

    font: inherit;
    font-size: 12px;
    font-weight: 700;

    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        transform 0.15s ease;
}

.plan-inline-button:hover {
    background: #eff6ff;
    border-color: #93c5fd;
}

.plan-inline-button:active {
    transform: translateY(1px);
}

.plan-inline-button:focus-visible {
    outline: 3px solid rgba(59, 130, 246, 0.18);
    outline-offset: 2px;
}


/* ============================================================
   REMOVE DYNAMIC ITEM BUTTONS
   Used by Part 6C
   ============================================================ */

.plan-remove-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 30px;
    height: 30px;

    flex: 0 0 30px;

    margin-top: 24px;

    background: #ffffff;
    border: 1px solid #fecaca;
    border-radius: 8px;

    color: #dc2626;
    cursor: pointer;

    font-size: 16px;
    font-weight: 700;
}

.plan-remove-item:hover {
    background: #fef2f2;
}


/* ============================================================
   FOLLOW-UP
   ============================================================ */

.plan-followup-notes {
    margin-top: 14px;
}


/* ============================================================
   CLINICAL REFERENCE CARD
   Reserved for future guideline integration
   ============================================================ */

.plan-reference-card {
    margin: 0 20px 20px;
    padding: 14px 16px;

    background: #f8fafc;
    border: 1px solid #cbd5e1;
    border-left: 4px solid #2563eb;
    border-radius: 10px;

    color: #475569;
    font-size: 12px;
    line-height: 1.5;
}

.plan-reference-card.hidden {
    display: none;
}

.plan-reference-header {
    display: flex;
    align-items: center;
    gap: 7px;

    margin-bottom: 8px;

    color: #0f172a;
}

.plan-reference-source,
.plan-reference-guideline,
.plan-reference-applicability {
    margin-top: 4px;
}


/* ============================================================
   COMPLETION SUMMARY
   ============================================================ */

.plan-completion-summary {
    margin-top: 24px;
    margin-bottom: 24px;
    padding: 16px 18px;

    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
}

.plan-completion-header {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 5px;

    color: #0f172a;
    font-size: 14px;
}

.plan-completion-header span {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 22px;
    height: 22px;

    background: #e2e8f0;
    border-radius: 50%;

    color: #64748b;
    font-size: 11px;
    font-weight: 900;
}

.plan-completion-summary p {
    margin: 0;

    color: #64748b;
    font-size: 12px;
    line-height: 1.5;
}

.plan-completion-summary[data-status="progress"] {
    background: #fff7ed;
    border-color: #fed7aa;
}

.plan-completion-summary[data-status="complete"] {
    background: #ecfdf5;
    border-color: #a7f3d0;
}


/* ============================================================
   OPTIONAL LABEL
   ============================================================ */

#planSection .optional-label {
    margin-left: 5px;

    color: #94a3b8;
    font-size: 10px;
    font-weight: 600;
}


/* ============================================================
   FORM CONSISTENCY INSIDE PLAN
   ============================================================ */

#planSection .form-group {
    min-width: 0;
}

#planSection .form-label {
    display: block;

    margin-bottom: 6px;

    color: #334155;
    font-size: 12px;
    font-weight: 700;
}

#planSection input,
#planSection select,
#planSection textarea {
    box-sizing: border-box;
}


/* ============================================================
   RESPONSIVE — MEDIUM SCREENS
   ============================================================ */

@media (max-width: 1100px) {

    .plan-medication-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .plan-order-grid,
    .plan-referral-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* ============================================================
   RESPONSIVE — TABLET
   ============================================================ */

@media (max-width: 800px) {

    .plan-block {
        padding: 18px;
    }

    .plan-problem-header {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .plan-problem-status {
        margin-left: 50px;
    }

    .plan-medication-grid,
    .plan-order-grid,
    .plan-referral-grid,
    .plan-grid-two {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .plan-item-number {
        margin-top: 0;
    }

    .plan-medication-row,
    .plan-order-row,
    .plan-referral-row {
        flex-direction: column;
    }

    .plan-medication-row > .plan-medication-instructions-group {
        margin-left: 0;
        width: 100%;
    }

    .plan-medication-grid,
    .plan-order-grid,
    .plan-referral-grid {
        width: 100%;
    }

    .plan-remove-item {
        margin-top: 0;
    }

}


/* ============================================================
   RESPONSIVE — MOBILE
   ============================================================ */

@media (max-width: 560px) {

    .plan-context-card,
    .plan-clinical-notice {
        padding: 14px;
    }

    .plan-block {
        padding: 14px;
        border-radius: 14px;
    }

    .plan-subsection {
        padding: 18px 14px;
    }

    .plan-problem-header {
        padding: 14px;
    }

    .plan-problem-diagnosis {
        white-space: normal;
    }

    .plan-problem-status {
        margin-left: 0;
    }

}


/* ============================================================
   PRINT
   ============================================================ */

@media print {

    #planSection .section-navigation,
    #planSection .plan-inline-button,
    #planSection .plan-remove-item {
        display: none !important;
    }

    .plan-block,
    .plan-problem-card,
    .plan-context-card,
    .plan-clinical-notice,
    .plan-completion-summary {
        box-shadow: none !important;
        break-inside: avoid;
    }

    .plan-subsection {
        break-inside: avoid;
    }

}


/* ============================================================
   END PART 6B — PLAN UI
   ============================================================ */   

/* ============================================================
   PART 7B — REVIEW UI
   Medical SOAP
   ============================================================ */


/* ============================================================
   REVIEW SECTION
   ============================================================ */

#reviewSection {
    position: relative;
}


/* ============================================================
   REVIEW STATUS BADGE
   ============================================================ */

.review-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 30px;
    padding: 6px 12px;

    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 999px;

    color: #64748b;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.review-status-badge[data-status="pending"] {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #c2410c;
}

.review-status-badge[data-status="ready"] {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #047857;
}

.review-status-badge[data-status="attention"] {
    background: #fef2f2;
    border-color: #fecaca;
    color: #b91c1c;
}


/* ============================================================
   CLINICAL CONTEXT
   ============================================================ */

.review-context-card {
    display: flex;
    align-items: flex-start;
    gap: 16px;

    margin-bottom: 22px;
    padding: 18px 20px;

    background: #f8fbff;
    border: 1px solid #dbeafe;
    border-radius: 16px;
}

.review-context-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;
    flex: 0 0 42px;

    background: #e8f1ff;
    border-radius: 12px;

    color: #2563eb;
    font-size: 19px;
    font-weight: 900;
}

.review-context-content {
    min-width: 0;
}

.review-context-label {
    margin-bottom: 4px;

    color: #2563eb;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.review-context-summary {
    color: #475569;
    font-size: 14px;
    line-height: 1.55;
}


/* ============================================================
   CLINICAL NOTICE
   ============================================================ */

.review-clinical-notice {
    display: flex;
    align-items: flex-start;
    gap: 14px;

    margin-bottom: 24px;
    padding: 16px 18px;

    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 14px;

    color: #78350f;
}

.review-notice-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;
    flex: 0 0 26px;

    background: #fef3c7;
    border-radius: 50%;

    font-size: 14px;
    font-weight: 900;
}

.review-clinical-notice strong {
    display: block;
    margin-bottom: 4px;
    font-size: 14px;
}

.review-clinical-notice p {
    margin: 0;

    color: #92400e;
    font-size: 13px;
    line-height: 1.55;
}


/* ============================================================
   SHARED REVIEW BLOCK
   ============================================================ */

.review-block-kicker {
    margin-bottom: 5px;

    color: #2563eb;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}


/* ============================================================
   COMPLETENESS CARD
   ============================================================ */

.review-completeness-card {
    margin-bottom: 26px;
    padding: 20px;

    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
}

.review-completeness-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 16px;
}

.review-completeness-header h3 {
    margin: 0;

    color: #0f172a;
    font-size: 18px;
}

.review-completeness-percent {
    color: #2563eb;
    font-size: 24px;
    font-weight: 800;
    line-height: 1;
}

.review-progress-track {
    position: relative;
    overflow: hidden;

    width: 100%;
    height: 9px;

    margin-bottom: 12px;

    background: #eaf0f6;
    border-radius: 999px;
}

.review-progress-fill {
    width: 0%;
    height: 100%;

    background: #2563eb;
    border-radius: inherit;

    transition: width 0.3s ease;
}

.review-completeness-message {
    margin: 0;

    color: #64748b;
    font-size: 12px;
    line-height: 1.5;
}



/* ============================================================
   SMART CLINICAL REVIEW / SOAP POLISH — CORE71 11-20
   ============================================================ */
.review-smart-clinical-card,
.review-soap-polish-card {
    margin-bottom: 26px;
    padding: 20px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
}
.review-smart-clinical-card h3,
.review-soap-polish-card h3 { margin: 0; color: #0f172a; font-size: 18px; }
.review-smart-disclaimer,
.review-soap-polish-card p { color: #64748b; font-size: 12px; line-height: 1.5; }
.review-smart-list { display: grid; gap: 10px; }
.review-smart-item { padding: 11px 12px; border: 1px solid #f0c77b; border-radius: 10px; background: #fffaf0; }
.review-smart-item strong { display: block; color: #694b13; font-size: 13px; }
.review-smart-item p { margin: 4px 0 0; color: #6b5a38; }
.review-smart-empty { padding: 11px 12px; border: 1px solid #b9dbc8; border-radius: 10px; background: #f4fbf7; color: #315c45; font-size: 12px; }
.review-guideline-block { margin-top: 16px; }
.review-guideline-block > strong { display: block; margin-bottom: 8px; color: #334155; font-size: 12px; }
.review-guideline-sources { display: grid; gap: 8px; }
.review-guideline-source { display: grid; gap: 2px; padding: 9px 10px; border: 1px solid #dbe7f0; border-radius: 10px; color: #1e4f7a; text-decoration: none; background: #f8fbfe; }
.review-guideline-source strong { font-size: 12px; }
.review-guideline-source span,
.review-guideline-source small { color: #64748b; font-size: 11px; line-height: 1.4; }
.review-soap-polish-card > button { min-height: 40px; }
.review-polish-preview { display: grid; gap: 10px; margin-top: 12px; }
.review-polish-item { padding: 10px; border: 1px solid #dbe3eb; border-radius: 10px; background: #fbfdff; }
.review-polish-item strong { display: block; margin-bottom: 5px; font-size: 12px; color: #334155; }
.review-polish-item p { white-space: pre-wrap; color: #334155; }
.review-polish-item button { min-height: 36px; }

/* ============================================================
   SOAP REVIEW GRID
   ============================================================ */

.review-soap-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;

    margin-bottom: 26px;
}


/* ============================================================
   SOAP REVIEW CARD
   ============================================================ */

.review-soap-card {
    min-width: 0;
    overflow: hidden;

    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}

.review-soap-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 5px 18px rgba(15, 23, 42, 0.05);
}

.review-soap-card[data-status="complete"] {
    border-color: #a7f3d0;
}

.review-soap-card[data-status="attention"] {
    border-color: #fecaca;
}

.review-soap-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;

    padding: 16px 18px;

    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.review-soap-identity {
    display: flex;
    align-items: center;
    gap: 12px;

    min-width: 0;
}

.review-soap-letter {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;
    flex: 0 0 38px;

    background: #2563eb;
    border-radius: 11px;

    color: #ffffff;
    font-size: 16px;
    font-weight: 900;
}

.review-soap-label {
    margin-bottom: 2px;

    color: #0f172a;
    font-size: 14px;
    font-weight: 800;
}


/* ============================================================
   SECTION STATUS
   ============================================================ */

.review-section-status {
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
}

.review-section-status[data-status="complete"] {
    color: #047857;
}

.review-section-status[data-status="partial"] {
    color: #c2410c;
}

.review-section-status[data-status="attention"],
.review-section-status[data-status="missing"] {
    color: #b91c1c;
}


/* ============================================================
   EDIT SECTION BUTTONS
   ============================================================ */

.review-edit-button {
    flex: 0 0 auto;

    padding: 7px 10px;

    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;

    color: #2563eb;
    cursor: pointer;

    font: inherit;
    font-size: 11px;
    font-weight: 700;

    transition:
        background 0.15s ease,
        border-color 0.15s ease;
}

.review-edit-button:hover {
    background: #eff6ff;
    border-color: #93c5fd;
}

.review-edit-button:focus-visible {
    outline: 3px solid rgba(59, 130, 246, 0.18);
    outline-offset: 2px;
}


/* ============================================================
   REVIEW CONTENT
   ============================================================ */

.review-soap-content {
    min-height: 150px;
    max-height: 390px;
    overflow-y: auto;

    padding: 18px;

    color: #334155;
    font-size: 13px;
    line-height: 1.55;
}

.review-empty-state {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 110px;

    padding: 18px;

    color: #94a3b8;
    font-size: 12px;
    text-align: center;
}


/* ============================================================
   GENERATED SUMMARY ITEMS

   Part 7C will create these dynamically.
   ============================================================ */

.review-summary-group {
    margin-bottom: 16px;
}

.review-summary-group:last-child {
    margin-bottom: 0;
}

.review-summary-title {
    margin-bottom: 6px;

    color: #0f172a;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.review-summary-value {
    color: #475569;
    overflow-wrap: anywhere;
}

.review-summary-value + .review-summary-value {
    margin-top: 4px;
}

.review-summary-list {
    margin: 5px 0 0;
    padding-left: 18px;
}

.review-summary-list li {
    margin-bottom: 4px;
}

.review-summary-problem {
    margin-bottom: 12px;
    padding: 11px 12px;

    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
}

.review-summary-problem:last-child {
    margin-bottom: 0;
}

.review-summary-problem strong {
    color: #0f172a;
}


/* ============================================================
   DOCUMENTATION CHECKS
   ============================================================ */

.review-checks-card {
    margin-bottom: 26px;
    padding: 22px;

    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
}

.review-checks-header {
    margin-bottom: 18px;
}

.review-checks-header h3 {
    margin: 0 0 5px;

    color: #0f172a;
    font-size: 18px;
}

.review-checks-header p {
    margin: 0;

    color: #64748b;
    font-size: 12px;
    line-height: 1.5;
}

.review-check-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.review-check-item {
    display: flex;
    align-items: flex-start;
    gap: 11px;

    padding: 13px 14px;

    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 11px;
}

.review-check-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 23px;
    height: 23px;
    flex: 0 0 23px;

    margin-top: 1px;

    background: #e2e8f0;
    border-radius: 50%;

    color: #64748b;
    font-size: 12px;
    font-weight: 900;
}

.review-check-item strong {
    display: block;
    margin-bottom: 2px;

    color: #0f172a;
    font-size: 12px;
}

.review-check-item p {
    margin: 0;

    color: #64748b;
    font-size: 11px;
    line-height: 1.45;
}


/* Check states */

.review-check-item[data-status="complete"] {
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.review-check-item[data-status="complete"] .review-check-icon {
    background: #dcfce7;
    color: #15803d;
}

.review-check-item[data-status="warning"],
.review-check-item[data-status="partial"] {
    background: #fff7ed;
    border-color: #fed7aa;
}

.review-check-item[data-status="warning"] .review-check-icon,
.review-check-item[data-status="partial"] .review-check-icon {
    background: #ffedd5;
    color: #c2410c;
}

.review-check-item[data-status="missing"],
.review-check-item[data-status="attention"] {
    background: #fef2f2;
    border-color: #fecaca;
}

.review-check-item[data-status="missing"] .review-check-icon,
.review-check-item[data-status="attention"] .review-check-icon {
    background: #fee2e2;
    color: #b91c1c;
}


/* ============================================================
   FINAL SOAP NOTE CARD
   ============================================================ */

.review-final-note-card {
    margin-bottom: 26px;
    padding: 22px;

    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
}

.review-final-note-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 18px;
}

.review-final-note-header h3 {
    margin: 0 0 5px;

    color: #0f172a;
    font-size: 18px;
}

.review-final-note-header p {
    max-width: 700px;
    margin: 0;

    color: #64748b;
    font-size: 12px;
    line-height: 1.5;
}


/* ============================================================
   NOTE PLACEHOLDER
   ============================================================ */

.review-note-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 190px;
    padding: 28px;

    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 12px;

    text-align: center;
}

.review-note-placeholder-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    min-width: 88px;
    height: 38px;

    margin-bottom: 12px;
    padding: 0 12px;

    background: #eff6ff;
    border-radius: 10px;

    color: #2563eb;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.08em;
}

.review-note-placeholder strong {
    margin-bottom: 5px;

    color: #334155;
    font-size: 13px;
}

.review-note-placeholder p {
    margin: 0;

    color: #94a3b8;
    font-size: 12px;
}


/* ============================================================
   GENERATED NOTE OUTPUT
   ============================================================ */

.review-note-output {
    overflow: hidden;

    border: 1px solid #dbe3ee;
    border-radius: 12px;
}

.review-note-output.hidden {
    display: none;
}

.review-note-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding: 11px 14px;

    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;

    color: #334155;
    font-size: 12px;
    font-weight: 800;
}

.review-copy-button {
    padding: 6px 10px;

    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 7px;

    color: #2563eb;
    cursor: pointer;

    font: inherit;
    font-size: 11px;
    font-weight: 700;
}

.review-copy-button:hover {
    background: #eff6ff;
    border-color: #93c5fd;
}

.review-generated-note {
    min-height: 220px;
    max-height: 600px;
    overflow: auto;

    padding: 22px;

    background: #ffffff;

    color: #1e293b;
    font-size: 13px;
    line-height: 1.65;

    white-space: pre-wrap;
    overflow-wrap: anywhere;
}


/* ============================================================
   CONFIRMATION
   ============================================================ */

.review-confirmation-card {
    margin-bottom: 24px;
    padding: 18px 20px;

    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
}

.review-confirmation-label {
    display: flex;
    align-items: flex-start;
    gap: 11px;

    color: #334155;
    cursor: pointer;

    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
}

.review-confirmation-label input {
    width: 17px;
    height: 17px;

    flex: 0 0 17px;
    margin-top: 2px;

    accent-color: #2563eb;
}

.review-confirmation-help {
    margin: 8px 0 0 28px;

    color: #94a3b8;
    font-size: 11px;
    line-height: 1.45;
}


/* ============================================================
   FINALIZE BUTTON DISABLED STATE
   ============================================================ */

#finalizeSOAPButton:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}


/* ============================================================
   RESPONSIVE — TABLET
   ============================================================ */

@media (max-width: 900px) {

    .review-soap-grid,
    .review-check-list {
        grid-template-columns: minmax(0, 1fr);
    }

    .review-final-note-header {
        flex-direction: column;
    }

}


/* ============================================================
   RESPONSIVE — MOBILE
   ============================================================ */

@media (max-width: 600px) {

    .review-context-card,
    .review-clinical-notice,
    .review-completeness-card,
    .review-checks-card,
    .review-final-note-card,
    .review-confirmation-card {
        padding: 14px;
    }

    .review-completeness-header {
        align-items: center;
    }

    .review-completeness-percent {
        font-size: 20px;
    }

    .review-soap-card-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .review-edit-button {
        width: 100%;
    }

    .review-soap-content {
        max-height: none;
    }

    .review-final-note-header .secondary-button {
        width: 100%;
    }

    .review-confirmation-help {
        margin-left: 0;
    }

}


/* ============================================================
   PRINT
   ============================================================ */

@media print {

    #reviewSection .section-navigation,
    #reviewSection .review-edit-button,
    #reviewSection #generateSOAPButton,
    #reviewSection .review-copy-button,
    #reviewSection .review-confirmation-card {
        display: none !important;
    }

    .review-context-card,
    .review-clinical-notice,
    .review-completeness-card,
    .review-soap-card,
    .review-checks-card,
    .review-final-note-card {
        box-shadow: none !important;
    }

    .review-soap-card,
    .review-check-item {
        break-inside: avoid;
    }

    .review-soap-content,
    .review-generated-note {
        max-height: none;
        overflow: visible;
    }

}


/* ============================================================
   END PART 7B — REVIEW UI
   ============================================================ */   

   /* ============================================================
   PART 8A.1 — PEDIATRIC GROWTH CARD
   ============================================================ */

.pediatric-growth-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
}


.pediatric-growth-eyebrow {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.72;
}


.pediatric-growth-title {
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
}


.pediatric-growth-context {
    margin-bottom: 5px;

    font-size: 11px;
    font-weight: 600;
    opacity: 0.72;
}


.pediatric-growth-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;

    padding: 7px 0;

    border-top: 1px solid
        rgba(15, 23, 42, 0.08);
}


.pediatric-growth-label {
    font-size: 11px;
    font-weight: 700;
}


.pediatric-growth-value {
    text-align: right;

    font-size: 11px;
    font-weight: 800;
}


.pediatric-growth-value.pending {
    max-width: 190px;

    font-size: 10px;
    font-weight: 700;
    opacity: 0.68;
}


.pediatric-growth-warning {
    margin-top: 5px;
    padding: 9px 10px;

    background: rgba(
        245,
        158,
        11,
        0.10
    );

    border: 1px solid
        rgba(
            245,
            158,
            11,
            0.28
        );

    border-radius: 8px;

    font-size: 10px;
    line-height: 1.4;
}


.pediatric-growth-reference {
    margin-top: 5px;
    padding-top: 8px;

    border-top: 1px solid
        rgba(15, 23, 42, 0.08);

    font-size: 9px;
    line-height: 1.35;
    opacity: 0.65;
}


/* ============================================================
   END PART 8A.1 — PEDIATRIC GROWTH CARD
   ============================================================ */

   /* ============================================================
   PART 8B.1 — FINAL DOCUMENT OUTPUT UI
   Medical SOAP
   ============================================================ */


/* ============================================================
   OUTPUT HOST
   ============================================================ */

.encounter8b-host {
    width: 100%;
    margin-top: 28px;
}


/* ============================================================
   MAIN PANEL
   ============================================================ */

.encounter8b-panel {
    width: 100%;
    overflow: hidden;

    background: #ffffff;

    border: 1px solid rgba(148, 163, 184, 0.28);
    border-radius: 24px;

    box-shadow:
        0 18px 50px rgba(15, 23, 42, 0.06);

    animation: encounter8bEnter 0.28s ease-out;
}


@keyframes encounter8bEnter {

    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* ============================================================
   HEADER
   ============================================================ */

.encounter8b-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;

    padding: 30px 32px 22px;
}


.encounter8b-header-text {
    min-width: 0;
}


.encounter8b-eyebrow {
    margin-bottom: 7px;

    color: #64748b;

    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;

    letter-spacing: 0.09em;
    text-transform: uppercase;
}


.encounter8b-title {
    margin: 0;

    color: #0f172a;

    font-size: clamp(25px, 2.2vw, 32px);
    font-weight: 800;
    line-height: 1.15;

    letter-spacing: -0.025em;
}


.encounter8b-description {
    max-width: 720px;

    margin: 10px 0 0;

    color: #64748b;

    font-size: 14px;
    line-height: 1.6;
}


/* ============================================================
   FINALIZED STATUS
   ============================================================ */

.encounter8b-status {
    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 34px;

    padding: 7px 13px;

    color: #15803d;
    background: #f0fdf4;

    border: 1px solid #bbf7d0;
    border-radius: 999px;

    font-size: 11px;
    font-weight: 800;
    line-height: 1;

    letter-spacing: 0.05em;
}


/* ============================================================
   ENCOUNTER METADATA
   ============================================================ */

.encounter8b-metadata {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap: 12px;

    margin: 0 32px 24px;
}


.encounter8b-metadata-item {
    display: flex;
    flex-direction: column;
    gap: 6px;

    min-width: 0;

    padding: 15px 17px;

    background: #f8fafc;

    border: 1px solid #e2e8f0;
    border-radius: 14px;
}


.encounter8b-metadata-label {
    color: #64748b;

    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;

    letter-spacing: 0.06em;
    text-transform: uppercase;
}


.encounter8b-metadata-value {
    overflow-wrap: anywhere;

    color: #0f172a;

    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
}


/* ============================================================
   ACTION BAR
   ============================================================ */

.encounter8b-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;

    padding: 20px 32px;

    background: #f8fafc;

    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}


/* ============================================================
   BUTTONS
   ============================================================ */

.encounter8b-button {
    appearance: none;
    -webkit-appearance: none;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 42px;

    padding: 10px 16px;

    color: #334155;
    background: #ffffff;

    border: 1px solid #cbd5e1;
    border-radius: 11px;

    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04);

    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;

    cursor: pointer;

    transition:
        transform 0.15s ease,
        box-shadow 0.15s ease,
        border-color 0.15s ease,
        background 0.15s ease;
}


.encounter8b-button:hover {
    background: #f8fafc;
    border-color: #94a3b8;

    box-shadow:
        0 4px 12px rgba(15, 23, 42, 0.07);

    transform: translateY(-1px);
}


.encounter8b-button:active {
    transform: translateY(0);
}


.encounter8b-button:focus-visible {
    outline: 3px solid rgba(37, 99, 235, 0.20);
    outline-offset: 2px;
}


.encounter8b-button:disabled {
    opacity: 0.65;
    cursor: default;
    transform: none;
}


/* ============================================================
   PRIMARY BUTTON
   ============================================================ */

.encounter8b-button-primary {
    color: #ffffff;
    background: #1677ff;

    border-color: #1677ff;

    box-shadow:
        0 7px 18px rgba(22, 119, 255, 0.20);
}


.encounter8b-button-primary:hover {
    color: #ffffff;
    background: #0f6fe8;

    border-color: #0f6fe8;

    box-shadow:
        0 9px 22px rgba(22, 119, 255, 0.26);
}


/* ============================================================
   PREVIEW HEADER
   ============================================================ */

.encounter8b-preview-header {
    padding: 28px 32px 18px;
}


.encounter8b-preview-title {
    margin: 0;

    color: #0f172a;

    font-size: 19px;
    font-weight: 800;
    line-height: 1.25;

    letter-spacing: -0.015em;
}


.encounter8b-preview-description {
    margin: 7px 0 0;

    color: #64748b;

    font-size: 13px;
    line-height: 1.55;
}


/* ============================================================
   DOCUMENT PREVIEW BACKGROUND
   ============================================================ */

.encounter8b-document-shell {
    padding: 0 32px 34px;

    overflow-x: auto;
}


/* ============================================================
   DOCUMENT PAGE
   ============================================================ */

.encounter8b-document {
    width: 100%;
    max-width: 920px;

    margin: 0 auto;

    padding: 38px 42px 30px;

    background: #ffffff;

    border: 1px solid #dbe3ee;
    border-radius: 16px;

    box-shadow:
        0 14px 38px rgba(15, 23, 42, 0.07);
}


/* ============================================================
   DOCUMENT TOP
   ============================================================ */

.encounter8b-document-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;

    padding-bottom: 19px;

    border-bottom: 2px solid #e2e8f0;
}


.encounter8b-document-brand {
    display: flex;
    flex-direction: column;
    gap: 3px;
}


.encounter8b-document-brand strong {
    color: #0f172a;

    font-size: 20px;
    font-weight: 850;
    line-height: 1.2;

    letter-spacing: -0.02em;
}


.encounter8b-document-brand span {
    color: #64748b;

    font-size: 11px;
    font-weight: 500;
    line-height: 1.35;
}


.encounter8b-document-finalized {
    flex: 0 0 auto;

    padding: 6px 10px;

    color: #15803d;
    background: #f0fdf4;

    border: 1px solid #bbf7d0;
    border-radius: 999px;

    font-size: 9px;
    font-weight: 800;
    line-height: 1;

    letter-spacing: 0.07em;
}


/* ============================================================
   DOCUMENT METADATA
   ============================================================ */

.encounter8b-document-meta {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap: 8px 20px;

    margin: 17px 0 25px;

    padding: 12px 14px;

    color: #475569;
    background: #f8fafc;

    border: 1px solid #e2e8f0;
    border-radius: 10px;

    font-size: 10px;
    font-weight: 600;
    line-height: 1.45;
}


.encounter8b-document-meta > div {
    min-width: 0;
    overflow-wrap: anywhere;
}


/* ============================================================
   FINAL SOAP TEXT
   ============================================================ */

.encounter8b-note-text {
    width: 100%;

    margin: 0;
    padding: 0;

    overflow: visible;

    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: normal;

    color: #1e293b;
    background: transparent;

    border: 0;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Helvetica,
        Arial,
        sans-serif;

    font-size: 13px;
    font-weight: 450;
    line-height: 1.68;

    tab-size: 4;
}


/* ============================================================
   MAKE SOAP HEADINGS STAND OUT

   Because noteText is plain text, CSS cannot independently
   target individual SUBJECTIVE / OBJECTIVE lines. The typography
   remains intentionally clean until structured rendering is
   introduced in a later module.
   ============================================================ */


/* ============================================================
   DOCUMENT FOOTER
   ============================================================ */

.encounter8b-document-footer {
    display: flex;
    flex-direction: column;
    gap: 4px;

    margin-top: 30px;
    padding-top: 14px;

    color: #94a3b8;

    border-top: 1px solid #e2e8f0;

    font-size: 9px;
    font-weight: 500;
    line-height: 1.45;
}


/* ============================================================
   RESPONSIVE — TABLET
   ============================================================ */

@media (max-width: 900px) {

    .encounter8b-header {
        padding:
            26px
            24px
            20px;
    }


    .encounter8b-metadata {
        margin:
            0
            24px
            22px;
    }


    .encounter8b-actions {
        padding:
            18px
            24px;
    }


    .encounter8b-preview-header {
        padding:
            25px
            24px
            16px;
    }


    .encounter8b-document-shell {
        padding:
            0
            24px
            28px;
    }


    .encounter8b-document {
        padding:
            32px
            30px
            26px;
    }

}


/* ============================================================
   RESPONSIVE — PHONE
   ============================================================ */

@media (max-width: 640px) {

    .encounter8b-host {
        margin-top: 20px;
    }


    .encounter8b-panel {
        border-radius: 18px;
    }


    .encounter8b-header {
        flex-direction: column;

        gap: 15px;

        padding:
            22px
            18px
            18px;
    }


    .encounter8b-status {
        align-self: flex-start;
    }


    .encounter8b-title {
        font-size: 24px;
    }


    .encounter8b-description {
        font-size: 13px;
    }


    .encounter8b-metadata {
        grid-template-columns: 1fr;

        margin:
            0
            18px
            18px;
    }


    .encounter8b-metadata-item {
        padding:
            13px
            14px;
    }


    .encounter8b-actions {
        display: grid;
        grid-template-columns: 1fr;

        padding:
            16px
            18px;
    }


    .encounter8b-button {
        width: 100%;
        min-height: 44px;
    }


    .encounter8b-preview-header {
        padding:
            22px
            18px
            15px;
    }


    .encounter8b-document-shell {
        padding:
            0
            12px
            20px;
    }


    .encounter8b-document {
        padding:
            25px
            19px
            22px;

        border-radius: 12px;
    }


    .encounter8b-document-top {
        gap: 12px;
    }


    .encounter8b-document-brand strong {
        font-size: 17px;
    }


    .encounter8b-document-meta {
        grid-template-columns: 1fr;

        gap: 5px;

        margin-bottom: 21px;
    }


    .encounter8b-note-text {
        font-size: 12px;
        line-height: 1.62;
    }

}


/* ============================================================
   VERY SMALL PHONE
   ============================================================ */

@media (max-width: 390px) {

    .encounter8b-document-finalized {
        display: none;
    }


    .encounter8b-document {
        padding:
            22px
            15px
            20px;
    }

}


/* ============================================================
   PRINT SAFETY

   Main PDF printing is handled by Part 8B's dedicated
   print window. These rules protect browser printing of
   the application itself.
   ============================================================ */

@media print {

    .encounter8b-actions,
    .encounter8b-preview-header {
        display: none !important;
    }


    .encounter8b-panel {
        border: 0;
        box-shadow: none;
    }


    .encounter8b-document-shell {
        padding: 0;
    }


    .encounter8b-document {
        max-width: none;

        padding: 0;

        border: 0;
        border-radius: 0;

        box-shadow: none;
    }

}


/* ============================================================
   ACCESSIBILITY — REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    .encounter8b-panel {
        animation: none;
    }


    .encounter8b-button {
        transition: none;
    }

}


/* ============================================================
   END PART 8B.1 — FINAL DOCUMENT OUTPUT UI
   ============================================================ */

   /* ============================================================
   PART 8A.5 — PEDIATRIC GROWTH HEADER FIX
   ============================================================ */

.pediatric-growth-card {
    padding-top: 18px;
}

.pediatric-growth-eyebrow {
    display: block;
    position: relative;
    margin: 0 0 8px 0;
    padding: 0;
    line-height: 1.25;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
    overflow: visible;
}

.pediatric-growth-title {
    margin-top: 0;
}


/* ============================================================
   END PART 8A.5 — PEDIATRIC GROWTH HEADER FIX
   ============================================================ */


/* =========================================================
   NOVU Hx PRO V2 — ACCESSIBLE SHARED VISUAL SYSTEM
   MASTER HTML/JS structure remains authoritative.
   ========================================================= */
:root{
 --nx-bg:#00182d; --nx-bg-soft:#002541; --nx-panel:#073657; --nx-panel-2:#0a4168;
 --nx-line:#267bb1; --nx-primary:#168cff; --nx-cyan:#25c5ff;
 --nx-text:#f7fbff; --nx-secondary:#c3d7e8; --nx-muted:#9eb9cf;
 --nx-white:#ffffff; --nx-ink:#0b2139; --nx-ink2:#405d79;
 --nx-shadow:0 16px 44px rgba(0,8,20,.28);
}
html[data-nx-theme="light"]{
 --nx-bg:#eef6fd; --nx-bg-soft:#e4f1fb; --nx-panel:#ffffff; --nx-panel-2:#f7fbff;
 --nx-line:#b9d8ef; --nx-text:#0b2139; --nx-secondary:#35536e; --nx-muted:#5f7c96;
 --nx-shadow:0 12px 34px rgba(17,67,110,.10);
}
body.nx-v2{
 background:linear-gradient(160deg,var(--nx-bg),var(--nx-bg-soft)) fixed!important;
 color:var(--nx-text)!important;
}
body.nx-v2 .app-header{
 position:sticky!important;top:0!important;z-index:9000!important;
 background:rgba(0,25,48,.97)!important;border-bottom:1px solid rgba(57,177,242,.28)!important;
 box-shadow:0 8px 26px rgba(0,8,20,.20)!important;
}
html[data-nx-theme="light"] body.nx-v2 .app-header{background:rgba(255,255,255,.97)!important}
body.nx-v2 .app-header .brand h1{color:var(--nx-text)!important}
body.nx-v2 .app-header .brand p{color:var(--nx-secondary)!important}
body.nx-v2 #settingsButton{
 display:grid!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;
 min-width:46px!important;min-height:42px!important;background:var(--nx-panel)!important;
 color:var(--nx-text)!important;border:1px solid var(--nx-line)!important;border-radius:12px!important;
}
body.nx-v2 .card,body.nx-v2 .panel,body.nx-v2 fieldset,
body.nx-v2 [class*="section-card"],body.nx-v2 .documentation-mode-card{
 background:var(--nx-panel)!important;color:var(--nx-text)!important;
 border-color:var(--nx-line)!important;box-shadow:var(--nx-shadow)!important;
}
body.nx-v2 h1,body.nx-v2 h2,body.nx-v2 h3,body.nx-v2 h4,body.nx-v2 strong,body.nx-v2 legend{color:var(--nx-text)!important}
body.nx-v2 p,body.nx-v2 label,body.nx-v2 small,body.nx-v2 .helper-text,
body.nx-v2 .field-description,body.nx-v2 .mode-description{color:var(--nx-secondary)!important}
body.nx-v2 input,body.nx-v2 textarea,body.nx-v2 select{
 background:var(--nx-panel-2)!important;color:var(--nx-text)!important;border-color:var(--nx-line)!important;
}
body.nx-v2 input::placeholder,body.nx-v2 textarea::placeholder{color:var(--nx-muted)!important;opacity:1!important}
body.nx-v2 input:focus,body.nx-v2 textarea:focus,body.nx-v2 select:focus{
 outline:none!important;border-color:var(--nx-cyan)!important;box-shadow:0 0 0 3px rgba(37,197,255,.16)!important
}
/* White selectable cards must always use dark readable copy. */
body.nx-v2 .documentation-mode-card,
body.nx-v2 .documentation-mode-card *,
body.nx-v2 .mode-card,
body.nx-v2 .mode-card *{
 color:var(--nx-ink)!important;
}
body.nx-v2 .documentation-mode-card p,body.nx-v2 .documentation-mode-card small,
body.nx-v2 .mode-card p,body.nx-v2 .mode-card small{color:var(--nx-ink2)!important}
body.nx-v2 .documentation-mode-card.selected,
body.nx-v2 .mode-card.selected{border-color:var(--nx-primary)!important;box-shadow:0 0 0 2px rgba(22,140,255,.18),var(--nx-shadow)!important}
body.nx-v2 .section-label,body.nx-v2 [class*="eyebrow"]{color:#5fcfff!important}

/* Settings remains the original Settings surface, with every original/dynamic feature. */
body.nx-v2 #settingsOverlay{z-index:20000!important;background:rgba(0,10,22,.76)!important;backdrop-filter:blur(10px)!important}
body.nx-v2 #settingsOverlay.hidden{display:none!important}
body.nx-v2 #settingsOverlay .settings-panel{
 background:var(--nx-bg)!important;color:var(--nx-text)!important;overflow-y:auto!important;overflow-x:hidden!important;
 box-sizing:border-box!important;
}
body.nx-v2 #settingsOverlay .settings-header{
 position:sticky!important;top:0!important;z-index:30!important;background:var(--nx-bg)!important;
 border-bottom:1px solid var(--nx-line)!important;
}
body.nx-v2 #settingsOverlay .close-settings{
 display:grid!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;
 color:var(--nx-text)!important;background:var(--nx-panel)!important;border:1px solid var(--nx-line)!important;
}
body.nx-v2 #settingsOverlay .settings-group,
body.nx-v2 #settingsOverlay .pro-settings-card,
body.nx-v2 #settingsOverlay #medicalSOAPProSettings,
body.nx-v2 #settingsOverlay #proPrivacySettings,
body.nx-v2 #settingsOverlay #msoapSignatureSettingsCard{
 color:var(--nx-text)!important;border-color:var(--nx-line)!important;background:var(--nx-panel)!important;
 box-sizing:border-box!important;max-width:100%!important;
}
body.nx-v2 #settingsOverlay input,body.nx-v2 #settingsOverlay select,body.nx-v2 #settingsOverlay textarea{
 max-width:100%!important;box-sizing:border-box!important
}
.nx-theme-settings{margin:0 0 18px;padding:16px;border:1px solid var(--nx-line);border-radius:16px;background:var(--nx-panel)}
.nx-theme-settings h3{margin:0 0 4px}.nx-theme-settings p{margin:0 0 12px}
.nx-theme-choice{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.nx-theme-choice button{min-height:42px;border-radius:11px;border:1px solid var(--nx-line);background:var(--nx-panel-2);color:var(--nx-text);font-weight:800}
.nx-theme-choice button.active{background:linear-gradient(100deg,var(--nx-primary),var(--nx-cyan));color:#fff;border-color:transparent}

/* Android/tablet accordion shells are injected around ORIGINAL nodes; handlers remain on originals. */
.nx-setting-shell{border:1px solid var(--nx-line);border-radius:15px;background:var(--nx-panel);overflow:hidden;margin:0 0 10px}
.nx-setting-shell>.nx-setting-head{width:100%;min-height:58px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;
 border:0;background:var(--nx-panel-2);color:var(--nx-text);font-weight:850;text-align:left}
.nx-setting-shell>.nx-setting-head small{display:block;color:var(--nx-secondary)!important;font-weight:500;margin-top:3px}
.nx-setting-shell>.nx-setting-body{display:none;padding:14px}
.nx-setting-shell.open>.nx-setting-body{display:block}
.nx-setting-shell.open>.nx-setting-head .nx-chevron{transform:rotate(180deg)}
.nx-chevron{transition:transform .18s ease}

/* Lock screen */
#nxLockScreen{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;padding:18px;background:linear-gradient(155deg,#001326,#00325b);color:#fff}
#nxLockScreen .nx-lock-card{width:min(100%,390px);padding:24px;box-sizing:border-box;border:1px solid #218dd2;border-radius:20px;background:#052743;box-shadow:0 28px 80px rgba(0,0,0,.45)}
#nxLockScreen h2{margin:0 0 6px;color:#fff!important}#nxLockScreen p{color:#b9d5e8!important}
#nxLockScreen input{width:100%;box-sizing:border-box;min-height:46px;margin:10px 0;border-radius:11px;border:1px solid #4da9df;background:#082f50;color:#fff;padding:0 12px}
#nxLockScreen button{width:100%;min-height:46px;border:0;border-radius:11px;background:linear-gradient(100deg,#087cff,#20bfff);color:#fff;font-weight:900}
#nxLockError{min-height:18px;color:#ffb3b8;font-size:11px;margin-top:7px}



/* DESKTOP/LAPTOP */
@media(min-width:900px){
 body.nx-v2{padding:0 22px 42px!important}
 body.nx-v2 main{max-width:1280px!important;margin:0 auto!important}
 body.nx-v2 .app-header{max-width:1500px!important;margin:0 auto!important}
 body.nx-v2 #settingsOverlay .settings-panel{width:min(92vw,1120px)!important;max-width:1120px!important;max-height:94vh!important;margin:3vh auto!important;border:1px solid var(--nx-line)!important;border-radius:20px!important;padding:0 24px 30px!important}
 body.nx-v2 #settingsOverlay .settings-header{padding-top:20px!important}
 body.nx-v2 #settingsOverlay .form-grid,body.nx-v2 #settingsOverlay .pro-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}



/* ===== NOVU Hx PRO V3 Desktop — GUIMED local access gateway ===== */
#nxAccessGate{position:fixed;inset:0;z-index:2147483500;overflow:auto;padding:28px;box-sizing:border-box;
 background:radial-gradient(circle at 15% 0,rgba(32,190,255,.22),transparent 34rem),linear-gradient(145deg,#001326,#00315a);color:#fff}
#nxAccessGate .nx-access-wrap{min-height:calc(100dvh - 56px);display:grid;grid-template-columns:minmax(340px,1fr) minmax(480px,620px);gap:7vw;align-items:center;max-width:1320px;margin:auto}
#nxAccessGate .nx-access-brand h1{font-size:clamp(52px,6vw,88px);line-height:.94;letter-spacing:-.055em;margin:0;color:#fff!important}
#nxAccessGate .nx-access-brand p{font-size:18px;max-width:520px;color:#a9cce5!important;line-height:1.55}
#nxAccessGate .nx-org-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(57,188,255,.4);border-radius:999px;padding:8px 12px;color:#b9ecff;font-size:11px;font-weight:900;letter-spacing:.09em}
#nxAccessGate .nx-org-chip:before{content:"";width:8px;height:8px;border-radius:50%;background:#27d7a3;box-shadow:0 0 12px #27d7a3}
#nxAccessGate .nx-access-card{border:1px solid rgba(55,183,255,.42);border-radius:24px;padding:28px;background:linear-gradient(155deg,rgba(5,40,70,.98),rgba(1,25,48,.99));box-shadow:0 30px 90px rgba(0,8,23,.5);backdrop-filter:blur(22px) saturate(1.1)}
#nxAccessGate .nx-logo{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(145deg,#087cff,#25c8ff);font-size:24px;font-weight:950;box-shadow:0 10px 28px rgba(10,140,255,.35)}
#nxAccessGate .nx-card-head{display:flex;gap:14px;align-items:center;margin-bottom:18px}
#nxAccessGate h2{margin:0;color:#fff!important;font-size:27px}#nxAccessGate .nx-sub{margin:4px 0 0;color:#a7c6de!important;font-size:12px}
#nxAccessGate .nx-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:5px;background:#001c34;border:1px solid rgba(52,170,237,.23);border-radius:13px;margin:18px 0}
#nxAccessGate .nx-tabs button{min-height:40px;border:0;border-radius:9px;background:transparent;color:#91b4ce;font-weight:850}
#nxAccessGate .nx-tabs button.active{background:linear-gradient(100deg,#087cff,#20bfff);color:#fff}
#nxAccessGate label{display:block;margin:12px 0 5px;color:#cce2f1!important;font-size:10px;font-weight:850}
#nxAccessGate input,#nxAccessGate select{width:100%;box-sizing:border-box;min-height:45px;padding:0 12px;border-radius:11px;border:1px solid #4c9fd5;background:#062846;color:#fff}
#nxAccessGate .nx-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
#nxAccessGate .nx-primary,#nxAccessGate .nx-guest{width:100%;min-height:47px;border-radius:11px;font-weight:900;margin-top:16px}
#nxAccessGate .nx-primary{border:0;background:linear-gradient(100deg,#087cff,#20bfff);color:#fff}
#nxAccessGate .nx-guest{border:1px solid #34bfff;background:#07355b;color:#e9faff}
#nxAccessGate .nx-guest small{display:block;color:#9fc9e5!important;margin-top:3px}
#nxAccessGate .nx-divider{display:flex;align-items:center;gap:10px;color:#7298b7;font-size:9px;margin:17px 0 0}
#nxAccessGate .nx-divider:before,#nxAccessGate .nx-divider:after{content:"";height:1px;flex:1;background:#28506f}
#nxAccessGate .nx-error{min-height:17px;margin-top:8px;color:#ffb0b6;font-size:10px}
#nxAccessGate .nx-fine{font-size:9px;color:#779ab6!important;line-height:1.5;margin-top:14px}
#nxAccessGate .nx-linklike{display:block;width:100%;margin-top:10px;background:none;border:none;color:#8fc4ee!important;font-size:11.5px;font-weight:700;text-align:center;cursor:pointer;padding:4px}
#nxAccessGate .nx-linklike:hover{text-decoration:underline;color:#b9ddfa!important}
#nxAccessGate .nx-pane-help{font-size:11.5px;color:#a9c4db!important;line-height:1.5;margin:0 0 12px}
#nxLocalIdentity{position:fixed;left:12px;bottom:12px;z-index:8500;padding:7px 10px;border:1px solid rgba(52,183,255,.34);border-radius:999px;background:rgba(0,31,58,.92);color:#bcecff;font-size:9px;font-weight:850;letter-spacing:.05em}
/* Login screen background video (cube loop). Positioned behind the brand
   text with a dark scrim so "NOVU Hx" / the description stay fully
   readable regardless of what's playing underneath -- text sits in its
   own stacking layer above the video via position+z-index, never mixed
   into the video itself (title/copy/login card are always real, live
   DOM text, matching the accessibility and i18n requirements already in
   place for this screen). */
#nxAccessGate .nx-access-brand{position:relative;isolation:isolate;overflow:hidden;border-radius:28px}
#nxAccessGate .nx-brand-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;border-radius:28px}
#nxAccessGate .nx-access-brand:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(0,10,22,.78) 0%,rgba(0,10,22,.5) 55%,rgba(0,10,22,.35) 100%)}
#nxAccessGate .nx-access-brand h1,#nxAccessGate .nx-access-brand p{position:relative;z-index:2;padding-left:28px}
#nxAccessGate .nx-access-brand h1{padding-top:28px;text-shadow:0 2px 20px rgba(0,0,0,.55)}
#nxAccessGate .nx-access-brand p{padding-bottom:28px;text-shadow:0 1px 10px rgba(0,0,0,.5)}
#nxAccessGate .nx-media-off{display:none!important}
#nxAccessGate.nx-video-off .nx-brand-video{display:none}
@media(max-width:850px){#nxAccessGate{padding:16px}#nxAccessGate .nx-access-wrap{grid-template-columns:1fr}.nx-access-brand{display:none}#nxAccessGate .nx-access-card{width:min(100%,520px);margin:auto}#nxAccessGate .nx-grid{grid-template-columns:1fr}}


/* ===== NOVU Hx PRO V4 — appearance semantics + developer credit ===== */
.nx-dev-credit{
 font-size:9px!important;line-height:1.35!important;letter-spacing:.025em!important;
 color:var(--nx-muted,#8faec9)!important;opacity:.86!important;font-weight:650!important;
}
#nxAppDeveloperCredit{
 position:fixed;right:12px;bottom:12px;z-index:8400;
 padding:6px 9px;border-radius:999px;border:1px solid rgba(80,167,220,.20);
 background:rgba(0,24,45,.72);backdrop-filter:blur(10px);pointer-events:none;
}
html[data-nx-theme="light"] #nxAppDeveloperCredit{background:rgba(255,255,255,.82);color:#536f87!important}
#nxThemeSettings .nx-theme-choice button{position:relative}
#nxThemeSettings .nx-theme-choice button[data-theme="system"]::after{
 content:"AUTO";display:inline-block;margin-left:6px;padding:2px 5px;border-radius:999px;
 font-size:7px;letter-spacing:.08em;background:rgba(255,255,255,.14);vertical-align:middle
}
/* Selection state is deliberately unmistakable in every appearance. */
#nxThemeSettings .nx-theme-choice button.active{
 background:linear-gradient(100deg,#087cff,#25c7ff)!important;color:#fff!important;
 border-color:#67d5ff!important;box-shadow:0 0 0 2px rgba(37,199,255,.18)!important
}
#nxThemeSettings .nx-theme-choice button:not(.active){
 background:transparent!important;color:var(--nx-text)!important;border:1px solid var(--nx-line)!important;
 box-shadow:none!important
}
html[data-nx-theme="light"] #nxThemeSettings .nx-theme-choice button:not(.active){
 background:#f8fbfe!important;color:#17314a!important;border-color:#9fc8e4!important
}


/* ===== NOVU Hx Desktop V5 — premium texture / navigation / section identity ===== */
html[data-nx-theme-source="system"] body.nx-v2,
html[data-nx-theme="system"] body.nx-v2{
 --nx-bg:#211a31;--nx-bg-soft:#302345;--nx-panel:#382a50;--nx-panel-2:#46355f;
 --nx-line:#826ca2;--nx-primary:#9b6cff;--nx-cyan:#d29cff;
 --nx-text:#fbf8ff;--nx-secondary:#ded2eb;--nx-muted:#bcaaca;
 background:
 radial-gradient(circle at 12% 0,rgba(165,103,255,.18),transparent 30rem),
 linear-gradient(155deg,#211a31,#35264b)!important;
}
/* subtle premium texture */
body.nx-v2:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.22;
 background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
 linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
 background-size:30px 30px}
body.nx-v2 .card,body.nx-v2 .panel,body.nx-v2 [class*="section-card"]{
 backdrop-filter:blur(14px);border-radius:20px!important;
 box-shadow:0 18px 46px rgba(0,8,20,.22),inset 0 1px 0 rgba(255,255,255,.035)!important
}
#nxHomeAccess{
 position:fixed;left:16px;top:84px;z-index:8900;display:flex;align-items:center;gap:8px;
 min-height:40px;padding:0 13px;border-radius:12px;border:1px solid var(--nx-line);
 background:var(--nx-panel);color:var(--nx-text);font-weight:850;box-shadow:0 10px 28px rgba(0,8,20,.18)
}
#nxHomeAccess .ico{font-size:16px}
#nxHomeAccess:hover{transform:translateY(-1px);border-color:var(--nx-cyan)}
.nx-section-icon{
 display:inline-grid;place-items:center;width:30px;height:30px;margin-right:8px;border-radius:9px;
 background:linear-gradient(145deg,var(--nx-primary),var(--nx-cyan));color:#fff!important;
 font-size:15px;box-shadow:0 7px 18px rgba(18,126,235,.22);vertical-align:middle
}
.nx-login-credit{border-top:1px solid rgba(120,180,220,.16);padding-top:12px!important;margin-top:14px!important;text-align:center}
@media(max-width:1050px){#nxHomeAccess{position:sticky;top:70px;left:auto;margin:10px 0;width:max-content}}


/* NOVU Hx Desktop V7 — professional access-page refinement.
   Keep the original V5 logo treatment; no experimental monogram override. */
#nxAccessGate .nx-access-brand .nx-org-chip{display:none!important}
#nxAccessGate .nx-access-brand p{
 max-width:590px!important;
 font-size:17px!important;
 line-height:1.58!important;
 color:#b8d3e7!important;
}
#nxAccessGate .nx-access-brand .nx-professional-tagline{
 margin-top:22px!important;
 padding-top:18px!important;
 border-top:1px solid rgba(96,180,230,.18);
 font-size:11px!important;
 line-height:1.45!important;
 letter-spacing:.035em!important;
 color:#8eb5d0!important;
}
#nxAccessGate .nx-access-card .nx-fine{
 color:#82a9c5!important;
 font-size:9px!important;
 line-height:1.5!important;
}
/* Keep developer attribution understated and clearly secondary. */
#nxAccessGate .nx-login-credit{opacity:.78!important;font-size:9px!important}

/* NOVU Hx V10 — approved corporate identity + reliable access navigation */
.app-header .brand-icon.novu-approved-mark{
 width:46px!important;height:46px!important;padding:0!important;overflow:hidden!important;
 border-radius:13px!important;background:#031b32!important;border:1px solid #2b83ba!important;
 box-shadow:0 8px 22px rgba(0,90,180,.22)!important;
}
.app-header .brand-icon.novu-approved-mark img{display:block;width:100%;height:100%;object-fit:cover}
.nx-header-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.nx-referral-bell{position:relative;font-size:18px;line-height:1}
.nx-referral-bell-badge{position:absolute;top:-4px;right:-6px;min-width:16px;height:16px;padding:0 3px;border-radius:999px;background:#d92d20;color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center}
.nx-access-menu-btn{
 display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 13px;
 border:1px solid var(--nx-line,#bfd2e2);border-radius:11px;
 background:var(--nx-panel,#fff);color:var(--nx-text,#10263d);
 font:inherit;font-size:12px;font-weight:850;cursor:pointer;
 box-shadow:0 7px 20px rgba(0,20,45,.08)
}
.nx-access-menu-btn:hover{border-color:var(--nx-primary,#168cff);transform:translateY(-1px)}
#nxAccessGate .nx-access-brand .nx-org-chip{display:none!important}
#nxAccessGate .nx-access-brand .nx-brand-logo{
 display:block;width:118px;height:118px;object-fit:contain;margin:0 0 24px;
 filter:drop-shadow(0 18px 34px rgba(0,126,255,.24))
}
#nxAccessGate .nx-logo{
 width:58px!important;height:58px!important;padding:0!important;overflow:hidden!important;
 background:#031b32!important;border:1px solid #2b83ba!important;box-shadow:0 10px 26px rgba(0,100,200,.22)!important
}
#nxAccessGate .nx-logo img{display:block;width:100%;height:100%;object-fit:cover}
@media(max-width:760px){.nx-access-menu-btn{font-size:0;width:42px;padding:0;justify-content:center}.nx-access-menu-btn span{font-size:17px}}


/* =========================================================
   NOVU Hx PRO V11 — CLINICAL READABILITY / HIGH CONTRAST
   Priority: text remains legible in every theme and card.
   ========================================================= */

/* Global semantic text tokens */
body.nx-v2{
 --nx-heading:#f8fbff;
 --nx-body:#d9e8f3;
 --nx-subtle:#b7cddd;
 --nx-on-light:#10263d;
 --nx-on-light-body:#405c74;
}

/* Never allow pale text on white/light clinical surfaces */
body.nx-v2 .card,
body.nx-v2 .panel,
body.nx-v2 [class*="review"],
body.nx-v2 [class*="summary"],
body.nx-v2 [class*="status"],
body.nx-v2 [class*="notice"],
body.nx-v2 [class*="alert"]{
 text-shadow:none!important;
}
body.nx-v2 .card:not(.dark-card),
body.nx-v2 .panel:not(.dark-panel){
 color:var(--nx-on-light)!important;
}
body.nx-v2 .card:not(.dark-card) h1,
body.nx-v2 .card:not(.dark-card) h2,
body.nx-v2 .card:not(.dark-card) h3,
body.nx-v2 .card:not(.dark-card) h4,
body.nx-v2 .panel:not(.dark-panel) h1,
body.nx-v2 .panel:not(.dark-panel) h2,
body.nx-v2 .panel:not(.dark-panel) h3,
body.nx-v2 .panel:not(.dark-panel) h4{
 color:#10263d!important;
}
body.nx-v2 .card:not(.dark-card) p,
body.nx-v2 .card:not(.dark-card) small,
body.nx-v2 .card:not(.dark-card) .helper-text,
body.nx-v2 .panel:not(.dark-panel) p,
body.nx-v2 .panel:not(.dark-panel) small{
 color:#46647c!important;
}

/* Explicitly repair Final Review area shown in testing */
body.nx-v2 #reviewSection,
body.nx-v2 [data-step="review"],
body.nx-v2 .review-section,
body.nx-v2 .final-review{
 color:#10263d!important;
}
body.nx-v2 #reviewSection h1, body.nx-v2 #reviewSection h2, body.nx-v2 #reviewSection h3,
body.nx-v2 [data-step="review"] h1, body.nx-v2 [data-step="review"] h2, body.nx-v2 [data-step="review"] h3,
body.nx-v2 .review-section h1, body.nx-v2 .review-section h2, body.nx-v2 .review-section h3,
body.nx-v2 .final-review h1, body.nx-v2 .final-review h2, body.nx-v2 .final-review h3{
 color:#10263d!important;
}
body.nx-v2 #reviewSection p,body.nx-v2 #reviewSection small,
body.nx-v2 [data-step="review"] p,body.nx-v2 [data-step="review"] small,
body.nx-v2 .review-section p,body.nx-v2 .review-section small,
body.nx-v2 .final-review p,body.nx-v2 .final-review small{
 color:#49677f!important;
}

/* Warning / information cards: strong readable ink */
body.nx-v2 [class*="warning"],body.nx-v2 [class*="caution"]{color:#563800!important}
body.nx-v2 [class*="warning"] p,body.nx-v2 [class*="caution"] p{color:#6a4a08!important}
body.nx-v2 [class*="info"]{--local-ink:#163c5a}
body.nx-v2 [class*="info"] p{color:#365f7c!important}

/* SYSTEM: executive graphite + steel blue + restrained cyan.
   Distinct from Dark's navy and Light's white/ice. */
html[data-nx-theme-source="system"] body.nx-v2{
 --nx-bg:#0b0e12!important;
 --nx-bg-soft:#121820!important;
 --nx-panel:#171e27!important;
 --nx-panel-2:#202a35!important;
 --nx-line:#52677a!important;
 --nx-primary:#3f91d2!important;
 --nx-cyan:#68c6d8!important;
 --nx-text:#f5f8fb!important;
 --nx-secondary:#d1dbe4!important;
 --nx-muted:#aebdca!important;
 --nx-heading:#ffffff!important;
 --nx-body:#dbe5ed!important;
 --nx-subtle:#b8c6d1!important;
 background:
   radial-gradient(circle at 15% 0,rgba(63,145,210,.14),transparent 32rem),
   linear-gradient(155deg,#080b0f,#111922 58%,#0c1117)!important;
}
html[data-nx-theme-source="system"] body.nx-v2 .app-header{
 background:rgba(9,13,18,.96)!important;
 border-bottom-color:#35495a!important;
}
html[data-nx-theme-source="system"] body.nx-v2 .nx-access-menu-btn,
html[data-nx-theme-source="system"] body.nx-v2 .icon-button{
 background:#16212b!important;color:#f5f8fb!important;border-color:#48647a!important;
}
html[data-nx-theme-source="system"] #nxThemeSettings .nx-theme-choice button[data-theme="system"]{
 background:linear-gradient(135deg,#161c23,#314657)!important;
 color:#ffffff!important;border-color:#6e8da5!important;
}

/* Dark surfaces always use light text */
html[data-nx-theme="dark"] body.nx-v2 .app-header,
html[data-nx-theme-source="system"] body.nx-v2 .app-header,
html[data-nx-theme="dark"] body.nx-v2 .dark-card,
html[data-nx-theme-source="system"] body.nx-v2 .dark-card{
 color:#f7fbff!important;
}
html[data-nx-theme="dark"] body.nx-v2 .app-header *,
html[data-nx-theme-source="system"] body.nx-v2 .app-header *{
 color:inherit;
}

/* Form controls: readable in every mode */
html[data-nx-theme="dark"] body.nx-v2 input,
html[data-nx-theme="dark"] body.nx-v2 select,
html[data-nx-theme="dark"] body.nx-v2 textarea,
html[data-nx-theme-source="system"] body.nx-v2 input,
html[data-nx-theme-source="system"] body.nx-v2 select,
html[data-nx-theme-source="system"] body.nx-v2 textarea{
 color:#f7fbff!important;background:#132b3c!important;border-color:#557b95!important;
}
html[data-nx-theme="light"] body.nx-v2 input,
html[data-nx-theme="light"] body.nx-v2 select,
html[data-nx-theme="light"] body.nx-v2 textarea{
 color:#10263d!important;background:#ffffff!important;border-color:#9ebfd7!important;
}

/* Placeholder contrast */
body.nx-v2 input::placeholder,body.nx-v2 textarea::placeholder{opacity:1!important}
html[data-nx-theme="light"] body.nx-v2 input::placeholder,
html[data-nx-theme="light"] body.nx-v2 textarea::placeholder{color:#688197!important}
html[data-nx-theme="dark"] body.nx-v2 input::placeholder,
html[data-nx-theme="dark"] body.nx-v2 textarea::placeholder,
html[data-nx-theme-source="system"] body.nx-v2 input::placeholder,
html[data-nx-theme-source="system"] body.nx-v2 textarea::placeholder{color:#a9bfd0!important}

/* =========================================================
   NOVU Hx PRO V12 FINAL — About / Mission / Vision / Founder
   ========================================================= */
#nxAboutOverlay{
 position:fixed;inset:0;z-index:12000;background:rgba(1,12,24,.72);
 backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;
 padding:28px;
}
#nxAboutOverlay[hidden]{display:none!important}
.nx-about-shell{
 width:min(1080px,96vw);max-height:90vh;overflow:auto;
 border:1px solid var(--nx-line,#4c718d);border-radius:24px;
 background:var(--nx-panel,#fff);color:var(--nx-text,#10263d);
 box-shadow:0 30px 90px rgba(0,0,0,.38);
}
.nx-about-hero{
 position:relative;padding:34px 38px 28px;
 background:linear-gradient(135deg,#031a30,#073a61 65%,#07557a);
 color:#f8fbff;border-radius:23px 23px 0 0;overflow:hidden;
}
.nx-about-hero:after{
 content:"";position:absolute;width:280px;height:280px;border-radius:50%;
 right:-90px;top:-130px;background:radial-gradient(circle,rgba(49,185,255,.24),transparent 68%);
}
.nx-about-head{display:flex;align-items:center;gap:18px;position:relative;z-index:1}
.nx-about-logo{width:70px;height:70px;object-fit:cover;border-radius:18px;border:1px solid rgba(128,220,255,.65);box-shadow:0 12px 30px rgba(0,100,210,.28)}
.nx-about-kicker{font-size:10px;font-weight:900;letter-spacing:.16em;color:#67d4ff;text-transform:uppercase}
.nx-about-title{margin:3px 0 3px;font-size:30px;line-height:1.1;color:#fff}
.nx-about-subtitle{margin:0;color:#c8e3f4;font-size:13px}
.nx-about-quote{
 margin:24px 0 0;padding:17px 20px;border-left:3px solid #36c7ff;
 background:rgba(255,255,255,.06);border-radius:0 14px 14px 0;
 color:#e8f6ff;font-size:15px;line-height:1.55;position:relative;z-index:1;
}
.nx-about-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:24px}
.nx-about-card{
 border:1px solid var(--nx-line,#c9d9e5);border-radius:18px;
 padding:22px;background:var(--nx-panel-2,#f7fbff);color:var(--nx-text,#10263d);
}
.nx-about-card h3{margin:0 0 10px;color:var(--nx-text,#10263d);font-size:17px}
.nx-about-card p{margin:0;color:var(--nx-secondary,#49677f);font-size:13px;line-height:1.65}
.nx-about-icon{
 width:36px;height:36px;display:grid;place-items:center;margin-bottom:14px;
 border-radius:11px;background:linear-gradient(145deg,#087cff,#25c2ff);
 color:#fff;font-size:17px;font-weight:900;box-shadow:0 8px 20px rgba(0,126,255,.18)
}
.nx-founder{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center}
.nx-founder-badge{
 width:62px;height:62px;border-radius:18px;display:grid;place-items:center;
 background:linear-gradient(145deg,#082b48,#0a6ca0);color:#fff;font-size:20px;font-weight:950;
 border:1px solid #45b9ee
}
.nx-founder-name{font-size:16px;font-weight:900;color:var(--nx-text,#10263d);margin-bottom:3px}
.nx-founder-meta{font-size:11px;font-weight:750;color:var(--nx-secondary,#55758d);margin-bottom:10px}
.nx-about-footer{
 display:flex;justify-content:space-between;align-items:center;gap:18px;
 padding:0 24px 24px;color:var(--nx-muted,#6d879b);font-size:10px
}
.nx-about-close{
 position:absolute;right:22px;top:20px;z-index:2;width:40px;height:40px;border-radius:12px;
 border:1px solid rgba(150,220,255,.38);background:rgba(2,26,46,.7);color:#fff;
 font-size:22px;cursor:pointer
}
.nx-about-menu-btn{
 width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
 padding:12px 14px;border:0;background:transparent;color:inherit;cursor:pointer;
 font:inherit;font-weight:800;text-align:left
}
.nx-about-menu-btn:hover{background:rgba(24,137,255,.08)}
@media(max-width:760px){
 #nxAboutOverlay{padding:10px}.nx-about-grid{grid-template-columns:1fr;padding:14px}
 .nx-founder{grid-column:auto;grid-template-columns:1fr}.nx-about-hero{padding:28px 20px 22px}
 .nx-about-title{font-size:25px}.nx-about-footer{padding:0 14px 18px;display:block}
}


/* =========================================================
   NOVU Hx PRO V13 — Readability + unmistakable ON/OFF states
   ========================================================= */

/* ABOUT: hero is always dark, therefore all text inside must remain light.
   This intentionally overrides generic high-contrast card inheritance. */
#nxAboutOverlay .nx-about-hero,
#nxAboutOverlay .nx-about-hero *{
  color:#f7fbff !important;
}
#nxAboutOverlay .nx-about-kicker{
  color:#5dd7ff !important;
}
#nxAboutOverlay .nx-about-subtitle{
  color:#c9e5f5 !important;
}
#nxAboutOverlay .nx-about-quote{
  color:#eaf8ff !important;
  background:rgba(255,255,255,.09) !important;
  border-left-color:#35c9ff !important;
}
#nxAboutOverlay .nx-about-card{
  color:var(--nx-text,#10263d) !important;
}
#nxAboutOverlay .nx-about-card h3,
#nxAboutOverlay .nx-founder-name{
  color:var(--nx-text,#10263d) !important;
}
#nxAboutOverlay .nx-about-card p,
#nxAboutOverlay .nx-founder-meta{
  color:var(--nx-secondary,#49677f) !important;
}

/* Settings clinical assistance: strong text hierarchy */
#settingsPanel .settings-section,
#settingsPanel .settings-card{
  color:var(--nx-text,#10263d);
}
#settingsPanel .settings-section h3,
#settingsPanel .settings-card h3,
#settingsPanel label{
  color:var(--nx-text,#10263d) !important;
}
#settingsPanel .settings-section p,
#settingsPanel .settings-card p{
  color:var(--nx-secondary,#49677f) !important;
}

/* Make every native checkbox/switch visually obvious.
   OFF = neutral gray. ON = saturated clinical blue with white check. */
#settingsPanel input[type="checkbox"]{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:42px !important;
  height:24px !important;
  min-width:42px !important;
  border-radius:999px !important;
  border:1px solid #9aafc0 !important;
  background:#cbd6df !important;
  position:relative !important;
  cursor:pointer !important;
  vertical-align:middle !important;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.12) !important;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease !important;
}
#settingsPanel input[type="checkbox"]::before{
  content:"" !important;
  position:absolute !important;
  width:18px !important;
  height:18px !important;
  left:2px !important;
  top:2px !important;
  border-radius:50% !important;
  background:#fff !important;
  box-shadow:0 2px 5px rgba(0,0,0,.24) !important;
  transition:transform .18s ease !important;
}
#settingsPanel input[type="checkbox"]:checked{
  background:#087cff !important;
  border-color:#087cff !important;
  box-shadow:0 0 0 3px rgba(8,124,255,.13), inset 0 1px 2px rgba(0,0,0,.08) !important;
}
#settingsPanel input[type="checkbox"]:checked::before{
  transform:translateX(18px) !important;
}
#settingsPanel input[type="checkbox"]:focus-visible{
  outline:3px solid rgba(39,173,255,.32) !important;
  outline-offset:3px !important;
}

/* If the legacy UI uses custom switch wrappers, force equivalent states. */
#settingsPanel .switch,
#settingsPanel .toggle,
#settingsPanel [class*="toggle"]{
  opacity:1 !important;
}
#settingsPanel .switch input:checked + .slider,
#settingsPanel .toggle input:checked + .slider,
#settingsPanel input:checked + [class*="slider"]{
  background:#087cff !important;
  border-color:#087cff !important;
}
#settingsPanel .switch input:not(:checked) + .slider,
#settingsPanel .toggle input:not(:checked) + .slider,
#settingsPanel input:not(:checked) + [class*="slider"]{
  background:#cbd6df !important;
  border-color:#9aafc0 !important;
}

/* Dark/System Settings retain unmistakable switch states */
html[data-nx-theme="dark"] #settingsPanel input[type="checkbox"]:not(:checked),
html[data-nx-theme-source="system"] #settingsPanel input[type="checkbox"]:not(:checked){
  background:#536575 !important;
  border-color:#8395a4 !important;
}
html[data-nx-theme="dark"] #settingsPanel input[type="checkbox"]:checked,
html[data-nx-theme-source="system"] #settingsPanel input[type="checkbox"]:checked{
  background:#21a8ff !important;
  border-color:#72d0ff !important;
}

/* Assistance rows get enough room so switches never overlap text. */
#settingsPanel .setting-row,
#settingsPanel [class*="setting-row"],
#settingsPanel [class*="option-row"]{
  gap:18px !important;
}
#settingsPanel .setting-row > input[type="checkbox"],
#settingsPanel [class*="setting-row"] > input[type="checkbox"],
#settingsPanel [class*="option-row"] > input[type="checkbox"]{
  margin-left:auto !important;
  flex:0 0 42px !important;
}

/* V14 — Remove controls: visible, consistent, clickable, no overlap */
body.nx-v2 button[data-action="remove"],
body.nx-v2 [data-remove-section],
body.nx-v2 .remove-section,
body.nx-v2 .section-remove,
body.nx-v2 .remove-button,
body.nx-v2 .btn-remove{
 position:relative!important;z-index:4!important;
 min-height:32px!important;padding:6px 10px!important;border-radius:9px!important;
 border:1px solid transparent!important;background:transparent!important;
 color:#1267e8!important;font-weight:800!important;cursor:pointer!important;
 pointer-events:auto!important;opacity:1!important;
}
body.nx-v2 button[data-action="remove"]:hover,
body.nx-v2 [data-remove-section]:hover,
body.nx-v2 .remove-section:hover,
body.nx-v2 .section-remove:hover,
body.nx-v2 .remove-button:hover,
body.nx-v2 .btn-remove:hover{
 background:#fff1f1!important;border-color:#ffb6b6!important;color:#c51e1e!important;
}
body.nx-v2 [data-nx-removed="true"]{display:none!important}

/* V15 — Professional Diagnostic Results option + Attach pairing */
.nx-diagnostic-results-v15 .nx-diagnostic-pair{
 display:grid!important;
 grid-template-columns:minmax(0,1fr) auto!important;
 align-items:stretch!important;
 gap:8px!important;
 margin:0!important;
}
.nx-diagnostic-results-v15 .nx-diagnostic-pair > button:first-child{
 width:100%!important;min-height:48px!important;margin:0!important;
}
.nx-diagnostic-results-v15 .nx-diagnostic-pair > button:last-child{
 width:auto!important;min-width:92px!important;min-height:48px!important;
 margin:0!important;padding:0 16px!important;
 border:1px solid #8ebce2!important;border-radius:11px!important;
 background:#f7fbff!important;color:#1267d8!important;font-weight:850!important;
}
.nx-diagnostic-results-v15 .nx-diagnostic-pair > button:last-child:hover{
 background:#e9f5ff!important;border-color:#168cff!important;color:#0756bd!important;
}
html[data-nx-theme="dark"] .nx-diagnostic-results-v15 .nx-diagnostic-pair > button:last-child,
html[data-nx-theme-source="system"] .nx-diagnostic-results-v15 .nx-diagnostic-pair > button:last-child{
 background:#122b3e!important;color:#8bd8ff!important;border-color:#4c7897!important;
}
.nx-diagnostic-results-v15 .nx-diagnostic-pair-extra{
 grid-template-columns:1fr!important;
}
@media(max-width:620px){
 .nx-diagnostic-results-v15 .nx-diagnostic-pair{
   grid-template-columns:minmax(0,1fr) 84px!important;gap:6px!important;
 }
 .nx-diagnostic-results-v15 .nx-diagnostic-pair > button:last-child{
   min-width:84px!important;padding:0 10px!important;
 }
}

/* V16 — Prescription PDF option beside Medication Plan */
.nx-rx-toggle{
 display:flex;align-items:center;justify-content:space-between;gap:18px;
 margin-top:14px;padding:14px 16px;border:1px solid var(--nx-line,#bfd2e2);
 border-radius:14px;background:var(--nx-panel-2,#f7fbff);
}
.nx-rx-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.nx-rx-copy strong{color:var(--nx-text,#10263d)!important;font-size:13px}
.nx-rx-copy span{color:var(--nx-secondary,#55758d)!important;font-size:11px;line-height:1.45}
.nx-rx-switch{position:relative;flex:0 0 auto}
.nx-rx-switch input{position:absolute;opacity:0;pointer-events:none}
.nx-rx-switch span{display:block;width:46px;height:26px;border-radius:999px;background:#b9c7d2;border:1px solid #91a7b8;position:relative;cursor:pointer;transition:.18s}
.nx-rx-switch span:before{content:"";position:absolute;width:20px;height:20px;left:2px;top:2px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.22);transition:.18s}
.nx-rx-switch input:checked + span{background:#087cff;border-color:#087cff;box-shadow:0 0 0 3px rgba(8,124,255,.12)}
.nx-rx-switch input:checked + span:before{transform:translateX(20px)}
.nx-rx-switch input:focus-visible + span{outline:3px solid rgba(38,170,255,.3);outline-offset:3px}

/* =========================================================
   NOVU Hx PRO V18 — Global readability + iOS-style icon polish
   Contrast is surface-aware in Light / Dark / System.
   ========================================================= */

/* Global semantic palette */
:root{
 --nx-on-light:#10243a;
 --nx-on-light-secondary:#45627d;
 --nx-on-dark:#f7fbff;
 --nx-on-dark-secondary:#c6d9e9;
 --nx-blue:#168cff;
 --nx-cyan:#38bdf8;
 --nx-warning-bg:#fff8df;
 --nx-warning-border:#e8bd42;
 --nx-warning-text:#503a00;
 --nx-info-bg:#eef7ff;
 --nx-info-border:#9bcdf2;
 --nx-info-text:#173b5b;
}

/* Never let generic inherited theme colors make light cards unreadable. */
body.nx-v2 .nx-light-surface,
body.nx-v2 .nx-light-surface *,
body.nx-v2 .card,
body.nx-v2 .card h1,
body.nx-v2 .card h2,
body.nx-v2 .card h3,
body.nx-v2 .card h4{
 color:var(--nx-on-light);
}

/* Documentation mode footer/help text on dark container */
body.nx-v2 .documentation-mode-card > p:last-child,
body.nx-v2 .documentation-mode-card .helper-text,
body.nx-v2 .documentation-mode-card .footnote,
body.nx-v2 [class*="documentation-mode"] .helper-text,
body.nx-v2 [class*="documentation-mode"] .footnote{
 color:var(--nx-on-dark-secondary)!important;
 opacity:1!important;
}

/* Broad fix for dark outer panels with explanatory copy */
body.nx-v2 .dark-panel p,
body.nx-v2 .dark-panel small,
body.nx-v2 .dark-panel .helper-text,
body.nx-v2 [class*="dark"] .helper-text{
 color:var(--nx-on-dark-secondary)!important;
 opacity:1!important;
}

/* Warning / patient-specific management callouts:
   yellow surface ALWAYS gets dark text in every theme. */
body.nx-v2 .warning,
body.nx-v2 .warning *,
body.nx-v2 .alert-warning,
body.nx-v2 .alert-warning *,
body.nx-v2 [class*="warning"],
body.nx-v2 [class*="warning"] *{
 color:var(--nx-warning-text)!important;
}
body.nx-v2 .warning,
body.nx-v2 .alert-warning,
body.nx-v2 [class*="warning"]{
 background:var(--nx-warning-bg)!important;
 border-color:var(--nx-warning-border)!important;
 opacity:1!important;
}

/* Information callouts */
body.nx-v2 .alert-info,
body.nx-v2 .alert-info *,
body.nx-v2 [class*="info-callout"],
body.nx-v2 [class*="info-callout"] *{
 color:var(--nx-info-text)!important;
}
body.nx-v2 .alert-info,
body.nx-v2 [class*="info-callout"]{
 background:var(--nx-info-bg)!important;
 border-color:var(--nx-info-border)!important;
}

/* Explicit readability for the plan area seen in V17 */
body.nx-v2 [class*="patient-specific"],
body.nx-v2 [class*="patient-specific"] *{
 color:var(--nx-warning-text)!important;
 opacity:1!important;
}
body.nx-v2 [class*="patient-specific"]{
 background:var(--nx-warning-bg)!important;
 border-color:var(--nx-warning-border)!important;
}

/* Any white / near-white clinical content panel keeps dark typography,
   even when the application shell is Dark or System. */
html[data-nx-theme="dark"] body.nx-v2 .soap-card,
html[data-nx-theme="dark"] body.nx-v2 .soap-card *,
html[data-nx-theme-source="system"] body.nx-v2 .soap-card,
html[data-nx-theme-source="system"] body.nx-v2 .soap-card *,
html[data-nx-theme="dark"] body.nx-v2 .form-section,
html[data-nx-theme="dark"] body.nx-v2 .form-section *,
html[data-nx-theme-source="system"] body.nx-v2 .form-section,
html[data-nx-theme-source="system"] body.nx-v2 .form-section *{
 color:var(--nx-on-light);
}

/* But form controls retain their own explicit legible colors */
body.nx-v2 input,
body.nx-v2 textarea,
body.nx-v2 select{
 color:#10243a!important;
 background:#fff!important;
}
body.nx-v2 input::placeholder,
body.nx-v2 textarea::placeholder{
 color:#6b8094!important;
 opacity:1!important;
}

/* iOS-inspired icon system: crisp rounded-square glyph containers */
body.nx-v2 .section-icon,
body.nx-v2 .module-icon,
body.nx-v2 .step-icon,
body.nx-v2 [class*="section-icon"],
body.nx-v2 [class*="module-icon"]{
 width:34px!important;height:34px!important;min-width:34px!important;
 display:inline-grid!important;place-items:center!important;
 border-radius:10px!important;
 background:linear-gradient(145deg,#168cff,#39bdf8)!important;
 color:#fff!important;
 border:1px solid rgba(255,255,255,.35)!important;
 box-shadow:0 5px 14px rgba(15,118,210,.22), inset 0 1px 0 rgba(255,255,255,.28)!important;
 font-weight:850!important;
}

/* Secondary icons use an iOS-like frosted tile */
body.nx-v2 .icon-button,
body.nx-v2 [class*="icon-button"]{
 border-radius:11px!important;
 border:1px solid rgba(112,148,178,.35)!important;
 box-shadow:0 3px 10px rgba(13,48,77,.10)!important;
}

/* Focus rings must remain visible in all themes */
body.nx-v2 button:focus-visible,
body.nx-v2 a:focus-visible,
body.nx-v2 input:focus-visible,
body.nx-v2 textarea:focus-visible,
body.nx-v2 select:focus-visible{
 outline:3px solid rgba(38,169,255,.45)!important;
 outline-offset:2px!important;
}

/* Small helper text minimum visibility */
body.nx-v2 small,
body.nx-v2 .helper-text,
body.nx-v2 .description,
body.nx-v2 [class*="description"]{
 opacity:1;
}

/* Mobile/tablet readability */
@media(max-width:760px){
 body.nx-v2 .helper-text,
 body.nx-v2 .description,
 body.nx-v2 [class*="description"]{
   line-height:1.5!important;
 }
 body.nx-v2 .section-icon,
 body.nx-v2 .module-icon,
 body.nx-v2 [class*="section-icon"],
 body.nx-v2 [class*="module-icon"]{
   width:36px!important;height:36px!important;min-width:36px!important;
 }
}

/* =========================================================
   NOVU Hx PRO V19 — GLOBAL SWITCH / TOGGLE ACCESSIBILITY
   Applies across the whole app and all SOAP modes/themes.
   OFF and ON must never be visually ambiguous.
   ========================================================= */

/* Native checkbox/toggle baseline everywhere except deliberate plain checkboxes */
body.nx-v2 input[type="checkbox"]:not(.nx-plain-checkbox){
  appearance:none!important;
  -webkit-appearance:none!important;
  width:46px!important;height:26px!important;min-width:46px!important;
  border-radius:999px!important;
  position:relative!important;
  vertical-align:middle!important;
  cursor:pointer!important;
  opacity:1!important;
  border:1px solid #8498aa!important;
  background:#aebbc6!important;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.18),0 1px 2px rgba(0,0,0,.08)!important;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease!important;
}
body.nx-v2 input[type="checkbox"]:not(.nx-plain-checkbox)::before{
  content:""!important;
  position:absolute!important;
  width:20px!important;height:20px!important;
  left:2px!important;top:2px!important;
  border-radius:50%!important;
  background:#fff!important;
  border:1px solid rgba(20,45,65,.12)!important;
  box-shadow:0 2px 6px rgba(0,0,0,.28)!important;
  transition:transform .16s ease!important;
}
body.nx-v2 input[type="checkbox"]:not(.nx-plain-checkbox):checked{
  background:#087cff!important;
  border-color:#0067dc!important;
  box-shadow:0 0 0 3px rgba(8,124,255,.17),inset 0 1px 2px rgba(0,0,0,.10)!important;
}
body.nx-v2 input[type="checkbox"]:not(.nx-plain-checkbox):checked::before{
  transform:translateX(20px)!important;
}
body.nx-v2 input[type="checkbox"]:not(.nx-plain-checkbox):disabled{
  opacity:.48!important;cursor:not-allowed!important;
}

/* Dark mode: OFF is graphite, ON is bright blue/cyan. */
html[data-nx-theme="dark"] body.nx-v2 input[type="checkbox"]:not(.nx-plain-checkbox):not(:checked){
  background:#465866!important;border-color:#718696!important;
}
html[data-nx-theme="dark"] body.nx-v2 input[type="checkbox"]:not(.nx-plain-checkbox):checked{
  background:#20a8ff!important;border-color:#70d0ff!important;
  box-shadow:0 0 0 3px rgba(32,168,255,.20),0 0 12px rgba(32,168,255,.20)!important;
}

/* System mode: deliberately different graphite + teal identity. */
html[data-nx-theme-source="system"] body.nx-v2 input[type="checkbox"]:not(.nx-plain-checkbox):not(:checked){
  background:#4b555d!important;border-color:#7e8b94!important;
}
html[data-nx-theme-source="system"] body.nx-v2 input[type="checkbox"]:not(.nx-plain-checkbox):checked{
  background:#00a89d!important;border-color:#49d8cc!important;
  box-shadow:0 0 0 3px rgba(0,168,157,.19),0 0 12px rgba(0,168,157,.16)!important;
}

/* Custom legacy switches/sliders across every form section */
body.nx-v2 .switch .slider,
body.nx-v2 .toggle .slider,
body.nx-v2 [class*="switch"] [class*="slider"],
body.nx-v2 [class*="toggle"] [class*="slider"]{
  opacity:1!important;
  border:1px solid #8498aa!important;
  background:#aebbc6!important;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.16)!important;
}
body.nx-v2 .switch input:checked + .slider,
body.nx-v2 .toggle input:checked + .slider,
body.nx-v2 [class*="switch"] input:checked + [class*="slider"],
body.nx-v2 [class*="toggle"] input:checked + [class*="slider"]{
  background:#087cff!important;border-color:#0067dc!important;
  box-shadow:0 0 0 3px rgba(8,124,255,.16)!important;
}
html[data-nx-theme="dark"] body.nx-v2 .switch input:checked + .slider,
html[data-nx-theme="dark"] body.nx-v2 .toggle input:checked + .slider,
html[data-nx-theme="dark"] body.nx-v2 [class*="switch"] input:checked + [class*="slider"],
html[data-nx-theme="dark"] body.nx-v2 [class*="toggle"] input:checked + [class*="slider"]{
  background:#20a8ff!important;border-color:#70d0ff!important;
}
html[data-nx-theme-source="system"] body.nx-v2 .switch input:checked + .slider,
html[data-nx-theme-source="system"] body.nx-v2 .toggle input:checked + .slider,
html[data-nx-theme-source="system"] body.nx-v2 [class*="switch"] input:checked + [class*="slider"],
html[data-nx-theme-source="system"] body.nx-v2 [class*="toggle"] input:checked + [class*="slider"]{
  background:#00a89d!important;border-color:#49d8cc!important;
}

/* Keyboard focus / touch accessibility */
body.nx-v2 input[type="checkbox"]:focus-visible{
  outline:3px solid rgba(41,174,255,.42)!important;
  outline-offset:3px!important;
}

/* Prevent toggles from fading into white cards or clipping at card edges */
body.nx-v2 label:has(> input[type="checkbox"]),
body.nx-v2 [class*="toggle"],
body.nx-v2 [class*="switch"]{
  overflow:visible!important;
}
body.nx-v2 input[type="checkbox"]{
  flex:0 0 auto!important;
  margin-left:auto;
}

/* Explicit state halo on checked toggles so ON remains obvious even at a glance */
body.nx-v2 input[type="checkbox"]:checked:not(.nx-plain-checkbox)::after{
  content:"✓"!important;
  position:absolute!important;
  left:7px!important;top:3px!important;
  color:#fff!important;
  font-size:11px!important;line-height:18px!important;font-weight:950!important;
}


/* =========================================================
   NOVU Hx PRO V20 — COMPLETE THEME CONTRAST AUDIT
   Explicit component-level colors override theme inheritance.
   ========================================================= */

/* 1. Documentation-mode safety strip: DARK surface */
body.nx-v2 .documentation-mode-safety,
html[data-nx-theme="dark"] body.nx-v2 .documentation-mode-safety,
html[data-nx-theme-source="system"] body.nx-v2 .documentation-mode-safety{
  border-top-color:#66829a!important;
  color:#e5f1fa!important;
}
body.nx-v2 .documentation-mode-safety > span{
  color:#7dd3fc!important;
}
body.nx-v2 .documentation-mode-safety p{
  color:#d7e7f3!important;
  opacity:1!important;
}

/* 2. Yellow clinical notices: LIGHT surface, always dark text */
body.nx-v2 .plan-clinical-notice,
body.nx-v2 .review-clinical-notice{
  background:#fff8df!important;
  border-color:#e7bd45!important;
  color:#3f3000!important;
}
body.nx-v2 .plan-clinical-notice strong,
body.nx-v2 .review-clinical-notice strong{
  color:#3a2a00!important;
}
body.nx-v2 .plan-clinical-notice p,
body.nx-v2 .review-clinical-notice p{
  color:#57451a!important;
  opacity:1!important;
}
body.nx-v2 .plan-notice-icon,
body.nx-v2 .review-notice-icon{
  color:#075fbd!important;
  background:#fff0b5!important;
}

/* 3. Review cards are light regardless of shell theme */
body.nx-v2 .review-context-card,
body.nx-v2 .review-completeness-card,
body.nx-v2 .review-block,
body.nx-v2 [class^="review-"][class*="-card"]{
  color:#10243a!important;
}
body.nx-v2 .review-context-card h1,
body.nx-v2 .review-context-card h2,
body.nx-v2 .review-context-card h3,
body.nx-v2 .review-context-card strong,
body.nx-v2 .review-completeness-card h1,
body.nx-v2 .review-completeness-card h2,
body.nx-v2 .review-completeness-card h3,
body.nx-v2 .review-completeness-card strong{
  color:#10243a!important;
}
body.nx-v2 .review-context-summary,
body.nx-v2 .review-completeness-message{
  color:#49657c!important;
  opacity:1!important;
}
body.nx-v2 .review-block-kicker,
body.nx-v2 .review-context-label{
  color:#155fd1!important;
}

/* 4. Plan white/light blocks */
body.nx-v2 .plan-block,
body.nx-v2 .plan-context-card,
body.nx-v2 .plan-problem-card{
  color:#10243a;
}
body.nx-v2 .plan-context-summary,
body.nx-v2 .plan-block p,
body.nx-v2 .plan-problem-card p{
  color:#49657c;
  opacity:1;
}

/* 5. Generic light cards — headings/body/helper hierarchy */
body.nx-v2 .form-card,
body.nx-v2 .form-card h1,
body.nx-v2 .form-card h2,
body.nx-v2 .form-card h3,
body.nx-v2 .form-card h4,
body.nx-v2 .section-card,
body.nx-v2 .section-card h1,
body.nx-v2 .section-card h2,
body.nx-v2 .section-card h3,
body.nx-v2 .module-card,
body.nx-v2 .module-card h1,
body.nx-v2 .module-card h2,
body.nx-v2 .module-card h3{
  color:#10243a!important;
}
body.nx-v2 .form-card p,
body.nx-v2 .section-card p,
body.nx-v2 .module-card p{
  color:#49657c;
}

/* 6. Dark application shell — loose text not sitting on a light card */
html[data-nx-theme="dark"] body.nx-v2 main > p,
html[data-nx-theme="dark"] body.nx-v2 main > section > p,
html[data-nx-theme-source="system"] body.nx-v2 main > p,
html[data-nx-theme-source="system"] body.nx-v2 main > section > p{
  color:#d3e3ef;
}

/* 7. Buttons: readable in all states */
body.nx-v2 button:not(:disabled){
  opacity:1;
}
body.nx-v2 button:disabled{
  opacity:.55;
}
body.nx-v2 .btn-primary,
body.nx-v2 button.primary,
body.nx-v2 [class*="primary-button"]{
  color:#fff!important;
}
body.nx-v2 .btn-secondary,
body.nx-v2 button.secondary{
  color:#12314c!important;
}

/* 8. Status/badge chips */
body.nx-v2 .badge,
body.nx-v2 [class*="badge"]{
  opacity:1!important;
}
body.nx-v2 .review-status-badge{
  color:#8b1e1e!important;
  background:#fff0f0!important;
  border-color:#ffb4b4!important;
}

/* 9. Labels and field help */
body.nx-v2 label{
  opacity:1!important;
}
body.nx-v2 .form-group > label,
body.nx-v2 .field-label{
  color:#17344e!important;
}
body.nx-v2 .field-help,
body.nx-v2 .form-help,
body.nx-v2 .helper-text{
  opacity:1!important;
}

/* 10. Selection highlight must not be mistaken for app text color */
::selection{
  background:#2d67d8;
  color:#fff;
}

/* 11. System theme: distinguish shell from Dark but preserve readable surfaces */
html[data-nx-theme-source="system"] body.nx-v2{
  --nx-shell-text:#f5fafc;
  --nx-shell-secondary:#c8d9df;
}
html[data-nx-theme-source="system"] body.nx-v2 .documentation-mode-safety p{
  color:#d7e9e8!important;
}

/* =========================================================
   NOVU Hx PRO V21.1 — SAFE SOAP COLOR NAVIGATION
   CSS-only enhancement built from stable V20.
   No MutationObserver / no navigation JavaScript override.
   ========================================================= */

:root{
  --soap-patient:#64748b;
  --soap-subjective:#1677e8;
  --soap-objective:#078b9f;
  --soap-assessment:#6d50d8;
  --soap-plan:#16815d;
  --soap-review:#3f55b8;
}

/* ---------- Progress icons: iOS-inspired dimensional tiles ---------- */
body.nx-v2 .progress-card .steps .step > span{
  width:31px!important;
  height:31px!important;
  min-width:31px!important;
  display:inline-grid!important;
  place-items:center!important;
  border-radius:10px!important;
  background:linear-gradient(145deg,#ffffff 0%,#edf3f8 58%,#dfe9f1 100%)!important;
  border:1px solid #ccd9e4!important;
  color:#61788e!important;
  font-weight:900!important;
  font-size:11px!important;
  line-height:1!important;
  text-shadow:0 1px 0 rgba(255,255,255,.9)!important;
  box-shadow:
    0 5px 11px rgba(28,52,76,.14),
    inset 0 1px 0 rgba(255,255,255,.98),
    inset 0 -2px 4px rgba(75,103,128,.08)!important;
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease!important;
  position:relative!important;
  overflow:hidden!important;
}
body.nx-v2 .progress-card .steps .step > span::after{
  content:""!important;
  position:absolute!important;
  left:5px!important;
  right:5px!important;
  top:3px!important;
  height:7px!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,0))!important;
  pointer-events:none!important;
}

/* Semantic color per progress step */
body.nx-v2 .progress-card .steps .step:nth-child(1){--step-accent:var(--soap-patient)}
body.nx-v2 .progress-card .steps .step:nth-child(2){--step-accent:var(--soap-subjective)}
body.nx-v2 .progress-card .steps .step:nth-child(3){--step-accent:var(--soap-objective)}
body.nx-v2 .progress-card .steps .step:nth-child(4){--step-accent:var(--soap-assessment)}
body.nx-v2 .progress-card .steps .step:nth-child(5){--step-accent:var(--soap-plan)}
body.nx-v2 .progress-card .steps .step:nth-child(6){--step-accent:var(--soap-review)}

/* Active step: unmistakable colored 3D tile */
body.nx-v2 .progress-card .steps .step.active > span{
  color:#fff!important;
  border-color:rgba(255,255,255,.50)!important;
  background:var(--step-accent)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.22)!important;
  transform:translateY(-2px) scale(1.07)!important;
  box-shadow:
    0 7px 16px rgba(15,54,90,.26),
    inset 0 2px 2px rgba(255,255,255,.36),
    inset 0 -3px 5px rgba(0,0,0,.15)!important;
}
body.nx-v2 .progress-card .steps .step.active small{
  color:var(--step-accent)!important;
  font-weight:850!important;
  opacity:1!important;
}

/* Completed steps can keep the app's own completed state while remaining legible */
body.nx-v2 .progress-card .steps .step:not(.active) small{
  opacity:1!important;
}

/* Dark/System inactive tiles: dark glass, active colors stay semantic */
html[data-nx-theme="dark"] body.nx-v2 .progress-card .steps .step:not(.active) > span,
html[data-nx-theme-source="system"] body.nx-v2 .progress-card .steps .step:not(.active) > span{
  background:linear-gradient(145deg,#1d384d,#102638)!important;
  border-color:#3f5d73!important;
  color:#d0dee8!important;
  text-shadow:none!important;
  box-shadow:0 5px 12px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.09)!important;
}

/* ---------- Permanent section identity inside the form ---------- */
/* Patient */
body.nx-v2 #patientSection{
  --soap-section-accent:var(--soap-patient);
}
/* Subjective */
body.nx-v2 #subjectiveSection{
  --soap-section-accent:var(--soap-subjective);
}
/* Objective */
body.nx-v2 #objectiveSection{
  --soap-section-accent:var(--soap-objective);
}
/* Assessment */
body.nx-v2 #assessmentSection{
  --soap-section-accent:var(--soap-assessment);
}
/* Plan */
body.nx-v2 #planSection{
  --soap-section-accent:var(--soap-plan);
}
/* Review */
body.nx-v2 #reviewSection{
  --soap-section-accent:var(--soap-review);
}

/* Color bar identifies the current SOAP family without recoloring clinical prose */
body.nx-v2 #patientSection,
body.nx-v2 #subjectiveSection,
body.nx-v2 #objectiveSection,
body.nx-v2 #assessmentSection,
body.nx-v2 #planSection,
body.nx-v2 #reviewSection{
  border-top:4px solid var(--soap-section-accent)!important;
}

/* Main section title remains readable; accent is applied to the visual marker/eyebrow */
body.nx-v2 #patientSection .section-label,
body.nx-v2 #subjectiveSection .section-label,
body.nx-v2 #objectiveSection .section-label,
body.nx-v2 #assessmentSection .section-label,
body.nx-v2 #planSection .section-label,
body.nx-v2 #reviewSection .section-label,
body.nx-v2 #assessmentSection .assessment-block-kicker,
body.nx-v2 #planSection .plan-block-kicker{
  color:var(--soap-section-accent)!important;
  opacity:1!important;
}

/* Existing section icons get semantic color + restrained iOS-style depth */
body.nx-v2 #patientSection .section-icon,
body.nx-v2 #subjectiveSection .section-icon,
body.nx-v2 #objectiveSection .section-icon,
body.nx-v2 #assessmentSection .section-icon,
body.nx-v2 #planSection .section-icon,
body.nx-v2 #reviewSection .section-icon,
body.nx-v2 #assessmentSection .assessment-subsection-icon,
body.nx-v2 #planSection .plan-context-icon{
  background:var(--soap-section-accent)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.38)!important;
  border-radius:11px!important;
  box-shadow:
    0 6px 14px rgba(20,45,70,.18),
    inset 0 1px 0 rgba(255,255,255,.38),
    inset 0 -2px 4px rgba(0,0,0,.12)!important;
}

/* Section headings: keep text high contrast in every theme */
body.nx-v2 #patientSection h1,
body.nx-v2 #patientSection h2,
body.nx-v2 #patientSection h3,
body.nx-v2 #subjectiveSection h1,
body.nx-v2 #subjectiveSection h2,
body.nx-v2 #subjectiveSection h3,
body.nx-v2 #objectiveSection h1,
body.nx-v2 #objectiveSection h2,
body.nx-v2 #objectiveSection h3,
body.nx-v2 #assessmentSection h1,
body.nx-v2 #assessmentSection h2,
body.nx-v2 #assessmentSection h3,
body.nx-v2 #planSection h1,
body.nx-v2 #planSection h2,
body.nx-v2 #planSection h3,
body.nx-v2 #reviewSection h1,
body.nx-v2 #reviewSection h2,
body.nx-v2 #reviewSection h3{
  opacity:1!important;
}

/* Responsive: same visual language, slightly smaller on phones */
@media(max-width:760px){
  body.nx-v2 .progress-card .steps .step > span{
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    border-radius:9px!important;
    font-size:10px!important;
  }
  body.nx-v2 .progress-card .steps .step.active > span{
    transform:translateY(-1px) scale(1.04)!important;
  }
}

/* V21.2 — Rx belongs visually to Medications */
body.nx-v2 #nxRxPDFToggle.nx-rx-under-medications{
  margin:10px 0 18px!important;
  border-left:4px solid var(--soap-plan,#16815d)!important;
}
body.nx-v2 #nxRxPDFToggle.nx-rx-under-medications .nx-rx-copy strong{
  font-size:13px!important;
}

/* =========================================================
   V21.3 — ONE harmonious Rx switch, directly below Add Medication
   ========================================================= */
body.nx-v2 #nxRxPDFToggle.nx-rx-directly-under-add{
  margin:10px 0 4px!important;
  padding:12px 14px!important;
  min-height:64px!important;
  border:1px solid #b9d6ea!important;
  border-left:4px solid var(--soap-plan,#16815d)!important;
  border-radius:12px!important;
  background:#f7fbfe!important;
  box-shadow:none!important;
}
body.nx-v2 #nxRxPDFToggle.nx-rx-directly-under-add .nx-rx-copy{
  padding-right:12px!important;
}
body.nx-v2 #nxRxPDFToggle.nx-rx-directly-under-add .nx-rx-copy strong{
  color:#15314b!important;
}
body.nx-v2 #nxRxPDFToggle.nx-rx-directly-under-add .nx-rx-copy span{
  color:#506d85!important;
}

/* Neutralize global checkbox-as-switch styling inside this component.
   The component owns its switch presentation. */
body.nx-v2 #nxRxPDFToggle input[type="checkbox"]{
  position:absolute!important;
  opacity:0!important;
  width:1px!important;height:1px!important;min-width:1px!important;
  margin:0!important;padding:0!important;
  appearance:none!important;-webkit-appearance:none!important;
  pointer-events:none!important;
}
body.nx-v2 #nxRxPDFToggle input[type="checkbox"]::before,
body.nx-v2 #nxRxPDFToggle input[type="checkbox"]::after{
  content:none!important;display:none!important;
}

body.nx-v2 #nxRxPDFToggle .nx-rx-switch-v213{
  position:relative!important;
  width:48px!important;height:28px!important;min-width:48px!important;
  display:block!important;
  flex:0 0 48px!important;
  cursor:pointer!important;
  overflow:visible!important;
}
body.nx-v2 #nxRxPDFToggle .nx-rx-switch-track-v213{
  position:absolute!important;inset:0!important;
  display:block!important;
  width:48px!important;height:28px!important;
  border-radius:999px!important;
  background:#aab9c5!important;
  border:1px solid #8297a8!important;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.16)!important;
  transition:.16s ease!important;
}
body.nx-v2 #nxRxPDFToggle .nx-rx-switch-track-v213::before{
  content:""!important;
  position:absolute!important;
  left:3px!important;top:3px!important;
  width:20px!important;height:20px!important;
  border-radius:50%!important;
  background:#fff!important;
  border:1px solid rgba(15,45,70,.10)!important;
  box-shadow:0 2px 6px rgba(0,0,0,.25)!important;
  transition:transform .16s ease!important;
}
body.nx-v2 #nxRxPDFToggle input:checked + .nx-rx-switch-track-v213{
  background:var(--soap-plan,#16815d)!important;
  border-color:#0e6f4d!important;
  box-shadow:0 0 0 3px rgba(22,129,93,.14),inset 0 1px 2px rgba(0,0,0,.08)!important;
}
body.nx-v2 #nxRxPDFToggle input:checked + .nx-rx-switch-track-v213::before{
  transform:translateX(20px)!important;
}
body.nx-v2 #nxRxPDFToggle .nx-rx-switch-v213:focus-within .nx-rx-switch-track-v213{
  outline:3px solid rgba(35,151,255,.30)!important;
  outline-offset:2px!important;
}

/* Dark/System: retain one control with obvious contrast */
html[data-nx-theme="dark"] body.nx-v2 #nxRxPDFToggle.nx-rx-directly-under-add{
  background:#102b3e!important;border-color:#315a72!important;border-left-color:var(--soap-plan,#16815d)!important;
}
html[data-nx-theme="dark"] body.nx-v2 #nxRxPDFToggle.nx-rx-directly-under-add .nx-rx-copy strong{
  color:#f4f9fc!important;
}
html[data-nx-theme="dark"] body.nx-v2 #nxRxPDFToggle.nx-rx-directly-under-add .nx-rx-copy span{
  color:#c5d8e5!important;
}
html[data-nx-theme-source="system"] body.nx-v2 #nxRxPDFToggle.nx-rx-directly-under-add{
  border-left-color:#00a89d!important;
}

/* =========================================================
   NOVU Hx PRO V21.4 — GLOBAL LEGIBILITY / CONTRAST LOCK
   Final cascade layer: clinical text may NEVER inherit a
   low-contrast decorative color from section/theme accents.
   ========================================================= */

/* LIGHT: all ordinary content on light surfaces */
html:not([data-nx-theme="dark"]) body.nx-v2 main,
html:not([data-nx-theme="dark"]) body.nx-v2 .main-content,
html:not([data-nx-theme="dark"]) body.nx-v2 .soap-form{
  --nx-readable-title:#102a43;
  --nx-readable-body:#35536d;
  --nx-readable-muted:#58738a;
}

/* Explicitly repair the Management by Problem family shown in the screenshot */
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection .plan-management-heading,
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection .management-heading,
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection [class*="management"] h2,
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection [class*="management"] h3,
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection [class*="management"] h4{
  color:#102a43!important;
  opacity:1!important;
  -webkit-text-fill-color:#102a43!important;
}
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection .plan-management-subtitle,
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection .management-subtitle,
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection [class*="management"] p,
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection [class*="management"] .helper-text,
html:not([data-nx-theme="dark"]) body.nx-v2 #planSection [class*="management"] .hint{
  color:#47657e!important;
  opacity:1!important;
  -webkit-text-fill-color:#47657e!important;
}

/* Global LIGHT safeguards for semantic text.
   Accent labels/badges/buttons remain excluded. */
html:not([data-nx-theme="dark"]) body.nx-v2 .form-section h1:not(.section-label),
html:not([data-nx-theme="dark"]) body.nx-v2 .form-section h2:not(.section-label),
html:not([data-nx-theme="dark"]) body.nx-v2 .form-section h3:not(.section-label),
html:not([data-nx-theme="dark"]) body.nx-v2 .form-section h4:not(.section-label),
html:not([data-nx-theme="dark"]) body.nx-v2 .section-card h1:not(.section-label),
html:not([data-nx-theme="dark"]) body.nx-v2 .section-card h2:not(.section-label),
html:not([data-nx-theme="dark"]) body.nx-v2 .section-card h3:not(.section-label),
html:not([data-nx-theme="dark"]) body.nx-v2 .section-card h4:not(.section-label){
  color:#102a43!important;
  opacity:1!important;
  -webkit-text-fill-color:#102a43!important;
}

html:not([data-nx-theme="dark"]) body.nx-v2 .form-section p:not(.badge):not(.pill),
html:not([data-nx-theme="dark"]) body.nx-v2 .section-card p:not(.badge):not(.pill),
html:not([data-nx-theme="dark"]) body.nx-v2 .helper-text,
html:not([data-nx-theme="dark"]) body.nx-v2 .field-help,
html:not([data-nx-theme="dark"]) body.nx-v2 .description,
html:not([data-nx-theme="dark"]) body.nx-v2 .subtitle{
  color:#47657e!important;
  opacity:1!important;
  -webkit-text-fill-color:#47657e!important;
}

/* DARK: force readable typography on dark surfaces */
html[data-nx-theme="dark"] body.nx-v2 .form-section h1:not(.section-label),
html[data-nx-theme="dark"] body.nx-v2 .form-section h2:not(.section-label),
html[data-nx-theme="dark"] body.nx-v2 .form-section h3:not(.section-label),
html[data-nx-theme="dark"] body.nx-v2 .form-section h4:not(.section-label),
html[data-nx-theme="dark"] body.nx-v2 .section-card h1:not(.section-label),
html[data-nx-theme="dark"] body.nx-v2 .section-card h2:not(.section-label),
html[data-nx-theme="dark"] body.nx-v2 .section-card h3:not(.section-label),
html[data-nx-theme="dark"] body.nx-v2 .section-card h4:not(.section-label){
  color:#f4f8fb!important;
  opacity:1!important;
  -webkit-text-fill-color:#f4f8fb!important;
}
html[data-nx-theme="dark"] body.nx-v2 .form-section p:not(.badge):not(.pill),
html[data-nx-theme="dark"] body.nx-v2 .section-card p:not(.badge):not(.pill),
html[data-nx-theme="dark"] body.nx-v2 .helper-text,
html[data-nx-theme="dark"] body.nx-v2 .field-help,
html[data-nx-theme="dark"] body.nx-v2 .description,
html[data-nx-theme="dark"] body.nx-v2 .subtitle{
  color:#c5d6e3!important;
  opacity:1!important;
  -webkit-text-fill-color:#c5d6e3!important;
}

/* SYSTEM gets its own high-contrast palette rather than inheriting a weak mix */
html[data-nx-theme-source="system"]:not([data-nx-theme="dark"]) body.nx-v2 .form-section h1:not(.section-label),
html[data-nx-theme-source="system"]:not([data-nx-theme="dark"]) body.nx-v2 .form-section h2:not(.section-label),
html[data-nx-theme-source="system"]:not([data-nx-theme="dark"]) body.nx-v2 .form-section h3:not(.section-label),
html[data-nx-theme-source="system"]:not([data-nx-theme="dark"]) body.nx-v2 .form-section h4:not(.section-label){
  color:#132d46!important;
  opacity:1!important;
  -webkit-text-fill-color:#132d46!important;
}
html[data-nx-theme-source="system"]:not([data-nx-theme="dark"]) body.nx-v2 .form-section p:not(.badge):not(.pill),
html[data-nx-theme-source="system"]:not([data-nx-theme="dark"]) body.nx-v2 .helper-text,
html[data-nx-theme-source="system"]:not([data-nx-theme="dark"]) body.nx-v2 .description{
  color:#405f77!important;
  opacity:1!important;
  -webkit-text-fill-color:#405f77!important;
}

/* Never allow disabled-like opacity on informational copy unless actually disabled */
body.nx-v2 .form-section :not(:disabled)[aria-disabled="false"],
body.nx-v2 .form-section .helper-text,
body.nx-v2 .form-section .description,
body.nx-v2 .form-section .subtitle{
  opacity:1!important;
}

/* =========================================================
 NOVU Hx PRO V21.5 — CONTRAST ARCHITECTURE
 Rule: semantic SOAP colors identify navigation/accent only.
 Text color is derived from the SURFACE it sits on, never from
 the SOAP section color. This is the final cascade layer.
 ========================================================= */

/* LIGHT palette — deliberately high-contrast pairs */
html[data-nx-theme="light"] body.nx-v2,
html:not([data-nx-theme]) body.nx-v2{
 --fg-strong:#0b1f33;
 --fg-body:#29465f;
 --fg-muted:#506b80;
 --fg-placeholder:#5d7487;
 --surface-main:#f4f8fc;
 --surface-card:#ffffff;
 --surface-soft:#eef5fa;
 --surface-input:#ffffff;
 --line-readable:#b8ccdc;
}

/* DARK palette */
html[data-nx-theme="dark"] body.nx-v2{
 --fg-strong:#f7fbff;
 --fg-body:#d9e7f1;
 --fg-muted:#b8ccda;
 --fg-placeholder:#9fb5c5;
 --surface-main:#071722;
 --surface-card:#0d2638;
 --surface-soft:#123247;
 --surface-input:#0b2233;
 --line-readable:#46667c;
}

/* SYSTEM palette has its own identity but the same readability discipline */
html[data-nx-theme-source="system"] body.nx-v2:not([data-force-light]){
 --fg-strong:#f8fbff;
 --fg-body:#dbe9f3;
 --fg-muted:#bbcedb;
 --fg-placeholder:#a4b9c8;
 --surface-main:#0b1118;
 --surface-card:#131c26;
 --surface-soft:#1a2733;
 --surface-input:#101a24;
 --line-readable:#526577;
}
/* When System resolves to a light document, use a neutral graphite-on-ice pair. */
html[data-nx-theme-source="system"][data-nx-theme="light"] body.nx-v2{
 --fg-strong:#101820;
 --fg-body:#30485b;
 --fg-muted:#566f82;
 --fg-placeholder:#607789;
 --surface-main:#f1f5f7;
 --surface-card:#ffffff;
 --surface-soft:#e9f0f4;
 --surface-input:#ffffff;
 --line-readable:#b8c9d4;
}

/* Core surfaces */
body.nx-v2{
 background:var(--surface-main)!important;
 color:var(--fg-body)!important;
}
body.nx-v2 .form-section,
body.nx-v2 .section-card,
body.nx-v2 .plan-block,
body.nx-v2 .plan-problem-card,
body.nx-v2 .assessment-block,
body.nx-v2 .review-card,
body.nx-v2 .module-card,
body.nx-v2 .progress-card{
 color:var(--fg-body)!important;
}

/* Typography contract:
   headings/labels = strong; prose = body; secondary metadata = muted.
   No opacity is used to manufacture muted text. */
body.nx-v2 :where(
 h1,h2,h3,h4,h5,h6,legend,
 .field-label,.input-label,.form-label,
 .plan-management-heading,.management-heading,
 .card-title,.module-title,.section-title
):not(.nx-accent-text){
 color:var(--fg-strong)!important;
 -webkit-text-fill-color:var(--fg-strong)!important;
 opacity:1!important;
 text-shadow:none!important;
}

body.nx-v2 :where(
 p,.description,.subtitle,.field-description,.field-help,.helper-text,
 .mode-description,.plan-management-subtitle,.management-subtitle,
 .clinical-copy,.supporting-copy
):not(.nx-accent-text):not(.badge):not(.pill){
 color:var(--fg-body)!important;
 -webkit-text-fill-color:var(--fg-body)!important;
 opacity:1!important;
 text-shadow:none!important;
}

body.nx-v2 :where(
 small,.muted,.meta,.hint,.optional-label,.supporting-text
):not(.nx-accent-text):not(.badge):not(.pill){
 color:var(--fg-muted)!important;
 -webkit-text-fill-color:var(--fg-muted)!important;
 opacity:1!important;
}

/* Inputs always use a foreground chosen for their own surface */
body.nx-v2 :where(input,textarea,select){
 background:var(--surface-input)!important;
 color:var(--fg-strong)!important;
 -webkit-text-fill-color:var(--fg-strong)!important;
 border-color:var(--line-readable)!important;
 opacity:1!important;
}
body.nx-v2 :where(input,textarea)::placeholder{
 color:var(--fg-placeholder)!important;
 -webkit-text-fill-color:var(--fg-placeholder)!important;
 opacity:1!important;
}

/* Explicitly kill pale inherited text in Plan/Assessment/Review containers */
body.nx-v2 :where(#planSection,#assessmentSection,#reviewSection)
 :where(h1,h2,h3,h4,h5,h6,legend,.field-label,.form-label,strong)
 :not(.section-label):not(.nx-accent-text){
 color:var(--fg-strong)!important;
 -webkit-text-fill-color:var(--fg-strong)!important;
 opacity:1!important;
}
body.nx-v2 :where(#planSection,#assessmentSection,#reviewSection)
 :where(p,.description,.subtitle,.helper-text,.field-help,.field-description)
 :not(.nx-accent-text):not(.badge):not(.pill){
 color:var(--fg-body)!important;
 -webkit-text-fill-color:var(--fg-body)!important;
 opacity:1!important;
}

/* SOAP colors are allowed ONLY on these identity elements */
body.nx-v2 :where(
 .section-label,.section-kicker,.assessment-block-kicker,.plan-block-kicker,
 .nx-soap-step.active small,.nx-soap-step-label
){
 opacity:1!important;
}
/* Information/warning cards own their text colors; never white-on-pale */
body.nx-v2 :where(.info-card,.clinical-info,.review-info,.warning-card,.clinical-warning){
 opacity:1!important;
}
body.nx-v2 :where(.info-card,.clinical-info,.review-info) :where(h1,h2,h3,h4,strong){
 color:#123653!important;-webkit-text-fill-color:#123653!important;opacity:1!important;
}
body.nx-v2 :where(.info-card,.clinical-info,.review-info) :where(p,small,.description,.helper-text){
 color:#315a76!important;-webkit-text-fill-color:#315a76!important;opacity:1!important;
}
body.nx-v2 :where(.warning-card,.clinical-warning) :where(h1,h2,h3,h4,strong){
 color:#4b3500!important;-webkit-text-fill-color:#4b3500!important;opacity:1!important;
}
body.nx-v2 :where(.warning-card,.clinical-warning) :where(p,small,.description,.helper-text){
 color:#624d16!important;-webkit-text-fill-color:#624d16!important;opacity:1!important;
}
/* Dark cards override the above with light readable pairs */
html[data-nx-theme="dark"] body.nx-v2 :where(.info-card,.clinical-info,.review-info,.warning-card,.clinical-warning) :where(h1,h2,h3,h4,strong){
 color:#f7fbff!important;-webkit-text-fill-color:#f7fbff!important;
}
html[data-nx-theme="dark"] body.nx-v2 :where(.info-card,.clinical-info,.review-info,.warning-card,.clinical-warning) :where(p,small,.description,.helper-text){
 color:#d4e3ed!important;-webkit-text-fill-color:#d4e3ed!important;
}

/* Accessibility: actual disabled controls may be visually subdued,
   but explanatory text must never inherit disabled opacity. */
body.nx-v2 :where(p,small,h1,h2,h3,h4,h5,h6,label,legend,.description,.helper-text,.field-help){
 filter:none!important;
}

/* =========================================================
 NOVU Hx PRO V21.6 — SURFACE-AWARE CONTRAST
 Root cause fixed:
 Dark/System themes can contain LIGHT cards. Text must follow
 the card surface, not the global theme.
 ========================================================= */

:root{
 --nx-light-surface-title:#0b1f33;
 --nx-light-surface-body:#29465f;
 --nx-light-surface-muted:#526d82;
 --nx-dark-surface-title:#f7fbff;
 --nx-dark-surface-body:#d9e7f1;
 --nx-dark-surface-muted:#b8ccda;
}

/* Every major light clinical surface explicitly owns dark readable typography,
   EVEN when the surrounding application is Dark or System. */
body.nx-v2 :where(
 .assessment-block,
 .assessment-problem-card,
 .assessment-clinical-notice,
 .assessment-patient-context,
 .plan-block,
 .plan-problem-card,
 .plan-context-card,
 .plan-patient-context,
 .review-card,
 .clinical-review-card,
 .patient-context-card,
 .context-card,
 .section-card.light,
 .module-card.light,
 .white-card,
 .card-white
){
 color:var(--nx-light-surface-body)!important;
}

/* Strong text on light cards */
body.nx-v2 :where(
 .assessment-block,
 .assessment-problem-card,
 .assessment-clinical-notice,
 .assessment-patient-context,
 .plan-block,
 .plan-problem-card,
 .plan-context-card,
 .plan-patient-context,
 .review-card,
 .clinical-review-card,
 .patient-context-card,
 .context-card,
 .section-card.light,
 .module-card.light,
 .white-card,
 .card-white
) :where(
 h1,h2,h3,h4,h5,h6,legend,label,strong,
 .form-label,.field-label,.input-label,
 .assessment-problem-label,.assessment-subsection-title,
 .plan-problem-title,.card-title,.module-title
):not(.section-label):not(.section-kicker):not(.assessment-block-kicker):not(.plan-block-kicker){
 color:var(--nx-light-surface-title)!important;
 -webkit-text-fill-color:var(--nx-light-surface-title)!important;
 opacity:1!important;
 text-shadow:none!important;
}

/* Normal explanatory text on light cards */
body.nx-v2 :where(
 .assessment-block,
 .assessment-problem-card,
 .assessment-clinical-notice,
 .assessment-patient-context,
 .plan-block,
 .plan-problem-card,
 .plan-context-card,
 .plan-patient-context,
 .review-card,
 .clinical-review-card,
 .patient-context-card,
 .context-card,
 .section-card.light,
 .module-card.light,
 .white-card,
 .card-white
) :where(
 p,.description,.subtitle,.field-helper,.field-help,.helper-text,
 .supporting-text,.clinical-copy,.assessment-helper,.plan-helper
):not(.badge):not(.pill){
 color:var(--nx-light-surface-body)!important;
 -webkit-text-fill-color:var(--nx-light-surface-body)!important;
 opacity:1!important;
 text-shadow:none!important;
}

/* Secondary text on light cards — still AA-readable */
body.nx-v2 :where(
 .assessment-block,
 .assessment-problem-card,
 .plan-block,
 .plan-problem-card,
 .review-card
) :where(small,.meta,.hint,.optional-label){
 color:var(--nx-light-surface-muted)!important;
 -webkit-text-fill-color:var(--nx-light-surface-muted)!important;
 opacity:1!important;
}

/* Exact Assessment surfaces visible in user's screenshot */
body.nx-v2 .assessment-clinical-notice strong,
body.nx-v2 .assessment-block-header h3,
body.nx-v2 .assessment-problem-card .form-label,
body.nx-v2 .assessment-subsection-title h4{
 color:#0b1f33!important;
 -webkit-text-fill-color:#0b1f33!important;
 opacity:1!important;
}
body.nx-v2 .assessment-clinical-notice p,
body.nx-v2 .assessment-block-header p,
body.nx-v2 .assessment-problem-card .field-helper,
body.nx-v2 .assessment-subsection-title p{
 color:#29465f!important;
 -webkit-text-fill-color:#29465f!important;
 opacity:1!important;
}

/* Attending selector wrapper is light; its label must remain dark.
   The select itself can remain dark with white text. */
body.nx-v2 .attending-selector,
body.nx-v2 .attending-physician-selector,
body.nx-v2 .supervising-physician-selector{
 color:#0b1f33!important;
}
body.nx-v2 :where(.attending-selector,.attending-physician-selector,.supervising-physician-selector) label{
 color:#0b1f33!important;
 -webkit-text-fill-color:#0b1f33!important;
 opacity:1!important;
}
body.nx-v2 :where(.attending-selector,.attending-physician-selector,.supervising-physician-selector) select{
 color:#f7fbff!important;
 -webkit-text-fill-color:#f7fbff!important;
 background:#143247!important;
}

/* Inputs with dark fills always get light text, independent of theme. */
body.nx-v2 :where(
 .assessment-problem-card,
 .assessment-block,
 .plan-block,
 .plan-problem-card
) :where(input,textarea,select).form-control{
 color:#f7fbff!important;
 -webkit-text-fill-color:#f7fbff!important;
}
body.nx-v2 :where(
 .assessment-problem-card,
 .assessment-block,
 .plan-block,
 .plan-problem-card
) :where(input,textarea).form-control::placeholder{
 color:#b8ccda!important;
 -webkit-text-fill-color:#b8ccda!important;
 opacity:1!important;
}

/* Accent colors are allowed for identity labels only. */
body.nx-v2 :where(
 .assessment-block-kicker,.plan-block-kicker,.section-kicker,.section-label
){
 opacity:1!important;
}

/* Never use opacity to fade readable clinical text. */
body.nx-v2 :where(
 .assessment-block,.assessment-problem-card,.assessment-clinical-notice,
 .plan-block,.plan-problem-card,.review-card
) :where(h1,h2,h3,h4,h5,h6,p,label,strong,small,.field-helper,.helper-text,.description,.subtitle){
 opacity:1!important;
}

/* V21.7 — Rx clinician/signature block */
.nx-rx-clinicians{
 display:grid;
 grid-template-columns:repeat(2,minmax(0,1fr));
 gap:28px;
 margin-top:34px;
 padding-top:18px;
 border-top:1px solid #d7e2eb;
 color:#17324a!important;
 break-inside:avoid;
}
.nx-rx-clinician{font-size:11px;line-height:1.45;color:#35536d!important}
.nx-rx-clinician strong{display:block;color:#102a43!important;font-size:11px!important}
.nx-rx-signature-space{height:54px;display:flex;align-items:flex-end}
.nx-rx-signature-image{display:block;max-height:50px;max-width:210px;object-fit:contain}
.nx-rx-signature-line{border-top:1px solid #17324a;margin:2px 0 6px}
@media print{
 .nx-rx-clinicians{display:grid!important;grid-template-columns:1fr 1fr!important;color:#17324a!important}
 .nx-rx-clinician,.nx-rx-clinician strong{opacity:1!important}
}


/* ============================================================
 NOVU Hx PRO V21.14 — READABILITY RESET
 One coherent rule set. No stacked V21.8–V21.13 overrides.
 ============================================================ */

:root{
  --novu-light-surface:#ffffff;
  --novu-light-text:#10243a;
  --novu-light-muted:#35536c;
  --novu-field-bg:#edf5fa;
  --novu-field-border:#6d9fbe;
  --novu-field-text:#10243a;
  --novu-placeholder:#526f86;

  --novu-dark-surface:#062846;
  --novu-dark-surface-2:#0b3555;
  --novu-dark-text:#ffffff;
  --novu-dark-muted:#d5e8f5;
  --novu-dark-field:#123a55;
  --novu-dark-field-border:#78bce6;
}

/* ---------- UNIVERSAL TEXT SAFETY ---------- */
body.nx-v2 :where(h1,h2,h3,h4,h5,h6,p,span,label,legend,small,strong,em,
  .description,.subtitle,.helper-text,.field-help,.field-helper,.hint,.meta,
  .form-label,.field-label,.input-label,.section-title,.module-title,.card-title,
  .clinical-copy,.supporting-copy,.supporting-text){
  opacity:1;
  text-shadow:none;
}

/* ---------- CLINICAL FORM: LIGHT CARDS ---------- */
/* The actual form cards are light even when the surrounding app shell is dark. */
body.nx-v2 :where(
 .form-section,.section-card,.module-card,.patient-card,.patient-context-card,
 .assessment-block,.assessment-problem-card,.assessment-clinical-notice,
 .plan-block,.plan-problem-card,.review-card,.clinical-review-card,
 .medical-record-card,.clinical-card,.white-card,.card-white
) :where(h1,h2,h3,h4,h5,h6,label,legend,strong,.form-label,.field-label,.input-label){
  color:var(--novu-light-text)!important;
  -webkit-text-fill-color:var(--novu-light-text)!important;
  opacity:1!important;
}
body.nx-v2 :where(
 .form-section,.section-card,.module-card,.patient-card,.patient-context-card,
 .assessment-block,.assessment-problem-card,.assessment-clinical-notice,
 .plan-block,.plan-problem-card,.review-card,.clinical-review-card,
 .medical-record-card,.clinical-card,.white-card,.card-white
) :where(p,small,.description,.subtitle,.helper-text,.field-help,.field-helper,.hint,.meta,.supporting-copy,.supporting-text){
  color:var(--novu-light-muted)!important;
  -webkit-text-fill-color:var(--novu-light-muted)!important;
  opacity:1!important;
}

/* ---------- EVERY DATA-ENTRY CONTROL ---------- */
/* Empty field: visible template/placeholder.
   Filled field: high-contrast real value.
   The field itself is visibly different from the form background. */
body.nx-v2 input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
body.nx-v2 textarea,
body.nx-v2 select,
body.nx-v2 [role="searchbox"],
body.nx-v2 [role="combobox"],
body.nx-v2 [contenteditable="true"]{
  background:var(--novu-field-bg)!important;
  background-color:var(--novu-field-bg)!important;
  color:var(--novu-field-text)!important;
  -webkit-text-fill-color:var(--novu-field-text)!important;
  caret-color:var(--novu-field-text)!important;
  border:1.5px solid var(--novu-field-border)!important;
  opacity:1!important;
  box-shadow:inset 0 1px 2px rgba(0,25,45,.06)!important;
}
body.nx-v2 input::placeholder,
body.nx-v2 textarea::placeholder{
  color:var(--novu-placeholder)!important;
  -webkit-text-fill-color:var(--novu-placeholder)!important;
  opacity:1!important;
}
body.nx-v2 :where(input,textarea,select,[role="searchbox"],[role="combobox"],[contenteditable="true"]):focus{
  background:#ffffff!important;
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  border-color:#087cff!important;
  outline:3px solid rgba(8,124,255,.18)!important;
  outline-offset:1px!important;
}

/* Native options/autocomplete */
body.nx-v2 select option{
  background:#ffffff!important;
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
}
body.nx-v2 :where(.assessment-smartdx-menu,.autocomplete-results,.autocomplete-menu,
 .suggestions,.suggestion-list,.search-results,.smart-search-results,.typeahead-menu,
 .lookup-results,[role="listbox"]){
  background:#ffffff!important;
  color:#10243a!important;
}
body.nx-v2 :where(.assessment-smartdx-menu,.autocomplete-results,.autocomplete-menu,
 .suggestions,.suggestion-list,.search-results,.smart-search-results,.typeahead-menu,
 .lookup-results,[role="listbox"]) :where(*){
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  opacity:1!important;
}

/* Read-only / disabled still readable */
body.nx-v2 :where(input,textarea,select)[readonly],
body.nx-v2 :where(input,textarea,select):disabled{
  background:#dce8f0!important;
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  border-color:#829fb2!important;
  opacity:1!important;
}

/* Browser autofill */
body.nx-v2 input:-webkit-autofill,
body.nx-v2 input:-webkit-autofill:hover,
body.nx-v2 input:-webkit-autofill:focus{
  -webkit-text-fill-color:#10243a!important;
  caret-color:#10243a!important;
  -webkit-box-shadow:0 0 0 1000px var(--novu-field-bg) inset!important;
}

/* ---------- ACCESS / LOGIN: EXACT ACTUAL CLASSES ---------- */
#nxAccessGate,
#nxAccessGate .nx-access-brand,
#nxAccessGate .nx-access-card{
  color:#ffffff!important;
}
#nxAccessGate .nx-access-brand h1,
#nxAccessGate .nx-access-card h2,
#nxAccessGate .nx-access-card h3,
#nxAccessGate .nx-access-brand .nx-professional-tagline,
#nxAccessGate .nx-login-credit{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}
#nxAccessGate .nx-access-brand > p:not(.nx-professional-tagline),
#nxAccessGate .nx-sub,
#nxAccessGate .nx-fine,
#nxAccessGate .nx-guest small{
  color:#d5e8f5!important;
  -webkit-text-fill-color:#d5e8f5!important;
  opacity:1!important;
}
#nxAccessGate label{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}
#nxAccessGate input,
#nxAccessGate select{
  background:#ffffff!important;
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  caret-color:#10243a!important;
  border:2px solid #77b6dc!important;
  opacity:1!important;
}
#nxAccessGate input::placeholder{
  color:#526f86!important;
  -webkit-text-fill-color:#526f86!important;
  opacity:1!important;
}
#nxAccessGate .nx-tabs button{color:#b9d7eb!important}
#nxAccessGate .nx-tabs button.active,
#nxAccessGate .nx-primary,
#nxAccessGate .nx-guest{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}
#nxAccessGate .nx-divider{color:#d5e8f5!important}

/* ---------- DARK BLUE COMPONENTS ---------- */
body.nx-v2 :where(.dark-card,.dark-surface,.nx-dark-card,.dark-panel,.clinical-dark-card,
 .rx-page-toggle,.prescription-toggle,.prescription-rx-toggle)
 :where(h1,h2,h3,h4,h5,h6,p,span,label,legend,small,strong,em,.description,.helper-text){
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}

/* ---------- KNOWN LIGHT ASSESSMENT CONTROLS ---------- */
#assessmentSection :where(.primary-diagnosis-input,.assessment-icd-input,
 .diagnostic-status-select,.problem-priority-select){
  background:var(--novu-field-bg)!important;
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  border-color:var(--novu-field-border)!important;
}
#assessmentSection :where(.primary-diagnosis-input,.assessment-icd-input)::placeholder{
  color:var(--novu-placeholder)!important;
  -webkit-text-fill-color:var(--novu-placeholder)!important;
  opacity:1!important;
}

/* ---------- NO TEXT TRANSPARENCY IN FORM/APP ---------- */
body.nx-v2 :where(
 .app-shell,.app-main,main,.form-section,.section-card,.module-card,.clinical-card,
 .patient-card,.assessment-block,.assessment-problem-card,.plan-block,.plan-problem-card,
 .review-card,#settingsOverlay,#nxAccessGate
) :where(h1,h2,h3,h4,h5,h6,p,span,label,legend,small,strong,em){
  opacity:1!important;
}

/* ============================================================
 NOVU Hx PRO V21.15 — FORM TYPOGRAPHY LOCK
 IMPORTANT:
 - DOES NOT redesign form cards, headers, status cards, section colors, icons,
   spacing, borders, or backgrounds.
 - ONLY restores readable foreground text inside the existing form UI.
 - Data-entry contrast rules from V21.14 remain.
 ============================================================ */

/* Existing LIGHT form surfaces: headings/labels must be solid dark ink. */
body.nx-v2 :where(
  .review-section,.review-panel,.review-card,.final-review,.pre-finalization,
  .pre-finalization-check,.generated-documentation,.generated-note,
  .documentation-review,.documentation-status,.status-card,.review-status-card,
  .form-section,.section-card,.module-card,.clinical-card,.patient-card,
  .assessment-block,.assessment-problem-card,.plan-block,.plan-problem-card
) :where(
  h1,h2,h3,h4,h5,h6,legend,label,strong,b,
  .title,.card-title,.section-title,.module-title,.review-title,
  .status-title,.form-label,.field-label,.input-label
){
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  opacity:1!important;
}

/* Existing LIGHT form surfaces: descriptive/body text is darker but secondary. */
body.nx-v2 :where(
  .review-section,.review-panel,.review-card,.final-review,.pre-finalization,
  .pre-finalization-check,.generated-documentation,.generated-note,
  .documentation-review,.documentation-status,.status-card,.review-status-card,
  .form-section,.section-card,.module-card,.clinical-card,.patient-card,
  .assessment-block,.assessment-problem-card,.plan-block,.plan-problem-card
) :where(
  p,small,.description,.subtitle,.helper-text,.field-help,.field-helper,
  .supporting-text,.supporting-copy,.status-description,.review-description
){
  color:#3b5870!important;
  -webkit-text-fill-color:#3b5870!important;
  opacity:1!important;
}

/* Preserve semantic status card backgrounds/icons; only make their text readable. */
body.nx-v2 :where(
 .status-card,.review-status-card,.check-card,.review-check,.validation-card,
 .warning-card,.success-card,.error-card,.info-card
) :where(h1,h2,h3,h4,h5,h6,strong,b,.title,.status-title){
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  opacity:1!important;
}
body.nx-v2 :where(
 .status-card,.review-status-card,.check-card,.review-check,.validation-card,
 .warning-card,.success-card,.error-card,.info-card
) :where(p,small,.description,.status-description,.helper-text){
  color:#35536c!important;
  -webkit-text-fill-color:#35536c!important;
  opacity:1!important;
}

/* Common review/finalization class names used by generated blocks.
   Foreground only; NO background/border/layout declarations. */
body.nx-v2 [class*="review"] :where(h1,h2,h3,h4,h5,h6,strong,b,label),
body.nx-v2 [class*="final"] :where(h1,h2,h3,h4,h5,h6,strong,b,label),
body.nx-v2 [class*="generated"] :where(h1,h2,h3,h4,h5,h6,strong,b,label){
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  opacity:1!important;
}
body.nx-v2 [class*="review"] :where(p,small,.description,.helper-text,.supporting-text),
body.nx-v2 [class*="final"] :where(p,small,.description,.helper-text,.supporting-text),
body.nx-v2 [class*="generated"] :where(p,small,.description,.helper-text,.supporting-text){
  color:#3b5870!important;
  -webkit-text-fill-color:#3b5870!important;
  opacity:1!important;
}

/* Never fade text in form/review content. */
body.nx-v2 :where(main,.app-main,.form-section,.review-section,.review-panel,
 .pre-finalization,.generated-documentation,.generated-note)
 :where(h1,h2,h3,h4,h5,h6,p,span,label,legend,small,strong,b,em){
  opacity:1!important;
}

/* ============================================================
 NOVU Hx PRO V21.16 — EXACT FORM TEXT AUDIT / FOREGROUND ONLY
 Audit finding:
 older theme-wide rules were assigning DARK-theme white text to
 .form-section descendants even when the actual component surface is WHITE.
 This final layer uses the ACTUAL FORM SURFACE, not the global theme.
 It changes foreground text only. No background/layout/border/icon changes.
 ============================================================ */

/* A. Every major FORM SECTION itself is a light clinical canvas.
   Main headings and structural headings are ALWAYS dark, regardless of
   Light / Dark / System shell. */
body.nx-v2 :where(
 #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,
 #planSection,#reviewSection
) :where(
 h1,h2,h3,h4,h5,h6,legend,
 .section-title,.module-title,.card-title,
 .assessment-subsection-title,.plan-subsection-title,
 .review-section-title,.review-soap-title,
 .review-checks-header h3,.review-final-note-header h3,
 .review-confirmation-label,.review-note-toolbar
):not(.section-label):not(.section-kicker):not(.review-block-kicker){
 color:#0b1f33!important;
 -webkit-text-fill-color:#0b1f33!important;
 opacity:1!important;
 text-shadow:none!important;
}

/* B. Labels / field names / strong clinical text on the light form. */
body.nx-v2 :where(
 #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,
 #planSection,#reviewSection
) :where(
 label,legend,strong,b,
 .form-label,.field-label,.input-label,.assessment-problem-label,
 .plan-problem-title,.review-check-item strong,.review-note-placeholder strong
):not(.button):not(.badge):not(.pill){
 color:#10243a!important;
 -webkit-text-fill-color:#10243a!important;
 opacity:1!important;
 text-shadow:none!important;
}

/* C. Explanatory prose on the light form. */
body.nx-v2 :where(
 #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,
 #planSection,#reviewSection
) :where(
 p,.description,.subtitle,.helper-text,.field-help,.field-helper,
 .field-description,.supporting-text,.supporting-copy,
 .review-checks-header p,.review-final-note-header p,
 .review-check-item p,.review-confirmation-help,
 .review-note-placeholder p
):not(.badge):not(.pill){
 color:#35536c!important;
 -webkit-text-fill-color:#35536c!important;
 opacity:1!important;
 text-shadow:none!important;
}

/* D. Exact PRE-FINALIZATION block from the user's screenshot. */
body.nx-v2 #reviewSection .review-checks-card{
 color:#10243a!important;
}
body.nx-v2 #reviewSection .review-checks-card .review-checks-header h3{
 color:#0b1f33!important;
 -webkit-text-fill-color:#0b1f33!important;
 opacity:1!important;
}
body.nx-v2 #reviewSection .review-checks-card .review-checks-header p{
 color:#35536c!important;
 -webkit-text-fill-color:#35536c!important;
 opacity:1!important;
}
body.nx-v2 #reviewSection .review-checks-card .review-check-item strong{
 color:#10243a!important;
 -webkit-text-fill-color:#10243a!important;
 opacity:1!important;
}
body.nx-v2 #reviewSection .review-checks-card .review-check-item p{
 color:#45627a!important;
 -webkit-text-fill-color:#45627a!important;
 opacity:1!important;
}

/* E. Exact GENERATED DOCUMENTATION block from the user's screenshot. */
body.nx-v2 #reviewSection .review-final-note-card{
 color:#10243a!important;
}
body.nx-v2 #reviewSection .review-final-note-card .review-final-note-header h3{
 color:#0b1f33!important;
 -webkit-text-fill-color:#0b1f33!important;
 opacity:1!important;
}
body.nx-v2 #reviewSection .review-final-note-card .review-final-note-header p,
body.nx-v2 #reviewSection .review-final-note-card .review-note-placeholder p{
 color:#35536c!important;
 -webkit-text-fill-color:#35536c!important;
 opacity:1!important;
}
body.nx-v2 #reviewSection .review-final-note-card .review-note-placeholder strong{
 color:#10243a!important;
 -webkit-text-fill-color:#10243a!important;
 opacity:1!important;
}

/* F. KICKERS remain accent-colored but fully opaque; these are identity text,
   not washed-out body text. */
body.nx-v2 :where(
 #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,
 #planSection,#reviewSection
) :where(
 .section-label,.section-kicker,.review-block-kicker,
 .assessment-block-kicker,.plan-block-kicker
){
 opacity:1!important;
 -webkit-text-fill-color:currentColor!important;
}

/* G. STATUS CARDS: preserve their existing green/orange/red backgrounds.
   Only foreground is locked to readable dark ink. */
body.nx-v2 #reviewSection .review-check-item :where(strong,p){
 opacity:1!important;
 text-shadow:none!important;
}

/* H. Controls are NOT recolored by the heading audit.
   Existing V21.14 data-entry contrast remains responsible for their surface/text. */

/* ============================================================
 NOVU Hx PRO V21.17 — EXACT COMPONENT SURFACE CONTRAST
 Foreground-only repair for the exact components shown in audit/screenshots.
 The app theme must NEVER turn text pale inside these light components.
 ============================================================ */

/* DOCUMENTATION MODE — four white cards */
body.nx-v2 .documentation-mode-content > strong{
  color:#081a2e!important;
  -webkit-text-fill-color:#081a2e!important;
  opacity:1!important;
}
body.nx-v2 .documentation-mode-content > p{
  color:#334f68!important;
  -webkit-text-fill-color:#334f68!important;
  opacity:1!important;
}
body.nx-v2 .documentation-mode-tags span{
  color:#18344d!important;
  -webkit-text-fill-color:#18344d!important;
  opacity:1!important;
}
body.nx-v2 .documentation-mode-option > input:checked + .documentation-mode-content
.documentation-mode-tags span{
  color:#123f84!important;
  -webkit-text-fill-color:#123f84!important;
}
body.nx-v2 .documentation-mode-summary strong{
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  opacity:1!important;
}
body.nx-v2 .documentation-mode-summary p{
  color:#35536c!important;
  -webkit-text-fill-color:#35536c!important;
  opacity:1!important;
}

/* CLINICAL CONTEXT — exact light card */
body.nx-v2 .clinical-context-card .section-label{
  color:#1769aa!important;
  -webkit-text-fill-color:#1769aa!important;
  opacity:1!important;
}
body.nx-v2 .clinical-context-heading h4{
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  opacity:1!important;
}
body.nx-v2 .clinical-context-heading p:not(.section-label){
  color:#35536c!important;
  -webkit-text-fill-color:#35536c!important;
  opacity:1!important;
}
body.nx-v2 .clinical-context-card .context-summary-label{
  color:#48637a!important;
  -webkit-text-fill-color:#48637a!important;
  opacity:1!important;
}
body.nx-v2 .clinical-context-card .context-summary-item strong{
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  opacity:1!important;
}
body.nx-v2 .clinical-context-card .context-engine-note strong{
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  opacity:1!important;
}
body.nx-v2 .clinical-context-card .context-engine-note p{
  color:#35536c!important;
  -webkit-text-fill-color:#35536c!important;
  opacity:1!important;
}
body.nx-v2 .clinical-context-card .context-status-badge{
  color:#075da8!important;
  -webkit-text-fill-color:#075da8!important;
  opacity:1!important;
}

/* Every section kicker/header that lives on a WHITE form surface */
body.nx-v2 :where(
 #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection
) :where(
 .section-label,.section-kicker,.assessment-block-kicker,.plan-block-kicker,
 .review-block-kicker,.clinical-context-badge,.assessment-context-label,
 .plan-context-label,.review-context-label
){
  color:#1769aa!important;
  -webkit-text-fill-color:#1769aa!important;
  opacity:1!important;
  text-shadow:none!important;
}

/* Context cards repeated in Assessment / Plan / Review */
body.nx-v2 :where(.assessment-context-card,.plan-context-card,.review-context-card)
 :where(h1,h2,h3,h4,strong,.assessment-context-label,.plan-context-label,.review-context-label){
  color:#10243a!important;
  -webkit-text-fill-color:#10243a!important;
  opacity:1!important;
}
body.nx-v2 :where(.assessment-context-card,.plan-context-card,.review-context-card)
 :where(p,.assessment-context-summary,.plan-context-summary,.review-context-summary){
  color:#35536c!important;
  -webkit-text-fill-color:#35536c!important;
  opacity:1!important;
}

/* Important: theme rules cannot fade these exact light-surface descendants. */
body.nx-v2 :where(
 .documentation-mode-content,.documentation-mode-summary,.clinical-context-card,
 .assessment-context-card,.plan-context-card,.review-context-card,
 .review-checks-card,.review-final-note-card
) :where(h1,h2,h3,h4,h5,h6,p,span,strong,label,small){
  opacity:1!important;
  text-shadow:none!important;
}

/* ============================================================
 NOVU Hx PRO V21.18 — ABOUT NOVU HX HEADER CONTRAST
 Exact dark-surface repair. Foreground only.
 ============================================================ */

/* The About modal hero/header is dark blue: every text element in that
   dark hero must be white or bright cyan, never dark theme ink. */
body.nx-v2 :where(
 .about-hero,.about-header,.about-modal-header,.about-novu-hero,
 .nx-about-hero,.nx-about-header,.about-banner
) :where(h1,h2,h3,h4,h5,h6,strong,b){
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
  text-shadow:none!important;
}
body.nx-v2 :where(
 .about-hero,.about-header,.about-modal-header,.about-novu-hero,
 .nx-about-hero,.nx-about-header,.about-banner
) :where(p,span,small,.subtitle,.description,.tagline,.about-subtitle){
  color:#d9efff!important;
  -webkit-text-fill-color:#d9efff!important;
  opacity:1!important;
  text-shadow:none!important;
}
body.nx-v2 :where(
 .about-hero,.about-header,.about-modal-header,.about-novu-hero,
 .nx-about-hero,.nx-about-header,.about-banner
) :where(.eyebrow,.kicker,.section-label,.about-kicker){
  color:#52d4ff!important;
  -webkit-text-fill-color:#52d4ff!important;
  opacity:1!important;
}

/* Quote/callout inside the dark About header */
body.nx-v2 :where(
 .about-hero,.about-header,.about-modal-header,.about-novu-hero,
 .nx-about-hero,.nx-about-header,.about-banner
) :where(blockquote,.quote,.about-quote,.hero-quote){
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}
body.nx-v2 :where(
 .about-hero,.about-header,.about-modal-header,.about-novu-hero,
 .nx-about-hero,.nx-about-header,.about-banner
) :where(blockquote,.quote,.about-quote,.hero-quote) *{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}

/* Exact source fallbacks for the About modal container.
   Only the TOP dark region is targeted; white mission/vision cards remain untouched. */
body.nx-v2 #aboutOverlay :where(
 .about-hero,.about-header,.about-modal-header,.about-novu-hero,
 .nx-about-hero,.nx-about-header,.about-banner
) *{
  opacity:1!important;
}

/* Known heading phrase containers when markup uses generic classes */
body.nx-v2 #aboutOverlay :where(.about-title,.about-main-title){
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}
body.nx-v2 #aboutOverlay :where(.about-tagline,.about-hero-copy,.about-quote){
  color:#d9efff!important;
  -webkit-text-fill-color:#d9efff!important;
  opacity:1!important;
}

/* ============================================================
 NOVU Hx PRO V21.19 — ABOUT EXACT-ID FIX
 Source uses #nxAboutOverlay (not #aboutOverlay).
 No body/theme dependency. Exact classes + both CSS text channels.
 ============================================================ */
#nxAboutOverlay .nx-about-hero .nx-about-title{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}
#nxAboutOverlay .nx-about-hero .nx-about-subtitle{
  color:#d9efff!important;
  -webkit-text-fill-color:#d9efff!important;
  opacity:1!important;
}
#nxAboutOverlay .nx-about-hero .nx-about-kicker{
  color:#52d4ff!important;
  -webkit-text-fill-color:#52d4ff!important;
  opacity:1!important;
}
#nxAboutOverlay .nx-about-hero .nx-about-quote{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}
#nxAboutOverlay .nx-about-hero .nx-about-quote *{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}

/* ============================================================
 NOVU Hx PRO V21.20 — DOCUMENTATION CARDS HARD CONTRAST
 Exact visible bug: pale descriptive text on WHITE cards.
 This layer intentionally overrides ALL theme inheritance for
 documentation-mode cards and selected-summary text.
 ============================================================ */

/* CARD TITLES */
body .documentation-mode-option .documentation-mode-content > strong,
body .documentation-mode-option .documentation-mode-content strong:first-of-type{
  color:#07192c !important;
  -webkit-text-fill-color:#07192c !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}

/* CARD DESCRIPTIONS — THIS IS THE TEXT CIRCLED IN THE SCREENSHOT */
body .documentation-mode-option .documentation-mode-content > p,
body .documentation-mode-option .documentation-mode-content p{
  color:#284861 !important;
  -webkit-text-fill-color:#284861 !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  font-weight:500 !important;
}

/* TAGS / PILLS */
body .documentation-mode-option .documentation-mode-tags,
body .documentation-mode-option .documentation-mode-tags span{
  color:#102b43 !important;
  -webkit-text-fill-color:#102b43 !important;
  opacity:1 !important;
}

/* SELECTED SUMMARY UNDER THE FOUR CARDS */
body .documentation-mode-summary strong,
body .documentation-mode-summary p,
body .documentation-mode-summary span{
  color:#17344d !important;
  -webkit-text-fill-color:#17344d !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}
body .documentation-mode-summary strong{
  color:#07192c !important;
  -webkit-text-fill-color:#07192c !important;
}

/* Nuclear guard limited ONLY to text descendants of the white mode cards.
   Prevents Dark/System/Light rules from fading them again. */
body .documentation-mode-option .documentation-mode-content :where(p,strong,b,small,label){
  opacity:1 !important;
  text-shadow:none !important;
}

/* V21.21 — MAXIMUM READABILITY ON LIGHT DOCUMENTATION CARDS
   User-requested stronger contrast. */
html body .documentation-mode-option .documentation-mode-content > p,
html body .documentation-mode-option .documentation-mode-content p{
  color:#07111f!important;
  -webkit-text-fill-color:#07111f!important;
  opacity:1!important;
  font-weight:600!important;
  filter:none!important;
  text-shadow:none!important;
}
html body .documentation-mode-option .documentation-mode-content > strong,
html body .documentation-mode-option .documentation-mode-content strong{
  color:#000000!important;
  -webkit-text-fill-color:#000000!important;
  opacity:1!important;
  font-weight:800!important;
}
html body .documentation-mode-summary p,
html body .documentation-mode-summary span{
  color:#0b1b2b!important;
  -webkit-text-fill-color:#0b1b2b!important;
  opacity:1!important;
  font-weight:600!important;
}
html body .documentation-mode-summary strong{
  color:#000000!important;
  -webkit-text-fill-color:#000000!important;
  opacity:1!important;
  font-weight:800!important;
}

/* ============================================================
 V21.22 — FORCE VISIBLE TEXT ON DOCUMENTATION MODE LIGHT SURFACES
 Light card = near-black text. No exceptions from theme inheritance.
 ============================================================ */

html body .documentation-mode-option,
html body .documentation-mode-content{
  --fg:#07111f !important;
  --fg-strong:#000000 !important;
  --fg-muted:#16283a !important;
  --text:#07111f !important;
  --text-primary:#000000 !important;
  --text-secondary:#16283a !important;
  --muted:#16283a !important;
}

/* Every ordinary text node inside the four light cards */
html body .documentation-mode-option .documentation-mode-content :where(
  p,span,small,div,label
){
  color:#07111f !important;
  -webkit-text-fill-color:#07111f !important;
  opacity:1 !important;
  font-weight:650 !important;
  filter:none !important;
  text-shadow:none !important;
  mix-blend-mode:normal !important;
}

/* Card headings */
html body .documentation-mode-option .documentation-mode-content :where(
  strong,b,h1,h2,h3,h4,h5,h6
){
  color:#000000 !important;
  -webkit-text-fill-color:#000000 !important;
  opacity:1 !important;
  font-weight:800 !important;
  filter:none !important;
  text-shadow:none !important;
}

/* Descriptive paragraph: explicit maximum contrast */
html body .documentation-mode-option .documentation-mode-content > p,
html body .documentation-mode-option .documentation-mode-content p[class]{
  color:#07111f !important;
  -webkit-text-fill-color:#07111f !important;
  opacity:1 !important;
  font-weight:700 !important;
}

/* Selected-mode summary is also a light surface */
html body .documentation-mode-summary,
html body .documentation-mode-summary *{
  --fg:#07111f !important;
  --fg-strong:#000000 !important;
  --fg-muted:#16283a !important;
}
html body .documentation-mode-summary :where(p,span,small,div){
  color:#07111f !important;
  -webkit-text-fill-color:#07111f !important;
  opacity:1 !important;
  font-weight:650 !important;
  filter:none !important;
}
html body .documentation-mode-summary :where(strong,b,h1,h2,h3,h4){
  color:#000000 !important;
  -webkit-text-fill-color:#000000 !important;
  opacity:1 !important;
  font-weight:800 !important;
}

/* Pills remain readable without being washed out */
html body .documentation-mode-tags span{
  color:#07111f !important;
  -webkit-text-fill-color:#07111f !important;
  opacity:1 !important;
  font-weight:700 !important;
}

/* ============================================================
 NOVU Hx PRO V21.23 — LITERAL BLACK TEXT / DOCUMENTATION MODE
 User requirement: on these LIGHT surfaces, text is BLACK.
 This is the final cascade layer in style.css.
 ============================================================ */

/* Four white/light SOAP mode cards: ALL textual descendants are black. */
html body .documentation-mode-option .documentation-mode-content,
html body .documentation-mode-option .documentation-mode-content * {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    mix-blend-mode: normal !important;
}

/* Keep descriptive copy clearly readable, not thin/pale. */
html body .documentation-mode-option .documentation-mode-content p {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    opacity: 1 !important;
    font-weight: 600 !important;
}

/* Titles remain black and stronger. */
html body .documentation-mode-option .documentation-mode-content strong {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    opacity: 1 !important;
    font-weight: 800 !important;
}

/* Pills on the light cards: black text. */
html body .documentation-mode-option .documentation-mode-tags,
html body .documentation-mode-option .documentation-mode-tags * {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    opacity: 1 !important;
}

/* Light selected-mode summary below the cards: ALL text black. */
html body .documentation-mode-summary,
html body .documentation-mode-summary * {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    mix-blend-mode: normal !important;
}
html body .documentation-mode-summary p {
    font-weight: 600 !important;
}
html body .documentation-mode-summary strong {
    font-weight: 800 !important;
}


/* =========================================================
   NOVU HX INTEGRATED CLINICAL LIBRARY — ROOT COMPONENT
   ========================================================= */
.nx-clinical-library-btn{border:1px solid #b9d8f6;background:#fff;color:#12304b;border-radius:12px;padding:11px 16px;font-weight:800;cursor:pointer}
.nx-clinical-library-btn:hover{background:#eef7ff}
.nx-library-overlay{position:fixed;inset:0;z-index:12000;background:rgba(5,20,35,.62);display:flex;align-items:center;justify-content:center;padding:24px}
.nx-library-overlay.hidden{display:none!important}
.nx-library-shell{position:relative;width:min(1180px,96vw);height:min(820px,92vh);background:#f8fbff;border:1px solid #86bde8;border-radius:24px;box-shadow:0 30px 90px rgba(0,0,0,.35);overflow:hidden;display:grid;grid-template-rows:auto auto 1fr}
.nx-library-header{background:#073858;padding:22px 26px;display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.nx-library-header h2{margin:0!important;color:#fff!important;font-size:25px!important;line-height:1.2!important}
.nx-library-header p{margin:7px 0 0!important;color:#d8efff!important;font-size:14px!important}
.nx-library-close{width:42px;height:42px;border:0;border-radius:12px;background:#fff;color:#073858;font-size:25px;cursor:pointer;flex:0 0 auto}
.nx-library-tabs{display:flex;gap:9px;overflow-x:auto;padding:14px 18px;background:#fff;border-bottom:1px solid #d5e5f3}
.nx-library-tab{white-space:nowrap;border:1px solid #b7d2ea;background:#fff;color:#102a43;border-radius:11px;padding:11px 15px;font-weight:800;cursor:pointer}
.nx-library-tab.active{background:#1677ef;color:#fff;border-color:#1677ef}
.nx-library-content{overflow:auto;padding:18px}
.nx-library-search{width:100%;border:1px solid #7fb7e5;background:#eef7fd;color:#102a43;border-radius:12px;padding:14px 16px;font-size:16px;margin-bottom:14px}
.nx-library-list{display:grid;gap:10px}
.nx-library-card{border:1px solid #c8def0;background:#fff;border-radius:14px;padding:15px 17px;cursor:pointer;text-align:left;color:#102a43;transition:.14s transform,.14s box-shadow}
.nx-library-card:hover{transform:translateY(-1px);box-shadow:0 7px 20px rgba(21,73,112,.11)}
.nx-library-card strong{display:block;font-size:16px;margin-bottom:5px}.nx-library-card small{display:block;color:#4e6d88;line-height:1.45}
.nx-library-detail{background:#fff;border:1px solid #bcd8ef;border-radius:16px;padding:20px}.nx-library-detail.hidden{display:none}
.nx-library-detail h3{margin-top:0;color:#102a43}.nx-library-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.nx-library-kv{background:#f3f8fc;border-radius:10px;padding:11px}.nx-library-kv b{display:block;font-size:12px;color:#42637f;margin-bottom:4px}
.nx-library-action{border:0;border-radius:10px;background:#1677ef;color:#fff;padding:11px 14px;font-weight:800;cursor:pointer;margin-top:14px}
.nx-library-back{border:1px solid #b7d2ea;border-radius:10px;background:#fff;color:#12304b;padding:9px 12px;font-weight:800;cursor:pointer;margin-bottom:12px}
.nx-smart-suggestions{margin:12px 0 4px;padding:12px;border:1px solid #bcd8ef;background:#f3f9ff;border-radius:13px}.nx-smart-suggestions-title{font-weight:800;color:#17324d;margin-bottom:8px}.nx-smart-chip{border:1px solid #83b9e7;background:#fff;color:#17324d;border-radius:999px;padding:7px 11px;margin:3px;cursor:pointer;font-weight:700}.nx-smart-chip:hover{background:#e8f4ff}
.nx-smart-card{border:1px solid #cfe1f2;background:#fff;border-radius:10px;padding:8px 10px;margin:6px 0}.nx-smart-card-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.nx-smart-card-row strong{color:#17324d;font-size:13px}.nx-smart-card-actions{display:flex;gap:6px;flex-shrink:0}.nx-smart-why,.nx-smart-add,.nx-smart-dismiss{border-radius:999px;padding:5px 10px;font-size:11px;font-weight:700;cursor:pointer}.nx-smart-why{border:1px solid #9db8cf;background:#fff;color:#3a5a78}.nx-smart-add{border:1px solid #2478f3;background:#2478f3;color:#fff}.nx-smart-dismiss{border:1px solid #d8dfe6;background:#fff;color:#7a8794}.nx-smart-why-text{margin-top:7px;font-size:12px;color:#455a70;background:#f5f9fd;border-radius:7px;padding:7px 9px}.nx-smart-why-text.hidden{display:none}.nx-smart-guideline{margin-top:6px;padding-top:6px;border-top:1px solid #e2eaf2;font-size:11px;color:#5b7086}.nx-smart-guideline span{font-weight:700;color:#3a5a78}.nx-smart-guideline a{color:#2478f3;font-weight:700;text-decoration:none}.nx-smart-guideline a:hover{text-decoration:underline}
.nx-internal-alert{margin:10px 0;padding:11px 13px;border:1px solid #e7b84c;background:#fff8df;border-radius:11px;color:#563d00;font-weight:700}
@media(max-width:800px){.nx-library-overlay{padding:8px}.nx-library-shell{width:100%;height:96vh;border-radius:16px}.nx-library-detail-grid{grid-template-columns:1fr}.nx-header-actions{gap:6px}.nx-clinical-library-btn{padding:9px 10px;font-size:12px}}

/* =========================================================
   NOVU Hx — CLINICAL LIBRARY HEADER
   Mirrors the proven About NOVU Hx hero treatment only.
   ========================================================= */
#nxClinicalLibraryOverlay .nx-library-header{
    position:relative;
    padding:34px 38px 28px;
    background:linear-gradient(135deg,#031a30,#073a61 65%,#07557a);
    color:#f8fbff;
    overflow:hidden;
    align-items:flex-start;
}
#nxClinicalLibraryOverlay .nx-library-header::after{
    content:"";
    position:absolute;
    width:280px;
    height:280px;
    border-radius:50%;
    right:-90px;
    top:-130px;
    background:radial-gradient(circle,rgba(49,185,255,.24),transparent 68%);
    pointer-events:none;
}
#nxClinicalLibraryOverlay .nx-library-header-main{
    display:flex;
    align-items:center;
    gap:18px;
    position:relative;
    z-index:1;
    min-width:0;
}
#nxClinicalLibraryOverlay .nx-library-header-logo{
    width:70px;
    height:70px;
    flex:0 0 70px;
    object-fit:cover;
    border-radius:18px;
    border:1px solid rgba(128,220,255,.65);
    box-shadow:0 12px 30px rgba(0,100,210,.28);
}
#nxClinicalLibraryOverlay .nx-library-header-copy{min-width:0}
#nxClinicalLibraryOverlay .nx-library-header-kicker{
    font-size:10px;
    font-weight:900;
    letter-spacing:.16em;
    color:#67d4ff;
    text-transform:uppercase;
}
#nxClinicalLibraryOverlay .nx-library-header h2{
    margin:3px 0 3px!important;
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    font-size:30px!important;
    line-height:1.1!important;
    letter-spacing:-.02em!important;
    font-weight:800!important;
    opacity:1!important;
    text-shadow:none!important;
}
#nxClinicalLibraryOverlay .nx-library-header p{
    margin:0!important;
    color:#c8e3f4!important;
    -webkit-text-fill-color:#c8e3f4!important;
    font-size:13px!important;
    line-height:1.45!important;
    font-weight:400!important;
    opacity:1!important;
}
#nxClinicalLibraryOverlay .nx-library-close{
    position:relative;
    z-index:2;
    width:42px;
    height:42px;
    border:1px solid rgba(128,220,255,.35);
    border-radius:12px;
    background:rgba(3,26,48,.82);
    color:#fff;
    -webkit-text-fill-color:#fff;
    font-size:25px;
    cursor:pointer;
    flex:0 0 auto;
}
#nxClinicalLibraryOverlay .nx-library-close:hover{background:rgba(9,72,112,.96)}
@media(max-width:700px){
    #nxClinicalLibraryOverlay .nx-library-header{padding:26px 20px 22px}
    #nxClinicalLibraryOverlay .nx-library-header-logo{width:58px;height:58px;flex-basis:58px;border-radius:15px}
    #nxClinicalLibraryOverlay .nx-library-header h2{font-size:25px!important}
}

/* =========================================================
   NOVU Hx PRO V22 — visibility + clinical document controls
   ========================================================= */
.plan-medication-row select,
.plan-medication-row select option,
.plan-medication-row input,
.nonpharmacologic-plan-input,
.nonpharmacologic-plan-input:focus,
#nonPharmacologicPlan1{
    color:#182230!important;
    -webkit-text-fill-color:#182230!important;
    opacity:1!important;
}
.nonpharmacologic-plan-input::placeholder,#nonPharmacologicPlan1::placeholder{color:#a6b0bf!important;-webkit-text-fill-color:#a6b0bf!important;opacity:1!important}
.nx-order-type-group{min-width:150px}.nx-order-type{color:#182230!important;-webkit-text-fill-color:#182230!important;background:#fff!important}
.nx-doc-controls{display:grid;gap:8px;margin:10px 0 4px}.nx-doc-control{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 13px;border:1px solid #b9d8f6;border-left:4px solid #16835d;border-radius:11px;background:#f8fbff}.nx-doc-control strong{display:block;color:#18304a}.nx-doc-control span{display:block;color:#60758b;font-size:11px;margin-top:2px}.nx-doc-actions{display:flex;align-items:center;gap:9px;flex:0 0 auto}.nx-doc-actions button,.nx-doc-only-rx{border:1px solid #9fc7e8;background:#fff;color:#0b5ed7;border-radius:8px;padding:7px 10px;font-weight:800;cursor:pointer}.nx-doc-actions button:hover,.nx-doc-only-rx:hover{background:#eef7ff}.nx-doc-switch{position:relative;width:48px;height:28px;display:block}.nx-doc-switch input{position:absolute;opacity:0}.nx-doc-switch span{position:absolute;inset:0;border-radius:999px;background:#9aabba;border:1px solid #7f93a6;cursor:pointer}.nx-doc-switch span:before{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:.18s}.nx-doc-switch input:checked+span{background:#1677ef;border-color:#1677ef}.nx-doc-switch input:checked+span:before{transform:translateX(20px)}.nx-doc-only-rx{margin-left:auto}@media(max-width:700px){.nx-doc-control{align-items:flex-start;flex-direction:column}.nx-doc-actions{width:100%;justify-content:flex-end}}

/* =========================================================
   NOVU Hx PRO V22.1 — Selected dropdown values stay legible
   ========================================================= */
.medication-plan-row select,
.medication-plan-row select:valid,
.medication-plan-row select:focus,
.plan-order-row select,
.plan-order-row select:valid,
.plan-order-row select:focus,
.assessment-problem-card select,
.assessment-problem-card select:valid,
.assessment-problem-card select:focus,
#planSection select,
#assessmentSection select {
    color: #182230 !important;
    -webkit-text-fill-color: #182230 !important;
    opacity: 1 !important;
    background-color: #ffffff !important;
}
.medication-plan-row select option,
.plan-order-row select option,
.assessment-problem-card select option,
#planSection select option,
#assessmentSection select option {
    color: #182230 !important;
    background: #ffffff !important;
}
.medication-plan-row select option[value=""],
.plan-order-row select option[value=""],
.assessment-problem-card select option[value=""] {
    color: #8491a3 !important;
}

/* NOVU Hx PRO V23 — Clinical Library 2.0 */
.nx-library-bulk-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:12px 0;padding:10px;border:1px solid var(--border);border-radius:12px;background:var(--surface-secondary);flex-wrap:wrap}.nx-library-bulk-left,.nx-library-bulk-right{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.nx-library-bulk-toolbar button{min-height:34px;padding:6px 10px;border:1px solid var(--border);border-radius:9px;background:#fff;cursor:pointer}.nx-library-select-card{display:grid!important;grid-template-columns:auto 1fr auto!important;align-items:center!important;gap:12px!important;cursor:pointer}.nx-library-select-card>input{width:18px!important;height:18px!important;min-height:18px!important}.nx-library-select-card span{min-width:0}.nx-code-pill{width:auto!important;min-height:30px!important;padding:4px 9px!important;border:1px solid var(--primary-soft)!important;border-radius:999px!important;background:var(--primary-ultra-soft)!important;color:var(--primary)!important;font-size:10px!important;font-weight:800!important}.nx-library-basket{margin:0 0 12px}.nx-basket-title{font-size:11px;font-weight:800;color:var(--text-secondary);margin:8px 0}.nx-basket-items{display:grid;gap:6px}.nx-basket-items label{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--border-light);border-radius:9px;background:#fff;font-size:11px}.nx-basket-items input{width:16px!important;height:16px!important;min-height:16px!important}.nx-basket-items b{color:var(--primary);font-size:10px}.nx-v23-info{padding:18px;border:1px dashed var(--border);border-radius:12px;color:var(--text-muted);font-size:12px}.nx-tutorial-overlay{position:fixed;inset:0;z-index:10000;background:rgba(15,23,42,.58);display:flex;align-items:flex-end;justify-content:center;padding:28px}.nx-tutorial-card{width:min(560px,100%);background:#fff;border-radius:18px;padding:22px;box-shadow:var(--shadow-lg)}.nx-tutorial-card small{color:var(--primary);font-weight:800}.nx-tutorial-card h3{margin:6px 0}.nx-tutorial-card p{color:var(--text-secondary);font-size:13px}.nx-tutorial-card>div{display:flex;justify-content:flex-end;gap:8px}.nx-tutorial-card button{min-height:38px;padding:7px 13px;border:1px solid var(--border);border-radius:10px;background:#fff;cursor:pointer}@media(max-width:720px){.nx-library-select-card{grid-template-columns:auto 1fr!important}.nx-code-pill{grid-column:2}.nx-library-bulk-toolbar{align-items:stretch}.nx-library-bulk-left,.nx-library-bulk-right{width:100%}}

/* V2.3.1 — Encounter action visibility fix */
#nxAddSelected{background:var(--primary)!important;color:#fff!important;border-color:var(--primary)!important;font-weight:800!important;min-width:170px;box-shadow:0 4px 12px rgba(22,119,255,.18)}
#nxAddSelected:hover:not(:disabled){background:var(--primary-dark)!important;transform:translateY(-1px)}
#nxAddSelected:disabled{opacity:.45!important;cursor:not-allowed!important;box-shadow:none!important}


/* =========================================================
   PATIENT RECORD FINDER — integrated in Patient Information
   ========================================================= */
.msoap-record-finder{margin:20px 0 10px;padding:18px;border:1px solid var(--border);border-radius:var(--radius-lg);background:linear-gradient(180deg,#fbfdff,#f7faff)}
.msoap-record-finder-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.msoap-record-finder h4{margin:2px 0 3px;font-size:15px;color:var(--text)}
.msoap-record-finder p{margin:0;color:var(--text-muted);font-size:11px}
.msoap-record-search-grid{display:grid;grid-template-columns:minmax(210px,.8fr) minmax(260px,1.2fr) auto;gap:12px;align-items:end}
.msoap-record-search-action{display:flex;align-items:flex-end}.msoap-record-search-action button{min-height:44px;white-space:nowrap}
.msoap-record-search-results{margin-top:14px;border-top:1px solid var(--border-light);padding-top:12px;display:grid;gap:7px}
.msoap-record-search-results[hidden]{display:none!important}
.msoap-record-results-head{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:11px;color:var(--text-muted);margin-bottom:2px}.msoap-record-results-head strong{color:var(--text-secondary)}
.msoap-record-result{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;padding:11px 12px;border:1px solid var(--border);border-radius:10px;background:#fff;cursor:pointer;transition:var(--transition-fast)}
.msoap-record-result:hover{border-color:var(--primary);box-shadow:0 0 0 3px rgba(22,119,255,.07)}
.msoap-record-result strong,.msoap-record-result small{display:block}.msoap-record-result strong{font-size:12px;color:var(--text)}.msoap-record-result small{margin-top:2px;font-size:10px;color:var(--text-muted)}
.msoap-record-open{font-size:10px;font-weight:800;color:var(--primary);white-space:nowrap}.msoap-record-empty{padding:10px 12px;border-radius:9px;background:var(--surface-secondary);color:var(--text-secondary);font-size:11px}
@media(max-width:760px){.msoap-record-search-grid{grid-template-columns:1fr}.msoap-record-search-action button{width:100%}.msoap-record-results-head{align-items:flex-start;flex-direction:column}.msoap-record-result{align-items:flex-start;flex-direction:column}}

/* =========================================================
   HPI SMART BUILDER — additive upgrade
   ========================================================= */
.hpi-smart-guide{margin-top:10px;padding:12px 14px;border:1px solid var(--border-light);border-radius:14px;background:#fbfdff;display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.hpi-smart-guide-copy{display:flex;flex-wrap:wrap;gap:6px 12px;color:var(--text-secondary);font-size:10px;line-height:1.45}.hpi-smart-guide-copy strong{width:100%;font-size:11px;color:var(--text)}.hpi-smart-guide-copy span{white-space:normal}.hpi-smart-guide-copy span>b{color:#334155}.hpi-smart-guide-copy em{color:#7b8ba5;font-style:normal}
.hpi-smart-launch{flex:0 0 auto;border:1px solid #b8d6ff;border-radius:11px;background:#fff;color:var(--primary);padding:9px 11px;display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;cursor:pointer}.hpi-smart-launch:hover{background:var(--primary-ultra-soft);transform:translateY(-1px)}.hpi-smart-launch small{padding:3px 6px;border-radius:999px;background:var(--primary-soft);font-size:8px;letter-spacing:.05em;text-transform:uppercase}
.hpi-completeness{margin-top:9px;padding:10px 12px;border:1px solid #e5edf7;border-radius:12px;background:#fff}.hpi-completeness-top{display:flex;justify-content:space-between;gap:10px;font-size:10px}.hpi-completeness-top strong{font-size:11px}.hpi-completeness-top span{color:var(--text-muted);font-weight:700}.hpi-completeness-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.hpi-detect-chip{padding:4px 7px;border-radius:999px;background:#f1f5f9;color:#64748b;font-size:9px;font-weight:700}.hpi-detect-chip.detected{background:var(--normal-soft);color:var(--normal-dark)}.hpi-completeness p{margin:7px 0 0;color:var(--text-muted);font-size:9px}
.hpi-smart-panel{padding:18px!important}.hpi-smart-header{margin-bottom:14px}.hpi-smart-kicker{display:block;color:var(--primary);font-size:9px;font-weight:900;letter-spacing:.09em;margin-bottom:3px}.hpi-smart-progress-wrap{display:flex;align-items:center;gap:12px;font-size:10px;color:var(--text-muted);font-weight:700}.hpi-smart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hpi-smart-card{display:flex;gap:10px;padding:11px;border:1px solid #dce8f7;border-radius:12px;background:#fff;transition:var(--transition-fast)}.hpi-smart-card.completed{border-color:#a9dfc8;background:#fbfffd}.hpi-letter{width:28px;height:28px;flex:0 0 28px;border-radius:8px;background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900}.hpi-smart-card.completed .hpi-letter{background:var(--normal-soft);color:var(--normal-dark)}.hpi-card-copy{display:block;min-width:0;flex:1}.hpi-card-copy>b,.hpi-card-copy>small{display:block}.hpi-card-copy>b{font-size:11px;color:var(--text)}.hpi-card-copy>small{margin:1px 0 7px;color:var(--text-muted);font-size:9px}.hpi-card-copy input[type=text],.hpi-card-copy input[type=number]{min-height:36px;font-size:11px}.hpi-card-copy input+input{margin-top:6px}.hpi-severity-row{display:grid;grid-template-columns:1fr 52px auto;align-items:center;gap:7px}.hpi-severity-row input[type=range]{min-height:auto;padding:0}.hpi-severity-row span{font-size:10px;color:var(--text-muted)}.hpi-smart-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.hpi-generate-note{text-align:right;margin:6px 0 0;color:var(--text-muted);font-size:9px}
@media(max-width:760px){.hpi-smart-guide{flex-direction:column}.hpi-smart-launch{width:100%;justify-content:center}.hpi-smart-grid{grid-template-columns:1fr}.hpi-smart-actions{flex-direction:column}.hpi-smart-actions button{width:100%}}

/* =========================================================
   ASSESSMENT SMART BUILDER — additive upgrade
   ========================================================= */
.assessment-smart-guide{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:12px;padding:14px 16px;border:1px solid var(--border);border-radius:14px;background:var(--primary-ultra-soft)}
.assessment-smart-guide strong{color:var(--primary);font-size:13px}.assessment-smart-guide p{margin:3px 0 0;color:var(--text-secondary);font-size:11px}.assessment-smart-panel{margin-top:14px;padding:18px;border:1px solid #cfe0f7;border-radius:16px;background:#fbfdff}.assessment-smart-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px}.assessment-smart-head h4{margin:2px 0 3px;font-size:17px}.assessment-smart-head p{margin:0;color:var(--text-secondary);font-size:11px}.assessment-smart-kicker{font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--primary)}.assessment-smart-progress{white-space:nowrap;padding:6px 10px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:10px;font-weight:800}.assessment-smart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.assessment-smart-grid label{font-size:11px;font-weight:700;color:var(--text);display:block}.assessment-smart-grid input,.assessment-smart-grid select,.assessment-smart-grid textarea{margin-top:6px}.assessment-smart-grid textarea{min-height:74px}.assessment-smart-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:14px}.assessment-smart-note,.assessment-smart-sources{font-size:10px;color:var(--text-muted);margin:10px 0 0}.assessment-smart-sources{padding:10px 12px;background:white;border:1px solid var(--border-light);border-radius:10px}.assessment-smart-sources:empty{display:none}
@media(max-width:760px){.assessment-smart-guide,.assessment-smart-head{flex-direction:column}.assessment-smart-grid{grid-template-columns:1fr}.assessment-smart-actions{justify-content:stretch}.assessment-smart-actions button{flex:1 1 100%}}

/* V17 — active patient context */
.novu-active-patient-strip{
  position:sticky; top:76px; z-index:35;
  margin:12px auto 14px; width:min(1180px,calc(100% - 36px));
  display:flex; align-items:center; gap:18px;
  padding:10px 16px; border:1px solid #b9d8fb; border-radius:14px;
  background:rgba(247,251,255,.97); box-shadow:0 8px 24px rgba(25,70,120,.08);
}
.novu-active-patient-strip.hidden{display:none!important}
.novu-patient-strip-label{font-size:11px;font-weight:800;letter-spacing:.12em;color:#2387e8;white-space:nowrap}
.novu-patient-strip-main{display:flex;align-items:center;gap:18px;flex-wrap:wrap;color:#17324d}
.novu-patient-strip-main strong{font-size:15px;color:#102b46}
.novu-patient-strip-main span{font-size:13px}
.novu-patient-strip-main b{font-size:11px;letter-spacing:.06em;color:#6d8196;margin-right:4px}
#bmiCard{transition:none!important;animation:none!important}
#bmiCard *{transition:none!important}
/* V18 — classified drug library */
.nx-drug-filterbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:12px 14px;margin:0 0 12px;border:1px solid #d5e3f2;border-radius:14px;background:#f8fbff}.nx-drug-filterbar label{display:flex;align-items:center;gap:10px;font-weight:800;color:#18344f}.nx-drug-filterbar select{min-width:260px;padding:10px 12px;border:1px solid #9fc7ef;border-radius:10px;background:white;color:#17324d}.nx-drug-filterbar span{font-size:13px;color:#607a94}.nx-drug-card{display:grid!important;grid-template-columns:minmax(220px,1fr) minmax(180px,.7fr);gap:4px 18px;text-align:left}.nx-drug-card .nx-drug-class{grid-column:1/-1;font-size:12px;font-weight:700;color:#2582df}.nx-drug-card .nx-drug-spec{grid-column:1/-1;font-size:12px;color:#4c6a86;font-weight:600}

/* V19 Guideline Library */
.nx-guideline-card{display:block!important}
.nx-guideline-card>strong,.nx-guideline-card>small,.nx-guideline-card>.nx-drug-class{display:block}
.nx-guideline-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.nx-guideline-actions button{border:1px solid #c9d8e8;background:#fff;border-radius:9px;padding:7px 10px;font-weight:700;cursor:pointer}
.nx-guideline-actions button:hover{background:#f4f9ff}

/* V20 stability: these two clinical context surfaces must never animate/fade. */
#bmiCard,#bmiCard *,.novu-active-patient-strip,.novu-active-patient-strip *{
  animation:none!important;
  transition:none!important;
}
.novu-active-patient-strip{will-change:auto!important}

/* V21 — Current Patient is a stable persistent context surface. */
.novu-active-patient-strip,
.novu-active-patient-strip *{
  animation:none!important;
  transition:none!important;
}

/* V22 — Existing Patient / Medical Record status is non-animated. */
#msoapPatientRecordCard,#msoapPatientRecordCard *,
.msoap-patient-record-card,.msoap-patient-record-card *{
  animation:none!important;
  transition:none!important;
}

/* V23 — Modern persistent Current Patient card. */
.novu-active-patient-strip{
  position:relative;
  display:flex;
  align-items:center;
  gap:14px;
  margin:14px auto 18px;
  padding:13px 16px 13px 18px;
  max-width:1180px;
  min-height:72px;
  border:1px solid #cfe1f3;
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff 0%,#f7fbff 100%);
  box-shadow:0 8px 24px rgba(25,74,120,.08);
  overflow:hidden;
}
.novu-active-patient-strip.hidden{display:none!important}
.novu-patient-strip-accent{position:absolute;left:0;top:0;bottom:0;width:5px;background:#1688f8}
.novu-patient-strip-avatar{
  width:44px;height:44px;flex:0 0 44px;border-radius:14px;
  display:grid;place-items:center;background:#e9f4ff;border:1px solid #bcdcff;
  color:#0968c8;font-size:15px;font-weight:900;letter-spacing:.04em
}
.novu-patient-strip-content{min-width:0;flex:1}
.novu-patient-strip-label{
  display:flex;align-items:center;gap:7px;margin-bottom:5px;
  color:#57718b;font-size:10px;font-weight:900;letter-spacing:.13em
}
.novu-patient-live-dot{width:7px;height:7px;border-radius:50%;background:#15936b;box-shadow:0 0 0 3px rgba(21,147,107,.10)}
.novu-patient-strip-main{display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap;color:#49657f;font-size:13px}
.novu-patient-strip-main strong{color:#10283f;font-size:17px;line-height:1.15}
.novu-patient-strip-main span{padding-left:17px;position:relative}
.novu-patient-strip-main span:before{content:"";position:absolute;left:0;top:50%;width:4px;height:4px;border-radius:50%;background:#a8bdd1;transform:translateY(-50%)}
.novu-patient-strip-open{
  flex:0 0 auto;border:1px solid #b7d5f2;border-radius:11px;background:#fff;
  padding:9px 12px;color:#126ac4;font-size:12px;font-weight:800;cursor:pointer
}
.novu-patient-strip-open:hover{background:#f1f8ff}
@media(max-width:720px){
  .novu-active-patient-strip{align-items:flex-start}
  .novu-patient-strip-open{display:none}
}

/* V25 — NOVU Hx Clinical Command Header
   Visual-only evolution of the stable V24 Current Patient component. */
.novu-active-patient-strip{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  gap:16px!important;
  max-width:1180px!important;
  min-height:94px!important;
  margin:16px auto 20px!important;
  padding:15px 17px 15px 20px!important;
  border:1px solid rgba(59,159,255,.38)!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 56% -42%,rgba(77,196,255,.26),transparent 42%),
    linear-gradient(108deg,#062842 0%,#07547f 27%,#0b79b4 48%,#246ccf 72%,#493bc8 100%)!important;
  box-shadow:0 14px 34px rgba(13,48,80,.18),inset 0 1px 0 rgba(255,255,255,.08)!important;
  overflow:hidden!important;
  color:#fff!important;
}
.novu-active-patient-strip:after{
  content:"";position:absolute;right:-45px;top:-85px;width:230px;height:230px;
  border:1px solid rgba(55,174,255,.11);border-radius:50%;pointer-events:none
}
.novu-patient-strip-accent{
  position:absolute!important;left:0!important;top:13px!important;bottom:13px!important;
  width:5px!important;border-radius:0 6px 6px 0!important;
  background:linear-gradient(180deg,#38c8ff,#0878ff)!important;
  box-shadow:0 0 18px rgba(24,163,255,.55)!important
}
.novu-patient-strip-avatar-wrap{position:relative;flex:0 0 auto}
.novu-patient-strip-avatar{
  width:54px!important;height:54px!important;border-radius:17px!important;
  display:grid!important;place-items:center!important;
  background:linear-gradient(145deg,rgba(37,166,255,.24),rgba(14,77,145,.45))!important;
  border:1px solid rgba(116,205,255,.5)!important;color:#e9f8ff!important;
  box-shadow:inset 0 0 20px rgba(35,157,255,.12),0 8px 22px rgba(0,0,0,.15)!important;
  font-size:16px!important;font-weight:900!important;letter-spacing:.05em!important
}
.novu-patient-avatar-status{
  position:absolute;right:-2px;bottom:-2px;width:13px;height:13px;border-radius:50%;
  background:#24c78e;border:3px solid #092843;box-shadow:0 0 10px rgba(36,199,142,.65)
}
.novu-patient-strip-content{min-width:0!important;flex:1!important}
.novu-patient-strip-label{
  display:flex!important;align-items:center!important;gap:7px!important;margin:0 0 4px!important;
  color:#8bcfff!important;font-size:9px!important;font-weight:900!important;letter-spacing:.17em!important
}
.novu-patient-live-dot{width:6px!important;height:6px!important;background:#31d59d!important;box-shadow:0 0 9px rgba(49,213,157,.8)!important}
.novu-patient-strip-main{
  display:flex!important;align-items:baseline!important;gap:8px 13px!important;
  flex-wrap:wrap!important;margin:0 0 8px!important;color:#b9cee1!important
}
.novu-patient-strip-main strong{
  color:#fff!important;font-size:20px!important;font-weight:850!important;letter-spacing:-.02em!important
}
.novu-patient-strip-main .novu-patient-demographic{
  padding:0!important;color:#b9cee1!important;font-size:12px!important;font-weight:700!important
}
.novu-patient-strip-main .novu-patient-demographic:before{
  content:"•"!important;position:static!important;display:inline!important;margin-right:10px!important;
  color:#5791bd!important;background:none!important;transform:none!important
}
.novu-patient-strip-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.novu-record-chip,.novu-encounter-chip{
  display:inline-flex;align-items:center;gap:7px;padding:5px 9px;border-radius:9px;
  border:1px solid rgba(139,207,255,.17);background:rgba(255,255,255,.055);
  color:#d9ebf8;font-size:11px;font-weight:750;letter-spacing:.01em
}
.novu-record-chip small{color:#77b7e5;font-size:8px;font-weight:900;letter-spacing:.12em}
.novu-encounter-chip{color:#73dcb8;border-color:rgba(60,207,156,.19);background:rgba(31,174,126,.08);font-size:8px;letter-spacing:.12em}
.novu-patient-strip-actions{position:relative;z-index:2;display:flex;align-items:center}
.novu-patient-strip-open{
  border:1px solid rgba(116,205,255,.42)!important;border-radius:12px!important;
  background:rgba(11,54,91,.72)!important;padding:10px 13px!important;color:#dff5ff!important;
  font-size:11px!important;font-weight:850!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease!important
}
.novu-patient-strip-open:hover{background:rgba(22,111,178,.52)!important;border-color:#63c5ff!important;transform:translateY(-1px)}
.novu-patient-strip-open span{margin-left:5px;color:#55c4ff}
@media(max-width:720px){
  .novu-active-patient-strip{min-height:82px!important;padding:13px 14px 13px 17px!important}
  .novu-patient-strip-avatar{width:46px!important;height:46px!important}
  .novu-patient-strip-main strong{font-size:17px!important}
  .novu-patient-strip-actions{display:none!important}
  .novu-encounter-chip{display:none!important}
}

/* V26 — Compact Clinical Command Ribbon.
   Layout/visibility correction only. No record, encounter, BMI or autoload logic changed. */
.novu-active-patient-strip{
  max-width:1180px!important;
  min-height:70px!important;
  margin:6px auto 8px!important;
  padding:9px 15px 9px 18px!important;
  border-radius:17px!important;
  gap:12px!important;
  position:relative!important;
  z-index:3!important;
  transform:none!important;
}
.novu-patient-strip-avatar{
  width:43px!important;height:43px!important;flex:0 0 43px!important;
  border-radius:13px!important;font-size:14px!important
}
.novu-patient-avatar-status{width:10px!important;height:10px!important;border-width:2px!important}
.novu-patient-strip-label{margin:0 0 2px!important;font-size:8px!important}
.novu-patient-strip-main{margin:0 0 4px!important;gap:6px 11px!important;line-height:1.05!important}
.novu-patient-strip-main .novu-patient-name{
  display:inline-block!important;
  visibility:visible!important;
  opacity:1!important;
  color:#ffffff!important;
  font-size:18px!important;
  font-weight:900!important;
  line-height:1.1!important;
  letter-spacing:-.015em!important;
  max-width:440px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.novu-patient-strip-meta{gap:6px!important}
.novu-record-chip,.novu-encounter-chip{padding:4px 8px!important;font-size:10px!important}
.novu-patient-strip-open{padding:8px 11px!important}
.novu-patient-strip-accent{top:8px!important;bottom:8px!important}

/* ==========================================================================
   V27 — Smart Clinical Library Workflow + non-overlapping Current Patient
   ========================================================================== */

/* Current Patient is a true block between Note Progress and the active section.
   No absolute/fixed positioning and no negative transform: it cannot cover a
   section heading. */
.progress-card{margin-bottom:8px!important}
.novu-active-patient-strip{
  position:relative!important;
  inset:auto!important;
  float:none!important;
  clear:both!important;
  width:calc(100% - 32px)!important;
  max-width:none!important;
  min-height:66px!important;
  margin:0 16px 14px!important;
  padding:8px 14px 8px 17px!important;
  transform:none!important;
  z-index:2!important;
}
#documentationModeSection{margin-top:0!important}
.novu-patient-strip-avatar{width:41px!important;height:41px!important;flex-basis:41px!important}
.novu-patient-strip-main .novu-patient-name{font-size:17px!important}
.novu-patient-strip-meta{margin-top:1px!important}

/* Search/tabs remain available while browsing. Scrolling remains fully enabled. */
#nxClinicalLibraryOverlay .nx-library-header{position:sticky!important;top:0!important;z-index:40!important}
#nxLibraryTabs{
  position:sticky!important;top:0!important;z-index:36!important;
  background:#fff!important;padding-top:8px!important
}
#nxLibrarySearch{
  position:sticky!important;top:74px!important;z-index:35!important;
  box-shadow:0 7px 18px rgba(15,23,42,.05)!important
}
#nxLibraryBulkToolbar{
  position:sticky!important;top:142px!important;z-index:34!important;
  box-shadow:0 7px 18px rgba(15,23,42,.05)!important
}

/* Per-result action: browsing is now the alternate method; search remains primary. */
.nx-library-select-card{
  grid-template-columns:auto minmax(0,1fr) auto!important;
}
.nx-result-actions{display:flex!important;align-items:center!important;gap:8px!important}
.nx-inline-add{
  width:auto!important;min-width:72px!important;min-height:34px!important;
  padding:6px 12px!important;border:1px solid #70b7ff!important;border-radius:10px!important;
  background:linear-gradient(135deg,#1687ff,#28b8ed)!important;color:#fff!important;
  font-size:11px!important;font-weight:900!important;cursor:pointer!important;
  box-shadow:0 5px 14px rgba(22,135,255,.16)!important
}
.nx-inline-add:hover{transform:translateY(-1px)!important}
.nx-inline-add.is-added{background:#e8f8f1!important;color:#087a55!important;border-color:#92dec3!important;box-shadow:none!important}
.nx-drug-card{
  display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;gap:14px!important
}
.nx-result-copy{min-width:0!important}

/* Persistent bottom action: never scroll back to the top just to continue. */
.nx-smart-library-dock{
  position:absolute!important;left:18px!important;right:18px!important;bottom:14px!important;
  z-index:60!important;display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:14px!important;padding:10px 12px!important;border:1px solid #b9d8f4!important;
  border-radius:14px!important;background:rgba(255,255,255,.96)!important;
  box-shadow:0 12px 30px rgba(15,55,90,.16)!important;backdrop-filter:blur(12px)!important
}
.nx-smart-library-dock>div{display:flex!important;flex-direction:column!important;gap:1px!important}
.nx-smart-library-dock strong{font-size:12px!important;color:#163a5d!important}
.nx-smart-library-dock small{font-size:10px!important;color:#71869b!important}
.nx-smart-library-dock button{
  min-height:38px!important;padding:7px 14px!important;border:0!important;border-radius:11px!important;
  background:#e8f1fa!important;color:#54718d!important;font-weight:900!important;cursor:pointer!important
}
.nx-smart-library-dock.has-items button{
  background:linear-gradient(135deg,#137fff,#20b9ee)!important;color:#fff!important
}
#nxClinicalLibraryOverlay .nx-library-content{padding-bottom:88px!important}

@media(max-width:720px){
  .novu-active-patient-strip{width:calc(100% - 16px)!important;margin:0 8px 12px!important}
  .nx-result-actions{flex-direction:column!important;align-items:stretch!important}
  .nx-smart-library-dock{left:8px!important;right:8px!important}
}

/* =========================================================
   V28 — Collapsible Documentation Mode
   Presentation-only enhancement; existing SOAP mode logic preserved.
   ========================================================= */
#documentationModeSection.nx-docmode-collapsible{padding:14px 18px!important;margin-top:12px!important;transition:padding .18s ease,box-shadow .18s ease}
#documentationModeSection.nx-docmode-collapsible .documentation-mode-header{margin:0!important;align-items:center!important}
#documentationModeSection.nx-docmode-collapsible .documentation-mode-header>div:first-child{min-width:0}
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .documentation-mode-header>div:first-child>p.documentation-mode-description,
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .documentation-mode-header>div:first-child>p.section-label,
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .documentation-mode-header>div:first-child>h3{display:none!important}
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed #documentationModeGrid,
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed #documentationModeSummary,
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed #customDocumentationOptions,
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .documentation-mode-footer{display:none!important}
#documentationModeSection .nx-docmode-compact{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
#documentationModeSection:not(.nx-docmode-collapsed) .nx-docmode-compact{display:none!important}
.nx-docmode-label{font-size:11px;font-weight:850;letter-spacing:.11em;color:#58708a;white-space:nowrap}
.nx-docmode-current{display:flex;align-items:center;gap:8px;min-width:0;font-size:14px;font-weight:800;color:#10253d}
.nx-docmode-dot{width:8px;height:8px;border-radius:50%;background:#2488ff;box-shadow:0 0 0 4px rgba(36,136,255,.10);flex:0 0 auto}
.nx-docmode-current-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nx-docmode-toggle{margin-left:auto!important;display:inline-flex!important;align-items:center!important;gap:7px!important;min-height:34px!important;padding:7px 12px!important;border:1px solid #b9d5f1!important;border-radius:10px!important;background:#fff!important;color:#155fbd!important;font-size:12px!important;font-weight:800!important;cursor:pointer!important;white-space:nowrap!important}
.nx-docmode-toggle:hover{background:#f3f8ff!important;border-color:#7db5eb!important}
.nx-docmode-chevron{font-size:13px;transition:transform .18s ease}
#documentationModeSection:not(.nx-docmode-collapsed) .nx-docmode-chevron{transform:rotate(180deg)}
#documentationModeSection:not(.nx-docmode-collapsed) .nx-docmode-toggle{margin-top:0!important}
@media(max-width:760px){.nx-docmode-label{display:none}.nx-docmode-current{font-size:13px}.nx-docmode-toggle{padding:7px 9px!important}}

/* =========================================================
   V29 — Documentation Mode layout correction
   Clean compact row; no duplicated/overlapping labels.
   ========================================================= */
#documentationModeSection.nx-docmode-collapsible{
  padding:0!important;
  margin-top:12px!important;
  overflow:hidden!important;
}
#documentationModeSection.nx-docmode-collapsible .documentation-mode-header{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto auto!important;
  align-items:center!important;
  gap:12px!important;
  padding:16px 18px!important;
  margin:0!important;
}
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .documentation-mode-header > div:not(.nx-docmode-compact){
  display:none!important;
}
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-compact{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:3px!important;
  min-width:0!important;
}
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-label{
  display:block!important;
  font-size:10px!important;
  line-height:1.1!important;
  font-weight:850!important;
  letter-spacing:.12em!important;
  color:#5d7289!important;
}
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-current{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  font-size:16px!important;
  line-height:1.25!important;
  font-weight:850!important;
  color:#10253d!important;
}
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed #documentationModeBadge{
  display:inline-flex!important;
  margin:0!important;
}
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-toggle{
  margin:0!important;
  align-self:center!important;
}
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed #documentationModeGrid,
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed #documentationModeSummary,
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed #customDocumentationOptions,
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .documentation-mode-footer,
#documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .documentation-mode-safety{
  display:none!important;
}
/* Expanded state returns to the original visual hierarchy. */
#documentationModeSection.nx-docmode-collapsible:not(.nx-docmode-collapsed){padding:22px 28px!important}
#documentationModeSection.nx-docmode-collapsible:not(.nx-docmode-collapsed) .documentation-mode-header{
  grid-template-columns:minmax(0,1fr) auto auto!important;
  padding:0!important;
  margin-bottom:22px!important;
}
#documentationModeSection.nx-docmode-collapsible:not(.nx-docmode-collapsed) .nx-docmode-compact{display:none!important}
#documentationModeSection.nx-docmode-collapsible:not(.nx-docmode-collapsed) .documentation-mode-header > div:not(.nx-docmode-compact){display:block!important}
#documentationModeSection.nx-docmode-collapsible:not(.nx-docmode-collapsed) .nx-docmode-toggle{margin:0!important;align-self:start!important}
@media(max-width:760px){
 #documentationModeSection.nx-docmode-collapsible .documentation-mode-header{grid-template-columns:minmax(0,1fr) auto!important;padding:13px 14px!important}
 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed #documentationModeBadge{display:none!important}
 #documentationModeSection.nx-docmode-collapsible:not(.nx-docmode-collapsed) #documentationModeBadge{display:none!important}
 #documentationModeSection.nx-docmode-collapsible:not(.nx-docmode-collapsed){padding:18px 16px!important}
}

/* ============================================================
   V30 — Assessment / Plan typed-text visibility hotfix
   Exact section-scoped foreground repair only.
   Does not alter layout, state, data binding, or clinical logic.
   ============================================================ */
#assessmentSection textarea,
#assessmentSection input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
#assessmentSection select,
#planSection textarea,
#planSection input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
#planSection select {
  color:#10243a !important;
  -webkit-text-fill-color:#10243a !important;
  caret-color:#10243a !important;
  opacity:1 !important;
  text-shadow:none !important;
}
#assessmentSection textarea::placeholder,
#assessmentSection input::placeholder,
#planSection textarea::placeholder,
#planSection input::placeholder {
  color:#9bb3c6 !important;
  -webkit-text-fill-color:#9bb3c6 !important;
  opacity:1 !important;
}
#assessmentSection textarea:focus,
#assessmentSection input:focus,
#planSection textarea:focus,
#planSection input:focus {
  color:#10243a !important;
  -webkit-text-fill-color:#10243a !important;
  caret-color:#10243a !important;
}
/* Explicit high-risk Assessment fields reported in V29. */
#assessmentSection .supporting-findings-input,
#assessmentSection .findings-against-input,
#assessmentSection .clinical-reasoning-input,
#assessmentSection #overallAssessmentSummary,
#assessmentSection .differential-diagnosis-input,
#assessmentSection .differential-reason-input,
/* Explicit Plan free-text fields and dynamically cloned rows. */
#planSection .plan-textarea,
#planSection textarea[id^="nonPharmacologicPlan"],
#planSection textarea[id^="patientEducationPlan"],
#planSection textarea[id^="monitoringPlan"],
#planSection textarea[id^="additionalPlanNotes"],
#planSection #overallPlanNotes {
  color:#10243a !important;
  -webkit-text-fill-color:#10243a !important;
  caret-color:#10243a !important;
  opacity:1 !important;
}

/* =========================================================
   V34 — Clinical Library navigation + uniform action controls
   No horizontal-only navigation: all categories remain visible.
   ========================================================= */
#nxClinicalLibraryOverlay .nx-library-shell{
  grid-template-rows:auto auto minmax(0,1fr)!important;
}
#nxClinicalLibraryOverlay #nxLibraryTabs,
#nxClinicalLibraryOverlay .nx-library-tabs{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:8px!important;
  overflow:visible!important;
  overflow-x:visible!important;
  padding:10px 14px!important;
  align-items:stretch!important;
  position:relative!important;
  top:auto!important;
  z-index:36!important;
  background:#fff!important;
  border-bottom:1px solid #d5e5f3!important;
}
#nxClinicalLibraryOverlay .nx-library-tab{
  width:100%!important;
  min-width:0!important;
  min-height:46px!important;
  height:100%!important;
  padding:8px 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:normal!important;
  line-height:1.15!important;
  border-radius:11px!important;
  font-size:13px!important;
  font-weight:850!important;
}
#nxClinicalLibraryOverlay #nxLibrarySearch{
  position:sticky!important;
  top:0!important;
  z-index:35!important;
}
#nxClinicalLibraryOverlay #nxLibraryBulkToolbar{
  position:sticky!important;
  top:58px!important;
  z-index:34!important;
}
#nxClinicalLibraryOverlay .nx-library-bulk-toolbar button,
#nxClinicalLibraryOverlay .nx-inline-add,
#nxClinicalLibraryOverlay .nx-code-pill,
#nxClinicalLibraryOverlay .nx-library-action,
#nxClinicalLibraryOverlay .nx-guideline-actions button{
  min-height:36px!important;
  border-radius:10px!important;
  font-size:11px!important;
  font-weight:850!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1!important;
}
#nxClinicalLibraryOverlay .nx-inline-add{min-width:82px!important}
#nxClinicalLibraryOverlay .nx-code-pill{min-width:86px!important}
@media(max-width:980px){
  #nxClinicalLibraryOverlay #nxLibraryTabs,
  #nxClinicalLibraryOverlay .nx-library-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:620px){
  #nxClinicalLibraryOverlay #nxLibraryTabs,
  #nxClinicalLibraryOverlay .nx-library-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #nxClinicalLibraryOverlay .nx-library-tab{font-size:12px!important;min-height:42px!important}
}

/* ============================================================
   V35 — Clinical Library button stability / professional controls
   Buttons are no longer nested inside a <label>; selector and actions are
   independent hit targets so Add / CPT Details cannot toggle the checkbox.
   ============================================================ */
#nxClinicalLibraryOverlay .nx-library-select-card{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:14px!important;
  cursor:default!important;
}
#nxClinicalLibraryOverlay .nx-result-selector{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:14px!important;
  min-width:0!important;
  cursor:pointer!important;
}
#nxClinicalLibraryOverlay .nx-result-selector>.nx-lib-check{
  width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;
  margin:0!important;cursor:pointer!important;
}
#nxClinicalLibraryOverlay .nx-result-actions{
  display:grid!important;
  grid-template-columns:minmax(86px,auto) minmax(86px,auto)!important;
  align-items:center!important;
  gap:10px!important;
}
#nxClinicalLibraryOverlay .nx-code-pill,
#nxClinicalLibraryOverlay .nx-inline-add{
  height:38px!important;min-height:38px!important;
  padding:0 14px!important;border-radius:10px!important;
  white-space:nowrap!important;cursor:pointer!important;
}
#nxClinicalLibraryOverlay .nx-inline-add:disabled{opacity:.55!important;cursor:wait!important;transform:none!important}
@media(max-width:720px){
  #nxClinicalLibraryOverlay .nx-library-select-card{grid-template-columns:minmax(0,1fr)!important}
  #nxClinicalLibraryOverlay .nx-result-actions{grid-template-columns:1fr 1fr!important;padding-left:36px!important}
}

/* NOVU Hx V37 — Drug multi-select workflow */
.nx-drug-selection-toolbar{position:sticky;top:0;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 12px;margin:8px 0 10px;background:rgba(248,251,255,.97);border:1px solid #d8e6f3;border-radius:12px;backdrop-filter:blur(8px)}
.nx-drug-selection-toolbar strong{font-size:13px;color:#36536f}.nx-drug-selector{display:flex!important;align-items:center;gap:12px;flex:1;min-width:0}.nx-drug-selector>input{width:19px;height:19px;accent-color:#1687f8;flex:0 0 auto}.nx-drug-card.is-selected{border-color:#2b8cff!important;box-shadow:0 0 0 2px rgba(43,140,255,.10)}

/* =========================================================
   V41 — Workflow homeostasis + persistent drug multi-select
   ========================================================= */
/* Drug multi-select remains reachable while the result list scrolls. */
#nxClinicalLibraryOverlay .nx-drug-selection-toolbar{
  position:sticky!important;
  top:116px!important;
  z-index:38!important;
  margin:8px 0 10px!important;
  box-shadow:0 8px 20px rgba(15,23,42,.10)!important;
}
/* Patient entry actions stay balanced as Existing/New/Attach controls grow. */
#msoapPatientRecordCard + * .msoap-existing-patient-bar,
.msoap-existing-patient-bar{flex-wrap:wrap!important;gap:10px!important}
.msoap-existing-patient-bar>span{min-width:220px;flex:1 1 280px}

/* NOVU Hx V42 — integrated Search → No match → Create Patient workflow */
.msoap-record-empty.novu-no-match{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 16px}
.msoap-record-empty.novu-no-match strong{color:#102a43}
.msoap-record-empty.novu-no-match span{color:#60758c;flex:1 1 320px}
.msoap-record-empty.novu-no-match #msoapCreateFromNoMatch{margin-left:auto;white-space:nowrap}
@media(max-width:700px){.msoap-record-empty.novu-no-match #msoapCreateFromNoMatch{width:100%;margin-left:0}}

/* ===== NOVU Hx — Quick Reference panel ===== */
.nx-qr-tab{position:fixed;top:50%;right:0;transform:translateY(-50%) rotate(180deg);writing-mode:vertical-rl;background:#0f2f4d!important;color:#fff!important;border:none;border-radius:10px 0 0 10px;padding:18px 10px;font-weight:800;font-size:13px;letter-spacing:.03em;cursor:pointer;z-index:9500;box-shadow:-2px 0 10px rgba(0,0,0,.18);transition:opacity .2s,transform .2s}
.nx-qr-tab:hover{background:#153f68!important}
.nx-qr-tab.nx-qr-tab-hidden{opacity:0;pointer-events:none;transform:translateY(-50%) translateX(20px) rotate(180deg)}
#nxQuickRefPanel.nx-qr-panel{position:fixed;top:0;right:0;bottom:0;width:min(420px,100vw);max-width:100vw;background:#fff!important;box-shadow:-6px 0 24px rgba(15,30,50,.18);z-index:9600;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .25s ease;border-left:1px solid #d5e3f2}
#nxQuickRefPanel.nx-qr-panel.nx-qr-open{transform:translateX(0)}
#nxQuickRefPanel .nx-qr-header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:16px 18px;background:linear-gradient(135deg,#0f2f4d,#1c4e7a)!important;flex-shrink:0}
#nxQuickRefPanel .nx-qr-header strong{display:block;font-size:16px;color:#fff!important;-webkit-text-fill-color:#fff!important}
#nxQuickRefPanel .nx-qr-header small{display:block;margin-top:4px;color:#cfe1f2!important;-webkit-text-fill-color:#cfe1f2!important;font-size:12px;line-height:1.4}
#nxQuickRefPanel .nx-qr-close{background:rgba(255,255,255,.15)!important;color:#fff!important;border:none;border-radius:8px;width:32px;height:32px;font-size:18px;cursor:pointer;flex-shrink:0}
#nxQuickRefPanel .nx-qr-close:hover{background:rgba(255,255,255,.28)!important}
#nxQuickRefPanel .nx-qr-cats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:16px}
#nxQuickRefPanel .nx-qr-cats.hidden{display:none}
#nxQuickRefPanel .nx-qr-cat-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px;border:1px solid #d5e3f2;border-radius:14px;background:#f8fbff!important;cursor:pointer;font-weight:700;color:#17324d!important;-webkit-text-fill-color:#17324d!important;font-size:13px}
#nxQuickRefPanel .nx-qr-cat-btn:hover{background:#eaf3ff!important;border-color:#9fc7ef}
#nxQuickRefPanel .nx-qr-cat-icon{font-size:26px}
#nxQuickRefPanel .nx-qr-search-wrap{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid #e5edf5;flex-shrink:0}
#nxQuickRefPanel .nx-qr-search-wrap.hidden{display:none}
#nxQuickRefPanel .nx-qr-back{background:none;border:none;color:#2478f3!important;font-weight:700;font-size:13px;cursor:pointer;white-space:nowrap;padding:6px 4px}
#nxQuickRefPanel .nx-qr-search{flex:1;padding:9px 12px;border:1px solid #c7d8e8;border-radius:9px;font-size:14px;background:#fff!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important}
#nxQuickRefPanel .nx-qr-body{flex:1;overflow-y:auto;padding:12px 16px 24px;background:#fff!important}
#nxQuickRefPanel .nx-qr-info{padding:14px;text-align:center;color:#5b7086!important;font-size:13px;background:#f5f9fd!important;border-radius:10px}
#nxQuickRefPanel .nx-qr-card{display:block;width:100%;text-align:left;padding:12px 14px;margin-bottom:8px;border:1px solid #e2eaf2;border-radius:12px;background:#fff!important;cursor:pointer}
#nxQuickRefPanel .nx-qr-card:hover{border-color:#9fc7ef;background:#f8fbff!important}
#nxQuickRefPanel .nx-qr-card strong{display:block;color:#17324d!important;-webkit-text-fill-color:#17324d!important;font-size:14px}
#nxQuickRefPanel .nx-qr-card small{display:block;color:#5b7086!important;-webkit-text-fill-color:#5b7086!important;font-size:12px;margin-top:3px}
#nxQuickRefPanel .nx-qr-cat-tag{color:#2582df!important;-webkit-text-fill-color:#2582df!important;font-weight:700}
#nxQuickRefPanel .nx-qr-detail-back{background:none;border:none;color:#2478f3!important;font-weight:700;font-size:13px;cursor:pointer;padding:4px 0;margin-bottom:10px}
#nxQuickRefPanel .nx-qr-body h3{margin:0 0 12px;font-size:19px;color:#0f2f4d!important;-webkit-text-fill-color:#0f2f4d!important}
#nxQuickRefPanel .nx-qr-brand{color:#5b7086!important;-webkit-text-fill-color:#5b7086!important;font-weight:600;font-size:15px}
#nxQuickRefPanel .nx-qr-detail-grid{display:flex;flex-direction:column;gap:10px}
#nxQuickRefPanel .nx-qr-kv{border-bottom:1px solid #edf2f7;padding-bottom:9px}
#nxQuickRefPanel .nx-qr-kv b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.03em;color:#7a8fa3!important;-webkit-text-fill-color:#7a8fa3!important;margin-bottom:3px}
#nxQuickRefPanel .nx-qr-kv span{display:block;font-size:14px;color:#1f2f3f!important;-webkit-text-fill-color:#1f2f3f!important;line-height:1.4}
#nxQuickRefPanel .nx-qr-disclaimer{margin-top:14px;padding:10px 12px;background:#fff4e5!important;border:1px solid #f3d9a8;border-radius:10px;font-size:12px;color:#7a5b1e!important;-webkit-text-fill-color:#7a5b1e!important;line-height:1.4}
#nxQuickRefPanel .nx-qr-duptherapy{margin-top:10px;padding:10px 12px;background:#fdeceb!important;border:1px solid #f3b8b3;border-radius:10px;font-size:12.5px;color:#8a2b22!important;-webkit-text-fill-color:#8a2b22!important;line-height:1.4;font-weight:700}
#nxQuickRefPanel .nx-qr-guideline-card{padding:14px;margin-bottom:10px;border:1px solid #e2eaf2;border-radius:12px;background:#fff!important}
#nxQuickRefPanel .nx-qr-guideline-card strong{display:block;color:#17324d!important;-webkit-text-fill-color:#17324d!important;font-size:14px;line-height:1.35}
#nxQuickRefPanel .nx-qr-guideline-card small{display:block;color:#5b7086!important;-webkit-text-fill-color:#5b7086!important;font-size:12px;margin-top:5px}
#nxQuickRefPanel .nx-qr-guideline-link{display:inline-block;margin-top:9px;color:#2478f3!important;-webkit-text-fill-color:#2478f3!important;font-weight:700;font-size:12.5px;text-decoration:none}
#nxQuickRefPanel .nx-qr-guideline-link:hover{text-decoration:underline}
@media(max-width:640px){.nx-qr-panel{width:100vw}}
.nx-dup-therapy-warning{margin:10px 0;padding:12px 14px;background:#fdeceb!important;border:1px solid #f0b4ae;border-radius:12px;color:#8a2b22!important;font-size:13px;line-height:1.45;font-weight:650}
.nx-dup-therapy-warning.hidden{display:none}

/* ===== NOVU Hx — Guest Mode banner ===== */
.nx-guest-banner{position:fixed;left:224px;right:0;bottom:0;z-index:9400;display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;padding:10px 16px;background:#17324d!important;color:#eaf3ff!important;font-size:13px;font-weight:650;box-shadow:0 -4px 14px rgba(0,0,0,.15);pointer-events:none}
.nx-guest-banner span{color:#eaf3ff!important;-webkit-text-fill-color:#eaf3ff!important;pointer-events:none}
.nx-guest-banner button{background:#2478f3!important;color:#fff!important;border:none;border-radius:8px;padding:7px 14px;font-weight:700;font-size:12.5px;cursor:pointer;white-space:nowrap;pointer-events:auto}
.nx-guest-banner button:hover{background:#3a8bff!important}
@media(max-width:640px){.nx-guest-banner{flex-direction:column;gap:8px;text-align:center}}

/* ===== NOVU Hx — Security settings (MFA / Delete account) ===== */
.nx-security-settings{margin-top:20px;padding:16px;border:1px solid #d5e3f2;border-radius:14px;background:#f8fbff}
.nx-security-settings h3{margin:0 0 4px;font-size:15px;color:#17324d!important}
.nx-security-email{font-size:12px;color:#5b7086!important;margin:0 0 14px}
.nx-security-mfa strong{display:block;font-size:13px;color:#17324d!important;margin-bottom:6px}
.nx-security-help{font-size:12px;color:#5b7086!important;margin:0 0 8px}
.nx-mfa-row{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;background:#fff;border:1px solid #e2eaf2;border-radius:9px;margin-bottom:6px;font-size:12.5px;color:#17324d!important}
.nx-security-passkeys{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e2eaf2}
.nx-security-passkeys>strong{display:block;font-size:13px;color:#17324d!important;margin-bottom:4px}
#nxPasskeyCredentialList{display:grid;gap:6px;margin-bottom:10px}
.nx-passkey-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;position:relative;padding:8px 10px;background:#fff;border:1px solid #e2eaf2;border-radius:9px}
.nx-passkey-row>span{flex:1 1 200px;display:grid;gap:1px}
.nx-passkey-row>span>b{font-size:12.5px;color:#17324d!important}
.nx-passkey-row>span>small{font-size:11px;color:#5b7086!important}
.nx-passkey-row button{padding:6px 10px;font-size:12px;border-radius:7px;border:1px solid #e2eaf2;background:#f7fafc;cursor:pointer}
#nxRegisterPasskeyBtn{padding:8px 14px;font-size:12.5px;border-radius:8px;border:1px solid #1a73e8;background:#1a73e8;color:#fff;cursor:pointer}
.nx-passkey-status{min-height:16px;margin-top:7px;font-size:12px;color:#177a4a}
.nx-passkey-status.is-error{color:#b42318}
.nx-passkey-confirm{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:100%;padding:8px 10px;margin-top:6px;background:#fef3f2;border:1px solid #fecdca;border-radius:8px;font-size:13px}
.nx-passkey-confirm span{flex:1 1 160px;color:#7a271a}
.nx-passkey-confirm [data-confirm-yes]{background:#d92d20;color:#fff;border-color:#d92d20}
.nx-passkey-confirm [data-confirm-no]{background:#fff}
/* Patient Lifecycle — canonical component styling */
/* Patient Lifecycle — canonical isolated modal component */
.nx-lifecycle-center{position:fixed;inset:0;z-index:50000;display:flex;align-items:center;justify-content:center;padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));box-sizing:border-box;isolation:isolate}
.nx-lifecycle-backdrop{position:absolute;inset:0;background:rgba(8,22,38,.58);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.nx-lifecycle-dialog{position:relative;z-index:1;display:flex;flex-direction:column;width:min(840px,calc(100vw - 40px));max-height:calc(100dvh - 40px);margin:0;background:#fff;color:#17324d;border:1px solid rgba(69,116,190,.18);border-radius:18px;box-shadow:0 28px 90px rgba(8,24,44,.32);overflow:hidden}
.nx-lifecycle-header{position:relative;display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex:0 0 auto;min-height:112px;padding:26px 28px 24px;box-sizing:border-box;background:linear-gradient(112deg,#173f92 0%,#315fd1 55%,#486bdc 100%);border:0;color:#fff;overflow:visible}
.nx-lifecycle-heading{min-width:0;padding-top:2px}
.nx-lifecycle-header .nx-lifecycle-heading h2{display:block;margin:0 0 8px;padding:0;font-size:25px;line-height:1.2;font-weight:800;letter-spacing:-.02em;color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important;transform:none!important;position:static!important}
.nx-lifecycle-header .nx-lifecycle-heading p{display:block;margin:0;padding:0;font-size:14px;line-height:1.45;font-weight:500;color:rgba(255,255,255,.92)!important;-webkit-text-fill-color:rgba(255,255,255,.92)!important;opacity:1!important;transform:none!important}
.nx-lifecycle-close{flex:0 0 46px;width:46px;height:46px;min-width:46px;min-height:46px;margin:0;border-radius:12px;border:1px solid rgba(255,255,255,.32);background:rgba(255,255,255,.10);color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:28px;line-height:1;cursor:pointer}
.nx-lifecycle-body{flex:1 1 auto;min-height:0;padding:28px;overflow:auto;background:#fff;color:#17324d;box-sizing:border-box}
.nx-lifecycle-status-card{display:grid;grid-template-columns:52px minmax(0,1fr);gap:16px;align-items:center;padding:20px;margin:0 0 28px;border:1px solid #dce5ef;border-radius:14px;background:#fbfdff;box-shadow:0 3px 12px rgba(20,50,80,.035)}
.nx-lifecycle-status-icon,.nx-lifecycle-field-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:13px;background:#edf4ff;color:#245ed4;font-size:18px}
.nx-lifecycle-status-card strong{display:block;font-size:16px;color:#17324d;margin-bottom:5px}.nx-lifecycle-status-card strong span{color:#168254;text-transform:uppercase}.nx-lifecycle-status-card p{margin:0 0 7px;font-size:13.5px;color:#3d5266}.nx-lifecycle-status-card small{display:block;font-size:12.5px;line-height:1.5;color:#5b7086}
.nx-lifecycle-form{display:grid;gap:0}.nx-lifecycle-field{display:grid;grid-template-columns:52px minmax(0,1fr);gap:16px;align-items:center;padding:16px 0 22px;border-bottom:1px solid #e8eef5}.nx-lifecycle-field+.nx-lifecycle-field{padding-top:22px}
.nx-lifecycle-form label{display:grid;gap:8px;font-size:13.5px;font-weight:750;color:#17324d}.nx-lifecycle-form input{width:100%;min-height:50px;padding:11px 14px;border:1px solid #cbd8e6;border-radius:10px;background:#fff;font:inherit;color:#17324d;box-sizing:border-box;box-shadow:0 1px 2px rgba(20,50,80,.03)}.nx-lifecycle-form input:focus-visible{outline:2px solid #2d64d7;outline-offset:1px;border-color:#2d64d7}.nx-lifecycle-form input[type="file"]{padding:8px 10px;background:#fbfcfe}
.nx-lifecycle-help{margin:22px 0 0 68px!important;color:#526a80!important;font-size:13px!important;line-height:1.55!important}.nx-lifecycle-actions{display:flex;justify-content:flex-end;align-items:center;gap:12px;margin:26px -28px -28px;padding:20px 28px;border-top:1px solid #e5ebf2;background:#fbfcfe}.nx-lifecycle-actions button{min-height:48px;border-radius:10px;padding:0 20px;font-size:14px;font-weight:750;cursor:pointer}.nx-lifecycle-actions .nx-lifecycle-cancel{border:1px solid #c7d5e5;background:#fff;color:#2458bf}.nx-lifecycle-actions button[type="submit"]{border:1px solid #2d61d2;background:#2d61d2;color:#fff;box-shadow:0 5px 14px rgba(45,97,210,.2)}.nx-lifecycle-actions button[type="submit"]:disabled{opacity:.6;cursor:default}
@media(max-width:700px){.nx-lifecycle-center{padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}.nx-lifecycle-dialog{width:100%;max-height:calc(100dvh - 20px);border-radius:14px}.nx-lifecycle-header{min-height:108px;padding:22px 20px 20px}.nx-lifecycle-body{padding:20px}.nx-lifecycle-actions{margin:22px -20px -20px;padding:16px 20px;flex-wrap:wrap}.nx-lifecycle-actions button{flex:1 1 220px}.nx-lifecycle-help{margin-left:0!important}}


.nx-mfa-remove{background:none;border:1px solid #e3b3ae;color:#a4342b!important;border-radius:7px;padding:4px 9px;font-size:11px;font-weight:700;cursor:pointer}
#nxMfaEnrollBtn{background:#2478f3!important;color:#fff!important;border:none;border-radius:8px;padding:8px 14px;font-weight:700;font-size:12.5px;cursor:pointer}
.nx-mfa-enroll-card{margin-top:12px;padding:14px;background:#fff;border:1px solid #e2eaf2;border-radius:12px}
.nx-mfa-qr{display:flex;justify-content:center;margin:10px 0}
.nx-mfa-qr svg{width:180px;height:180px}
.nx-mfa-secret{font-size:11.5px;color:#5b7086!important;margin:6px 0}
.nx-mfa-secret code{background:#f0f4f8;padding:2px 6px;border-radius:5px;font-size:11px}
#nxMfaEnrollCode{width:100%;padding:9px 12px;border:1px solid #c7d8e8;border-radius:9px;font-size:14px;margin-bottom:8px;text-align:center;letter-spacing:.15em}
#nxMfaEnrollConfirm{width:100%;background:#2478f3!important;color:#fff!important;border:none;border-radius:8px;padding:9px;font-weight:700;font-size:13px;cursor:pointer}
.nx-security-danger{margin-top:16px;padding-top:14px;border-top:1px solid #e2eaf2}
#nxDeleteAccountBtn{background:#fff!important;color:#a4342b!important;border:1px solid #e3b3ae;border-radius:8px;padding:8px 14px;font-weight:700;font-size:12.5px;cursor:pointer}
.nx-security-settings .nx-error{color:#a4342b!important;font-size:12px;margin-top:10px;min-height:0}

/* V49 targeted fix: native Supabase TOTP QR scanner-safe rendering */
.nx-mfa-qr-native{width:260px!important;height:260px!important;box-sizing:content-box!important;padding:20px!important;margin:16px auto!important;background:#fff!important;border-radius:0!important;overflow:visible!important;display:flex!important;align-items:center!important;justify-content:center!important;filter:none!important;transform:none!important;animation:none!important;box-shadow:none!important}
.nx-mfa-qr-native svg,.nx-mfa-qr-native img{display:block!important;width:260px!important;height:260px!important;max-width:none!important;max-height:none!important;object-fit:contain!important;background:#fff!important;filter:none!important;transform:none!important;animation:none!important;border-radius:0!important}
.nx-mfa-manual{margin:12px 0}.nx-mfa-manual summary{font-weight:700;cursor:pointer}.nx-mfa-manual-key{margin-top:8px;padding:10px;background:#f7f9fc;border:1px solid #d9e3f0;border-radius:8px;overflow-wrap:anywhere}.nx-mfa-manual-key code{user-select:all}

/* ========================================================================== */
/* NOVU Hx V59 — MASTER UI/UX REMAKE · shared premium shell + Model 1/2      */
/* Presentation-only enhancement. Existing clinical/auth handlers remain SoT. */
/* ========================================================================== */
/* Bug fix: this later, unconditional :root redefinition collided with 7
   variable names (--nx-bg/blue/cyan/line/muted/shadow/text) already owned by
   the EARLIER, genuinely theme-aware dark-mode system (lines ~8003+, scoped
   under html[data-nx-theme]) -- since both are :root with equal specificity,
   this LATER declaration silently won for every consumer of those 7 names
   regardless of theme, which is why body.nx-v2's own background rule (which
   consumes --nx-bg) never actually went dark. Kept only the 3 names unique
   to this V59 layout (--nx-navy/--nx-azure/--nx-radius) that don't collide;
   removed the rest so the theme system's own values apply uncontested. */
:root{--nx-navy:#071b34;--nx-azure:#2f8df4;--nx-radius:18px}
body.nx-master-ui{background:var(--nx-bg);color:var(--nx-text)}
.nx-premium-sidebar{position:fixed;inset:0 auto 0 0;width:236px;background:linear-gradient(180deg,#06182e,#0a2d58 70%,#0b3b74);z-index:900;display:flex;flex-direction:column;padding:20px 14px;color:#fff;box-shadow:8px 0 30px rgba(5,30,58,.14)}
.nx-side-brand{display:flex;align-items:center;gap:11px;padding:2px 8px 20px;border-bottom:1px solid rgba(255,255,255,.12)}.nx-side-brand img{width:42px;height:42px;object-fit:contain}.nx-side-brand strong{font-size:20px;letter-spacing:.2px}.nx-side-brand small{display:block;color:#9dc9ff;font-size:10px;letter-spacing:1.4px}
.nx-side-scroll{overflow:auto;padding:16px 2px;flex:1}.nx-side-label{font-size:10px;font-weight:800;letter-spacing:1.5px;color:#7fb2e9;margin:14px 9px 7px}.nx-side-btn{width:100%;border:0;background:transparent;color:#dcecff;display:flex;align-items:center;gap:10px;padding:10px 11px;border-radius:11px;text-align:left;font-weight:650;cursor:pointer}.nx-side-btn:hover,.nx-side-btn:focus-visible{background:rgba(255,255,255,.10);outline:none}.nx-side-btn.active{background:rgba(63,151,255,.22);box-shadow:inset 3px 0 #5eb9ff;color:#fff}.nx-side-icon{width:21px;height:21px;display:grid;place-items:center}
.nx-side-user{border-top:1px solid rgba(255,255,255,.12);padding:14px 8px 4px}.nx-user-row{display:flex;gap:10px;align-items:center}.nx-user-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#d9efff;color:#0b4b8e;font-weight:800}.nx-user-copy{min-width:0;flex:1}.nx-user-copy small{display:block;color:#9fc5ec}.nx-user-copy strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nx-mfa-real{font-size:10px;color:#9de4be;margin-top:3px}.nx-signout{margin-top:10px;width:100%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);color:#fff;border-radius:10px;padding:9px;font-weight:700;cursor:pointer}
body.nx-master-ui>main,body.nx-master-ui>.app-container,body.nx-master-ui>#app{margin-left:236px!important}.nx-premium-sidebar[hidden]{display:none!important}
.nx-record-overlay{position:fixed;inset:0;z-index:1800;background:#eef4fa;overflow:auto;color:var(--nx-text)}.nx-record-shell{min-height:100%;padding:28px 34px 40px;margin-left:236px}.nx-record-top{display:flex;align-items:center;gap:18px;background:#fff;border:1px solid var(--nx-line);border-radius:22px;padding:18px 22px;box-shadow:var(--nx-shadow)}.nx-record-avatar{width:72px;height:72px;border-radius:20px;background:linear-gradient(145deg,#dceeff,#eef9ff);display:grid;place-items:center;color:#0e5fae;font-size:25px;font-weight:850;border:1px solid #cbe1f6}.nx-record-ident{flex:1}.nx-record-kicker{font-size:10px;font-weight:850;letter-spacing:1.5px;color:var(--nx-blue)}.nx-record-ident h1{margin:3px 0 4px;font-size:25px}.nx-record-meta{color:var(--nx-muted);font-size:13px}.nx-record-actions{display:flex;gap:8px;flex-wrap:wrap}.nx-record-actions button{border:1px solid var(--nx-line);background:#fff;border-radius:11px;padding:10px 13px;font-weight:750;color:#1d4d7b;cursor:pointer}.nx-record-actions .primary{background:var(--nx-blue);color:#fff;border-color:var(--nx-blue)}
.nx-summary-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin:18px 0;background:var(--nx-line);border:1px solid var(--nx-line);border-radius:16px;overflow:hidden}.nx-summary-item{background:#fff;padding:13px 16px}.nx-summary-item small{display:block;color:var(--nx-muted);font-size:10px;font-weight:800;letter-spacing:.8px}.nx-summary-item strong{display:block;margin-top:4px;font-size:14px}
.nx-vitals{display:grid;grid-template-columns:repeat(7,minmax(105px,1fr));gap:12px}.nx-vital{background:#fff;border:1px solid var(--nx-line);border-radius:18px;padding:14px;text-align:center;box-shadow:0 8px 24px rgba(25,67,113,.06);transition:transform .2s ease,box-shadow .2s ease;animation:nxVitalEntrance .3s ease both}.nx-vital:nth-child(1){animation-delay:0ms}.nx-vital:nth-child(2){animation-delay:45ms}.nx-vital:nth-child(3){animation-delay:90ms}.nx-vital:nth-child(4){animation-delay:135ms}.nx-vital:nth-child(5){animation-delay:180ms}.nx-vital:nth-child(6){animation-delay:225ms}.nx-vital:nth-child(7){animation-delay:270ms}@keyframes nxVitalEntrance{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.nx-vital:hover,.nx-vital:focus-within{transform:translateY(-3px);box-shadow:0 14px 30px rgba(25,67,113,.12),0 0 0 3px rgba(36,120,243,.16)}.nx-vital-ring{width:54px;height:54px;margin:0 auto 9px;border-radius:50%;display:grid;place-items:center;background:#eef7ff;border:1px solid #d7ebff;transition:background .2s,border-color .2s}.nx-vital:hover .nx-vital-ring{background:#e2f0ff;border-color:#a8d4ff}.nx-vital svg{width:27px;height:27px;stroke:#1671d9;fill:none;stroke-width:1.8}.nx-vital strong{display:block;font-size:15px}.nx-vital small{color:var(--nx-muted);font-size:10px}
/* Part C — one distinct, lightweight micro-animation per vital type, matching the approved icon motion spec. Each targets only its own [data-kind], so they never mix. */
.nx-vital[data-kind="bp"] .nx-vital-ring svg{animation:nxBpRing 2.6s ease-in-out infinite}
@keyframes nxBpRing{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.85}}
.nx-vital[data-kind="hr"] .nx-vital-ring{animation:nxPulse 3.8s ease-in-out infinite}
.nx-vital[data-kind="spo2"] .nx-vital-ring svg{animation:nxSpo2Wave 2.4s ease-in-out infinite}
@keyframes nxSpo2Wave{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
.nx-vital[data-kind="temp"] .nx-vital-ring svg{animation:nxTempRise 3s ease-in-out infinite;transform-origin:bottom center}
@keyframes nxTempRise{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.04)}}
.nx-vital[data-kind="weight"] .nx-vital-ring svg{animation:nxScaleSettle 3.2s ease-in-out infinite}
@keyframes nxScaleSettle{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(.5px) rotate(-1deg)}}
.nx-vital[data-kind="bmi"] .nx-vital-ring svg{animation:nxBmiRing 3s ease-in-out infinite}
@keyframes nxBmiRing{0%,100%{stroke-dashoffset:0}50%{stroke-dashoffset:2}}
.nx-vital[data-kind="glucose"] .nx-vital-ring svg{animation:nxDropBob 2.6s ease-in-out infinite}
@keyframes nxDropBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.5px)}}
@keyframes nxPulse{0%,92%,100%{transform:scale(1)}95%{transform:scale(1.06)}97%{transform:scale(.98)}}
.nx-record-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;margin-top:18px}.nx-module-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.nx-module{background:#fff;border:1px solid var(--nx-line);border-radius:17px;padding:16px;min-height:118px}.nx-module-head{display:flex;justify-content:space-between;align-items:center}.nx-module h3{font-size:13px;margin:0}.nx-module-count{font-size:22px;font-weight:850;color:#145fae}.nx-module p{font-size:12px;color:var(--nx-muted);min-height:30px}.nx-module button{border:0;background:transparent;color:var(--nx-blue);font-size:11px;font-weight:800;padding:0;cursor:pointer}.nx-panel{background:#fff;border:1px solid var(--nx-line);border-radius:18px;padding:17px}.nx-panel h2{font-size:14px;margin:0 0 12px}.nx-encounter-item{padding:11px 0;border-top:1px solid #edf2f7}.nx-encounter-item:first-of-type{border-top:0}.nx-encounter-item strong{display:block;font-size:12px}.nx-encounter-item span{font-size:11px;color:var(--nx-muted)}.nx-trend{margin-top:12px;height:180px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#fbfdff,#f4f9ff);border:1px dashed #cbdced;border-radius:14px;color:var(--nx-muted);font-size:12px}
.nx-subject-tabs{display:flex;gap:6px;overflow-x:auto;padding:8px 2px 10px;scrollbar-width:thin}.nx-subject-tab{white-space:nowrap;border:1px solid #d9e6f2;background:#fff;border-radius:999px;padding:7px 12px;font-size:11px;font-weight:750;color:#55708d}.nx-subject-tab.active{background:#eaf4ff;border-color:#b9d8f8;color:#0d62b7}.progress-card{border-radius:16px!important;box-shadow:0 8px 26px rgba(25,67,113,.07)!important}.steps .step{cursor:pointer}.steps .step small{font-weight:700}
@media(max-width:1180px){.nx-vitals{grid-template-columns:repeat(4,1fr)}.nx-module-grid{grid-template-columns:repeat(2,1fr)}.nx-record-grid{grid-template-columns:1fr}.nx-summary-strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.nx-premium-sidebar{width:82px}.nx-side-brand strong,.nx-side-brand small,.nx-side-label,.nx-side-btn span:not(.nx-side-icon),.nx-user-copy,.nx-mfa-real{display:none}.nx-side-brand{justify-content:center}.nx-side-btn{justify-content:center}.nx-side-user{padding-inline:2px}.nx-user-row{justify-content:center}.nx-signout{font-size:0}.nx-signout:after{content:'↪';font-size:18px}body.nx-master-ui>main,body.nx-master-ui>.app-container,body.nx-master-ui>#app,.nx-record-shell{margin-left:82px!important}.nx-record-shell{padding:20px}.nx-record-top{align-items:flex-start;flex-wrap:wrap}.nx-vitals{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){.nx-vital,.nx-vital-ring,.nx-vital-ring svg{animation:none!important;transition:none!important}}

/* NOVU Hx V60 — MASTER UI/UX REMAKE completion */
.nx-record-avatar{cursor:pointer;overflow:hidden}.nx-record-avatar img{width:100%;height:100%;object-fit:cover}.nx-clinical-context-v60{position:fixed;right:18px;top:118px;width:246px;z-index:760;background:#fff;border:1px solid var(--nx-line);border-radius:18px;box-shadow:var(--nx-shadow);padding:14px;color:var(--nx-text)}.nx-clinical-context-v60 header small,.nx-context-actions>small{display:block;font-size:9px;letter-spacing:1.2px;color:var(--nx-blue);font-weight:850}.nx-clinical-context-v60 header strong{display:block;font-size:14px;margin-top:2px}.nx-context-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:11px 0}.nx-context-grid div{background:#f6faff;border:1px solid #e2edf7;border-radius:10px;padding:8px}.nx-context-grid span{display:block;font-size:9px;color:var(--nx-muted)}.nx-context-grid b{font-size:11px}.nx-context-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.nx-context-actions>small{grid-column:1/-1;margin:3px 0}.nx-context-actions button{border:1px solid #d9e8f5;background:#fff;color:#245a8c;border-radius:9px;padding:7px 5px;font-size:10px;font-weight:750;cursor:pointer}.nx-context-actions button:hover{background:#edf6ff;border-color:#bcd9f4}
.nx-trend{height:auto;display:block;padding:12px}.nx-trend-toolbar{display:flex;gap:6px;overflow:auto;padding-bottom:10px}.nx-trend-toolbar button{white-space:nowrap;border:1px solid #d8e5f1;background:#fff;border-radius:999px;padding:6px 10px;font-size:10px;font-weight:750;color:#55708d}.nx-trend-toolbar button.active{background:#e8f3ff;color:#0d62b7;border-color:#afd2f5}.nx-trend-chart{min-height:190px;display:grid;place-items:center}.nx-trend-svg{width:100%;height:190px;overflow:visible}.nx-trend-svg polyline{fill:none;stroke:#1e78d6;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.nx-trend-svg circle{fill:#fff;stroke:#1e78d6;stroke-width:3;cursor:pointer}.nx-trend-svg circle:focus{outline:none;stroke-width:5}.nx-trend-empty{color:var(--nx-muted);font-size:12px}.nx-encounter-item{cursor:pointer;border-radius:9px;padding-inline:8px}.nx-encounter-item:hover{background:#f4f9ff}
.nx-encounter-drawer{position:fixed;right:0;top:0;bottom:0;width:min(430px,92vw);z-index:2200;background:#fff;box-shadow:-20px 0 50px rgba(11,45,80,.2);padding:28px;animation:nxDrawer .22s ease-out;color:var(--nx-text)}@keyframes nxDrawer{from{transform:translateX(30px);opacity:0}to{transform:none;opacity:1}}.nx-drawer-close{position:absolute;right:18px;top:16px;border:0;background:#eef5fb;width:34px;height:34px;border-radius:50%;font-size:20px}.nx-encounter-drawer>small{color:var(--nx-blue);font-weight:850;letter-spacing:1.2px}.nx-encounter-drawer h2{margin:6px 0}.nx-encounter-drawer>p{color:var(--nx-muted)}.nx-encounter-drawer dl{margin-top:24px}.nx-encounter-drawer dt{font-size:10px;color:var(--nx-muted);font-weight:800;margin-top:16px}.nx-encounter-drawer dd{margin:4px 0 0;line-height:1.45}.nx-encounter-drawer .primary{margin-top:24px;width:100%;border:0;background:var(--nx-blue);color:#fff;padding:11px;border-radius:11px;font-weight:800}
.nx-guest-temp-panel{position:fixed;inset:9% 8%;z-index:2300;background:#f5f9fd;border:1px solid #cfe0ef;border-radius:22px;box-shadow:0 30px 80px rgba(8,38,69,.25);padding:22px;overflow:auto}.nx-guest-temp-head{display:flex;justify-content:space-between;align-items:flex-start}.nx-guest-temp-head small{display:block;color:#6f8296;font-weight:800}.nx-guest-temp-head strong{display:block;font-size:19px;color:#173b61}.nx-guest-temp-head span{display:block;color:#6f8296;font-size:12px;margin-top:3px}.nx-guest-temp-head>button{border:0;background:#e5eef6;border-radius:50%;width:34px;height:34px;font-size:20px}.nx-guest-temp-list{margin-top:18px}.nx-guest-temp-list article{display:flex;justify-content:space-between;gap:12px;background:#fff;border:1px solid #dbe7f1;border-radius:14px;padding:14px;margin-bottom:9px}.nx-guest-temp-list article strong,.nx-guest-temp-list article small,.nx-guest-temp-list article em{display:block}.nx-guest-temp-list article small{color:#708398;margin-top:3px}.nx-guest-temp-list article em{font-style:normal;color:#9a650d;font-size:9px;font-weight:850;margin-top:5px}.nx-guest-temp-list article button{border:1px solid #d3e2ef;background:#fff;border-radius:8px;padding:7px 9px;margin-left:5px;font-size:10px;font-weight:750;color:#285b88}
.nx-encounter-primary-actions{display:flex;flex-wrap:wrap;gap:9px;align-items:center;justify-content:flex-end;padding:13px;margin-bottom:14px;background:#f7fbff;border:1px solid #dce9f4;border-radius:14px}.nx-encounter-primary-actions>button,.nx-encounter-primary-actions summary{border:1px solid #cfe0ef;background:#fff;color:#285b88;border-radius:10px;padding:9px 13px;font-size:11px;font-weight:800;cursor:pointer;list-style:none}.nx-encounter-primary-actions>button.primary{background:var(--nx-blue);border-color:var(--nx-blue);color:#fff}.nx-encounter-primary-actions details{position:relative}.nx-encounter-primary-actions details>div{position:absolute;right:0;top:40px;background:#fff;border:1px solid #dce7f2;border-radius:11px;box-shadow:var(--nx-shadow);padding:6px;min-width:150px;z-index:50}.nx-encounter-primary-actions details button{display:block;width:100%;border:0;background:#fff;text-align:left;padding:8px;border-radius:7px}.nx-version-history{margin:16px 0;background:#fff;border:1px solid #dce7f2;border-radius:14px;padding:12px}.nx-version-history summary{font-size:11px;font-weight:850;color:#315e89;cursor:pointer}.nx-version-history>div{display:grid;grid-template-columns:1fr auto;gap:3px 12px;padding:10px 2px;border-top:1px solid #edf2f6}.nx-version-history>div:first-of-type{margin-top:9px}.nx-version-history span,.nx-version-history small{font-size:10px;color:#718398}.nx-version-history small{grid-column:1/-1}
@media(min-width:1201px){body.nx-master-ui .app-container>*{padding-right:300px!important;max-width:calc(100vw - 224px)!important;box-sizing:border-box!important}body.nx-master-ui #documentationModeSection,body.nx-master-ui #novuActivePatientStrip{padding-right:300px!important}}@media(max-width:1200px){.nx-clinical-context-v65{position:fixed;top:auto;bottom:74px;right:16px;width:220px;max-height:44vh;overflow:auto;z-index:9100;box-shadow:0 -8px 24px rgba(20,60,100,.18)}.nx-context-grid{grid-template-columns:1fr 1fr}}@media(max-width:900px){.nx-clinical-context-v65{display:none}.nx-guest-temp-panel{inset:5% 4%}.nx-guest-temp-list article{flex-direction:column}}@media(prefers-reduced-motion:reduce){.nx-encounter-drawer{animation:none!important}}
\n\n/* =========================================================\n   NOVU Hx V62 — FINAL MODEL 1 / MODEL 2 VISUAL CONTRACT\n   Root-level layout consolidation. No clinical data handlers replaced.\n   ========================================================= */\n.nx-access-menu-btn,#nxHomeAccess{display:none!important}\n:root{--v62-navy:#062d52;--v62-navy2:#0b4774;--v62-blue:#0b77d5;--v62-cyan:#27b6df;--v62-ink:#10243b;--v62-muted:#62778f;--v62-line:#dbe6ef;--v62-bg:#f5f9fc}\nbody.nx-master-ui{background:var(--v62-bg)!important}\n.nx-premium-sidebar{background:linear-gradient(180deg,#062b4c 0%,#073c65 58%,#052b4d 100%)!important;border-right:0!important;box-shadow:10px 0 30px rgba(14,54,91,.12)!important}\n.nx-side-brand{padding:22px 17px 18px!important}.nx-side-brand img{width:36px!important;height:36px!important;border-radius:10px!important}.nx-side-brand strong{font-size:19px!important;letter-spacing:-.4px}.nx-side-brand small{opacity:.7!important}\n.nx-side-label{font-size:9px!important;letter-spacing:1.25px!important;opacity:.7!important;margin:15px 14px 6px!important}.nx-side-btn{min-height:38px!important;border-radius:8px!important;margin:2px 9px!important;padding:8px 11px!important}.nx-side-btn:hover,.nx-side-btn.active{background:linear-gradient(90deg,rgba(18,143,199,.9),rgba(11,102,173,.78))!important;box-shadow:0 7px 18px rgba(0,0,0,.12)!important}.nx-side-user{margin:10px!important;border:1px solid rgba(255,255,255,.13)!important;background:rgba(255,255,255,.06)!important;border-radius:13px!important}.nx-signout{background:linear-gradient(180deg,#0a6bad,#07538b)!important;border-radius:8px!important}\n.nx-record-overlay{background:rgba(237,244,249,.98)!important;backdrop-filter:blur(10px);padding:22px!important}.nx-record-shell{max-width:1440px!important;margin:0 auto 0 220px!important;background:#fff!important;border:1px solid #dce6ef!important;border-radius:18px!important;box-shadow:0 22px 60px rgba(25,65,100,.14)!important;padding:20px!important;min-height:calc(100vh - 44px)!important}\n.nx-record-top{border-bottom:0!important;padding:0 0 14px!important}.nx-record-avatar{width:70px!important;height:70px!important;border:4px solid #fff!important;box-shadow:0 5px 18px rgba(31,71,107,.15)!important}.nx-record-kicker{font-size:10px!important;letter-spacing:1.2px!important;color:#54708a!important}.nx-record-ident h1{font-size:24px!important;letter-spacing:-.6px!important}.nx-record-meta{font-size:11px!important;color:#61778d!important}.nx-record-actions button{height:38px!important;border-radius:9px!important}.nx-record-actions .primary{background:linear-gradient(180deg,#0d8394,#087083)!important}\n.nx-summary-strip{background:linear-gradient(110deg,#65d1e3 0%,#dceeff 54%,#8f9eea 100%)!important;border:0!important;border-radius:12px!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)!important}.nx-summary-item{border-color:rgba(67,105,140,.13)!important}.nx-summary-item small{color:#34536d!important}.nx-summary-item strong{color:#102a43!important}\n.nx-vitals{margin-top:15px!important}.nx-vital{border-radius:16px!important;box-shadow:none!important}.nx-vital-ring{background:#f5fbfd!important;border-color:#d9edf1!important}.nx-vital svg{stroke:#0b7b84!important}.nx-module{border-radius:12px!important;box-shadow:0 3px 12px rgba(36,75,108,.045)!important}.nx-module-count{color:#163b61!important}.nx-module button{color:#087a83!important}.nx-panel{border-radius:12px!important;box-shadow:0 3px 12px rgba(36,75,108,.045)!important}\n.nx-encounter-drawer{border-radius:16px 0 0 16px!important}.nx-encounter-drawer .primary{background:#087a83!important}\n/* Encounter workspace: keep original SOAP DOM/handlers, impose Model 2 hierarchy. */\nbody.nx-master-ui .app-header{margin-left:220px!important;background:#fff!important;border-bottom:1px solid #dfe8f0!important;box-shadow:0 4px 16px rgba(34,70,104,.06)!important}\nbody.nx-master-ui .app-header .brand{display:none!important}\nbody.nx-master-ui .nx-header-actions{margin-left:auto!important}\nbody.nx-master-ui main,body.nx-master-ui>.app-container,body.nx-master-ui>#app{margin-left:220px!important;max-width:none!important}\nbody.nx-master-ui .progress-card{position:sticky!important;top:0!important;z-index:120!important;background:#fff!important;border:1px solid var(--v62-line)!important;border-radius:0 0 14px 14px!important;margin-top:0!important}\nbody.nx-master-ui .steps{gap:5px!important}.steps .step{border-radius:999px!important}.steps .step.active{background:linear-gradient(180deg,#58b9f2,#187ed6)!important;color:#fff!important;box-shadow:0 7px 18px rgba(20,120,205,.2)!important}\n.nx-subject-tabs{position:sticky!important;top:72px!important;z-index:105!important;background:rgba(255,255,255,.96)!important;border:1px solid #e0e9f1!important;border-radius:12px!important;padding:7px!important;box-shadow:0 6px 18px rgba(30,68,101,.06)!important}.nx-subject-tab{border:0!important;background:transparent!important}.nx-subject-tab.active{background:#eaf5ff!important;color:#0a69bc!important}\nbody.nx-master-ui .section.active{background:transparent!important}\nbody.nx-master-ui .card,body.nx-master-ui .subsection-card,body.nx-master-ui .form-card{border-radius:12px!important;border-color:#dce6ef!important;box-shadow:0 3px 12px rgba(36,75,108,.04)!important}\n.nx-clinical-context-v60{border-radius:12px!important;box-shadow:0 12px 32px rgba(32,72,108,.12)!important}.nx-context-actions button{border-radius:8px!important}.nx-encounter-primary-actions{border-radius:11px!important}.nx-encounter-primary-actions>button.primary{background:linear-gradient(180deg,#0b5f9e,#064f87)!important}\n@media(max-width:900px){.nx-record-shell{margin-left:82px!important}body.nx-master-ui .app-header,body.nx-master-ui main,body.nx-master-ui>.app-container,body.nx-master-ui>#app{margin-left:82px!important}}\n
/* ===== NOVU Hx — Strength picker (Part E medication pipeline fix) ===== */
.nx-strength-picker-overlay{position:fixed;inset:0;background:rgba(15,30,50,.55);z-index:17000;display:flex;align-items:center;justify-content:center;padding:20px}
.nx-strength-picker-card{background:#fff;border-radius:16px;padding:24px;max-width:400px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.nx-strength-picker-card h3{margin:0 0 4px;font-size:17px;color:#17324d!important}
.nx-strength-picker-card h3 span{color:#5b7086!important;font-weight:600;font-size:14px}
.nx-strength-picker-card p{margin:0 0 14px;font-size:12.5px;color:#5b7086!important}
.nx-strength-options{display:flex;flex-direction:column;gap:8px;max-height:280px;overflow-y:auto;margin-bottom:16px}
.nx-strength-option{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #e2eaf2;border-radius:10px;cursor:pointer;font-size:14px;color:#17324d!important}
.nx-strength-option:has(input:checked){border-color:#2478f3;background:#f0f7ff}
.nx-strength-option input{accent-color:#2478f3}
.nx-strength-actions{display:flex;gap:10px;justify-content:flex-end}
.nx-strength-cancel{background:none;border:1px solid #d5e3f2;color:#5b7086!important;border-radius:8px;padding:9px 16px;font-weight:700;font-size:13px;cursor:pointer}
.nx-strength-confirm{background:#2478f3!important;color:#fff!important;border:none;border-radius:8px;padding:9px 18px;font-weight:700;font-size:13px;cursor:pointer}
.plan-medication-row.nx-just-added{animation:nxJustAddedPulse 1.8s ease}
@keyframes nxJustAddedPulse{0%{background:#e3f0ff}70%{background:#e3f0ff}100%{background:transparent}}
.nx-record-avatar{position:relative}
.nx-photo-remove{position:absolute;top:-4px;right:-4px;width:20px;height:20px;border-radius:50%;background:#a4342b!important;color:#fff!important;border:2px solid #fff;font-size:12px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.nx-photo-remove:hover{background:#7f271f!important}

/* ===== Live per-stage completion ring — real field-fill ratio, not decorative ===== */
.step{position:relative}
.step[data-soap-step] span{position:relative;z-index:1}
.step.nx-step-has-content span::before{
  content:"";position:absolute;inset:-4px;border-radius:50%;z-index:-1;
  background:conic-gradient(#2478f3 calc(var(--nx-step-ratio,0)*360deg),transparent 0deg);
  transition:background 1.1s cubic-bezier(.22,1,.36,1);
}
.step.active.nx-step-has-content span::before{background:conic-gradient(#fff calc(var(--nx-step-ratio,0)*360deg),rgba(255,255,255,.28) 0deg)}
#progressFill{transition:width .5s cubic-bezier(.22,1,.36,1)}
@media(prefers-reduced-motion:reduce){.step.nx-step-has-content span::before{transition:none}#progressFill{transition:none}}

/* ===== "About NOVU Hx" header button — own class, so it never collides
   with .nx-access-menu-btn's display:none!important (that rule
   correctly hides the retired legacy Access Menu button, but this one
   only ever borrowed the class for its visual style, not its identity). ===== */
.nx-about-header-btn{
 display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 13px;
 border:1px solid var(--nx-line,#bfd2e2);border-radius:11px;
 background:var(--nx-panel,#fff)!important;color:var(--nx-text,#10263d)!important;
 -webkit-text-fill-color:var(--nx-text,#10263d)!important;
 font:inherit;font-size:12px;font-weight:850;cursor:pointer;
 box-shadow:0 7px 20px rgba(0,20,45,.08)
}
.nx-about-header-btn:hover{border-color:var(--nx-primary,#168cff);transform:translateY(-1px)}
@media(max-width:760px){.nx-about-header-btn{font-size:0;width:42px;padding:0;justify-content:center}.nx-about-header-btn span{font-size:17px}}
.plan-medication-row,.plan-order-row,.plan-referral-row{position:relative}
.plan-row-remove{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;border:1px solid #e3c7cb;background:#fdf0f1;color:#a4342b;font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;z-index:2;transition:background .14s ease,transform .14s ease}
.plan-row-remove:hover{background:#f6d3d6;transform:scale(1.08)}
.nx-lock-screen-btn{width:100%;margin-top:7px;padding:8px 10px;border:1px solid #3a5a7a;border-radius:8px;background:rgba(255,255,255,.06);color:#cfe1f2;font-size:10px;font-weight:750;cursor:pointer;transition:background .14s ease}
.nx-lock-screen-btn:hover{background:rgba(255,255,255,.14);color:#fff}

/* ===== Model 2 redesign — Subject/Objective subnav tabs =====
   Redesigned per the reference photo: numbered circles + label,
   larger touch target, clearer active state, instead of the flat
   small text pills these were before. */
.nx-subject-tab{display:inline-flex!important;align-items:center;gap:7px;padding:8px 14px 8px 8px!important;border-radius:999px!important;font-size:12px!important;border:1px solid #d9e6f2!important;background:#fff!important;color:#3d5872!important;cursor:pointer;transition:all .15s ease}
.nx-subject-tab-num{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#eef3f8;color:#5c7690;font-size:10.5px;font-weight:800;flex-shrink:0;transition:background .15s ease,color .15s ease}
.nx-subject-tab:hover{border-color:#b9d8f8!important;transform:translateY(-1px)}
.nx-subject-tab.active{background:#0d62b7!important;border-color:#0d62b7!important;color:#fff!important;box-shadow:0 6px 16px rgba(13,98,183,.28)}
.nx-subject-tab.active .nx-subject-tab-num{background:rgba(255,255,255,.22);color:#fff}

/* ===== Model 2 redesign — HPI toolbar ===== */
.nx-hpi-toolbar{display:flex;align-items:center;gap:4px;padding:6px 8px;margin-bottom:6px;border:1px solid #dde8f0;border-radius:9px 9px 0 0;background:#f7fafc;flex-wrap:wrap}
.nx-hpi-toolbar button{width:28px;height:28px;border:1px solid transparent;border-radius:6px;background:transparent;color:#3d5872;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s ease}
.nx-hpi-toolbar button:hover{background:#e9f1f8;border-color:#d5e3ee}
.nx-hpi-toolbar-sep{width:1px;height:18px;background:#dde8f0;margin:0 2px}
.nx-hpi-toolbar select{height:28px;border:1px solid #d9e6f2;border-radius:6px;background:#fff;color:#3d5872;font-size:11px;padding:0 6px;cursor:pointer}

/* ===== Bug fix found while testing the new HPI toolbar: #hpiNarrative
   (and textareas broadly) rendered with a dark background but dark
   text-fill-color at the same time -- nearly unreadable. Root cause:
   --novu-field-bg/--novu-field-text (used by the rule that actually
   wins the cascade for input/textarea/select) are only ever defined
   once, for light mode, with no dark-mode counterpart -- so in dark
   mode the background came from a different, earlier dark-theme rule
   while the text stayed pinned to its light-mode dark value. This
   rule is placed last on purpose so it wins by source order over the
   older, inconsistent rules instead of trying to patch every one of
   them individually. ===== */
html[data-nx-theme="dark"] body.nx-v2 :where(input,textarea,select),
html[data-nx-theme-source="system"] body.nx-v2 :where(input,textarea,select){
  background-color:#132b3c!important;color:#f7fbff!important;-webkit-text-fill-color:#f7fbff!important;
}
html:not([data-nx-theme="dark"]) body.nx-v2 :where(input,textarea,select){
  background-color:#edf5fa!important;color:#10243a!important;-webkit-text-fill-color:#10243a!important;
}

/* ===== Model 2 redesign — live Assessment & Plan summary in the
   Current Encounter panel (the "second column" from the reference
   photo, without restructuring the page layout). ===== */
.nx-current-summary{margin:10px 0;padding:10px 12px;border:1px solid #dbe6ee;border-radius:10px;background:#f7fafc}
.nx-current-summary>small{display:block;font-size:9px;font-weight:800;letter-spacing:.08em;color:#7488a0;margin-bottom:6px}
.nx-current-summary-row{display:flex;justify-content:space-between;align-items:baseline;padding:3px 0;font-size:11.5px}
.nx-current-summary-row span{color:#5c7690}
.nx-current-summary-row b{color:#10243b;font-weight:750;text-align:right}
.nx-current-summary-row b.nx-empty-val{color:#93a5b6;font-weight:600;font-style:italic}

/* ===== Lock screen contrast fix — same recurring pattern: a global
   -webkit-text-fill-color safety-net rule was winning over this
   screen's intended white-on-navy text, making "NOVU Hx Locked" and
   the instructions nearly invisible. ===== */
#nxLockScreen .nx-lock-card h2,#nxLockScreen .nx-lock-card p{color:#eaf4ff!important;-webkit-text-fill-color:#eaf4ff!important;opacity:1!important}
#nxLockScreen .nx-lock-card h2{font-size:22px;font-weight:800;margin:0 0 8px}
#nxLockScreen .nx-lock-card p{font-size:13px;margin:0 0 18px;color:#a9c9e3!important;-webkit-text-fill-color:#a9c9e3!important}

/* ===== Defensive fix: guarantee the Subject/Objective subnav tabs
   never stretch vertically regardless of ancestor flex/grid context.
   Not reproduced in direct testing at multiple widths, but adding
   this closes off any edge case and is zero-risk either way. ===== */
.nx-subject-tabs{align-items:center!important}
.nx-subject-tab{height:38px!important;max-height:38px!important;min-height:38px!important;align-self:center!important;flex-shrink:0!important}

/* ===== Clinical Library — the "N items added" floating dock sits at
   the bottom of the results list and was covering the last visible
   row(s). Reserve room for it at the bottom of the scrollable list at
   all times, so scrolling to the end never lands content underneath
   it. ===== */
#nxLibraryList{padding-bottom:78px!important}

/* ===== Sidebar brand "NOVU Hx" text — same recurring pattern: a
   generic body.nx-v2 strong{color:var(--fg-strong)!important} safety
   rule (meant for light-background contexts) was winning here too,
   painting the logo text dark navy on the dark navy sidebar. ===== */
#nxPremiumSidebar strong{color:#fff!important;-webkit-text-fill-color:#fff!important}

/* =========================================================
   NOVU Hx — VITALS DYNAMISM (all 6 kinds, both surfaces)
   Every effect below reads --vs-color/--vs-ratio/--vs-dur/
   --vs-intensity, set inline per-vital from the same vitalStatus()
   the app already uses for color-coding. Nothing here invents new
   clinical meaning; it gives the existing meaning (normal/elevated/
   critical, and distance from normal) a visual language, at a glance,
   on both the Patient Record's vital icons and the SOAP screen's
   live Current Encounter panel.
   ========================================================= */

/* ---- HR: pulse intensity + speed already partly wired; this adds
   the actual visible thump, scaled by --vs-intensity (harder thump
   the further HR sits from 80bpm-ish normal). ---- */
@keyframes nxDynHrPulse{0%,100%{transform:scale(1)}50%{transform:scale(calc(1 + .16 * var(--vs-intensity,.5)))}}
.novu-vital.nx-dyn-hr .novu-vital-icon{animation:nxDynHrPulse var(--vs-dur,1s) ease-in-out infinite;color:var(--vs-color)!important;border-color:var(--vs-color)!important}
[data-vs-key="hr"].nx-dyn-hr{animation:nxDynHrPulse var(--vs-dur,1s) ease-in-out infinite}

/* ---- BP: a conic-gradient ring showing --vs-ratio (position between
   the low/high display range), colored by clinical band. ---- */
.novu-vital.nx-dyn-bp .novu-vital-icon{background:conic-gradient(var(--vs-color) calc(var(--vs-ratio,0)*360deg),#eef2f5 0);border-color:transparent;position:relative}
.novu-vital.nx-dyn-bp .novu-vital-icon::after{content:'';position:absolute;inset:3px;border-radius:50%;background:#fff}
.novu-vital.nx-dyn-bp .novu-vital-icon{color:var(--vs-color)!important}
.novu-vital.nx-dyn-bp .novu-vital-icon>*{position:relative;z-index:1}
[data-vs-key="bp"].nx-dyn-bp{box-shadow:inset 3px 0 0 var(--vs-color)}

/* ---- SpO2: slow "breathing" scale, faster/shorter as saturation
   drops (--vs-dur already computed shorter = more urgent). ---- */
@keyframes nxDynBreathe{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.09);opacity:.82}}
.novu-vital.nx-dyn-spo2 .novu-vital-icon{animation:nxDynBreathe var(--vs-dur,2s) ease-in-out infinite;color:var(--vs-color)!important;border-color:var(--vs-color)!important}
[data-vs-key="spo2"].nx-dyn-spo2{animation:nxDynBreathe var(--vs-dur,2s) ease-in-out infinite}

/* ---- Temp: a small fill bar (mini thermometer) rising to --vs-ratio,
   colored by band (blue=low, green=normal, orange/red=fever). ---- */
.novu-vital.nx-dyn-temp .novu-vital-icon{position:relative;overflow:hidden;color:var(--vs-color)!important;border-color:var(--vs-color)!important}
.novu-vital.nx-dyn-temp .novu-vital-icon::before{content:'';position:absolute;left:0;right:0;bottom:0;height:calc(var(--vs-ratio,0)*100%);background:var(--vs-color);opacity:.22;transition:height .4s ease}
[data-vs-key="temp"].nx-dyn-temp{box-shadow:inset 3px 0 0 var(--vs-color)}

/* ---- Weight/BMI: no animation (these don't change moment to moment)
   -- the ↑/↓ trend glyph (already injected in the markup) just gets a
   readable accent color matching the vital's own status. ---- */
.novu-vital.nx-dyn-weight .nx-vital-trend,.novu-vital.nx-dyn-bmi .nx-vital-trend{color:var(--vs-color);font-weight:800;font-size:11px;margin-left:2px}
[data-vs-key="weight"].nx-dyn-weight b,[data-vs-key="bmi"].nx-dyn-bmi b{color:var(--vs-color)}

/* ---- Glucose: blink, but ONLY at genuinely critical bands (the
   nx-dyn-critical class is only added for low/high, never
   normal/prediabetic) so it stays meaningful, not just decorative. ---- */
@keyframes nxDynBlink{0%,100%{opacity:1}50%{opacity:.35}}
.novu-vital.nx-dyn-glucose.nx-dyn-critical .novu-vital-icon{animation:nxDynBlink 1.1s ease-in-out infinite;color:var(--vs-color)!important;border-color:var(--vs-color)!important}
[data-vs-key="glucose"].nx-dyn-glucose.nx-dyn-critical{animation:nxDynBlink 1.1s ease-in-out infinite}

@media(prefers-reduced-motion:reduce){
  .novu-vital.nx-dyn-hr .novu-vital-icon,[data-vs-key="hr"].nx-dyn-hr,
  .novu-vital.nx-dyn-spo2 .novu-vital-icon,[data-vs-key="spo2"].nx-dyn-spo2,
  .novu-vital.nx-dyn-glucose.nx-dyn-critical .novu-vital-icon,[data-vs-key="glucose"].nx-dyn-glucose.nx-dyn-critical
  {animation:none!important}
}

@media(max-width:900px){body.nx-master-ui .nx-guest-banner{left:82px}}


/* NOVU Hx V84 — Clinical Library Plan Builder + legibility pass */
#nxClinicalLibraryOverlay .nx-library-shell{width:min(1220px,97vw);height:min(900px,95vh)}
#nxClinicalLibraryOverlay .nx-library-content{padding:var(--novu-space-4)}
#nxClinicalLibraryOverlay .nx-library-search,#nxClinicalLibraryOverlay select,#nxClinicalLibraryOverlay input[type="text"],#nxClinicalLibraryOverlay input[type="search"]{min-height:var(--novu-control-height);border-radius:var(--novu-control-radius)}
#nxClinicalLibraryOverlay .nx-drug-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--novu-space-3)}
#nxClinicalLibraryOverlay .nx-planbuilder-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--novu-space-3);margin-bottom:var(--novu-space-4)}
#nxClinicalLibraryOverlay .nx-planbuilder-head small{display:block;font-size:var(--novu-type-label);font-weight:700;color:#5d7286;letter-spacing:.04em}
#nxClinicalLibraryOverlay .nx-planbuilder-head h3{margin:4px 0 0;font-size:20px}
#nxClinicalLibraryOverlay .nx-planbuilder-head h3 span{color:#5d7286;font-weight:500;font-size:14px}
#nxClinicalLibraryOverlay .nx-planbuilder-source{display:inline-flex;align-items:center;min-height:30px;padding:4px 9px;border:1px solid #cbdbe8;border-radius:999px;background:#f7fbfe;color:#47657e;font-size:11px;font-weight:650}
#nxClinicalLibraryOverlay .nx-planbuilder-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--novu-space-3)}
#nxClinicalLibraryOverlay .nx-planbuilder-grid label{display:grid;gap:6px;color:#425f77;font-size:var(--novu-type-label);font-weight:650}
#nxClinicalLibraryOverlay .nx-planbuilder-grid label.wide{grid-column:1/-1}
#nxClinicalLibraryOverlay .nx-planbuilder-grid input,#nxClinicalLibraryOverlay .nx-planbuilder-grid select{width:100%;padding:8px 10px;border:1px solid #bfd0df;background:#fff;color:#17324d;font:inherit}
#nxClinicalLibraryOverlay .nx-planbuilder-reference,#nxClinicalLibraryOverlay .nx-planbuilder-guideline{margin-top:var(--novu-space-4);padding:var(--novu-space-3);border:1px solid #d8e5ef;border-radius:12px;background:#f8fbfd;color:#29465e}
#nxClinicalLibraryOverlay .nx-planbuilder-guideline{border-color:#c8dfd7;background:#f5fbf8}
#nxClinicalLibraryOverlay .nx-planbuilder-guideline.is-neutral{border-color:#d8e5ef;background:#f8fbfd}
#nxClinicalLibraryOverlay .nx-planbuilder-reference strong,#nxClinicalLibraryOverlay .nx-planbuilder-guideline strong{display:block;margin-bottom:5px;font-size:13px}
#nxClinicalLibraryOverlay .nx-planbuilder-reference p,#nxClinicalLibraryOverlay .nx-planbuilder-guideline p{margin:4px 0;font-size:12.5px;line-height:1.45}
#nxClinicalLibraryOverlay .nx-planbuilder-reference small,#nxClinicalLibraryOverlay .nx-planbuilder-guideline small{display:block;color:#5a7085;font-size:11.5px;line-height:1.45}
#nxClinicalLibraryOverlay .nx-planbuilder-guideline a{display:inline-block;margin-top:7px;color:#176fc1;font-size:12px;font-weight:700}
#nxClinicalLibraryOverlay .nx-planbuilder-actions{display:flex;justify-content:flex-end;gap:var(--novu-space-2);margin-top:var(--novu-space-4)}
#nxClinicalLibraryOverlay .nx-planbuilder-actions button{min-height:var(--novu-control-height);border-radius:var(--novu-control-radius)}
#nxClinicalLibraryOverlay button:focus-visible,#nxClinicalLibraryOverlay input:focus-visible,#nxClinicalLibraryOverlay select:focus-visible{outline:3px solid rgba(30,117,210,.22);outline-offset:2px}
#novuPatientRecordHost .novu-summary-item small,#novuPatientRecordHost .novu-summary-item .label{font-size:12px}
#novuPatientRecordHost .novu-summary-item strong,#novuPatientRecordHost .novu-summary-item .value{font-size:13.5px}
#novuPatientRecordHost .novu-vital-label,#novuPatientRecordHost .novu-metric-label{font-size:12px}
#novuPatientRecordHost .novu-vital-value,#novuPatientRecordHost .novu-metric-value{font-size:var(--novu-type-clinical-value)}
#novuPatientRecordHost .novu-vital-unit,#novuPatientRecordHost .novu-metric-unit,#novuPatientRecordHost [data-unit]{font-size:var(--novu-clinical-unit-size);font-weight:var(--novu-clinical-unit-weight);line-height:1.25}
@media(max-width:760px){#nxClinicalLibraryOverlay .nx-planbuilder-grid{grid-template-columns:1fr}#nxClinicalLibraryOverlay .nx-planbuilder-grid label.wide{grid-column:auto}#nxClinicalLibraryOverlay .nx-planbuilder-head{flex-direction:column}#nxClinicalLibraryOverlay .nx-drug-card{grid-template-columns:1fr}}
@media print{#nxClinicalLibraryOverlay{display:none}}

/* =========================================================
   NOVU Hx V87 — Canonical Encounter deletion confirmation UI
   Destructive affordance only; authorization remains in the
   Encounter domain service, never in CSS/UI visibility.
   ========================================================= */
.novu-encounter-delete-modal{
  position:fixed;inset:0;z-index:100120;
  display:grid;place-items:center;padding:22px;
  background:rgba(15,23,42,.5);
}
.novu-encounter-delete-modal>section{
  width:min(560px,96vw);max-height:90vh;overflow:auto;
  border:1px solid #e3e8ef;border-radius:14px;background:#fff;
  box-shadow:0 24px 70px rgba(15,23,42,.28);
}
.novu-encounter-delete-modal header{
  display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
  padding:16px 18px;border-bottom:1px solid #e7edf3;background:#fbfcfe;
}
.novu-encounter-delete-modal header small{display:block;font-size:10px;font-weight:800;letter-spacing:.07em;color:#8b2635}
.novu-encounter-delete-modal header h2{margin:3px 0;font-size:18px;color:#172033}
.novu-encounter-delete-modal header p{margin:0;font-size:11px;color:#66758a}
.novu-encounter-delete-modal header>button{width:30px!important;height:30px!important;min-height:30px!important;padding:0!important}
.novu-delete-stage{padding:18px}
.novu-delete-stage h3{margin:0 0 7px;font-size:15px;color:#172033}
.novu-delete-stage>p{margin:0 0 16px;font-size:12.5px;line-height:1.5;color:#516276}
.novu-delete-stage label{display:grid;gap:6px;margin-top:12px;font-size:11.5px;font-weight:700;color:#40566d}
.novu-delete-stage label span{font-weight:500;color:#7a8796}
.novu-delete-stage select,.novu-delete-stage input{width:100%;min-height:40px;border:1px solid #cbd7e3;border-radius:9px;background:#fff;padding:8px 10px;color:#172033;font:inherit}
.novu-delete-stage footer{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}
.novu-delete-stage footer button{min-height:38px;padding:0 13px;border-radius:9px}
.novu-delete-stage .danger-secondary{border:1px solid #df9b9b;background:#fff;color:#a61b1b;font-weight:750}
.novu-delete-stage .danger-final{border:1px solid #9f1239;background:#b42318;color:#fff;font-weight:850;letter-spacing:.025em}
.novu-delete-stage .danger-final:disabled{opacity:.55;cursor:not-allowed}
.novu-delete-confirm-summary{padding:11px 12px;border:1px solid #ead2d2;border-radius:10px;background:#fff8f7}
.novu-delete-confirm-summary strong,.novu-delete-confirm-summary small{display:block}
.novu-delete-confirm-summary strong{font-size:12px;color:#442329}
.novu-delete-confirm-summary small{margin-top:4px;font-size:10.5px;color:#77555b}
#novuPatientRecordHost .novu-delete-encounter-btn{
  width:100%;margin-top:7px;min-height:34px;border:1px solid #e4aaaa!important;
  background:#fff!important;color:#a61b1b!important;font-weight:750!important;
}
#novuPatientRecordHost .novu-delete-encounter-btn:hover{background:#fff4f2!important}
@media(max-width:620px){.novu-encounter-delete-modal{padding:10px}.novu-delete-stage footer{flex-direction:column-reverse}.novu-delete-stage footer button{width:100%}}
@media print{.novu-encounter-delete-modal,.novu-delete-encounter-btn,.msoap-delete-encounter{display:none!important}}


/* CORE71 35-38 clinician support component */
.novu-plan-clinical-support{margin:14px 0;padding:12px;border:1px solid #d8e5ee;border-radius:12px;background:#f8fbfd}
.novu-plan-clinical-support>header{display:grid;gap:3px;margin-bottom:10px}
.novu-plan-clinical-support>header>strong{font-size:13px;color:#17324d}
.novu-plan-clinical-support>header>small,.novu-plan-support-provenance{font-size:11px;line-height:1.45;color:#657b8d}
.novu-plan-support-group{display:grid;gap:7px;margin-top:10px}
.novu-plan-support-group>strong{font-size:12px;color:#36546b}
.novu-plan-support-list{display:grid;gap:6px}
.novu-plan-support-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start;padding:8px;border:1px solid #e1e9ef;border-radius:9px;background:#fff}
.novu-plan-support-item>span{font-size:12px;line-height:1.45;color:#314b60}
.novu-plan-support-item>div{display:flex;gap:5px;flex-wrap:wrap}
.novu-plan-support-item button{min-height:30px;padding:4px 8px;border-radius:7px;font-size:10.5px}
@media(max-width:760px){.novu-plan-support-item{grid-template-columns:1fr}}

/* TRUE CORE PHASE 1A — provider identity, fluid in all existing themes */
#nxProviderIdentitySettings{min-width:0}
.nx-provider-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px;min-width:0}
.nx-provider-grid>.field{min-width:0}
.nx-provider-grid input,.nx-provider-grid select{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
.nx-provider-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px}
#nxSaveProviderProfile{min-height:44px}
#nxProviderProfileStatus{font-size:12px;line-height:1.4;overflow-wrap:anywhere}
@media(max-width:700px){.nx-provider-grid{grid-template-columns:1fr}.nx-provider-actions>*{max-width:100%}}
/* TRUE CORE Phase 1C — glucose context controls */
.glucose-context{margin-top:9px;display:grid;gap:6px}.glucose-context>label{font-size:12px;font-weight:650}.glucose-context select{min-height:38px}.glucose-context-duration{display:grid;grid-template-columns:1fr 1fr;gap:7px}.glucose-context-duration[hidden]{display:none}.glucose-context-duration input{min-width:0}.glucose-context small{color:var(--text-muted,#66788a)}

/* ============================================================================
   Dark mode — Phase 1: Settings.
   Root cause, not a symptom patch: .settings-panel hardcoded background:white
   with no theme awareness, so ANY settings-group/settings-card that never
   received its own explicit dark override (Handwritten Signatures, Patient
   Data Management) rendered as an unstyled white island inside an otherwise
   dark-themed modal -- confirmed with live screenshots before starting this
   fix. Light mode is completely untouched below -- every rule here is scoped
   under html[data-nx-theme="dark"], so it can never affect the working
   default theme.
   ============================================================================ */
html[data-nx-theme="dark"] .settings-panel{background:#0f2438;color:#e7eef5}
html[data-nx-theme="dark"] .settings-header{border-bottom-color:#233c52}
html[data-nx-theme="dark"] .settings-header h2{color:#f2f6fa}
html[data-nx-theme="dark"] .close-settings{background:#16334c;border-color:#28496a;color:#b9cbdc}
html[data-nx-theme="dark"] .settings-group{border-bottom-color:#1d3750}
html[data-nx-theme="dark"] .settings-group-title h3{color:#f2f6fa}
html[data-nx-theme="dark"] .settings-group-title p{color:#8fa7bd}
html[data-nx-theme="dark"] .settings-panel label{color:#d3e0eb}
html[data-nx-theme="dark"] .settings-panel input,
html[data-nx-theme="dark"] .settings-panel select,
html[data-nx-theme="dark"] .settings-panel textarea{background:#16334c;border-color:#2c4d6d;color:#eef4f9}
html[data-nx-theme="dark"] .settings-panel input::placeholder{color:#6f889e}

/* Handwritten Signatures / Patient Data Management float their own cards
   next to the main panel rather than living inside .settings-group -- some
   built their inner container as an INLINE style="background:#fff" in the
   JS template itself, which no plain class selector can reach. Targeting
   the structural position (direct child of the card wrapper) with
   !important is the same escape hatch this stylesheet already relies on
   elsewhere for exactly this situation. */
html[data-nx-theme="dark"] .settings-card,
html[data-nx-theme="dark"] #msoapSignatureSettingsCard>div,
html[data-nx-theme="dark"] .msoap-data-card-inner{background:#16334c!important;border-color:#2c4d6d!important;color:#e7eef5}
html[data-nx-theme="dark"] .settings-card *,
html[data-nx-theme="dark"] #msoapSignatureSettingsCard>div *,
html[data-nx-theme="dark"] .msoap-data-card-inner *{color:inherit}
html[data-nx-theme="dark"] .msoap-data-card-inner>div:first-child span{color:#8fa7bd!important}
html[data-nx-theme="dark"] .settings-card small,
html[data-nx-theme="dark"] #msoapSignatureSettingsCard>div div[style*="color:#64748b"],
html[data-nx-theme="dark"] .msoap-data-card-inner small{color:#8fa7bd!important}
html[data-nx-theme="dark"] .msoap-data-buttons button,
html[data-nx-theme="dark"] .msoap-managed-actions button,
html[data-nx-theme="dark"] .msoap-signature-actions button{background:#1c3f5c!important;border-color:#33587c!important;color:#cfe0ee!important}
html[data-nx-theme="dark"] .msoap-data-buttons .danger,
html[data-nx-theme="dark"] .msoap-managed-actions .danger{background:#3a1f1f!important;border-color:#6b3535!important;color:#f0a5a0!important}
html[data-nx-theme="dark"] .msoap-signature-actions button.primary{background:#0f8f7a!important;border-color:#0f8f7a!important;color:#fff!important}

/* Signature capture modal (opened from the Handwritten Signatures card) --
   drawing on a black canvas would be unusable, so the canvas itself stays
   white deliberately (matching what gets printed/saved); only the dialog
   chrome around it goes dark. */
html[data-nx-theme="dark"] .msoap-signature-dialog{background:#0f2438!important;box-shadow:0 24px 70px rgba(0,0,0,.5)!important}
html[data-nx-theme="dark"] .msoap-signature-head div div{color:#8fa7bd!important}
html[data-nx-theme="dark"] .msoap-signature-head button{color:#cfe0ee}
html[data-nx-theme="dark"] .msoap-signature-note{color:#8fa7bd!important}

/* ============================================================================
   Dark mode — Phase 2: main clinical workspace (SOAP documentation).
   Root cause found: FOUR separate, uncoordinated color systems all compete for
   body's own background (--background var, the plain "PRO V2" body.nx-v2 rule,
   the "V59 MASTER UI" body.nx-master-ui rule, and the newer --surface-main
   token system) -- body carries BOTH nx-v2 AND nx-master-ui classes
   simultaneously in practice, and depending on which of the four systems'
   rules is textually last for a given sub-property, body's rendered
   background kept resolving to a stray light value none of the four systems'
   own dark branches actually intended. Untangling all four fully is a much
   larger undertaking than this phase -- this single, maximally-specific,
   last-in-file rule is the pragmatic, verified-correct fix: it authoritatively
   sets the one thing that actually matters (the visible page background/text)
   for dark mode, without deleting or fighting any of the four legacy systems.
   ============================================================================ */
html[data-nx-theme="dark"] body{background:#0b1118!important;color:#e7eef5!important}
html[data-nx-theme="dark"] .welcome-section h2{color:#f7fbff!important}
html[data-nx-theme="dark"] .welcome-section .eyebrow{color:#4dd8b8!important}
html[data-nx-theme="dark"] .welcome-section .subtitle{color:#9db4c7!important}
html[data-nx-theme="dark"] .form-section,
html[data-nx-theme="dark"] .section-card,
html[data-nx-theme="dark"] [class*="-card"]:not(.msoap-signature-dialog):not(.nx-network-card):not(.nx-passkey-row),
html[data-nx-theme="dark"] [class^="card"],
html[data-nx-theme="dark"] .card:not(.msoap-signature-dialog){background:#131c26!important;border-color:#2c4257!important;color:#e7eef5}
html[data-nx-theme="dark"] .form-section *:not(button):not(.badge):not(.pill),
html[data-nx-theme="dark"] .section-card *:not(button):not(.badge):not(.pill),
html[data-nx-theme="dark"] [class*="-card"]:not(.msoap-signature-dialog):not(.nx-network-card):not(.nx-passkey-row) *:not(button):not(.badge):not(.pill):not(select):not(input),
html[data-nx-theme="dark"] [class^="card"] *:not(button):not(.badge):not(.pill):not(select):not(input),
html[data-nx-theme="dark"] .card:not(.msoap-signature-dialog) *:not(button):not(.badge):not(.pill):not(select):not(input){color:inherit}
html[data-nx-theme="dark"] .form-section input,
html[data-nx-theme="dark"] .form-section select,
html[data-nx-theme="dark"] .form-section textarea,
html[data-nx-theme="dark"] .section-card input,
html[data-nx-theme="dark"] .section-card select,
html[data-nx-theme="dark"] .section-card textarea{background:#0e1720!important;border-color:#2c4257!important;color:#eef4f9!important}

/* Bug fix: an older, pre-existing rule (.form-section * {color:var(--nx-on-light)})
   assumed every card would always have a LIGHT background (hence the name
   "on-light" -- dark text meant to sit on a light surface) and unconditionally
   applied that dark color to every descendant, including plain <label>
   elements with no class at all. That assumption broke the moment the rules
   above gave these same cards a genuinely DARK background -- labels went
   dark-text-on-dark-background. Overriding with higher specificity + !important
   so labels/legends (and any other bare, unclassed text) always resolve to a
   light color inside a dark card, regardless of which older rule already
   claimed a --nx-on-light value for them. */
html[data-nx-theme="dark"] [class*="-card"] label,
html[data-nx-theme="dark"] [class*="-card"] legend,
html[data-nx-theme="dark"] [class^="card"] label,
html[data-nx-theme="dark"] .form-section label,
html[data-nx-theme="dark"] .form-section legend,
html[data-nx-theme="dark"] .section-card label,
html[data-nx-theme="dark"] .card:not(.msoap-signature-dialog) label{color:#dce6ee!important;-webkit-text-fill-color:#dce6ee!important}

/* Bug fix, root cause fully identified this time: the actual rule winning
   the cascade against every dark-mode attempt above is an older ID-selector
   block (body.nx-v2 :where(#patientSection,#subjectiveSection,#objectiveSection,
   #assessmentSection,#planSection,#reviewSection) :where(label,...)) explicitly
   titled "every FORM SECTION is a light clinical canvas" -- it was written to
   NEVER change with theme at all, and its 6 combined ID selectors give it far
   higher specificity than any class-based override, so it silently beat every
   class-based dark rule above regardless of !important (specificity is
   compared first among equally-important rules; only ties fall through to
   source order). The only way to override an ID-selector !important rule is
   an equal-or-higher-specificity selector with !important -- matching its own
   6 section IDs here, scoped to dark theme, is that fix. */
html[data-nx-theme="dark"] body.nx-v2 :where(
 #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,
 #planSection,#reviewSection
) :where(
 h1,h2,h3,h4,h5,h6,legend,
 .section-title,.module-title,.card-title,
 .assessment-subsection-title,.plan-subsection-title,
 .review-section-title,.review-soap-title,
 .review-checks-header h3,.review-final-note-header h3,
 .review-confirmation-label,.review-note-toolbar
):not(.section-label):not(.section-kicker):not(.review-block-kicker){
 color:#f7fbff!important;-webkit-text-fill-color:#f7fbff!important;opacity:1!important;text-shadow:none!important;
}
html[data-nx-theme="dark"] body.nx-v2 :where(
 #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,
 #planSection,#reviewSection
) :where(
 label,legend,strong,b,
 .form-label,.field-label,.input-label,.assessment-problem-label,
 .plan-problem-title,.review-check-item strong,.review-note-placeholder strong
):not(.button):not(.badge):not(.pill){
 color:#dce6ee!important;-webkit-text-fill-color:#dce6ee!important;opacity:1!important;text-shadow:none!important;
}
html[data-nx-theme="dark"] body.nx-v2 :where(
 #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,
 #planSection,#reviewSection
) :where(
 p,.description,.subtitle,.helper-text,.field-help,.field-helper,
 .field-description,.supporting-text,.supporting-copy,
 .review-checks-header p,.review-final-note-header p,
 .review-check-item p,.review-confirmation-help,
 .review-note-placeholder p
):not(.badge):not(.pill){
 color:#9fb5c5!important;-webkit-text-fill-color:#9fb5c5!important;opacity:1!important;text-shadow:none!important;
}

/* ============================================================================
   Dark mode — Phase 3: Patient Record, Provider Home, and shared modal shells
   (Network Center / Patient Lifecycle / Manage Patient Records / Visit History).
   Root cause for Patient Lifecycle specifically: its own inner content was
   already dark-themed in an earlier pass, but the SHARED dialog shell it reuses
   (.nx-network-center-dialog, also used by the Network Center itself) never
   got a dark background at all -- light-colored text sat on a still-white
   modal, which is the exact mirror-image of every other contrast bug found
   this session. Fixing the shared shell here also correctly carries the fix
   to the Network Center's own tabs (Referrals/Access/Messages/Handoffs).
   ============================================================================ */
html[data-nx-theme="dark"] .nx-lifecycle-dialog{background:#10283d;color:#e7eef5;border-color:#28496a}
html[data-nx-theme="dark"] .nx-lifecycle-body{background:#10283d;color:#e7eef5}
html[data-nx-theme="dark"] .nx-lifecycle-status-card{background:#142f47;border-color:#28496a}
html[data-nx-theme="dark"] .nx-lifecycle-status-card strong{color:#f2f6fa}
html[data-nx-theme="dark"] .nx-lifecycle-status-card p{color:#c5d4e0}
html[data-nx-theme="dark"] .nx-lifecycle-status-card small{color:#9db4c7}
html[data-nx-theme="dark"] .nx-lifecycle-status-icon,html[data-nx-theme="dark"] .nx-lifecycle-field-icon{background:#173a5b;color:#78a7ff}
html[data-nx-theme="dark"] .nx-lifecycle-field{border-bottom-color:#28445d}
html[data-nx-theme="dark"] .nx-lifecycle-form label{color:#e7eef5}
html[data-nx-theme="dark"] .nx-lifecycle-form input{background:#f7fbff;color:#17324d;border-color:#79a7ce}
html[data-nx-theme="dark"] .nx-lifecycle-help{color:#b7c9d8!important}
html[data-nx-theme="dark"] .nx-lifecycle-actions{background:#0d2235;border-top-color:#28445d}

html[data-nx-theme="dark"] .nx-lifecycle-header .nx-lifecycle-heading h2{color:#fff!important;-webkit-text-fill-color:#fff!important}
html[data-nx-theme="dark"] .nx-lifecycle-header .nx-lifecycle-heading p{color:rgba(255,255,255,.92)!important;-webkit-text-fill-color:rgba(255,255,255,.92)!important}
html[data-nx-theme="dark"] .nx-network-center-dialog{background:#0f2438!important;color:#e7eef5!important}
html[data-nx-theme="dark"] .nx-network-center-dialog>header{border-bottom-color:#233c52!important}
html[data-nx-theme="dark"] .nx-network-center-dialog header h2{color:#f2f6fa!important}
html[data-nx-theme="dark"] .nx-network-center-dialog header p{color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-network-center-dialog header button{background:#16334c!important;border-color:#28496a!important;color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-network-center-tabs{border-bottom-color:#233c52!important}
html[data-nx-theme="dark"] .nx-network-center-tabs button{background:#16334c!important;border-color:#28496a!important;color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-network-card{border-bottom-color:#233c52!important}
html[data-nx-theme="dark"] .nx-network-card strong{color:#f2f6fa!important}
html[data-nx-theme="dark"] .nx-network-card span,
html[data-nx-theme="dark"] .nx-network-card small{color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-network-card-actions button{background:#1c3f5c!important;border-color:#33587c!important;color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-network-empty{color:#9db4c7!important}
html[data-nx-theme="dark"] #nxNetworkCenterStatus{color:#9db4c7!important}

/* Manage Patient Records (Archive/Restore/Delete) -- same root cause as
   Patient Lifecycle: hardcoded white dialog background with unset text color
   inherited from a light-mode assumption. Covers every .msoap-history-dialog
   instance (this module reuses the same shell/class for several distinct
   modals, e.g. Visit History below). */
html[data-nx-theme="dark"] .msoap-history-dialog{background:#0f2438!important;color:#e7eef5!important}
html[data-nx-theme="dark"] .msoap-history-head{background:#16334c!important;border-bottom-color:#28496a!important}
html[data-nx-theme="dark"] .msoap-history-head strong{color:#f2f6fa!important}
html[data-nx-theme="dark"] .msoap-history-head span{color:#9db4c7!important}
html[data-nx-theme="dark"] .msoap-history-head button{background:#16334c!important;border-color:#28496a!important;color:#cfe0ee!important}
html[data-nx-theme="dark"] .msoap-data-tabs button{background:#16334c!important;border-color:#28496a!important;color:#cfe0ee!important}
html[data-nx-theme="dark"] .msoap-data-tabs button.active{background:#0f8f7a!important;border-color:#0f8f7a!important;color:#fff!important}
html[data-nx-theme="dark"] .msoap-managed-patient{border-top-color:#233c52!important}
html[data-nx-theme="dark"] .msoap-managed-patient>div:first-child strong{color:#f2f6fa!important}
html[data-nx-theme="dark"] .msoap-managed-patient>div:first-child span{color:#9db4c7!important}
html[data-nx-theme="dark"] .msoap-managed-actions button{background:#1c3f5c!important;border-color:#33587c!important;color:#cfe0ee!important}
html[data-nx-theme="dark"] .msoap-managed-actions button.danger{background:#3a1f1f!important;border-color:#6b3535!important;color:#f0a5a0!important}
html[data-nx-theme="dark"] .msoap-empty-history{color:#9db4c7!important}

/* Visit History panel (embedded below the Patient Record, not a modal) --
   same hardcoded-white pattern, this time with its own !important on the
   row background, matched here with equal specificity. */
html[data-nx-theme="dark"] .msoap-visit-history{background:#131c26!important;border-color:#2c4257!important}
html[data-nx-theme="dark"] .msoap-history-row{background:#131c26!important;border-bottom-color:#233c52!important}
html[data-nx-theme="dark"] .msoap-history-row:hover{background:#16334c!important}
html[data-nx-theme="dark"] .msoap-history-row strong{color:#f2f6fa!important}
html[data-nx-theme="dark"] .msoap-history-row small{color:#9db4c7!important}
html[data-nx-theme="dark"] .msoap-history-row b{color:#4dd8b8!important}
html[data-nx-theme="dark"] .msoap-history-head span{color:#9db4c7!important}
html[data-nx-theme="dark"] .msoap-history-head strong{color:#f2f6fa!important}
html[data-nx-theme="dark"] .msoap-history-head small{color:#7d94a8!important}

/* Privacy reminder note (shown throughout patient forms) */
html[data-nx-theme="dark"] .privacy-note{background:#16334c!important;border-color:#28496a!important}
html[data-nx-theme="dark"] .privacy-note strong{color:#f2f6fa!important;-webkit-text-fill-color:#f2f6fa!important}
html[data-nx-theme="dark"] .privacy-note{color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}
html[data-nx-theme="dark"] .privacy-icon{color:#4dd8b8!important;-webkit-text-fill-color:#4dd8b8!important}

/* ============================================================================
   Dark mode — Phase 5: Clinical Library (drug/diagnosis reference, smart
   suggestions). Same navy+teal palette as every prior phase.
   ============================================================================ */
html[data-nx-theme="dark"] .nx-library-shell{background:#0b1118!important;border-color:#233c52!important}
html[data-nx-theme="dark"] .nx-library-header{background:#0f2438!important}
html[data-nx-theme="dark"] .nx-library-close{background:#16334c!important;color:#cfe0ee!important;-webkit-text-fill-color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-library-tabs{background:#131c26!important;border-bottom-color:#233c52!important}
html[data-nx-theme="dark"] .nx-library-tab{background:#16334c!important;border-color:#2c4d6d!important;color:#cfe0ee!important;-webkit-text-fill-color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-library-tab.active{background:#0f8f7a!important;border-color:#0f8f7a!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html[data-nx-theme="dark"] .nx-library-search{background:#0e1720!important;border-color:#2c4257!important;color:#eef4f9!important;-webkit-text-fill-color:#eef4f9!important}
html[data-nx-theme="dark"] #nxLibrarySearch{background:#0e1720!important;border-color:#2c4257!important;color:#eef4f9!important;-webkit-text-fill-color:#eef4f9!important}
html[data-nx-theme="dark"] .nx-library-card{background:#131c26!important;border-color:#2c4257!important;color:#e7eef5!important}
html[data-nx-theme="dark"] .nx-library-card:hover{box-shadow:0 7px 20px rgba(0,0,0,.3)!important}
html[data-nx-theme="dark"] .nx-library-card strong{color:#f2f6fa!important;-webkit-text-fill-color:#f2f6fa!important}
html[data-nx-theme="dark"] .nx-library-card small{color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-library-detail{background:#131c26!important;border-color:#2c4257!important}
html[data-nx-theme="dark"] .nx-library-detail h3{color:#f2f6fa!important;-webkit-text-fill-color:#f2f6fa!important}
html[data-nx-theme="dark"] .nx-library-kv{background:#16334c!important}
html[data-nx-theme="dark"] .nx-library-kv b{color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-library-action{background:#0f8f7a!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html[data-nx-theme="dark"] .nx-library-back{background:#16334c!important;border-color:#2c4d6d!important;color:#cfe0ee!important;-webkit-text-fill-color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-smart-suggestions{background:#131c26!important;border-color:#2c4257!important}
html[data-nx-theme="dark"] .nx-smart-suggestions-title{color:#f2f6fa!important;-webkit-text-fill-color:#f2f6fa!important}
html[data-nx-theme="dark"] .nx-smart-chip{background:#16334c!important;border-color:#2c4d6d!important;color:#cfe0ee!important;-webkit-text-fill-color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-smart-chip:hover{background:#1c3f5c!important}
html[data-nx-theme="dark"] .nx-smart-card{background:#131c26!important;border-color:#2c4257!important}
html[data-nx-theme="dark"] .nx-smart-card-row strong{color:#f2f6fa!important;-webkit-text-fill-color:#f2f6fa!important}
html[data-nx-theme="dark"] .nx-smart-why{background:#16334c!important;border-color:#2c4d6d!important;color:#cfe0ee!important;-webkit-text-fill-color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-smart-add{background:#0f8f7a!important;border-color:#0f8f7a!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html[data-nx-theme="dark"] .nx-smart-dismiss{background:#16334c!important;border-color:#2c4d6d!important;color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-smart-why-text{background:#0e1720!important;color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-smart-guideline{border-top-color:#233c52!important;color:#7d94a8!important;-webkit-text-fill-color:#7d94a8!important}
html[data-nx-theme="dark"] .nx-smart-guideline span{color:#cfe0ee!important;-webkit-text-fill-color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-smart-guideline a{color:#4dd8b8!important;-webkit-text-fill-color:#4dd8b8!important}
html[data-nx-theme="dark"] .nx-internal-alert{background:#3a3014!important;border-color:#5c4c1f!important;color:#f0c96a!important;-webkit-text-fill-color:#f0c96a!important}

/* Bulk-select toolbar + floating "Review Plan" dock at the bottom of the
   Clinical Library -- both use their own !important light-mode declarations,
   matched here with equal priority. */
html[data-nx-theme="dark"] .nx-library-bulk-toolbar{background:#131c26!important;border-color:#2c4257!important}
html[data-nx-theme="dark"] .nx-library-bulk-toolbar button{background:#16334c!important;border-color:#2c4d6d!important;color:#cfe0ee!important;-webkit-text-fill-color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-library-select-card{color:#e7eef5!important}
html[data-nx-theme="dark"] .nx-basket-items label{background:#131c26!important;border-color:#2c4257!important;color:#e7eef5!important}
html[data-nx-theme="dark"] .nx-basket-title{color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-smart-library-dock{background:rgba(15,36,56,.96)!important;border-color:#233c52!important}
html[data-nx-theme="dark"] .nx-smart-library-dock strong{color:#f2f6fa!important;-webkit-text-fill-color:#f2f6fa!important}
html[data-nx-theme="dark"] .nx-smart-library-dock small{color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-smart-library-dock button{background:#16334c!important;color:#cfe0ee!important;-webkit-text-fill-color:#cfe0ee!important}
html[data-nx-theme="dark"] .nx-smart-library-dock.has-items button{background:#0f8f7a!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html[data-nx-theme="dark"] .nx-tutorial-card{background:#131c26!important;color:#e7eef5}
html[data-nx-theme="dark"] .nx-tutorial-card small{color:#4dd8b8!important;-webkit-text-fill-color:#4dd8b8!important}
html[data-nx-theme="dark"] .nx-tutorial-card p{color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-tutorial-card button{background:#16334c!important;border-color:#2c4d6d!important;color:#cfe0ee!important;-webkit-text-fill-color:#cfe0ee!important}

/* Drug formulary filter bar (Clinical Library > Drugs tab, also reused by
   Prescribe Rx's quick action) */
html[data-nx-theme="dark"] .nx-drug-filterbar{background:#131c26!important;border-color:#2c4257!important}
html[data-nx-theme="dark"] .nx-drug-filterbar label{color:#e7eef5!important;-webkit-text-fill-color:#e7eef5!important}
html[data-nx-theme="dark"] .nx-drug-filterbar select{background:#0e1720!important;border-color:#2c4257!important;color:#eef4f9!important;-webkit-text-fill-color:#eef4f9!important}
html[data-nx-theme="dark"] .nx-drug-filterbar span{color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}
html[data-nx-theme="dark"] .nx-drug-card .nx-drug-class{color:#4dd8b8!important;-webkit-text-fill-color:#4dd8b8!important}
html[data-nx-theme="dark"] .nx-drug-card .nx-drug-spec{color:#9db4c7!important;-webkit-text-fill-color:#9db4c7!important}

/* =========================================================
   NOVU Hx — cinematic full-screen login video
   Visual layer only: authentication DOM/handlers remain unchanged.
   Two synchronized media layers crossfade at the seam so the ~8 s
   source can repeat without a hard loop cut.
   ========================================================= */
#nxAccessGate{
  --nx-access-pad:clamp(22px,3vw,48px);
  overflow:hidden!important;
  padding:var(--nx-access-pad)!important;
  background:#001326!important;
  isolation:isolate;
}
#nxAccessGate .nx-login-video-stage{
  position:fixed;inset:0;z-index:-3;overflow:hidden;pointer-events:none;background:#001326;
}
#nxAccessGate .nx-login-bg-video{
  position:absolute;inset:-2%;width:104%;height:104%;object-fit:cover;object-position:center center;
  opacity:0;transition:opacity 1.15s cubic-bezier(.4,0,.2,1);will-change:opacity,transform;
  transform:scale(1.015);filter:saturate(.96) contrast(1.03);
}
#nxAccessGate .nx-login-bg-video.is-active{opacity:1}
#nxAccessGate:before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:linear-gradient(90deg,rgba(0,12,27,.72) 0%,rgba(0,18,38,.47) 42%,rgba(0,12,28,.58) 100%);
}
#nxAccessGate:after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(circle at 50% 45%,transparent 15%,rgba(0,7,18,.18) 100%);
}
#nxAccessGate .nx-access-wrap{
  position:relative;z-index:1;min-height:calc(100dvh - clamp(36px,4.4vw,68px));
  width:100%;max-width:1500px!important;margin:0 auto!important;box-sizing:border-box;
  grid-template-columns:minmax(0,1fr) minmax(420px,520px)!important;
  gap:clamp(42px,7vw,120px)!important;align-items:center!important;
}
#nxAccessGate .nx-access-brand{
  position:relative!important;isolation:auto!important;overflow:visible!important;border-radius:0!important;
  min-height:440px;display:flex;flex-direction:column;justify-content:center;
  background:transparent!important;padding:clamp(22px,3vw,46px)!important;
}
#nxAccessGate .nx-access-brand:before{display:none!important}
#nxAccessGate .nx-access-brand h1,#nxAccessGate .nx-access-brand p{
  position:relative;z-index:2;padding-left:0!important;padding-right:0!important;
  text-shadow:0 3px 24px rgba(0,0,0,.72)!important;
}
#nxAccessGate .nx-access-brand h1{padding-top:0!important}
#nxAccessGate .nx-access-brand p{padding-bottom:0!important;max-width:610px!important}
#nxAccessGate .nx-access-brand>.nx-login-video-stage{position:fixed!important}
#nxAccessGate .nx-access-card{
  justify-self:end;width:100%;box-sizing:border-box;
  background:linear-gradient(155deg,rgba(4,34,62,.88),rgba(1,22,43,.93))!important;
  border:1px solid rgba(91,187,241,.36)!important;
  box-shadow:0 30px 90px rgba(0,6,18,.56)!important;
  backdrop-filter:blur(18px) saturate(1.08)!important;-webkit-backdrop-filter:blur(18px) saturate(1.08)!important;
}
#nxAccessGate.nx-video-off .nx-login-video-stage{display:none!important}
@media(max-width:900px){
 #nxAccessGate{overflow:auto!important;padding:16px!important}
 #nxAccessGate .nx-access-wrap{grid-template-columns:1fr!important;min-height:calc(100dvh - 32px);gap:16px!important}
 #nxAccessGate .nx-access-brand{display:none!important}
 #nxAccessGate .nx-access-card{justify-self:center;width:min(100%,540px)!important;margin:auto!important}
 #nxAccessGate:before{background:rgba(0,12,28,.62)}
}
@media(prefers-reduced-motion:reduce){#nxAccessGate .nx-login-bg-video{transition:none!important}}

/* =========================================================
   NOVU Hx V26.1 — CINEMATIC LOGIN COMPOSITING ROOT FIX
   The media layer must live ABOVE the gate fallback background and BELOW
   all auth UI. Negative z-index inside an isolated gate hid the video.
   ========================================================= */
#nxAccessGate{position:fixed!important;inset:0!important;z-index:10000!important;background:#001326!important;isolation:isolate!important;overflow:hidden!important}
#nxAccessGate .nx-login-video-stage{position:absolute!important;inset:0!important;z-index:0!important;overflow:hidden!important;pointer-events:none!important;background:#001326!important}
#nxAccessGate .nx-login-bg-video{position:absolute!important;inset:-2%!important;width:104%!important;height:104%!important;object-fit:cover!important;object-position:center center!important;transform:scale(1.015)!important}
#nxAccessGate:before{z-index:1!important;background:linear-gradient(90deg,rgba(0,10,24,.70) 0%,rgba(0,14,31,.43) 43%,rgba(0,10,25,.60) 100%)!important}
#nxAccessGate:after{z-index:2!important;background:radial-gradient(circle at 50% 44%,transparent 10%,rgba(0,6,17,.20) 100%)!important}
#nxAccessGate .nx-access-wrap{z-index:3!important;width:100%!important;max-width:1625px!important;box-sizing:border-box!important;grid-template-columns:minmax(0,1fr) minmax(440px,560px)!important;gap:clamp(36px,5vw,84px)!important}
#nxAccessGate .nx-access-brand{min-height:560px!important;padding:clamp(18px,2.5vw,40px)!important;justify-content:center!important}
#nxAccessGate .nx-access-brand .nx-brand-logo{width:140px!important;height:140px!important;margin:0 0 34px!important;filter:drop-shadow(0 18px 36px rgba(0,126,255,.28))!important}
#nxAccessGate .nx-access-brand h1{font-size:clamp(72px,6.2vw,108px)!important;line-height:.92!important;letter-spacing:-.06em!important;margin:0 0 24px!important}
#nxAccessGate .nx-access-brand>p:not(.nx-professional-tagline){font-size:clamp(17px,1.25vw,21px)!important;line-height:1.55!important;max-width:720px!important;color:#d1e2ee!important}
#nxAccessGate .nx-access-brand .nx-professional-tagline{width:min(100%,720px)!important;margin-top:44px!important;padding-top:22px!important;border-top:1px solid rgba(130,199,239,.28)!important;color:#d5e4ef!important;font-size:12px!important;opacity:.96!important}
#nxAccessGate .nx-access-card{width:100%!important;max-width:620px!important;padding:32px!important;border-radius:28px!important;background:linear-gradient(155deg,rgba(3,34,61,.82),rgba(1,22,43,.89))!important;border:1px solid rgba(91,187,241,.42)!important;box-shadow:0 34px 100px rgba(0,5,17,.58)!important;backdrop-filter:blur(20px) saturate(1.1)!important;-webkit-backdrop-filter:blur(20px) saturate(1.1)!important}
@media(max-width:1100px){#nxAccessGate{--nx-access-pad:clamp(20px,3.2vw,34px)}#nxAccessGate .nx-access-wrap{grid-template-columns:minmax(0,1fr) minmax(390px,46%)!important;gap:clamp(24px,3.2vw,34px)!important}#nxAccessGate .nx-access-brand .nx-brand-logo{width:108px!important;height:108px!important}#nxAccessGate .nx-access-brand h1{font-size:clamp(58px,7vw,82px)!important}}
@media(max-width:900px){#nxAccessGate{overflow:auto!important}#nxAccessGate .nx-access-wrap{grid-template-columns:1fr!important}#nxAccessGate .nx-access-brand{display:none!important}#nxAccessGate .nx-access-card{max-width:560px!important}#nxAccessGate:before{background:rgba(0,12,28,.58)!important}}

/* NOVU Hx V28 — verified cinematic media visibility hardening */
#nxAccessGate .nx-login-video-stage{background:transparent!important;display:block!important;visibility:visible!important;opacity:1!important}
#nxAccessGate .nx-login-bg-video{display:block!important;visibility:visible!important}
#nxAccessGate .nx-login-bg-video.is-active{opacity:1!important}
#nxAccessGate:not(.nx-video-off) .nx-login-bg-a{opacity:1}
#nxAccessGate.nx-video-off .nx-login-video-stage{display:none!important}

/* NOVU Hx V29 — cinematic composition: keep the hero cube clear of auth card.
   The source is deliberately oversized and shifted left while preserving full-viewport cover.
   Auth card is modestly narrowed on wide screens; authentication behavior is untouched. */
@media(min-width:1101px){
  #nxAccessGate .nx-login-bg-video{
    inset:-4% -2% -4% -10%!important;
    width:112%!important;
    height:108%!important;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
  }
  #nxAccessGate .nx-access-wrap{
    grid-template-columns:minmax(0,1fr) minmax(430px,520px)!important;
    gap:clamp(36px,4.5vw,72px)!important;
  }
  #nxAccessGate .nx-access-card{max-width:560px!important;padding:30px!important}
}

/* =========================================================
   NOVU Hx V31 — CUBE VISIBILITY + GLASS AUTH + METALLIC WORDMARK
   Visual-only refinement on top of V30. Auth logic/theme defaults unchanged.
   ========================================================= */
@media(min-width:901px){
  #nxAccessGate{
    --nx-access-pad:clamp(22px,2.35vw,42px);
  }
  #nxAccessGate .nx-access-wrap{
    width:100%!important;
    max-width:1680px!important;
    grid-template-columns:minmax(0,1fr) clamp(380px,calc(20vw + 160px),520px)!important;
    gap:clamp(28px,3.2vw,58px)!important;
    align-items:center!important;
  }
  #nxAccessGate .nx-access-card{
    width:100%!important;
    max-width:none!important;
    justify-self:end!important;
    padding:clamp(22px,1.45vw,26px)!important;
    border-radius:24px!important;
    background:linear-gradient(155deg,rgba(3,34,61,.66),rgba(1,22,43,.74))!important;
    border-color:rgba(112,202,255,.46)!important;
    box-shadow:0 28px 82px rgba(0,5,17,.48),inset 0 1px 0 rgba(255,255,255,.05)!important;
    backdrop-filter:blur(16px) saturate(1.12)!important;
    -webkit-backdrop-filter:blur(16px) saturate(1.12)!important;
  }
  #nxAccessGate .nx-access-brand{
    min-width:0!important;
    padding-left:clamp(18px,1.5vw,28px)!important;
    padding-right:clamp(18px,1.5vw,28px)!important;
  }
  #nxAccessGate .nx-access-brand h1{
    font-size:clamp(58px,5.1vw,92px)!important;
  }
  #nxAccessGate .nx-access-brand>p:not(.nx-professional-tagline){
    font-size:clamp(15px,1.18vw,20px)!important;
    max-width:680px!important;
  }
}
@media(min-width:901px) and (max-width:1180px){
  #nxAccessGate .nx-access-wrap{
    grid-template-columns:minmax(0,1fr) clamp(380px,40vw,430px)!important;
    gap:clamp(20px,2.4vw,30px)!important;
  }
  #nxAccessGate .nx-access-brand .nx-brand-logo{width:92px!important;height:92px!important;margin-bottom:22px!important}
  #nxAccessGate .nx-access-brand h1{font-size:clamp(54px,6.2vw,70px)!important;margin-bottom:18px!important}
  #nxAccessGate .nx-access-brand .nx-professional-tagline{margin-top:28px!important;padding-top:16px!important}
}
#nxAccessGate .nx-access-brand h1{
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  background:linear-gradient(180deg,#ffffff 0%,#d9e5ee 26%,#7f98aa 48%,#f7fbff 67%,#9eb3c2 82%,#eef6fb 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  filter:drop-shadow(0 3px 2px rgba(0,0,0,.62)) drop-shadow(0 0 16px rgba(60,174,255,.12));
  text-shadow:none!important;
}

/* NOVU Hx V32 — seamless cinematic loop: source asset is pre-blended tail→head; runtime crossfade extended to 1.15 s as a second seam guard. */

/* ============================================================================
   TRUE CORE V34 — SOAP SURFACE CONTRAST CONTRACT
   Canonical rule: typography follows the rendered surface, never the global
   theme. System mode resolves to data-nx-theme="dark" when the OS is dark, so
   this single contract covers both Dark and System-dark without parallel
   theme patches. Light clinical canvases intentionally remain light and own
   dark readable typography; dark clinical canvases own light typography.
   ============================================================================ */
html[data-nx-theme="dark"] body.nx-v2 :where(
  #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection
) :where(
  .msoap-record-finder,.msoap-patient-record-card,
  .hpi-smart-guide,.hpi-completeness,
  .assessment-block,.assessment-problem-card,.assessment-clinical-notice,.assessment-patient-context,
  .plan-block,.plan-problem-card,.plan-problem-header,.plan-context-card,.plan-patient-context,
  .novu-plan-clinical-support,.novu-plan-support-item,
  .review-card,.clinical-review-card,.patient-context-card,.context-card,
  .section-card.light,.module-card.light,.white-card,.card-white
){color:#29465f!important;-webkit-text-fill-color:#29465f!important}

html[data-nx-theme="dark"] body.nx-v2 :where(
  #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection
) :where(
  .msoap-record-finder,.msoap-patient-record-card,
  .hpi-smart-guide,.hpi-completeness,
  .assessment-block,.assessment-problem-card,.assessment-clinical-notice,.assessment-patient-context,
  .plan-block,.plan-problem-card,.plan-problem-header,.plan-context-card,.plan-patient-context,
  .novu-plan-clinical-support,.novu-plan-support-item,
  .review-card,.clinical-review-card,.patient-context-card,.context-card,
  .section-card.light,.module-card.light,.white-card,.card-white
) :where(h1,h2,h3,h4,h5,h6,legend,label,strong,b,.form-label,.field-label,.input-label,.card-title,.module-title,.assessment-problem-label,.assessment-subsection-title,.plan-problem-title,.plan-problem-diagnosis,.plan-subsection-title h3,.plan-subsection-title h4,.hpi-smart-guide-copy strong,.hpi-smart-guide-copy b,.hpi-completeness-top strong,.novu-plan-support-group>strong,.novu-plan-clinical-support>header>strong){
  color:#0b1f33!important;-webkit-text-fill-color:#0b1f33!important;opacity:1!important;text-shadow:none!important
}
html[data-nx-theme="dark"] body.nx-v2 :where(
  #patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection
) :where(
  .msoap-record-finder,.msoap-patient-record-card,
  .hpi-smart-guide,.hpi-completeness,
  .assessment-block,.assessment-problem-card,.assessment-clinical-notice,.assessment-patient-context,
  .plan-block,.plan-problem-card,.plan-problem-header,.plan-context-card,.plan-patient-context,
  .novu-plan-clinical-support,.novu-plan-support-item,
  .review-card,.clinical-review-card,.patient-context-card,.context-card,
  .section-card.light,.module-card.light,.white-card,.card-white
) :where(p,small,span,em,.description,.subtitle,.helper-text,.field-help,.field-helper,.field-description,.supporting-text,.supporting-copy,.clinical-copy,.assessment-helper,.plan-helper,.meta,.hint,.optional-label){
  color:#3f5e76!important;-webkit-text-fill-color:#3f5e76!important;opacity:1!important;text-shadow:none!important
}
/* Preserve semantic accents/statuses on light SOAP canvases. */
html[data-nx-theme="dark"] body.nx-v2 .plan-problem-number{color:#fff!important;-webkit-text-fill-color:#fff!important}
html[data-nx-theme="dark"] body.nx-v2 :where(.plan-block-kicker,.assessment-block-kicker,.section-kicker,.section-label,.msoap-record-eyebrow){color:#1267a8!important;-webkit-text-fill-color:#1267a8!important;opacity:1!important}
html[data-nx-theme="dark"] body.nx-v2 .plan-problem-status[data-status="progress"]{color:#9a3412!important;-webkit-text-fill-color:#9a3412!important}
html[data-nx-theme="dark"] body.nx-v2 .plan-problem-status[data-status="complete"]{color:#047857!important;-webkit-text-fill-color:#047857!important}
html[data-nx-theme="dark"] body.nx-v2 .hpi-detect-chip{color:#475569!important;-webkit-text-fill-color:#475569!important}
html[data-nx-theme="dark"] body.nx-v2 .hpi-detect-chip.detected{color:#166534!important;-webkit-text-fill-color:#166534!important}
/* Inputs/selects on light SOAP canvases remain explicit high-contrast controls. */
html[data-nx-theme="dark"] body.nx-v2 :where(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(.msoap-record-finder,.assessment-block,.assessment-problem-card,.plan-block,.plan-problem-card,.review-card,.clinical-review-card) :where(input,textarea,select){color:#102a43!important;-webkit-text-fill-color:#102a43!important;background:#eef6fb!important;border-color:#78acd2!important;opacity:1!important}
html[data-nx-theme="dark"] body.nx-v2 :where(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(.msoap-record-finder,.assessment-block,.assessment-problem-card,.plan-block,.plan-problem-card,.review-card,.clinical-review-card) :where(input,textarea)::placeholder{color:#6b8498!important;-webkit-text-fill-color:#6b8498!important;opacity:1!important}
/* Disabled controls must read as disabled, not disappear. */
html[data-nx-theme="dark"] :where(.settings-panel,#msoapSignatureSettingsCard) button:disabled{color:#9fb5c5!important;-webkit-text-fill-color:#9fb5c5!important;background:#1a354d!important;border-color:#355873!important;opacity:.82!important}

/* ============================================================================
   TRUE CORE V34 — SOAP DARK/SYSTEM FOREGROUND OWNERSHIP
   Root correction: several SOAP components are intentionally LIGHT clinical
   canvases even while the application shell is dark. They now own their own
   foreground palette at the component root. This prevents global dark-theme
   inheritance from bleaching text and covers System-dark because System is
   canonically resolved to data-nx-theme="dark" before render.
   ============================================================================ */
html[data-nx-theme="dark"] body.nx-v2 {
  --soap-light-title:#0b1f33;
  --soap-light-text:#17324d;
  --soap-light-body:#36546b;
  --soap-light-muted:#5f7689;
  --soap-light-border:#cbdbe7;
}
/* Exact light clinical surfaces used across all six SOAP stages. */
html[data-nx-theme="dark"] body.nx-v2 :is(
 .msoap-record-finder,.hpi-smart-guide,.hpi-completeness,
 .plan-block,.plan-problem-header,.novu-plan-clinical-support,.novu-plan-support-item,
 .assessment-problem-header,.assessment-clinical-notice,
 .review-checks-card,.review-final-note-card,.review-confirmation-card
){color:var(--soap-light-text)!important;-webkit-text-fill-color:var(--soap-light-text)!important}
html[data-nx-theme="dark"] body.nx-v2 :is(
 .msoap-record-finder,.hpi-smart-guide,.hpi-completeness,
 .plan-block,.plan-problem-header,.novu-plan-clinical-support,.novu-plan-support-item,
 .assessment-problem-header,.assessment-clinical-notice,
 .review-checks-card,.review-final-note-card,.review-confirmation-card
) :is(h1,h2,h3,h4,h5,h6,strong,b,legend,label,.section-title,.card-title,.module-title){
 color:var(--soap-light-title)!important;-webkit-text-fill-color:var(--soap-light-title)!important;opacity:1!important;text-shadow:none!important
}
html[data-nx-theme="dark"] body.nx-v2 :is(
 .msoap-record-finder,.hpi-smart-guide,.hpi-completeness,
 .plan-block,.plan-problem-header,.novu-plan-clinical-support,.novu-plan-support-item,
 .assessment-problem-header,.assessment-clinical-notice,
 .review-checks-card,.review-final-note-card,.review-confirmation-card
) :is(p,small,em,span,.description,.subtitle,.helper-text,.field-help,.supporting-text){
 color:var(--soap-light-body)!important;-webkit-text-fill-color:var(--soap-light-body)!important;opacity:1!important;text-shadow:none!important
}
/* Exact components from the reported regressions. */
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-guide-copy{color:#29465f!important;-webkit-text-fill-color:#29465f!important}
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-guide-copy strong,
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-guide-copy b{color:#102a43!important;-webkit-text-fill-color:#102a43!important}
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-guide-copy em{color:#526d82!important;-webkit-text-fill-color:#526d82!important}
html[data-nx-theme="dark"] body.nx-v2 .novu-plan-clinical-support>header>strong,
html[data-nx-theme="dark"] body.nx-v2 .novu-plan-support-group>strong{color:#17324d!important;-webkit-text-fill-color:#17324d!important}
html[data-nx-theme="dark"] body.nx-v2 .novu-plan-clinical-support>header>small,
html[data-nx-theme="dark"] body.nx-v2 .novu-plan-support-provenance{color:#526d82!important;-webkit-text-fill-color:#526d82!important}
html[data-nx-theme="dark"] body.nx-v2 .novu-plan-support-item>span{color:#203d54!important;-webkit-text-fill-color:#203d54!important}
/* Buttons on the light suggestion canvas remain readable and visibly interactive. */
html[data-nx-theme="dark"] body.nx-v2 .novu-plan-support-item button{background:#f7fbff!important;border-color:#71879a!important;color:#18354d!important;-webkit-text-fill-color:#18354d!important;opacity:1!important}
/* Runtime signature card: static fallback mirrors the runtime-injected V34 rule. */
html[data-nx-theme="dark"] #msoapSignatureSettingsCard .msoap-signature-btn,
html[data-nx-theme="dark"] #msoapSignatureSettingsCard .msoap-signature-btn:disabled{background:#102c43!important;border-color:#4d7696!important;color:#eaf6ff!important;-webkit-text-fill-color:#eaf6ff!important;opacity:1!important}

/* V34 seamless runtime dissolve: two independent decoders overlap for 2 seconds.
   Native <video loop> is deliberately disabled in JS so the browser cannot expose
   a one-frame end→start cut underneath the dissolve. */
#nxAccessGate .nx-login-bg-video{transition:opacity 3.2s cubic-bezier(.45,0,.55,1)!important}

/* =============================================================
   V35 CANONICAL SOAP FOREGROUND OWNERSHIP
   Dark/System-dark shell + intentionally light clinical canvas.
   This block supersedes legacy theme inheritance for the complete
   six-step SOAP workspace. Every light clinical surface owns dark
   readable foreground tokens; interactive semantic controls retain
   their own foreground/background pair.
   ============================================================= */
html[data-nx-theme="dark"] body.nx-v2 {
  --soap-canvas-text:#102a43;
  --soap-canvas-title:#0b1f33;
  --soap-canvas-body:#29465f;
  --soap-canvas-muted:#526d82;
  --soap-canvas-placeholder:#5a7387;
}
html[data-nx-theme="dark"] body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(
  .form-section,.section-card,.module-card,.clinical-card,.patient-card,.patient-context-card,
  .msoap-record-finder,.msoap-record-card,.msoap-profile-update,.hpi-smart-guide,.hpi-completeness,
  .assessment-block,.assessment-problem-card,.plan-block,.plan-problem-card,.review-card,.clinical-review-card,
  .novu-plan-clinical-support,.novu-plan-support-group,.education-card,.precautions-card
){color:var(--soap-canvas-text)!important;-webkit-text-fill-color:var(--soap-canvas-text)!important}
html[data-nx-theme="dark"] body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(
  .form-section,.section-card,.module-card,.clinical-card,.patient-card,.patient-context-card,
  .msoap-record-finder,.msoap-record-card,.msoap-profile-update,.hpi-smart-guide,.hpi-completeness,
  .assessment-block,.assessment-problem-card,.plan-block,.plan-problem-card,.review-card,.clinical-review-card,
  .novu-plan-clinical-support,.novu-plan-support-group,.education-card,.precautions-card
) :where(h1,h2,h3,h4,h5,h6,legend,.form-label,label,strong,b,.title,[class*="title"],[class*="heading"]){
  color:var(--soap-canvas-title)!important;-webkit-text-fill-color:var(--soap-canvas-title)!important;opacity:1!important;text-shadow:none!important
}
html[data-nx-theme="dark"] body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(
  .form-section,.section-card,.module-card,.clinical-card,.patient-card,.patient-context-card,
  .msoap-record-finder,.msoap-record-card,.msoap-profile-update,.hpi-smart-guide,.hpi-completeness,
  .assessment-block,.assessment-problem-card,.plan-block,.plan-problem-card,.review-card,.clinical-review-card,
  .novu-plan-clinical-support,.novu-plan-support-group,.education-card,.precautions-card
) :where(p,small,em,li,.helper-text,.field-help,.field-helper,.description,.subtitle,.hint,[class*="helper"],[class*="description"],[class*="subtitle"]){
  color:var(--soap-canvas-body)!important;-webkit-text-fill-color:var(--soap-canvas-body)!important;opacity:1!important;text-shadow:none!important
}
html[data-nx-theme="dark"] body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(input:not([type="button"]):not([type="submit"]):not([type="reset"]),textarea,select){
  color:#102a43!important;-webkit-text-fill-color:#102a43!important;background:#f7fbff!important;border-color:#78a8c9!important;opacity:1!important
}
html[data-nx-theme="dark"] body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(input,textarea)::placeholder{
  color:var(--soap-canvas-placeholder)!important;-webkit-text-fill-color:var(--soap-canvas-placeholder)!important;opacity:1!important
}
/* Preserve semantic/action controls as explicit dark/light pairs rather than inheriting canvas text. */
html[data-nx-theme="dark"] body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(button,.btn,[role="button"]){opacity:1}
html[data-nx-theme="dark"] body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(.btn-primary,.primary-btn,.nx-primary,[class*="primary"]):not(.section-label){color:#fff!important;-webkit-text-fill-color:#fff!important}
html[data-nx-theme="dark"] body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :where(button:disabled,.btn:disabled){opacity:.72!important}
/* Signature card is a genuinely dark surface and therefore owns a light foreground. */
html[data-nx-theme="dark"] body.nx-v2 #msoapSignatureSettingsCard,
html[data-nx-theme="dark"] body.nx-v2 #msoapSignatureSettingsCard > div{color:#eaf6ff!important;-webkit-text-fill-color:#eaf6ff!important}
html[data-nx-theme="dark"] body.nx-v2 #msoapSignatureSettingsCard :where(strong,h1,h2,h3,h4,label){color:#f7fbff!important;-webkit-text-fill-color:#f7fbff!important;opacity:1!important}
html[data-nx-theme="dark"] body.nx-v2 #msoapSignatureSettingsCard :where(p,small,span){color:#c9dce9!important;-webkit-text-fill-color:#c9dce9!important;opacity:1!important}
html[data-nx-theme="dark"] body.nx-v2 #msoapSignatureSettingsCard .msoap-signature-btn,
html[data-nx-theme="dark"] body.nx-v2 #msoapSignatureSettingsCard .msoap-signature-btn:disabled{background:#173c58!important;border-color:#5d86a5!important;color:#f7fbff!important;-webkit-text-fill-color:#f7fbff!important;opacity:1!important}

/* V36 Dark/System-dark interactive-state legibility contract.
   Disabled means unavailable, never invisible. */
html[data-nx-theme="dark"] body.nx-v2 :is(button,input,select,textarea):disabled,
html[data-nx-theme="dark"] body.nx-v2 [aria-disabled="true"]{
  opacity:1!important;
}
html[data-nx-theme="dark"] body.nx-v2 button:disabled,
html[data-nx-theme="dark"] body.nx-v2 [role="button"][aria-disabled="true"]{
  color:#dceaf4!important;-webkit-text-fill-color:#dceaf4!important;
  background-color:#27465d!important;border-color:#607f96!important;
}
html[data-nx-theme="dark"] body.nx-v2 input:disabled,
html[data-nx-theme="dark"] body.nx-v2 textarea:disabled,
html[data-nx-theme="dark"] body.nx-v2 select:disabled{
  color:#29465f!important;-webkit-text-fill-color:#29465f!important;
  background-color:#e8f0f5!important;border-color:#7895aa!important;
}

/* ============================================================================
   V41 CANONICAL SOAP SURFACE OWNERSHIP
   Root rule: the SOAP workspace uses light clinical cards in every app theme.
   The shell may be Dark/System-dark, but these cards never inherit shell ink.
   This deliberately replaces older theme-wide foreground assumptions.
   ============================================================================ */
body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :is(
  .form-section,.section-card,.module-card,.clinical-card,.patient-card,.patient-context-card,
  .msoap-record-finder,.msoap-patient-record-card,.msoap-profile-update,
  .hpi-smart-guide,.hpi-completeness,
  .assessment-block,.assessment-problem-card,.assessment-clinical-notice,.assessment-patient-context,
  .plan-block,.plan-problem-card,.plan-problem-header,.plan-context-card,.plan-patient-context,
  .novu-plan-clinical-support,.novu-plan-support-item,.novu-plan-support-group,
  .education-card,.precautions-card,.review-card,.clinical-review-card,
  .review-checks-card,.review-final-note-card,.review-confirmation-card
){
  background:#ffffff!important;
  background-color:#ffffff!important;
  color:#17324d!important;
  -webkit-text-fill-color:#17324d!important;
  border-color:#cbdbe7!important;
}
body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :is(
  .form-section,.section-card,.module-card,.clinical-card,.patient-card,.patient-context-card,
  .msoap-record-finder,.msoap-patient-record-card,.msoap-profile-update,
  .hpi-smart-guide,.hpi-completeness,
  .assessment-block,.assessment-problem-card,.assessment-clinical-notice,.assessment-patient-context,
  .plan-block,.plan-problem-card,.plan-problem-header,.plan-context-card,.plan-patient-context,
  .novu-plan-clinical-support,.novu-plan-support-item,.novu-plan-support-group,
  .education-card,.precautions-card,.review-card,.clinical-review-card,
  .review-checks-card,.review-final-note-card,.review-confirmation-card
) :is(h1,h2,h3,h4,h5,h6,legend,label,strong,b,.form-label,.field-label,.input-label,.title,[class*="title"],[class*="heading"]){
  color:#0b1f33!important;
  -webkit-text-fill-color:#0b1f33!important;
  opacity:1!important;
  text-shadow:none!important;
}
body.nx-v2 :is(#patientSection,#subjectiveSection,#objectiveSection,#assessmentSection,#planSection,#reviewSection) :is(
  .form-section,.section-card,.module-card,.clinical-card,.patient-card,.patient-context-card,
  .msoap-record-finder,.msoap-patient-record-card,.msoap-profile-update,
  .hpi-smart-guide,.hpi-completeness,
  .assessment-block,.assessment-problem-card,.assessment-clinical-notice,.assessment-patient-context,
  .plan-block,.plan-problem-card,.plan-problem-header,.plan-context-card,.plan-patient-context,
  .novu-plan-clinical-support,.novu-plan-support-item,.novu-plan-support-group,
  .education-card,.precautions-card,.review-card,.clinical-review-card,
  .review-checks-card,.review-final-note-card,.review-confirmation-card
) :is(p,small,em,li,.description,.subtitle,.helper-text,.field-help,.field-helper,.field-description,.supporting-text,.supporting-copy,.clinical-copy,.assessment-helper,.plan-helper,.meta,.hint,.optional-label){
  color:#3f5e76!important;
  -webkit-text-fill-color:#3f5e76!important;
  opacity:1!important;
  text-shadow:none!important;
}
/* Exact Assessment subsections reported as unreadable. */
body.nx-v2 #assessmentSection .assessment-problem-card :is(.assessment-subsection-title h3,.assessment-subsection-title h4,.assessment-problem-label,.form-label){
  color:#102a43!important;-webkit-text-fill-color:#102a43!important;opacity:1!important
}
body.nx-v2 #assessmentSection .assessment-problem-card :is(.assessment-subsection-title p,.field-helper){
  color:#46657d!important;-webkit-text-fill-color:#46657d!important;opacity:1!important
}
body.nx-v2 #assessmentSection .assessment-inline-button{color:#145fb3!important;-webkit-text-fill-color:#145fb3!important;opacity:1!important}
/* Clinical context itself is a dark shell card and therefore owns light ink. */
body.nx-v2 #assessmentSection .assessment-patient-context{
  background:#13212d!important;background-color:#13212d!important;border-color:#31485c!important;color:#dceaf4!important;-webkit-text-fill-color:#dceaf4!important
}
body.nx-v2 #assessmentSection .assessment-patient-context :is(h1,h2,h3,h4,strong,b,label){color:#f4f8fb!important;-webkit-text-fill-color:#f4f8fb!important}
body.nx-v2 #assessmentSection .assessment-patient-context :is(p,small,span){color:#b9cfdf!important;-webkit-text-fill-color:#b9cfdf!important;opacity:1!important}

/* ============================================================================
   V42 FINAL READABILITY CLOSURE — Assessment / Plan / Header controls
   These are explicit surface contracts, not inherited theme overrides.
   ============================================================================ */

/* Assessment Clinical Standards is an intentionally light clinical surface in
   Light, Dark and System-dark. It owns both background and foreground. */
body.nx-v2 #assessmentSection .clinical-standards-summary{
  background:#f8fafc!important;background-color:#f8fafc!important;
  border-color:#cbdbe7!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important;
}
body.nx-v2 #assessmentSection .clinical-standards-summary-header,
body.nx-v2 #assessmentSection .clinical-standards-summary-header strong{
  color:#102a43!important;-webkit-text-fill-color:#102a43!important;opacity:1!important;
}
body.nx-v2 #assessmentSection .clinical-standards-summary p,
body.nx-v2 #assessmentSection .clinical-standards-list,
body.nx-v2 #assessmentSection .clinical-standards-list *{
  color:#3f5e76!important;-webkit-text-fill-color:#3f5e76!important;opacity:1!important;
}

/* Plan context, patient-specific management notice and completion summary each
   own a readable foreground regardless of the surrounding dark shell. */
body.nx-v2 #planSection .plan-context-card,
body.nx-v2 #planSection .plan-context-summary{
  color:#29465f!important;-webkit-text-fill-color:#29465f!important;opacity:1!important;
}
body.nx-v2 #planSection .plan-clinical-notice{
  background:#fff8df!important;background-color:#fff8df!important;
  border-color:#d8b13d!important;color:#3a2a00!important;-webkit-text-fill-color:#3a2a00!important;
}
body.nx-v2 #planSection .plan-clinical-notice strong{
  color:#332500!important;-webkit-text-fill-color:#332500!important;opacity:1!important;
}
body.nx-v2 #planSection .plan-clinical-notice p{
  color:#594716!important;-webkit-text-fill-color:#594716!important;opacity:1!important;
}
body.nx-v2 #planSection .plan-completion-summary{
  background:#f8fafc!important;background-color:#f8fafc!important;
  border-color:#cbdbe7!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important;
}
body.nx-v2 #planSection .plan-completion-header,
body.nx-v2 #planSection .plan-completion-header strong{
  color:#102a43!important;-webkit-text-fill-color:#102a43!important;opacity:1!important;
}
body.nx-v2 #planSection .plan-completion-summary p{
  color:#3f5e76!important;-webkit-text-fill-color:#3f5e76!important;opacity:1!important;
}
body.nx-v2 #planSection .plan-completion-summary[data-status="progress"]{
  background:#fff7ed!important;background-color:#fff7ed!important;border-color:#e8b981!important;
}
body.nx-v2 #planSection .plan-completion-summary[data-status="complete"]{
  background:#ecfdf5!important;background-color:#ecfdf5!important;border-color:#80d8b2!important;
}

/* Header Clinical Library is a white action on a dark ribbon. Never allow the
   ribbon's light foreground inheritance to make its label white-on-white. */
body.nx-v2 .app-header .nx-clinical-library-btn,
body.nx-master-ui .app-header .nx-clinical-library-btn,
#nxClinicalLibraryBtn{
  background:#ffffff!important;background-color:#ffffff!important;
  border-color:#b9d8f6!important;color:#102a43!important;-webkit-text-fill-color:#102a43!important;
  opacity:1!important;text-shadow:none!important;
}
body.nx-v2 .app-header .nx-clinical-library-btn:hover,
body.nx-master-ui .app-header .nx-clinical-library-btn:hover,
#nxClinicalLibraryBtn:hover{
  background:#eef7ff!important;background-color:#eef7ff!important;color:#0b3155!important;-webkit-text-fill-color:#0b3155!important;
}

/* Browser text selection remains unmistakably readable on both clinical light
   cards and the dark shell. */
body.nx-v2 ::selection{background:#1d63c7;color:#ffffff;-webkit-text-fill-color:#ffffff}


/* ============================================================================
   V43 REVIEW TAB — EXPLICIT SURFACE / FOREGROUND OWNERSHIP
   Review is composed of intentionally light clinical cards inside a dark shell.
   These selectors own BOTH paint layers and therefore cannot inherit pale shell
   ink or legacy -webkit-text-fill-color. Applies identically in Light, Dark and
   System-resolved themes.
   ============================================================================ */
body.nx-v2 #reviewSection :is(
  .review-context-card,.review-clinical-notice,.review-completeness-card,
  .review-smart-clinical-card,.review-soap-polish-card,.review-soap-card
){opacity:1!important;text-shadow:none!important}

/* Neutral clinical cards */
body.nx-v2 #reviewSection :is(
  .review-context-card,.review-completeness-card,.review-smart-clinical-card,
  .review-soap-polish-card,.review-soap-card
){background:#ffffff!important;background-color:#ffffff!important;border-color:#cbdbe7!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important}

body.nx-v2 #reviewSection :is(
  .review-context-card,.review-completeness-card,.review-smart-clinical-card,
  .review-soap-polish-card,.review-soap-card
) :is(h1,h2,h3,h4,h5,h6,strong,b,.review-soap-label,.review-guideline-block>strong){color:#0b1f33!important;-webkit-text-fill-color:#0b1f33!important;opacity:1!important}

body.nx-v2 #reviewSection :is(
  .review-context-card,.review-completeness-card,.review-smart-clinical-card,
  .review-soap-polish-card,.review-soap-card
) :is(p,small,span,em,li,.review-context-summary,.review-completeness-message,.review-smart-disclaimer,.review-soap-content,.review-empty-state){color:#3f5e76!important;-webkit-text-fill-color:#3f5e76!important;opacity:1!important}

/* Preserve semantic blue kickers / section identities. */
body.nx-v2 #reviewSection :is(.review-block-kicker,.review-context-label){color:#155fb0!important;-webkit-text-fill-color:#155fb0!important;opacity:1!important}
body.nx-v2 #reviewSection .review-soap-letter{background:#1769e8!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
body.nx-v2 #reviewSection .review-section-status[data-status="complete"]{color:#047857!important;-webkit-text-fill-color:#047857!important}
body.nx-v2 #reviewSection .review-section-status[data-status="partial"]{color:#9a3412!important;-webkit-text-fill-color:#9a3412!important}
body.nx-v2 #reviewSection .review-section-status:is([data-status="attention"],[data-status="missing"],[data-status="pending"]){color:#991b1b!important;-webkit-text-fill-color:#991b1b!important}

/* Clinical documentation notice: warm light surface with dark warm ink. */
body.nx-v2 #reviewSection .review-clinical-notice{background:#fff8df!important;background-color:#fff8df!important;border-color:#d8b13d!important;color:#3a2a00!important;-webkit-text-fill-color:#3a2a00!important}
body.nx-v2 #reviewSection .review-clinical-notice strong{color:#332500!important;-webkit-text-fill-color:#332500!important}
body.nx-v2 #reviewSection .review-clinical-notice p{color:#594716!important;-webkit-text-fill-color:#594716!important;opacity:1!important}
body.nx-v2 #reviewSection .review-notice-icon{background:#fff0b5!important;color:#075fbd!important;-webkit-text-fill-color:#075fbd!important}

/* Smart-review warnings and guideline sources are nested light surfaces. */
body.nx-v2 #reviewSection .review-smart-item{background:#fff8e8!important;border-color:#d7a948!important;color:#4a3508!important;-webkit-text-fill-color:#4a3508!important}
body.nx-v2 #reviewSection .review-smart-item strong{color:#4a3508!important;-webkit-text-fill-color:#4a3508!important}
body.nx-v2 #reviewSection .review-smart-item p{color:#654d19!important;-webkit-text-fill-color:#654d19!important;opacity:1!important}
body.nx-v2 #reviewSection .review-smart-empty{background:#f1faf5!important;border-color:#9bcdb0!important;color:#24533a!important;-webkit-text-fill-color:#24533a!important;opacity:1!important}
body.nx-v2 #reviewSection .review-guideline-source{background:#f7fbff!important;border-color:#bfd5e6!important;color:#153b5b!important;-webkit-text-fill-color:#153b5b!important}
body.nx-v2 #reviewSection .review-guideline-source strong{color:#123653!important;-webkit-text-fill-color:#123653!important}
body.nx-v2 #reviewSection .review-guideline-source :is(span,small){color:#405f78!important;-webkit-text-fill-color:#405f78!important;opacity:1!important}

/* SOAP section cards: header/body remain light and readable in all themes. */
body.nx-v2 #reviewSection .review-soap-card-header{background:#f4f8fc!important;background-color:#f4f8fc!important;border-color:#cbdbe7!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important}
body.nx-v2 #reviewSection .review-soap-content{background:#ffffff!important;background-color:#ffffff!important;color:#29465f!important;-webkit-text-fill-color:#29465f!important;opacity:1!important}
body.nx-v2 #reviewSection .review-soap-content *:not(button){-webkit-text-fill-color:currentColor}
body.nx-v2 #reviewSection .review-empty-state{color:#526d82!important;-webkit-text-fill-color:#526d82!important;opacity:1!important}

/* Generated review summary / polish content. */
body.nx-v2 #reviewSection :is(.review-summary-group,.review-polish-item){color:#17324d!important;-webkit-text-fill-color:#17324d!important}
body.nx-v2 #reviewSection .review-polish-item{background:#fbfdff!important;border-color:#cbdbe7!important}
body.nx-v2 #reviewSection .review-polish-item strong{color:#102a43!important;-webkit-text-fill-color:#102a43!important}
body.nx-v2 #reviewSection .review-polish-item p{color:#3f5e76!important;-webkit-text-fill-color:#3f5e76!important}

/* Buttons on light Review cards own their label color. */
body.nx-v2 #reviewSection :is(.review-edit-button,.secondary-button){background:#ffffff!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important;border-color:#b9cde0!important;opacity:1!important}
body.nx-v2 #reviewSection :is(.primary-button,#generateSOAPButton){color:#ffffff!important;-webkit-text-fill-color:#ffffff!important;opacity:1!important}

/* ============================================================================
   V44 CANONICAL THEME CLOSURE — NO CROSS-THEME INLINE MUTATION
   Light is the product default. System resolves to the same canonical Light or
   Dark state. Component surfaces own background + foreground as an inseparable
   pair so shell theme changes cannot bleach clinical content.
   ============================================================================ */
:root{color-scheme:light}
html[data-nx-theme="dark"]{color-scheme:dark}
html[data-nx-theme="light"]{color-scheme:light}

/* Permanent dark chrome: readable in EVERY mode. */
body.nx-v2 :is(.app-sidebar,.sidebar,.provider-sidebar,.nx-sidebar){color:#f5f9fc!important;-webkit-text-fill-color:#f5f9fc!important}
body.nx-v2 :is(.app-sidebar,.sidebar,.provider-sidebar,.nx-sidebar) :is(a,button,label,strong,b,h1,h2,h3,h4,p,span,small){-webkit-text-fill-color:currentColor;opacity:1}

/* Review shell is dark in the current product design and owns light ink. */
body.nx-v2 #reviewSection{color:#d7e3ec!important;-webkit-text-fill-color:#d7e3ec!important}
body.nx-v2 #reviewSection>.section-header :is(h1,h2,h3,p,span),
body.nx-v2 #reviewSection :is(.review-page-title,.review-page-subtitle){color:#eaf2f8!important;-webkit-text-fill-color:#eaf2f8!important;opacity:1!important}

/* Light clinical surfaces inside Review — complete ownership, all themes. */
body.nx-v2 #reviewSection :is(
 .review-context-card,.review-clinical-notice,.review-completeness-card,
 .review-smart-clinical-card,.review-soap-polish-card,.review-soap-card,
 .review-checks-card,.review-final-note-card,.review-confirmation-card,
 .review-guideline-source,.review-smart-item,.review-polish-item
){opacity:1!important;text-shadow:none!important}
body.nx-v2 #reviewSection :is(
 .review-context-card,.review-completeness-card,.review-smart-clinical-card,
 .review-soap-polish-card,.review-soap-card,.review-checks-card,
 .review-final-note-card,.review-confirmation-card
){background:#fff!important;background-color:#fff!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important;border-color:#c7d8e6!important}
body.nx-v2 #reviewSection :is(
 .review-context-card,.review-completeness-card,.review-smart-clinical-card,
 .review-soap-polish-card,.review-soap-card,.review-checks-card,
 .review-final-note-card,.review-confirmation-card
) :is(h1,h2,h3,h4,h5,h6,strong,b,label,legend,.review-soap-label,.review-guideline-block>strong){color:#0b1f33!important;-webkit-text-fill-color:#0b1f33!important;opacity:1!important}
body.nx-v2 #reviewSection :is(
 .review-context-card,.review-completeness-card,.review-smart-clinical-card,
 .review-soap-polish-card,.review-soap-card,.review-checks-card,
 .review-final-note-card,.review-confirmation-card
) :is(p,small,em,li,.review-context-summary,.review-completeness-message,.review-smart-disclaimer,.review-soap-content,.review-empty-state,.review-confirmation-help){color:#36546b!important;-webkit-text-fill-color:#36546b!important;opacity:1!important}

/* Warm notices/warnings. */
body.nx-v2 #reviewSection .review-clinical-notice,
body.nx-v2 #reviewSection .review-smart-item{background:#fff8df!important;background-color:#fff8df!important;border-color:#d6ae3e!important;color:#3a2a00!important;-webkit-text-fill-color:#3a2a00!important}
body.nx-v2 #reviewSection :is(.review-clinical-notice,.review-smart-item) :is(h1,h2,h3,h4,strong,b){color:#332500!important;-webkit-text-fill-color:#332500!important}
body.nx-v2 #reviewSection :is(.review-clinical-notice,.review-smart-item) :is(p,small,span,li){color:#594716!important;-webkit-text-fill-color:#594716!important;opacity:1!important}

/* Guideline cards. */
body.nx-v2 #reviewSection .review-guideline-source{background:#f7fbff!important;background-color:#f7fbff!important;border-color:#b9d2e5!important;color:#173b59!important;-webkit-text-fill-color:#173b59!important}
body.nx-v2 #reviewSection .review-guideline-source :is(h1,h2,h3,h4,strong,b){color:#102f49!important;-webkit-text-fill-color:#102f49!important}
body.nx-v2 #reviewSection .review-guideline-source :is(p,small,span,em){color:#405f78!important;-webkit-text-fill-color:#405f78!important;opacity:1!important}

/* Review SOAP card body may contain dynamically generated nested markup. */
body.nx-v2 #reviewSection .review-soap-card-header{background:#f4f8fc!important;background-color:#f4f8fc!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important;border-color:#c7d8e6!important}
body.nx-v2 #reviewSection .review-soap-content{background:#fff!important;background-color:#fff!important;color:#29465f!important;-webkit-text-fill-color:#29465f!important;opacity:1!important}
body.nx-v2 #reviewSection .review-soap-content :is(h1,h2,h3,h4,h5,h6,strong,b,label){color:#102a43!important;-webkit-text-fill-color:#102a43!important;opacity:1!important}
body.nx-v2 #reviewSection .review-soap-content :is(p,span,small,em,li,div:not([class])){color:#29465f!important;-webkit-text-fill-color:#29465f!important;opacity:1!important}

/* Semantic identities remain semantic. */
body.nx-v2 #reviewSection :is(.review-block-kicker,.review-context-label){color:#155fb0!important;-webkit-text-fill-color:#155fb0!important}
body.nx-v2 #reviewSection .review-soap-letter{background:#1769e8!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
body.nx-v2 #reviewSection .review-progress-fill{background:#2868e8!important}
body.nx-v2 #reviewSection .review-completeness-percent{color:#155fb0!important;-webkit-text-fill-color:#155fb0!important;opacity:1!important}

/* Controls on light Review surfaces. */
body.nx-v2 #reviewSection :is(.review-edit-button,.secondary-button,button.secondary){background:#fff!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important;border-color:#b9cde0!important;opacity:1!important}
body.nx-v2 #reviewSection :is(.primary-button,#generateSOAPButton){color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important}

/* Inputs, placeholders, disabled states: explicit in all themes. */
body.nx-v2 #reviewSection :is(input:not([type="checkbox"]):not([type="radio"]),textarea,select){background:#f7fbff!important;color:#102a43!important;-webkit-text-fill-color:#102a43!important;border-color:#78a8c9!important;opacity:1!important}
body.nx-v2 #reviewSection :is(input,textarea)::placeholder{color:#607a90!important;-webkit-text-fill-color:#607a90!important;opacity:1!important}
body.nx-v2 #reviewSection button:disabled{opacity:.72!important}

/* Keep selection legible without being mistaken for a theme color failure. */
body.nx-v2 #reviewSection ::selection{background:#1d63c7;color:#fff;-webkit-text-fill-color:#fff}

/* ============================================================================
   V45 ROOT THEME SURFACE CONTRACT
   Fixes remaining dark/system contrast failures without changing Light.
   Principle: every component owns BOTH its surface and its foreground.
   ============================================================================ */

/* A. Documentation mode ribbon is a dark shell surface in Dark/System. */
html[data-nx-theme="dark"] body.nx-v2 .documentation-mode-safety{
  background:#111d28!important;background-color:#111d28!important;border-color:#38546b!important;
  color:#eaf3f9!important;-webkit-text-fill-color:#eaf3f9!important;opacity:1!important;
}
html[data-nx-theme="dark"] body.nx-v2 .documentation-mode-safety :is(strong,b,label,p,span,small){
  color:#d9e8f2!important;-webkit-text-fill-color:#d9e8f2!important;opacity:1!important;text-shadow:none!important;
}
html[data-nx-theme="dark"] body.nx-v2 .documentation-mode-safety > span{
  color:#70c8ff!important;-webkit-text-fill-color:#70c8ff!important;
}

/* B. Objective Clinical Context is intentionally dark in Dark/System. */
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection .clinical-context-card{
  background:#111d28!important;background-color:#111d28!important;border-color:#35536a!important;
  color:#eaf3f9!important;-webkit-text-fill-color:#eaf3f9!important;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection .clinical-context-card :is(h1,h2,h3,h4,h5,h6,strong,b,label){
  color:#f4f8fb!important;-webkit-text-fill-color:#f4f8fb!important;opacity:1!important;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection .clinical-context-card :is(p,small,.clinical-context-heading p,.context-summary-label){
  color:#b9ccda!important;-webkit-text-fill-color:#b9ccda!important;opacity:1!important;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection .clinical-context-card .section-label{
  color:#83d9e5!important;-webkit-text-fill-color:#83d9e5!important;
}
/* Summary tiles and automatic-context note are light nested surfaces. */
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection .clinical-context-card :is(.context-summary-item,.context-engine-note){
  background:#f5f8fb!important;background-color:#f5f8fb!important;border-color:#c4d5e2!important;
  color:#17324d!important;-webkit-text-fill-color:#17324d!important;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection .clinical-context-card :is(.context-summary-item,.context-engine-note) :is(h1,h2,h3,h4,strong,b,label){
  color:#102a43!important;-webkit-text-fill-color:#102a43!important;opacity:1!important;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection .clinical-context-card :is(.context-summary-item,.context-engine-note) :is(p,small,span,.context-summary-label){
  color:#405f78!important;-webkit-text-fill-color:#405f78!important;opacity:1!important;
}

/* C. Body-measurement white panels: all labels/help must remain dark. */
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection :is(.measurement-card,.body-measurements-card,.vitals-card,.diagnostic-card,.form-section,.section-card)[style*="background"] :is(label,.field-label,.form-label,.helper-text,.field-help,small){
  opacity:1!important;text-shadow:none!important;
}
/* Generic exact white/ice form surfaces inside Objective. */
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection :is(.form-card,.form-section,.section-card,.module-card){
  --v45-light-title:#102a43;--v45-light-body:#405f78;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection :is(.form-card,.form-section,.section-card,.module-card) :is(h1,h2,h3,h4,h5,h6,strong,b,label,.form-label,.field-label){
  color:var(--v45-light-title)!important;-webkit-text-fill-color:var(--v45-light-title)!important;opacity:1!important;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection :is(.form-card,.form-section,.section-card,.module-card) :is(p,small,.helper-text,.field-help,.description,.hint){
  color:var(--v45-light-body)!important;-webkit-text-fill-color:var(--v45-light-body)!important;opacity:1!important;
}

/* D. Pediatric growth card is a DARK surface in Dark/System. */
html[data-nx-theme="dark"] body.nx-v2 .pediatric-growth-card{
  background:#111d28!important;background-color:#111d28!important;border-color:#35536a!important;
  color:#eaf3f9!important;-webkit-text-fill-color:#eaf3f9!important;
}
html[data-nx-theme="dark"] body.nx-v2 .pediatric-growth-card :is(.pediatric-growth-title,strong,b,h1,h2,h3,h4){
  color:#f4f8fb!important;-webkit-text-fill-color:#f4f8fb!important;opacity:1!important;
}
html[data-nx-theme="dark"] body.nx-v2 .pediatric-growth-card :is(.pediatric-growth-eyebrow,.pediatric-growth-context,.pediatric-growth-row,small,p,span){
  color:#b9ccda!important;-webkit-text-fill-color:#b9ccda!important;opacity:1!important;
}
html[data-nx-theme="dark"] body.nx-v2 .pediatric-growth-card .pediatric-growth-warning{
  background:#fff7d6!important;background-color:#fff7d6!important;border-color:#d6ae3e!important;
  color:#493600!important;-webkit-text-fill-color:#493600!important;opacity:1!important;
}

/* E. Assessment patient-context is a dark shell card in Dark/System. */
html[data-nx-theme="dark"] body.nx-v2 #assessmentSection .assessment-context-card{
  background:#111d28!important;background-color:#111d28!important;border-color:#35536a!important;
  color:#eaf3f9!important;-webkit-text-fill-color:#eaf3f9!important;
}
html[data-nx-theme="dark"] body.nx-v2 #assessmentSection .assessment-context-label{
  color:#83c7ff!important;-webkit-text-fill-color:#83c7ff!important;opacity:1!important;
}
html[data-nx-theme="dark"] body.nx-v2 #assessmentSection .assessment-context-summary{
  color:#b9ccda!important;-webkit-text-fill-color:#b9ccda!important;opacity:1!important;
}

/* F. Review status badge: pale status surface owns dark red ink. */
body.nx-v2 #reviewSection .review-status-badge,
body.nx-v2 #reviewSection .review-status-badge[data-status="pending"]{
  background:#fff1f1!important;background-color:#fff1f1!important;border-color:#efaaaa!important;
  color:#8f1d1d!important;-webkit-text-fill-color:#8f1d1d!important;opacity:1!important;text-shadow:none!important;
}
body.nx-v2 #reviewSection .review-status-badge[data-status="ready"]{
  background:#ecfdf5!important;border-color:#86d7b3!important;color:#05603f!important;-webkit-text-fill-color:#05603f!important;
}
body.nx-v2 #reviewSection .review-status-badge[data-status="attention"]{
  background:#fef2f2!important;border-color:#efaaaa!important;color:#8f1d1d!important;-webkit-text-fill-color:#8f1d1d!important;
}

/* G. Light remains untouched: no V45 foreground/surface selectors target data-nx-theme=light. */

/* V45.1 Objective body-measurement exact nested light surfaces. */
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection :is(.measurement-toggle-grid,.measurement-section){
  background:#f7fafc!important;background-color:#f7fafc!important;border-color:#c5d6e3!important;
  color:#17324d!important;-webkit-text-fill-color:#17324d!important;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection :is(.measurement-toggle-grid,.measurement-section) :is(label,strong,b,h1,h2,h3,h4){
  color:#17324d!important;-webkit-text-fill-color:#17324d!important;opacity:1!important;text-shadow:none!important;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection :is(.measurement-toggle-grid,.measurement-section) :is(p,small,.helper-text,.field-help){
  color:#4b687f!important;-webkit-text-fill-color:#4b687f!important;opacity:1!important;text-shadow:none!important;
}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection .glucose-context :is(label,small){
  color:#405f78!important;-webkit-text-fill-color:#405f78!important;opacity:1!important;
}


/* ============================================================================
   V48 EXHAUSTIVE THEME CLOSURE — SURFACE-OWNED CONTRAST
   System is NEVER a paint state: app.js resolves System -> light/dark first.
   These rules close the remaining photographed regressions without changing
   layout, behavior, storage, record workflows, or the Light visual language.
   ============================================================================ */

/* Dark clinical shells: explicit readable foregrounds. */
html[data-nx-theme="dark"] body.nx-v2 .documentation-mode-safety :is(strong,b,label,p,span,small),
html[data-nx-theme="dark"] body.nx-v2 #assessmentSection .assessment-context-card :is(h1,h2,h3,h4,strong,b,label,p,span,small),
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection .clinical-context-card > :is(div,header) :is(h1,h2,h3,h4,strong,b,label,p,span,small){
  opacity:1!important;text-shadow:none!important;
}
html[data-nx-theme="dark"] body.nx-v2 .documentation-mode-safety :is(strong,b,label){color:#f4f8fb!important;-webkit-text-fill-color:#f4f8fb!important}
html[data-nx-theme="dark"] body.nx-v2 .documentation-mode-safety :is(p,small){color:#bfd0dc!important;-webkit-text-fill-color:#bfd0dc!important}
html[data-nx-theme="dark"] body.nx-v2 #assessmentSection .assessment-context-card :is(h1,h2,h3,h4,strong,b,label){color:#f4f8fb!important;-webkit-text-fill-color:#f4f8fb!important}
html[data-nx-theme="dark"] body.nx-v2 #assessmentSection .assessment-context-card :is(p,span,small){color:#b9ccda!important;-webkit-text-fill-color:#b9ccda!important}

/* OLD CARTS: cards are dark in Dark; inputs remain intentionally light. */
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-panel .hpi-smart-card{background:#111d28!important;border-color:#35536a!important;color:#eef6fb!important;-webkit-text-fill-color:#eef6fb!important}
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-panel .hpi-card-copy>b{color:#f4f8fb!important;-webkit-text-fill-color:#f4f8fb!important}
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-panel .hpi-card-copy>small,
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-panel .hpi-severity-row span{color:#bfd0dc!important;-webkit-text-fill-color:#bfd0dc!important;opacity:1!important}
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-panel :is(input[type="text"],input[type="number"]){background:#f7fbff!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important;border-color:#78a8c9!important}
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-panel :is(input[type="text"],input[type="number"])::placeholder{color:#607a90!important;-webkit-text-fill-color:#607a90!important;opacity:1!important}

/* Clinical Interpretation is a light information surface in every theme. */
body.nx-v2 .clinical-interpretation{background:#f7fbff!important;background-color:#f7fbff!important;border-color:#c8d9e6!important;color:#17324d!important;-webkit-text-fill-color:#17324d!important}
body.nx-v2 .clinical-interpretation .interpretation-status strong{color:#17324d!important;-webkit-text-fill-color:#17324d!important;opacity:1!important}
body.nx-v2 .clinical-interpretation p{color:#36546b!important;-webkit-text-fill-color:#36546b!important;opacity:1!important}
body.nx-v2 .clinical-interpretation small{color:#526d82!important;-webkit-text-fill-color:#526d82!important;opacity:1!important}

/* Objective nested light cards: labels/helpers can never inherit dark-shell ink. */
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection :is(.measurement-toggle-grid,.measurement-section,.context-summary-item,.context-engine-note)
 :is(h1,h2,h3,h4,strong,b,label,.field-label,.form-label){color:#102a43!important;-webkit-text-fill-color:#102a43!important;opacity:1!important}
html[data-nx-theme="dark"] body.nx-v2 #objectiveSection :is(.measurement-toggle-grid,.measurement-section,.context-summary-item,.context-engine-note)
 :is(p,small,span,.helper-text,.field-help,.description,.hint){color:#405f78!important;-webkit-text-fill-color:#405f78!important;opacity:1!important}

/* Growth Assessment dark shell + warm warning nested surface. */
html[data-nx-theme="dark"] body.nx-v2 .pediatric-growth-card :is(h1,h2,h3,h4,strong,b,.pediatric-growth-title){color:#f4f8fb!important;-webkit-text-fill-color:#f4f8fb!important}
html[data-nx-theme="dark"] body.nx-v2 .pediatric-growth-card :is(p,small,span,.pediatric-growth-eyebrow,.pediatric-growth-context,.pediatric-growth-row){color:#b9ccda!important;-webkit-text-fill-color:#b9ccda!important;opacity:1!important}
html[data-nx-theme="dark"] body.nx-v2 .pediatric-growth-card .pediatric-growth-warning,
html[data-nx-theme="dark"] body.nx-v2 .pediatric-growth-card .pediatric-growth-warning *{color:#493600!important;-webkit-text-fill-color:#493600!important;opacity:1!important}

/* Patient Record shortcut tiles: preserve light tile, strengthen icon contrast. */
#novuPatientRecordHost .novu-context-badges button{background:#f7fbff!important;background-color:#f7fbff!important;border-color:#9bbbd0!important;color:#17324a!important;-webkit-text-fill-color:#17324a!important}
#novuPatientRecordHost .novu-context-badges button span:not(.context-icon){color:#17324a!important;-webkit-text-fill-color:#17324a!important}
#novuPatientRecordHost .novu-context-badges button .context-icon{display:inline-grid;place-items:center;min-width:26px;height:26px;border:1px solid #b8d3e4;border-radius:8px;background:#fff!important;color:#087886!important;-webkit-text-fill-color:#087886!important;opacity:1!important}

/* Review: final guard for known pale cards/badges. */
body.nx-v2 #reviewSection .review-status-badge{opacity:1!important;text-shadow:none!important}
body.nx-v2 #reviewSection :is(.review-clinical-notice,.review-smart-item,.review-guideline-source) :is(strong,b,h1,h2,h3,h4,p,span,small){opacity:1!important}

/* Selection is not used as a contrast crutch; normal state remains readable. */
body.nx-v2 ::selection{background:#1d63c7;color:#fff;-webkit-text-fill-color:#fff}

/* ============================================================
   V50 — DOCUMENTATION MODE COMPACT STRIP CONTRAST ROOT FIX
   The compact Documentation Mode row is a dark owned surface in Dark/System-dark.
   Previous V28/V29 rules hard-coded light-theme ink (#10253d/#5d7289), making
   the normal state readable only when text-selection supplied a blue backdrop.
   Scope is intentionally limited to the compact Documentation Mode strip.
   ============================================================ */
html[data-nx-theme="dark"] body.nx-v2 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-label,
html[data-nx-theme="dark"] body.nx-v2 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-current,
html[data-nx-theme="dark"] body.nx-v2 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-current-text {
  opacity:1!important;
  text-shadow:none!important;
}
html[data-nx-theme="dark"] body.nx-v2 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-label {
  color:#9fb6c8!important;
  -webkit-text-fill-color:#9fb6c8!important;
}
html[data-nx-theme="dark"] body.nx-v2 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-current,
html[data-nx-theme="dark"] body.nx-v2 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-current-text {
  color:#f4f8fb!important;
  -webkit-text-fill-color:#f4f8fb!important;
}
/* Light owns its original dark ink; this prevents the Dark repair from leaking. */
html[data-nx-theme="light"] body.nx-v2 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-label {
  color:#5d7289!important;
  -webkit-text-fill-color:#5d7289!important;
}
html[data-nx-theme="light"] body.nx-v2 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-current,
html[data-nx-theme="light"] body.nx-v2 #documentationModeSection.nx-docmode-collapsible.nx-docmode-collapsed .nx-docmode-current-text {
  color:#10253d!important;
  -webkit-text-fill-color:#10253d!important;
}

/* ============================================================
   V51 — AUTH VISUAL ISOLATION / NO-REGRESSION CONTRACT
   The authentication gate is outside the clinical workspace theme.
   Theme-wide clinical control rules must never recolor its controls.
   Restore the canonical login field contract and explicitly own
   -webkit-text-fill-color so global Dark/System rules cannot leak in.
   ============================================================ */
#nxAccessGate :is(input,select){
  background:#062846!important;
  background-color:#062846!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  border-color:#4c9fd5!important;
  opacity:1!important;
  caret-color:#ffffff!important;
}
#nxAccessGate :is(input,textarea)::placeholder{
  color:#9fbfd7!important;
  -webkit-text-fill-color:#9fbfd7!important;
  opacity:1!important;
}
#nxAccessGate :is(input,select):-webkit-autofill,
#nxAccessGate :is(input,select):-webkit-autofill:hover,
#nxAccessGate :is(input,select):-webkit-autofill:focus{
  -webkit-text-fill-color:#ffffff!important;
  caret-color:#ffffff!important;
  -webkit-box-shadow:0 0 0 1000px #062846 inset!important;
  box-shadow:0 0 0 1000px #062846 inset!important;
  border-color:#4c9fd5!important;
}

/* ============================================================
   V53 — OLD CARTS INITIAL BADGE CONTRAST (SURGICAL)
   Dark/System-dark only. Do not alter Light or any other surface.
   The O/L/D/C/A/R/T/S glyphs live on intentionally light badges,
   so they must own dark ink instead of inheriting dark-theme light ink.
   ============================================================ */
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-panel .hpi-smart-card .hpi-letter {
  background:#eef6fb!important;
  background-color:#eef6fb!important;
  color:#075f78!important;
  -webkit-text-fill-color:#075f78!important;
  border:1px solid #b8d3e4!important;
  opacity:1!important;
  text-shadow:none!important;
}
html[data-nx-theme="dark"] body.nx-v2 .hpi-smart-panel .hpi-smart-card.completed .hpi-letter {
  background:#e8f7ef!important;
  background-color:#e8f7ef!important;
  color:#176b48!important;
  -webkit-text-fill-color:#176b48!important;
  border-color:#a9dfc8!important;
}

/* V54 SURGICAL READABILITY — Clinical Interpretation legend only.
   Light remains unchanged; dark/system-dark use explicit ink on the light legend surface. */
html[data-nx-theme="dark"] .clinical-legend .clinical-legend-header strong,
html[data-nx-theme="dark"] .clinical-legend .clinical-legend-disclaimer,
html[data-nx-theme="dark"] .clinical-legend .clinical-legend-item,
html[data-nx-theme="dark"] .clinical-legend .clinical-legend-header span{
  color:#18324a!important;
  -webkit-text-fill-color:#18324a!important;
  opacity:1!important;
}
@media (prefers-color-scheme:dark){
  html[data-nx-theme="system"] .clinical-legend .clinical-legend-header strong,
  html[data-nx-theme="system"] .clinical-legend .clinical-legend-disclaimer,
  html[data-nx-theme="system"] .clinical-legend .clinical-legend-item,
  html[data-nx-theme="system"] .clinical-legend .clinical-legend-header span{
    color:#18324a!important;
    -webkit-text-fill-color:#18324a!important;
    opacity:1!important;
  }
}