@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

html,
body,
#app {
    width: 100%;
    height: 100%;
    min-height: 100%;
}

html {
    background-color: #f5f7fa;
}

body {
    margin: 0;
    overflow: hidden;
}

/* ============================================================
   EMIT Custom Layout
   ============================================================ */

.emit-shell {
    display: flex;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    min-height: 100svh;
    box-sizing: border-box;
    --emit-safe-top: env(safe-area-inset-top, 0);
    --emit-safe-right: env(safe-area-inset-right, 0);
    --emit-safe-bottom: env(safe-area-inset-bottom, 0);
    --emit-safe-left: env(safe-area-inset-left, 0);
    overflow: hidden;
    background-color: #f5f7fa;
}

/* ---- Sidebar ---- */
.emit-sidebar {
    width: 220px;
    min-width: 220px;
    height: 100%;
    background-color: #0d323f;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 100;
}

.emit-sidebar-logo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px 10px 16px;
    min-height: 48px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    flex-shrink: 0;
}

.emit-sidebar-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.emit-sidebar-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.85);
    cursor: pointer;
    touch-action: manipulation;
    transition: background-color 0.15s;
}

.emit-sidebar-toggle:hover {
    background: rgba(255, 255, 255, 0.12);
}

.emit-sidebar-toggle .mud-icon-root {
    font-size: 1.1rem;
}

.emit-sidebar-mobile-tab {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background-color: #0d323f;
    color: rgba(255, 255, 255, 0.9);
    cursor: pointer;
}

.emit-sidebar-mobile-tab:hover {
    background-color: #134656;
}

.emit-content-header-start {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.emit-content-header-start .emit-content-header-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.emit-sidebar-logo .emit-logo-divider {
    color: rgba(255,255,255,0.4);
    font-size: 16px;
}

.emit-sidebar-nav {
    flex: 1;
    padding: 8px 0;
}

.emit-nav-group-label {
    padding: 16px 16px 4px;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.45);
}

.emit-nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px 10px 19px;
    color: rgba(255,255,255,0.8);
    text-decoration: none;
    font-size: 0.875rem;
    border-radius: 0;
    transition: background-color 0.15s;
    cursor: pointer;
}

.emit-nav-link:hover {
    background-color: rgba(255,255,255,0.08);
    color: rgba(255,255,255,1);
}

.emit-nav-link.active {
    background-color: rgba(255,255,255,0.14);
    color: #fff;
}

.emit-nav-link .emit-nav-icon {
    color: rgba(255,255,255,0.6);
    font-size: 18px !important;
    width: 18px;
    height: 18px;
}

.emit-nav-link.active .emit-nav-icon {
    color: rgba(255,255,255,0.9);
}

.emit-nav-link-btn {
    background: none;
    border: none;
    width: 100%;
    text-align: left;
}

/* ---- Collapsed sidebar (module workspace active — see IWorkspaceChromeState) ---- */
.emit-sidebar--collapsed {
    width: 64px;
    min-width: 64px;
    transition: width 0.2s ease, min-width 0.2s ease;
}

.emit-sidebar--collapsed .emit-sidebar-brand,
.emit-sidebar--collapsed .emit-nav-group-label,
.emit-sidebar--collapsed .emit-nav-link span,
.emit-sidebar--collapsed .emit-user-info {
    display: none;
}

.emit-sidebar--collapsed .emit-sidebar-logo {
    justify-content: center;
    overflow: visible;
    padding-left: 10px;
    padding-right: 10px;
}

.emit-sidebar--collapsed .emit-nav-link,
.emit-sidebar--collapsed .emit-user-card {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}

/* The account button is wrapped in a shrink-to-fit MudMenu, so its width:100% resolves to the
   avatar's width and centering inside it does nothing. Give the wrapper the full rail. */
.emit-sidebar--collapsed .emit-user-menu {
    display: block;
    width: 100%;
}

/* ---- Compressor Venting module sidebar (workspace shell — see CompressorVentingWorkspaceNav) ---- */
.cv-workspace-nav {
    width: 196px;
    min-width: 196px;
    height: 100%;
    background-color: #ffffff;
    border-right: 1px solid #d5d7d8;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.cv-workspace-nav-header {
    padding: 16px 16px 12px;
    border-bottom: 1px solid #f1f3f4;
}

.cv-workspace-nav-badge {
    font-size: 10px;
    font-weight: 700;
    color: #5f6368;
    background-color: #f1f3f4;
    border-radius: 4px;
    padding: 1px 5px;
}

.cv-workspace-nav-badge--facility {
    color: #0079c1;
    background-color: #b7e6ff;
}

.cv-workspace-nav-group-label {
    padding: 12px 16px 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #5f6368;
}

.cv-workspace-nav-item {
    display: flex;
    align-items: center;
    /* MudBlazor's reset centers every bare <button>; the rail reads as a left-aligned list. */
    justify-content: flex-start;
    gap: 8px;
    width: 100%;
    /* 13px + the 3px status border lines the icon up with the group label's 16px inset. */
    padding: 9px 16px 9px 13px;
    background: none;
    border: none;
    border-left: 3px solid transparent;
    font-size: 14px;
    color: #141414;
    cursor: pointer;
    text-align: left;
}

.cv-workspace-nav-item .mud-icon-root {
    color: #5f6368;
}

.cv-workspace-nav-item.active {
    border-left-color: #0079c1;
    color: #0079c1;
    font-weight: 700;
}

.cv-workspace-nav-item.active .mud-icon-root {
    color: #0079c1;
}

.cv-workspace-shell {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.cv-workspace-main {
    flex: 1;
    overflow-y: auto;
    padding: 24px 32px;
    background-color: #e8e9ea;
}

/* ---- Sidebar top: user profile + account menu ---- */
.emit-sidebar-user-top {
    border-bottom: 1px solid rgba(255,255,255,0.08);
    padding: 8px 0;
}

.emit-user-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    border-radius: 0;
    transition: background-color 0.15s;
}

.emit-user-card:hover {
    background-color: rgba(255,255,255,0.08);
}

.emit-user-avatar {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 50%;
    background-color: rgba(102,193,242,0.25);
    border: 1.5px solid #66c1f2;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #66c1f2;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.emit-user-avatar-img {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 50%;
    border: 1.5px solid #66c1f2;
    object-fit: cover;
}

.emit-user-info {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ---- Account popup menu (rendered by MudMenu in the default light theme) ---- */
.emit-user-menu-header {
    display: flex;
    flex-direction: column;
    padding: 10px 16px 8px;
    min-width: 200px;
}

.emit-user-menu-name {
    font-size: 0.85rem;
    font-weight: 700;
    color: #141414;
}

.emit-user-menu-email {
    font-size: 0.75rem;
    color: #5f6368;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.emit-whats-new-menu-entry {
    display: flex;
    flex-direction: column;
}

.emit-whats-new-menu-version {
    font-size: 0.85rem;
    font-weight: 600;
    color: #141414;
}

.emit-whats-new-menu-date {
    font-size: 0.7rem;
    color: #5f6368;
}

.emit-user-name {
    color: rgba(255,255,255,0.87);
    font-size: 0.8rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.emit-user-role {
    color: rgba(255,255,255,0.45);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* ---- Standard page background (replaces per-page inline background-color) ---- */
.emit-page-body {
    background-color: #f5f7fa;
    min-height: 100%;
}

.emit-dark .emit-page-body {
    background-color: #121212;
}

/* ---- Schedule / My Work month calendar ---- */
.emit-schedule-tabs .mud-tabs-panels {
    min-height: 0;
}

.emit-schedule-header,
.emit-schedule-header-actions {
    flex-wrap: wrap;
}

.emit-schedule-header {
    gap: 12px;
}

.emit-schedule-editor-backdrop {
    display: none;
}

.emit-my-work-calendar {
    width: 100%;
}

.emit-my-work-calendar .emit-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
}

.emit-my-work-calendar .emit-calendar-weekday {
    text-align: center;
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.54);
    padding: 4px 0;
}

.emit-dark .emit-my-work-calendar .emit-calendar-weekday {
    color: rgba(255, 255, 255, 0.6);
}

.emit-my-work-calendar .emit-calendar-day {
    border: 1px solid #d0d7de;
    border-radius: 8px;
    background: #ffffff;
    color: inherit;
    min-height: 108px;
    padding: 6px;
    text-align: left;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.emit-my-work-calendar .emit-calendar-day--expanded {
    min-height: 140px;
    grid-row: span 2;
    z-index: 1;
}

.emit-my-work-calendar .emit-calendar-day__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    margin-bottom: 4px;
}

.emit-dark .emit-my-work-calendar .emit-calendar-day {
    border-color: rgba(255, 255, 255, 0.18);
    background: #1e1e1e;
}

.emit-my-work-calendar .emit-calendar-day--padding {
    border: none;
    background: transparent;
    cursor: default;
    min-height: 92px;
}

.emit-my-work-calendar .emit-calendar-day--today {
    border-color: var(--mud-palette-primary, #0078d4);
}

.emit-my-work-calendar .emit-calendar-day--selected {
    border-color: var(--mud-palette-primary, #0078d4);
    box-shadow: inset 0 0 0 1px var(--mud-palette-primary, #0078d4);
    background: rgba(0, 120, 212, 0.08);
}

.emit-my-work-calendar .emit-calendar-task-chip {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 3px 6px;
    border-radius: 4px;
    background: rgba(0, 120, 212, 0.12);
    color: var(--mud-palette-primary, #0078d4);
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1.25;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.emit-my-work-calendar .emit-calendar-task-chip:hover {
    background: rgba(0, 120, 212, 0.2);
    text-decoration: underline;
}

.emit-my-work-calendar .emit-calendar-task-chip--overdue {
    background: rgba(211, 47, 47, 0.12);
    color: var(--mud-palette-error, #d32f2f);
}

.emit-my-work-calendar .emit-calendar-task-chip--static {
    opacity: 0.85;
}

.emit-dark .emit-my-work-calendar .emit-calendar-task-chip {
    background: rgba(77, 177, 188, 0.18);
    color: #4db1bc;
}

.emit-my-work-calendar .emit-calendar-day--has-work:not(.emit-calendar-day--selected) {
    background: rgba(0, 120, 212, 0.04);
}

.emit-my-work-calendar .emit-calendar-day__number {
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.2;
}

.emit-my-work-calendar .emit-calendar-day__count {
    align-self: flex-end;
    margin-top: -1.1rem;
    min-width: 1.25rem;
    height: 1.25rem;
    border-radius: 999px;
    background: var(--mud-palette-primary, #0078d4);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
}

.emit-my-work-calendar .emit-calendar-day__tasks {
    margin-top: 4px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-height: 0;
    overflow: hidden;
}

.emit-my-work-calendar .emit-calendar-day-detail {
    background: rgba(0, 120, 212, 0.04);
}

.emit-my-work-calendar .emit-calendar-day--schedulable {
    cursor: pointer;
}

.emit-my-work-calendar .emit-calendar-day--schedulable:hover {
    border-color: var(--mud-palette-primary, #0078d4);
    background: rgba(0, 120, 212, 0.06);
}

.emit-my-work-calendar .emit-calendar-occurrence-chip {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 3px 6px;
    border-radius: 4px;
    border: none;
    background: rgba(98, 54, 168, 0.14);
    color: #6236a8;
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1.25;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.emit-my-work-calendar .emit-calendar-occurrence-chip:hover {
    background: rgba(98, 54, 168, 0.24);
}

.emit-dark .emit-my-work-calendar .emit-calendar-occurrence-chip {
    background: rgba(179, 136, 255, 0.18);
    color: #b388ff;
}

.emit-my-work-calendar .emit-calendar-occurrence-chip--failed {
    background: rgba(209, 67, 67, 0.16);
    color: #c62828;
}

.emit-my-work-calendar .emit-calendar-occurrence-chip--firing {
    background: rgba(237, 108, 2, 0.16);
    color: #e65100;
}

.emit-my-work-calendar .emit-calendar-occurrence-chip--fired {
    background: rgba(46, 125, 50, 0.14);
    color: #2e7d32;
}

.emit-my-work-calendar .emit-calendar-occurrence-chip--cancelled {
    background: rgba(0, 0, 0, 0.08);
    color: rgba(0, 0, 0, 0.55);
}

.emit-dark .emit-my-work-calendar .emit-calendar-occurrence-chip--failed {
    background: rgba(239, 154, 154, 0.22);
    color: #ef9a9a;
}

.emit-dark .emit-my-work-calendar .emit-calendar-occurrence-chip--firing {
    background: rgba(255, 183, 77, 0.22);
    color: #ffb74d;
}

.emit-dark .emit-my-work-calendar .emit-calendar-occurrence-chip--fired {
    background: rgba(129, 199, 132, 0.22);
    color: #81c784;
}

.emit-dark .emit-my-work-calendar .emit-calendar-occurrence-chip--cancelled {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.55);
}

.emit-my-work-calendar .emit-calendar-legend {
    font-size: 0.72rem;
    color: rgba(0, 0, 0, 0.6);
}

.emit-dark .emit-my-work-calendar .emit-calendar-legend {
    color: rgba(255, 255, 255, 0.65);
}

.emit-my-work-calendar .emit-calendar-legend__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.emit-my-work-calendar .emit-calendar-legend__swatch {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    display: inline-block;
}

.emit-my-work-calendar .emit-calendar-legend__swatch--assignment {
    background: rgba(0, 120, 212, 0.35);
}

.emit-my-work-calendar .emit-calendar-legend__swatch--occurrence {
    background: rgba(98, 54, 168, 0.35);
}

.emit-my-work-calendar .emit-calendar-legend__swatch--firing {
    background: rgba(237, 108, 2, 0.45);
}

.emit-my-work-calendar .emit-calendar-legend__swatch--fired {
    background: rgba(46, 125, 50, 0.45);
}

.emit-my-work-calendar .emit-calendar-legend__swatch--failed {
    background: rgba(209, 67, 67, 0.45);
}

.emit-my-work-calendar .emit-calendar-legend__swatch--cancelled {
    background: rgba(0, 0, 0, 0.25);
}

.emit-dark .emit-my-work-calendar .emit-calendar-legend__swatch--firing {
    background: rgba(255, 183, 77, 0.5);
}

.emit-dark .emit-my-work-calendar .emit-calendar-legend__swatch--fired {
    background: rgba(129, 199, 132, 0.5);
}

.emit-dark .emit-my-work-calendar .emit-calendar-legend__swatch--failed {
    background: rgba(239, 154, 154, 0.5);
}

.emit-dark .emit-my-work-calendar .emit-calendar-legend__swatch--cancelled {
    background: rgba(255, 255, 255, 0.25);
}

/* ---- My Work list + detail ---- */
.emit-work-split {
    display: flex;
    align-items: stretch;
    gap: 16px;
    min-height: calc(100vh - 220px);
}

.emit-work-split__list {
    flex: 1 1 auto;
    min-width: 0;
}

.emit-work-table .mud-table-container {
    overflow-x: auto;
}

.emit-work-table tbody tr {
    cursor: pointer;
}

.emit-work-row--selected,
.emit-work-row--selected > td {
    background: rgba(0, 120, 212, 0.08) !important;
}

.emit-work-split__backdrop {
    display: none;
}

.emit-work-split__pane {
    flex: 0 0 400px;
    width: 400px;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    /* Sized to its own content instead of stretching to the height of a long
       task list, so the footer actions are not pushed down the page. */
    position: sticky;
    top: 16px;
    align-self: flex-start;
    max-height: calc(100vh - 140px);
}

.emit-work-pane {
    display: flex;
    flex-direction: column;
    /* Fills the capped pane height so the footer pins to the bottom, but stays
       content-sized when the details are short. */
    flex: 1 1 auto;
    min-height: 0;
    background: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
    overflow: hidden;
}

.emit-work-pane__header {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 16px 16px 12px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.emit-work-pane__footer {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 16px 16px;
    border-top: 1px solid var(--mud-palette-lines-default);
}

.emit-work-pane__body {
    flex: 1 1 auto;
    overflow: auto;
    padding: 16px;
}

.emit-work-pane__field {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
}

.emit-work-card__facility {
    white-space: normal;
    word-break: break-word;
}

@media (max-width: 959px) {
    .emit-work-split__backdrop {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(15, 42, 68, 0.4);
        z-index: 1199;
    }

    .emit-work-split__pane {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(100%, 400px);
        z-index: 1200;
        flex: none;
        align-self: auto;
        max-height: none;
    }

    .emit-work-pane {
        border-radius: 0;
        height: 100%;
        border: none;
        border-left: 1px solid var(--mud-palette-lines-default);
    }
}

/* ---- Main content area ---- */
.emit-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
}

.emit-content-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: env(safe-area-inset-top, 0) 20px 0;
    min-height: calc(52px + env(safe-area-inset-top, 0));
    background-color: #e8e9ea;
    border-bottom: 1px solid #d5d7d8;
    padding-left: max(20px, env(safe-area-inset-left, 0));
    padding-right: max(20px, env(safe-area-inset-right, 0));
}

.emit-content-header-title {
    font-size: 0.875rem;
    font-weight: 700;
    color: #141414;
}

/* Header breadcrumb trail (replaces flat page title; page body publishers stay hidden). */
.emit-header-breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    font-size: 0.875rem;
    line-height: 1.25;
    min-width: 0;
}

.emit-header-breadcrumbs-link {
    color: #0079c1;
    text-decoration: none;
    white-space: nowrap;
}

.emit-header-breadcrumbs-link:hover {
    text-decoration: underline;
}

.emit-header-breadcrumbs-sep {
    color: #9aa0a6;
    margin: 0 6px;
    user-select: none;
}

.emit-header-breadcrumbs-current {
    font-weight: 700;
    color: #141414;
    white-space: nowrap;
}

/* Williams Breadcrumbs render in page body for stack publishing only. */
.emit-content-body .steps {
    display: none !important;
}

/* Shell save/sync indicator (US-100 §shell-save-status) — mounted on the right side of
   emit-content-header opposite the page title. */
.emit-save-sync {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 0.8125rem;
    color: #333;
    min-width: 0;
}

.emit-connectivity {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #5f6368;
}

.emit-connectivity-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #9aa0a6;
}

.emit-connectivity--online .emit-connectivity-dot {
    background-color: #2e7d32;
}

.emit-connectivity--offline .emit-connectivity-dot {
    background-color: #c62828;
}

.emit-connectivity--offline {
    color: #c62828;
    font-weight: 600;
}

.emit-save-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 420px;
    overflow: hidden;
}

.emit-save-status--saved {
    color: #2e7d32;
}

.emit-save-status--error {
    color: #c62828;
}

.emit-save-status--idle {
    color: #5f6368;
}

.emit-save-status-message {
    max-width: 240px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.emit-content-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.emit-content-body > .emit-fill-page {
    flex: 1 1 auto;
    min-height: 0;
}

/* ============================================================
   Fill-height pages (.emit-fill-page)

   The page box is exactly the content area and the card body is the only
   scroll region, so the card action bar stays on screen. Every level sets
   min-height:0 so a flex item can shrink below its content — without it an
   alert that appears at the top of the card grows the column and pushes the
   controls at the bottom past the fold instead of shrinking the region above.
   Use this instead of sizing a region with calc(100vh - <chrome>): the magic
   number goes stale the moment anything above it is shown or hidden.
   ============================================================ */
.emit-fill-page {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.emit-fill-page > .mud-container {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.emit-fill-page > .mud-card,
.emit-fill-page > .mud-container > .mud-card {
    flex: 1 1 auto;
    min-height: 0;
}

.emit-fill-page > .mud-card > .mud-card-content,
.emit-fill-page > .mud-container > .mud-card > .mud-card-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
}

.emit-fill-page > .mud-card > .mud-card-actions,
.emit-fill-page > .mud-container > .mud-card > .mud-card-actions {
    flex: 0 0 auto;
}

.emit-fill-page .mud-card-content > .mud-tabs {
    flex: 1 1 auto;
    min-height: 0;
}

.emit-fill-page .mud-card-content > .mud-tabs > .mud-tabs-panels {
    min-height: 0;
}

/* MudTabs wraps every panel; the visible one has to inherit the panel area so
   its content sizes against the space that is actually left. */
.emit-fill-page .mud-tabs-panels > *:not(.mud-tab-panel-hidden) {
    height: 100%;
    min-height: 0;
}

/* Opt a tab's own content into the chain. */
.emit-fill-page .emit-fill {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.activity-edit-page.emit-fill-page > .mud-card > .mud-card-content,
.emit-tabbed-edit-page.emit-fill-page > .mud-card > .mud-card-content,
.emit-tabbed-edit-page.emit-fill-page > .mud-container > .mud-card > .mud-card-content {
    overflow: hidden;
}

.activity-edit-page__tab-scroll {
    box-sizing: border-box;
    height: 100%;
    min-height: 0;
    overflow: auto;
    padding: 12px 16px 16px;
    border: 1px solid var(--mud-palette-lines-default, #e0e0e0);
    border-radius: 4px;
    background: #fff;
}

.activity-edit-page .activity-preview .acd-preview-surface {
    padding: 24px;
    background: #fff;
    border: 1px solid var(--mud-palette-lines-default, #e0e0e0);
    border-radius: 8px;
    max-width: 720px;
}

.activity-edit-page .mud-card-content > .mud-tabs > .mud-tabs-panels,
.emit-tabbed-edit-page .mud-card-content > .mud-tabs > .mud-tabs-panels {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.activity-edit-page .mud-tabs-panels > .mud-tab-panel:not(.mud-tab-panel-hidden),
.emit-tabbed-edit-page .mud-tabs-panels > .mud-tab-panel:not(.mud-tab-panel-hidden) {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.emit-tabbed-edit-page .emit-tab-scroll {
    flex: 1 1 auto;
    min-height: 0;
}

/* Shared tab scroll region (activity edit, data source AI tab, etc.) */
.emit-tab-scroll {
    box-sizing: border-box;
    height: 100%;
    min-height: 0;
    overflow: auto;
    padding: 12px 16px 16px;
    border: 1px solid var(--mud-palette-lines-default, #e0e0e0);
    border-radius: 4px;
    background: #fff;
}

/* Build with AI — transcript left, compose right; stacks on narrow viewports */
.authoring-chat-shell {
    height: 100%;
    min-height: 0;
    display: flex;
    gap: 12px;
    align-items: stretch;
}

.authoring-chat-sidebar {
    flex: 0 0 220px;
    min-width: 180px;
    max-width: 260px;
    min-height: 0;
    overflow-y: auto;
    border: 1px solid var(--mud-palette-lines-default, #e0e0e0);
    border-radius: 4px;
    padding: 12px;
    background: #fff;
}

.authoring-chat-thread-list {
    max-height: calc(100% - 72px);
    overflow-y: auto;
}

.authoring-chat-panel {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.authoring-chat-panel__header {
    flex: 0 0 auto;
}

.authoring-chat-workspace {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    gap: 12px;
    align-items: stretch;
}

.authoring-chat-transcript {
    flex: 1 1 58%;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
}

.authoring-chat-compose {
    flex: 0 0 clamp(280px, 38%, 440px);
    min-height: 0;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--mud-palette-lines-default, #e0e0e0);
    border-radius: 4px;
    padding: 12px;
    background: #fff;
}

.authoring-chat-compose__input {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.authoring-chat-compose__field {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    margin: 0 !important;
}

.authoring-chat-compose__field.mud-input-control,
.authoring-chat-compose__field .mud-input-control {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 0 !important;
}

.authoring-chat-compose__field .mud-input-control-input-container,
.authoring-chat-compose__field .mud-input-root,
.authoring-chat-compose__field .mud-input-outlined,
.authoring-chat-compose__field .mud-input-outlined-with-label {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.authoring-chat-compose__field .mud-input-slot {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.authoring-chat-compose__field textarea {
    flex: 1 1 auto;
    align-self: stretch;
    width: 100% !important;
    min-width: 0;
    min-height: 6rem;
    height: 100% !important;
    max-height: none !important;
    white-space: pre-wrap;
    overflow-wrap: break-word;
    word-break: break-word;
    overflow-x: hidden;
    overflow-y: auto;
    resize: none;
    box-sizing: border-box;
}

.authoring-chat-compose__actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
}

.authoring-chat-compose__hint {
    flex: 0 0 auto;
    margin-top: 6px;
}

.authoring-chat-error {
    word-break: break-word;
}

@media (max-width: 960px) {
    .authoring-chat-workspace {
        flex-direction: column;
    }

    .authoring-chat-compose {
        flex: 0 0 auto;
        max-width: none;
    }

    .authoring-chat-compose__field textarea {
        min-height: 8rem;
    }
}

a, .btn-link {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    color: darkblue;
    z-index: 1400;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }



/* ---- Rotating EMIT mark (boot splash + auth screens) ---- */
.emit-spin-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
}

.emit-spin-logo__mark {
    animation: emit-spin-logo-rotate 1.8s linear infinite;
    transform-origin: 50% 50%;
}

.emit-spin-logo__label {
    margin: 0;
}

/* Coin flip about the vertical axis. The perspective() is part of the
   transform so the mark does not need a 3D-context parent. */
@keyframes emit-spin-logo-rotate {
    from {
        transform: perspective(320px) rotateY(0deg);
    }

    to {
        transform: perspective(320px) rotateY(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    /* Still needs to read as "busy", so fade rather than spin. */
    .emit-spin-logo__mark {
        animation: emit-spin-logo-pulse 1.6s ease-in-out infinite;
    }

    @keyframes emit-spin-logo-pulse {
        0%, 100% {
            opacity: 1;
        }

        50% {
            opacity: 0.35;
        }
    }
}

.splash-background {
    height: 100vh;
    width: 100%;
    background-image: url('/_content/Williams.Blazor.Common/images/2020branding_secureauth_bkgd.jpg');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

.box-shadow {
    border-radius: 3px;
    box-shadow: 3px 3px 3px 3px #aaaaaa;
}

.full-size {
    flex-grow: 1;
}

.view-gutter {
    margin: 10px
}
.certificaiton-font{
    font-size: small;
}

/* ============================================================
   EMIT Login Page
   ============================================================ */

.emit-login-layout {
    height: 100vh;
    overflow: hidden;
}

.emit-login-shell {
    display: flex;
    height: 100vh;
    overflow: hidden;
}

/* ---- Left branding panel ---- */
.emit-login-left {
    flex: 0 0 58%;
    display: flex;
    flex-direction: column;
    background-color: #071e26;
    position: relative;
    overflow: hidden;
}

.emit-login-left::before {
    content: '';
    position: absolute;
    top: -15%;
    left: -5%;
    width: 65%;
    height: 65%;
    background: radial-gradient(ellipse, rgba(102,193,242,0.13) 0%, transparent 60%);
    pointer-events: none;
}

.emit-login-left::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: -5%;
    width: 55%;
    height: 55%;
    background: radial-gradient(ellipse, rgba(102,193,242,0.07) 0%, transparent 60%);
    pointer-events: none;
}

.emit-login-left-header {
    padding: 28px 36px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    position: relative;
    z-index: 1;
}

.emit-login-left-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 64px 80px;
    position: relative;
    z-index: 1;
}

.emit-login-wordmark {
    max-width: 320px;
    width: 100%;
    margin-bottom: 20px;
}

.emit-login-tagline {
    color: rgba(255,255,255,0.75);
    font-size: 18px;
    font-weight: 300;
    line-height: 1.5;
    margin: 0 0 20px;
}

.emit-login-accent {
    width: 48px;
    height: 3px;
    background-color: #0097e9;
    border-radius: 2px;
}

.emit-login-left-footer {
    display: flex;
    justify-content: space-between;
    padding: 16px 36px;
    border-top: 1px solid rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.35);
    font-size: 11px;
    position: relative;
    z-index: 1;
}

/* ---- Right login form panel ---- */
.emit-login-right {
    flex: 0 0 42%;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

.emit-login-form-container {
    width: 100%;
    max-width: 380px;
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.emit-login-logo-mark {
    text-align: center;
    margin-bottom: 16px;
}

.emit-login-title {
    font-size: 26px;
    font-weight: 700;
    color: #141414;
    text-align: center;
    margin: 0 0 28px;
}

/* SSO button */
.emit-login-sso-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 13px 20px;
    background: #0d323f;
    color: #ffffff;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.emit-login-sso-btn:hover:not(:disabled) {
    background: #164f61;
}

.emit-login-sso-btn:disabled {
    opacity: 0.7;
    cursor: default;
}

/* Divider */
.emit-login-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 22px 0 0;
}

.emit-login-divider-line {
    flex: 1;
    height: 1px;
    background: #d5d7d8;
}

.emit-login-divider-text {
    color: #5f6368;
    font-size: 12px;
    white-space: nowrap;
}

/* B2C external sign-in section */
.emit-login-b2c-section {
    margin-top: 16px;
    position: relative;
}

.emit-login-b2c-section--disabled {
    opacity: 0.55;
    pointer-events: none;
}

.emit-login-b2c-header {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}

.emit-login-b2c-badge {
    flex-shrink: 0;
    background: #ff9800;
    color: #ffffff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    padding: 3px 7px;
    border-radius: 4px;
    margin-top: 2px;
}

.emit-login-b2c-note {
    color: #5f6368;
    font-size: 11px;
    line-height: 1.45;
    margin: 0;
}

.emit-login-field {
    margin-bottom: 14px;
}

.emit-login-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #5f6368;
    margin-bottom: 6px;
}

.emit-login-input {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #d5d7d8;
    border-radius: 6px;
    font-size: 14px;
    color: rgba(20,20,20,0.5);
    background: #ffffff;
    box-sizing: border-box;
    cursor: not-allowed;
}

.emit-login-forgot-row {
    text-align: right;
    margin-bottom: 12px;
}

.emit-login-link-muted {
    color: #5f6368;
    font-size: 13px;
    cursor: not-allowed;
}

.emit-login-signin-btn {
    width: 100%;
    padding: 14px;
    background: #0079c1;
    color: #ffffff;
    border: none;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, opacity 0.15s;
}

.emit-login-signin-btn:hover:not(:disabled) {
    background: #006ba8;
}

.emit-login-signin-btn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

/* Contact line */
.emit-login-contact {
    text-align: center;
    color: #5f6368;
    font-size: 12px;
    margin-top: 20px;
}

/* Footer */
/* Auth callback status messages */
.emit-auth-status {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50vh;
    padding: 24px;
    font-size: 15px;
    color: #5f6368;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.emit-auth-failure {
    width: min(100%, 480px);
    text-align: center;
}

.emit-auth-failure-title {
    margin: 0 0 12px;
    font-size: 22px;
    font-weight: 700;
    color: #0d323f;
}

.emit-auth-failure-message {
    margin: 0 0 18px;
    font-size: 14px;
    line-height: 1.55;
    color: #5f6368;
}

.emit-auth-failure-hint {
    margin: 12px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: #5f6368;
}

.emit-auth-failure-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
}

.emit-auth-failure-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.emit-auth-failure-secondary {
    width: 100%;
}

.emit-auth-failure-detail {
    margin: 0 0 18px;
    text-align: left;
    font-size: 12px;
    color: #5f6368;
}

.emit-auth-failure-detail summary {
    cursor: pointer;
    margin-bottom: 8px;
}

.emit-auth-failure-detail pre {
    margin: 0;
    padding: 10px 12px;
    border-radius: 6px;
    background: #f4f5f6;
    border: 1px solid #d5d7d8;
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 11px;
    line-height: 1.45;
}

.emit-auth-error {
    color: #c62828;
}

.emit-auth-status a {
    color: #0079c1;
    margin-left: 4px;
}

.emit-login-right-footer {
    position: absolute;
    bottom: 14px;
    color: #c8cacc;
    font-size: 11px;
    text-align: center;
    width: 100%;
    pointer-events: none;
}

@media (max-width: 768px) {
    .emit-login-layout {
        height: auto;
        min-height: 100vh;
        min-height: 100dvh;
        overflow: auto;
    }

    .emit-login-shell {
        overflow-y: auto;
    }

    .emit-login-left {
        display: none;
    }

    .emit-login-right {
        flex: 1 1 100%;
        width: 100%;
        min-height: 100vh;
        min-height: 100dvh;
        justify-content: flex-start;
        padding-top: max(24px, env(safe-area-inset-top, 0));
        padding-bottom: max(48px, env(safe-area-inset-bottom, 0));
        overflow-y: auto;
    }

    .emit-login-form-container {
        max-width: 420px;
        margin: 0 auto;
        padding: 24px 20px 56px;
    }

    .emit-login-logo-mark img {
        height: 96px !important;
    }

    .emit-login-title {
        font-size: 22px;
        margin-bottom: 24px;
    }

    .emit-login-right-footer {
        position: static;
        padding: 16px 20px 0;
        margin-top: auto;
    }
}

/* ============================================================
   Dark Mode — emitSetDarkMode() in emit-auth.js adds .emit-dark to <html>
   (and EmitLayout also adds it to .emit-shell for Blazor binding).
   Sidebar stays the same dark teal — it's already dark in light mode.
   ============================================================ */

/* Page-level background: html class from emitSetDarkMode; shell class from layout */
html.emit-dark,
html.emit-dark body,
.emit-shell.emit-dark {
    background-color: #121212;
    color: rgba(255, 255, 255, 0.87);
}

.emit-dark.emit-shell {
    background-color: #121212;
}

.emit-dark .emit-main {
    background-color: #121212;
}

.emit-dark .emit-content-body {
    background-color: #121212;
}

.emit-dark .emit-content-header {
    background-color: #1a1a1a;
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

.emit-dark .emit-content-header-title {
    color: rgba(255, 255, 255, 0.87);
}

.emit-dark .emit-header-breadcrumbs-current {
    color: rgba(255, 255, 255, 0.87);
}

.emit-dark .emit-header-breadcrumbs-sep {
    color: rgba(255, 255, 255, 0.45);
}

.emit-dark .emit-header-breadcrumbs-link {
    color: #4DB1BC;
}

.emit-dark .emit-header-breadcrumbs-link:hover {
    color: #6bc4cd;
}

.emit-dark .emit-save-sync {
    color: rgba(255, 255, 255, 0.7);
}

.emit-dark .emit-connectivity {
    color: rgba(255, 255, 255, 0.5);
}

.emit-dark .emit-connectivity-dot {
    background-color: rgba(255, 255, 255, 0.3);
}

.emit-dark .emit-connectivity--online .emit-connectivity-dot {
    background-color: #66bb6a;
}

.emit-dark .emit-connectivity--offline .emit-connectivity-dot {
    background-color: #ef5350;
}

.emit-dark .emit-connectivity--offline {
    color: #ef5350;
}

.emit-dark .emit-save-status--saved  { color: #66bb6a; }
.emit-dark .emit-save-status--error  { color: #ef5350; }
.emit-dark .emit-save-status--idle   { color: rgba(255, 255, 255, 0.4); }

/* CV workspace nav */
.emit-dark .cv-workspace-nav {
    background-color: #1a1a1a;
    border-right-color: rgba(255, 255, 255, 0.08);
}

.emit-dark .cv-workspace-nav-header {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

.emit-dark .cv-workspace-nav-group-label {
    color: rgba(255, 255, 255, 0.45);
}

.emit-dark .cv-workspace-nav-badge {
    background-color: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.6);
}

.emit-dark .cv-workspace-nav-badge--facility {
    background-color: rgba(77, 177, 188, 0.15);
    color: #4DB1BC;
}

.emit-dark .cv-workspace-nav-item {
    color: rgba(255, 255, 255, 0.8);
}

.emit-dark .cv-workspace-nav-item .mud-icon-root {
    color: rgba(255, 255, 255, 0.45);
}

.emit-dark .cv-workspace-nav-item.active {
    border-left-color: #4DB1BC;
    color: #4DB1BC;
}

.emit-dark .cv-workspace-nav-item.active .mud-icon-root {
    color: #4DB1BC;
}

.emit-dark .cv-workspace-main {
    background-color: #121212;
}

/* Adaptive Card dark overrides (complements DARK_HOST_CONFIG in adaptive-card-host.js) */
.emit-dark .adaptive-card-host__surface .ac-adaptiveCard {
    background: #1e1e1e;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.06);
}

.emit-dark .adaptive-card-host__surface .ac-input-text,
.emit-dark .adaptive-card-host__surface .ac-input-number,
.emit-dark .adaptive-card-host__surface .ac-input-date,
.emit-dark .adaptive-card-host__surface .ac-input-time,
.emit-dark .adaptive-card-host__surface .ac-choiceSetInput,
.emit-dark .adaptive-card-host__surface .ac-input.ac-textInput,
.emit-dark .adaptive-card-host__surface textarea.ac-input.ac-textInput,
.emit-dark .adaptive-card-host__surface .ac-input.ac-numberInput,
.emit-dark .adaptive-card-host__surface .ac-input.ac-dateInput,
.emit-dark .adaptive-card-host__surface .ac-input.ac-timeInput,
.emit-dark .adaptive-card-host__surface select.ac-input.ac-multichoiceInput,
.emit-dark .adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered,
.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox {
    background: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.87);
}

.emit-dark .adaptive-card-host__surface .ac-input-text:focus,
.emit-dark .adaptive-card-host__surface .ac-input-number:focus,
.emit-dark .adaptive-card-host__surface .ac-input-date:focus,
.emit-dark .adaptive-card-host__surface .ac-input-time:focus,
.emit-dark .adaptive-card-host__surface .ac-choiceSetInput:focus,
.emit-dark .adaptive-card-host__surface .ac-input.ac-textInput:focus,
.emit-dark .adaptive-card-host__surface textarea.ac-input.ac-textInput:focus,
.emit-dark .adaptive-card-host__surface .ac-input.ac-numberInput:focus,
.emit-dark .adaptive-card-host__surface .ac-input.ac-dateInput:focus,
.emit-dark .adaptive-card-host__surface .ac-input.ac-timeInput:focus,
.emit-dark .adaptive-card-host__surface select.ac-input.ac-multichoiceInput:focus,
.emit-dark .adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered:focus,
.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox:focus {
    border-color: #4DB1BC;
    box-shadow: 0 0 0 3px rgba(77, 177, 188, 0.2);
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container {
    background: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.14);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='rgba(255,255,255,0.54)' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 12px;
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:focus-within {
    border-color: #4DB1BC;
    box-shadow: 0 0 0 3px rgba(77, 177, 188, 0.2);
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox {
    background: transparent;
    border: none;
    box-shadow: none;
    color: rgba(255, 255, 255, 0.87);
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox:focus {
    border-color: transparent;
    box-shadow: none;
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:has(.ac-choiceSetInput-filtered-textbox:disabled) {
    background: #1a1a1a;
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox:disabled {
    background: transparent;
    color: rgba(255, 255, 255, 0.25);
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-dropdown {
    background: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:focus-within
    .ac-input.ac-choiceSetInput-filtered-dropdown.ac-choiceSetInput-filtered-dropdown-open {
    border-color: #4DB1BC;
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-choice {
    color: rgba(255, 255, 255, 0.87);
}

.emit-dark .adaptive-card-host__surface .ac-input.ac-choiceSetInput-choice.ac-choiceSetInput-choice-highlighted {
    background: rgba(77, 177, 188, 0.18);
}

.emit-dark .adaptive-card-host__surface .ac-input-text::placeholder,
.emit-dark .adaptive-card-host__surface .ac-input-number::placeholder,
.emit-dark .adaptive-card-host__surface .ac-input-date::placeholder,
.emit-dark .adaptive-card-host__surface .ac-input.ac-textInput::placeholder,
.emit-dark .adaptive-card-host__surface .ac-input.ac-numberInput::placeholder,
.emit-dark .adaptive-card-host__surface .ac-input.ac-dateInput::placeholder {
    color: rgba(255, 255, 255, 0.3);
}

.emit-dark .adaptive-card-host__surface .ac-input-text:disabled,
.emit-dark .adaptive-card-host__surface .ac-input-number:disabled,
.emit-dark .adaptive-card-host__surface .ac-choiceSetInput:disabled,
.emit-dark .adaptive-card-host__surface .ac-input.ac-textInput:disabled,
.emit-dark .adaptive-card-host__surface .ac-input.ac-numberInput:disabled,
.emit-dark .adaptive-card-host__surface select.ac-input.ac-multichoiceInput:disabled,
.emit-dark .adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered:disabled {
    background: #1a1a1a;
    color: rgba(255, 255, 255, 0.25);
}

.emit-dark .adaptive-card-host__surface .ac-label {
    color: rgba(255, 255, 255, 0.5);
}

.emit-dark .adaptive-card-host__surface .ac-pushButton {
    background: #333333;
    border-color: rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.87);
}

.emit-dark .adaptive-card-host__surface .ac-pushButton:hover {
    background: #3d3d3d;
}

.emit-dark .adaptive-card-host__surface .ac-pushButton.style-positive {
    background: #4DB1BC;
    border-color: #4DB1BC;
    color: #121212;
}

.emit-dark .adaptive-card-host__surface .ac-pushButton.style-positive:hover {
    background: #6bc4cd;
    border-color: #6bc4cd;
}

/* ============================================================
   Adaptive Card Host — EMIT design overrides
   HostConfig controls colors/fonts/spacing; these rules handle
   input borders/radius, label text-transform, focus rings, and
   button shapes that HostConfig cannot express.
   ============================================================ */

/* --- Inputs (legacy .ac-input-* + adaptivecards@3 .ac-input.ac-*Input) --- */
.adaptive-card-host__surface .ac-input-text,
.adaptive-card-host__surface .ac-input-number,
.adaptive-card-host__surface .ac-input-date,
.adaptive-card-host__surface .ac-input-time,
.adaptive-card-host__surface .ac-choiceSetInput,
.adaptive-card-host__surface .ac-input.ac-textInput,
.adaptive-card-host__surface textarea.ac-input.ac-textInput,
.adaptive-card-host__surface .ac-input.ac-numberInput,
.adaptive-card-host__surface .ac-input.ac-dateInput,
.adaptive-card-host__surface .ac-input.ac-timeInput,
.adaptive-card-host__surface select.ac-input.ac-multichoiceInput,
.adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered,
.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox {
    border: 1px solid #d5d7d8;
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 14px;
    color: #141414;
    background: #ffffff;
    transition: border-color 0.15s, box-shadow 0.15s;
    width: 100%;
    box-sizing: border-box;
}

/* Compact dropdowns — chevron affordance (select only; static filtered inputs use browser datalist UI) */
.adaptive-card-host__surface select.ac-input.ac-multichoiceInput {
    appearance: none;
    min-height: 42px;
    padding-right: 36px;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235f6368' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 12px;
}

.adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered {
    padding-right: 12px;
    cursor: text;
    background-image: none;
}

/* Filtered ChoiceSet — one bordered field matching Input.Text chrome */
.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container {
    display: flex;
    position: relative;
    align-items: stretch;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #d5d7d8;
    border-radius: 6px;
    background: #ffffff;
    transition: border-color 0.15s, box-shadow 0.15s;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235f6368' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 12px;
}

.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:focus-within {
    outline: none;
    border-color: #0079c1;
    box-shadow: 0 0 0 3px rgba(0, 121, 193, 0.15);
}

.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox {
    border: none !important;
    border-radius: 6px;
    box-shadow: none !important;
    background: transparent;
    background-image: none !important;
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    padding: 10px 36px 10px 12px;
    min-height: unset;
    cursor: text;
}

.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox:focus {
    outline: none;
    border-color: transparent;
    box-shadow: none;
}

.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:has(.ac-choiceSetInput-filtered-textbox:disabled) {
    background-color: #f5f7fa;
    cursor: not-allowed;
}

.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox:disabled {
    background: transparent;
    color: #9aa0a6;
    cursor: not-allowed;
}

.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-dropdown {
    background: #ffffff;
    border: 1px solid #d5d7d8;
    border-top: none;
    border-radius: 0 0 6px 6px;
    box-sizing: border-box;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    max-height: 240px;
    overflow-y: auto;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 20;
}

.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:focus-within
    .ac-input.ac-choiceSetInput-filtered-dropdown.ac-choiceSetInput-filtered-dropdown-open {
    border-color: #0079c1;
}

.adaptive-card-host__surface .ac-input.ac-choiceSetInput-choice {
    padding: 10px 12px;
    font-size: 14px;
    color: #141414;
}

.adaptive-card-host__surface .ac-input.ac-choiceSetInput-choice.ac-choiceSetInput-choice-highlighted {
    background: #eef3f8;
}

.emit-card-upload {
    margin-top: .75rem;
}

.emit-native-upload {
    border: 1px dashed #9aa5ad;
    border-radius: 4px;
    padding: 12px;
    background: #f7f9fb;
}

.emit-native-upload__title {
    font-weight: 700;
    margin-bottom: 4px;
    color: #141414;
}

.emit-native-upload__description {
    font-size: 12px;
    color: #5f6368;
}

.emit-card-upload__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.emit-card-upload__button {
    display: inline-flex;
    align-items: center;
    min-height: 2.25rem;
    padding: .4rem .8rem;
    border: 1px solid #0078d4;
    border-radius: 4px;
    color: #005a9e;
    cursor: pointer;
    font-size: .875rem;
    font-weight: 600;
}

.emit-card-upload__button--disabled {
    border-color: #a8a8a8;
    color: #777;
    cursor: not-allowed;
    opacity: .7;
}

.emit-card-upload__message {
    min-height: 1.25rem;
    margin-top: .35rem;
    font-size: .8rem;
    color: #4a4a4a;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: .35rem .6rem;
    max-width: 100%;
}

.emit-card-upload__message-text {
    flex: 1 1 12rem;
    min-width: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.emit-card-upload__copy {
    flex: 0 0 auto;
    border: 1px solid #b10e1e;
    background: transparent;
    color: #b10e1e;
    border-radius: 4px;
    font-size: .75rem;
    font-weight: 600;
    padding: .15rem .45rem;
    cursor: pointer;
}

.emit-card-upload__message--error {
    color: #b10e1e;
}

.emit-card-upload__files {
    margin: .25rem 0 0;
    padding-left: 1.25rem;
    font-size: .85rem;
}

.emit-card-upload__file {
    display: flex;
    align-items: center;
    gap: .5rem;
    list-style: disc;
}

.emit-card-upload__file-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.emit-card-upload__remove {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    border: 1px solid #c8c8c8;
    border-radius: 4px;
    background: transparent;
    color: #605e5c;
    cursor: pointer;
    font-size: 1.1rem;
    line-height: 1;
}

.emit-card-upload__remove:hover {
    border-color: #b10e1e;
    color: #b10e1e;
}

.emit-dark .emit-card-upload__button {
    border-color: #5eb6f7;
    color: #c7e7ff;
    background: rgba(255, 255, 255, 0.04);
}

.emit-dark .emit-native-upload {
    border-color: rgba(94, 182, 247, 0.45);
    background: rgba(255, 255, 255, 0.06);
}

.emit-dark .emit-native-upload__title {
    color: rgba(255, 255, 255, 0.87);
}

.emit-dark .emit-native-upload__description {
    color: rgba(255, 255, 255, 0.54);
}

.emit-dark .emit-card-upload__file-name {
    color: rgba(255, 255, 255, 0.87);
}

.emit-dark .emit-card-upload__message {
    color: #d5d7d8;
}

.emit-dark .emit-card-upload__remove {
    border-color: #605e5c;
    color: #c8c6c4;
}

.emit-dark .emit-card-upload__remove:hover {
    border-color: #f1707b;
    color: #f1707b;
}

.adaptive-card-host__surface .ac-input-text:focus,
.adaptive-card-host__surface .ac-input-number:focus,
.adaptive-card-host__surface .ac-input-date:focus,
.adaptive-card-host__surface .ac-input-time:focus,
.adaptive-card-host__surface .ac-choiceSetInput:focus,
.adaptive-card-host__surface .ac-input.ac-textInput:focus,
.adaptive-card-host__surface textarea.ac-input.ac-textInput:focus,
.adaptive-card-host__surface .ac-input.ac-numberInput:focus,
.adaptive-card-host__surface .ac-input.ac-dateInput:focus,
.adaptive-card-host__surface .ac-input.ac-timeInput:focus,
.adaptive-card-host__surface select.ac-input.ac-multichoiceInput:focus,
.adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered:focus,
.adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:focus-within {
    outline: none;
    border-color: #0079c1;
    box-shadow: 0 0 0 3px rgba(0, 121, 193, 0.15);
}

.adaptive-card-host__surface .ac-input-text::placeholder,
.adaptive-card-host__surface .ac-input-number::placeholder,
.adaptive-card-host__surface .ac-input-date::placeholder,
.adaptive-card-host__surface .ac-input.ac-textInput::placeholder,
.adaptive-card-host__surface .ac-input.ac-numberInput::placeholder,
.adaptive-card-host__surface .ac-input.ac-dateInput::placeholder {
    color: #9aa0a6;
}

/* Disabled / read-only inputs (e.g. Location when no source selected) */
.adaptive-card-host__surface .ac-input-text:disabled,
.adaptive-card-host__surface .ac-input-number:disabled,
.adaptive-card-host__surface .ac-choiceSetInput:disabled,
.adaptive-card-host__surface .ac-input.ac-textInput:disabled,
.adaptive-card-host__surface .ac-input.ac-numberInput:disabled,
.adaptive-card-host__surface select.ac-input.ac-multichoiceInput:disabled,
.adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered:disabled {
    background: #f5f7fa;
    color: #9aa0a6;
    cursor: not-allowed;
}

/* --- Labels (light shell only; dark uses .emit-dark / --dark surface rules) --- */
.emit-shell:not(.emit-dark) .adaptive-card-host__surface .ac-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #5f6368;
    margin-bottom: 4px;
}

.emit-shell:not(.emit-dark) .adaptive-card-host__surface .ac-label .ac-label-suffix {
    color: #c62828;
    margin-left: 1px;
}

/* --- Action buttons --- */
.adaptive-card-host__surface .ac-pushButton {
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    padding: 11px 20px;
    cursor: pointer;
    border: 1px solid #d5d7d8;
    background: #ffffff;
    color: #141414;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
    white-space: nowrap;
}

.adaptive-card-host__surface .ac-pushButton:hover {
    background: #f5f7fa;
}

/* Positive / primary — dark navy matching the sidebar and "Save & Validate" */
.adaptive-card-host__surface .ac-pushButton.style-positive {
    background: #0d323f;
    color: #ffffff;
    border-color: #0d323f;
}

.adaptive-card-host__surface .ac-pushButton.style-positive:hover {
    background: #164f61;
    border-color: #164f61;
}

/* Destructive — red tint */
.adaptive-card-host__surface .ac-pushButton.style-destructive {
    background: #ffebee;
    color: #c62828;
    border-color: #c62828;
}

.adaptive-card-host__surface .ac-pushButton.style-destructive:hover {
    background: #fce4e4;
}

/* --- Error validation message --- */
.adaptive-card-host__surface .ac-input-validation-message {
    font-size: 11px;
    font-weight: 600;
    color: #c62828;
    margin-top: 3px;
}

/* --- Card root (Top Risks, table cards, list cards) --- */
.adaptive-card-host__surface .ac-adaptiveCard {
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.06);
}

/* Group header: the SCFH pill, status and Manifold Measurement button stack three deep on the
   right. Left in flow they'd set the row height and strand the group label in ~90px of dead
   space, so they're lifted out of flow and anchored to the row's right edge. The row then
   measures only the label, and the stack rises into the empty gutter beside the card title.
   The renderer writes layout as inline styles, hence !important. */
.adaptive-card-host__surface [id="manifoldHeaderRow"] {
    position: relative !important;
}

.adaptive-card-host__surface [id="manifoldHeaderActions"] {
    position: absolute !important;
    right: 0;
    bottom: 0;
    align-items: flex-end;
    /* Out of flow the column shrink-wraps, so let the pill keep its full label. */
    width: auto !important;
    max-width: none !important;
    white-space: nowrap;
}

.adaptive-card-host__surface [id="manifoldHeaderActions"] [id="emitScfhPill"] {
    flex: 0 0 auto !important;
    overflow: visible;
}

/* --- Table / list column headers (ALL CAPS, small, gray) --- */
.adaptive-card-host__surface .ac-columnHeader .ac-textBlock {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #5f6368;
}

/* --- ColumnSet row separators --- */
.adaptive-card-host__surface .ac-columnSet + .ac-columnSet {
    border-top: 1px solid #e8e9ea;
}

/* --- Accent badge (CENT) — rounded pill shape --- */
.adaptive-card-host__surface .ac-container.ac-accent,
.adaptive-card-host__surface .ac-column.ac-accent {
    border-radius: 4px;
}

/* --- Inline pill tags (seal type, SCFH) ---
   Marked in the card template so the compressor-type tile, which shares the
   accent style, keeps its square shape. */
.adaptive-card-host__surface [id="emitPillTag"] {
    border-radius: 999px !important;
    padding: 1px 9px !important;
    margin-left: 6px;
    align-self: center;
}

.adaptive-card-host__surface [id="emitPillTag"] .ac-textBlock {
    font-size: 10px !important;
    line-height: 17px !important;
    letter-spacing: 0.02em;
}

/* Each tag is its own repeated ColumnSet row; auto-width columns pack left, so the row has to
   push them to its right edge to line up with the status text underneath. */
.adaptive-card-host__surface .ac-columnSet:has(> [id="emitScfhPill"]) {
    justify-content: flex-end !important;
}

.adaptive-card-host__surface [id="emitScfhPill"] {
    border-radius: 999px !important;
    padding: 1px 9px !important;
    margin-left: 6px;
    align-self: center;
    background-color: #2e7d32 !important;
}

.adaptive-card-host__surface [id="emitScfhPill"] .ac-textBlock {
    font-size: 10px !important;
    line-height: 17px !important;
    letter-spacing: 0.02em;
    color: #ffffff !important;
}

.emit-dark .adaptive-card-host__surface [id="emitScfhPill"] {
    background-color: #43a047 !important;
}

.adaptive-card-host__surface [id="compressorTypeBadge"] {
    border-radius: 6px !important;
}

/* --- Warning callouts — AC 3 default (#FFE2B2) + EMIT host white foreground = illegible --- */
.adaptive-card-host__surface .ac-container.ac-warning,
.adaptive-card-host__surface .ac-column.ac-warning {
    background-color: #fff3e0 !important;
    border-left: 3px solid #e65100;
    border-radius: 4px;
}

.emit-shell:not(.emit-dark) .adaptive-card-host__surface .ac-container.ac-warning .ac-textBlock,
.emit-shell:not(.emit-dark) .adaptive-card-host__surface .ac-column.ac-warning .ac-textBlock {
    color: #bf360c !important;
}

.emit-dark .adaptive-card-host__surface .ac-container.ac-warning,
.emit-dark .adaptive-card-host__surface .ac-column.ac-warning {
    background-color: rgba(245, 124, 0, 0.22) !important;
    border-left-color: #ffb74d;
}

.emit-dark .adaptive-card-host__surface .ac-container.ac-warning .ac-textBlock,
.emit-dark .adaptive-card-host__surface .ac-column.ac-warning .ac-textBlock {
    color: #ffb74d !important;
}

/* --- Manifold group editor (Inventory) ---
   Selectors key off data attributes, not classes: Adaptive Cards 3.x reassigns
   `element.className` wholesale whenever an input changes, so any class added by
   enhanceManifoldGroupLayout() is destroyed on first interaction. Attributes survive. */
.adaptive-card-host__surface [data-emit-manifold-source-row] {
    border-top: none;
    align-items: end;
}

.adaptive-card-host__surface [data-emit-manifold-link] {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #0079c1 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    min-height: unset !important;
    padding: 6px 0 !important;
}

.adaptive-card-host__surface [data-emit-manifold-link]:hover {
    text-decoration: underline;
    background: transparent !important;
}

.emit-dark .adaptive-card-host__surface [data-emit-manifold-link] {
    color: #4db1bc !important;
}

.adaptive-card-host__surface [data-emit-manifold-link="group"],
.emit-dark .adaptive-card-host__surface [data-emit-manifold-link="group"] {
    color: #e5484d !important;
}

.adaptive-card-host__surface [data-emit-manifold-pills] {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
    width: 100%;
    box-sizing: border-box;
}

.adaptive-card-host__surface [data-emit-manifold-pill] {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    margin: 0 !important;
    padding: 4px 12px;
    border-radius: 999px;
    border: 1px solid #d5d7d8;
    background: #ffffff;
    color: #141414;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
    user-select: none;
    position: relative;
    transition: border-color 0.15s, color 0.15s, background-color 0.15s;
    box-sizing: border-box;
}

.adaptive-card-host__surface [data-emit-manifold-pill]:has(input[type="checkbox"]:checked),
.adaptive-card-host__surface [data-emit-manifold-pill]:has(input[type="checkbox"]:focus-visible) {
    border-color: #0079c1;
    color: #0079c1;
    background: #ebf5ff;
}

.adaptive-card-host__surface [data-emit-manifold-pill] input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
}

.adaptive-card-host__surface [data-emit-manifold-pill] > div[style*="width: 6px"] {
    display: none !important;
}

.adaptive-card-host__surface [data-emit-manifold-pill] .ac-textBlock {
    display: inline;
    margin: 0 !important;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

.emit-dark .adaptive-card-host__surface [data-emit-manifold-pill] {
    background: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.92);
}

.emit-dark .adaptive-card-host__surface [data-emit-manifold-pill]:has(input[type="checkbox"]:checked),
.emit-dark .adaptive-card-host__surface [data-emit-manifold-pill]:has(input[type="checkbox"]:focus-visible) {
    border-color: #4db1bc;
    color: #4db1bc;
    background: rgba(77, 177, 188, 0.12);
}

/* ============================================================
   Process view main card — navigation stays reachable
   Long repeating item lists (inventory, entry lists) would otherwise
   push the navigation buttons off screen. The surrounding shell owns
   the scroll (.emit-content-body, .mud-tab-panel, .cv-workspace-main);
   adding a second scroller here traps the wheel and strands the list
   bottom below the visible region.
   ============================================================ */

.process-view-surface .process-view-main {
    display: flex;
    flex-direction: column;
}

/* Sticks to the bottom of whichever shell region is scrolling. */
.process-view-main > .process-view-actions {
    flex: 0 0 auto;
    position: sticky;
    bottom: 0;
    z-index: 5;
    padding: 8px 0;
    background-color: #ffffff;
}

.cv-workspace-main .process-view-main > .process-view-actions {
    background-color: #e8e9ea;
}

.emit-dark .process-view-main > .process-view-actions {
    background-color: #111c24;
}

/* ============================================================
   Process view panel — measurement / side-panel forms
   Scoped polish for cv.source.measurement and similar panels.
   ============================================================ */

.process-view-surface .process-view-panel {
    min-width: 320px;
    max-width: 520px;
    flex: 0 0 480px;
}

.measurement-panel-backdrop {
    position: fixed;
    inset: 0;
    z-index: 299;
    background: rgba(15, 23, 42, 0.16);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.emit-dark .measurement-panel-backdrop {
    background: rgba(0, 0, 0, 0.32);
}

.process-view-panel.measurement-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(480px, 92vw);
    max-width: 520px;
    z-index: 300;
    flex: none;
    margin: 0;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
}

.process-view-panel__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid #d5d7d8;
    flex-shrink: 0;
}

.process-view-panel__title {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 4px;
}

.emit-shell:not(.emit-dark) .process-view-panel__title {
    color: #141414;
}

.process-view-panel__subtitle {
    font-size: 11px;
    line-height: 1.4;
}

.emit-shell:not(.emit-dark) .process-view-panel__subtitle {
    color: #5f6368;
}

.process-view-panel__close.mud-icon-button {
    flex-shrink: 0;
    border: 1px solid #d5d7d8;
    border-radius: 4px;
    padding: 4px;
    width: 28px;
    height: 28px;
}

.process-view-panel__body {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
}

.process-view-panel__actions {
    padding-top: 4px;
}

.process-view-panel .adaptive-card-host__surface .ac-adaptiveCard {
    box-shadow: none;
    background: transparent;
    padding: 0;
}

.measurement-panel .adaptive-card-host__surface .ac-adaptiveCard {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.manifold-measurement-panel .adaptive-card-host__surface .ac-adaptiveCard {
    gap: 24px;
}

/* Panel chrome owns the header — hide duplicate title/context rows in the card */
.measurement-panel:not(.manifold-measurement-panel) .adaptive-card-host__surface .ac-adaptiveCard > *:nth-child(-n+5) {
    display: none;
}

/* Source measurement sections — bordered cards (individual + manifold panels) */
.measurement-panel .adaptive-card-host__surface [id^="sourceBlock_"]:not([id$="_body"]) {
    border: 1px solid #d5d7d8;
    border-left: 3px solid #0079c1;
    border-radius: 8px;
    padding: 12px 14px 16px;
    margin: 0 !important;
    background: #fafbfc;
}

.measurement-panel .adaptive-card-host__surface [id^="sourceBlock_"]:not([id$="_body"]) > .ac-columnSet:first-child {
    padding-bottom: 10px;
    margin-bottom: 12px;
    border-bottom: 1px solid #e8eaed;
}

.manifold-measurement-panel .adaptive-card-host__surface [id^="sourceBlock_"]:not([id$="_body"]) {
    padding: 14px 16px 18px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.measurement-panel .adaptive-card-host__surface [id^="sourceBlock_"]:not([id$="_body"]) > .ac-columnSet:first-child .ac-column:last-child .ac-textBlock {
    background: rgba(0, 0, 0, 0.06);
    border-radius: 4px;
    padding: 2px 8px;
    font-size: 11px;
}

.emit-dark .measurement-panel .adaptive-card-host__surface [id^="sourceBlock_"]:not([id$="_body"]) {
    border-color: rgba(255, 255, 255, 0.14);
    border-left-color: #4DB1BC;
    background: #1e1e1e;
    box-shadow: none;
}

.emit-dark .manifold-measurement-panel .adaptive-card-host__surface [id^="sourceBlock_"]:not([id$="_body"]) {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}

.emit-dark .measurement-panel .adaptive-card-host__surface [id^="sourceBlock_"]:not([id$="_body"]) > .ac-columnSet:first-child {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

.emit-dark .measurement-panel .adaptive-card-host__surface [id^="sourceBlock_"]:not([id$="_body"]) > .ac-columnSet:first-child .ac-column:last-child .ac-textBlock {
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.75);
}

.measurement-panel .adaptive-card-host__surface .emit-field-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    margin-left: 4px;
    border-radius: 50%;
    border: 1px solid currentColor;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    cursor: help;
    opacity: 0.7;
    vertical-align: middle;
}

.measurement-panel .adaptive-card-host__surface .emit-field-help:hover {
    opacity: 1;
}

.emit-shell:not(.emit-dark) .manifold-measurement-panel .adaptive-card-host__surface .ac-input.ac-textInput[readonly],
.emit-shell:not(.emit-dark) .manifold-measurement-panel .adaptive-card-host__surface .ac-input.ac-textInput:disabled {
    background: #f1f3f4;
    color: #141414;
    border-color: #d5d7d8;
}

.emit-dark .manifold-measurement-panel .adaptive-card-host__surface .ac-input.ac-textInput[readonly],
.emit-dark .manifold-measurement-panel .adaptive-card-host__surface .ac-input.ac-textInput:disabled {
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.7);
    border-color: rgba(255, 255, 255, 0.15);
}

.process-view-panel .adaptive-card-host__surface .ac-inputContainer {
    margin-bottom: 14px;
}

.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #5f6368;
    margin-bottom: 6px;
    display: block;
}

.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-textBlock.ac-subtle {
    margin-bottom: 10px;
    line-height: 1.45;
    font-size: 11px;
    color: #5f6368;
}

/* Italic operating-mode help directly under the mode dropdown */
.measurement-panel .adaptive-card-host__surface .ac-inputContainer:has(select[id="operatingMode"]) + .ac-textBlock.ac-subtle,
.measurement-panel .adaptive-card-host__surface .ac-inputContainer:has(.ac-input[id="operatingMode"]) + .ac-textBlock.ac-subtle {
    margin-top: -6px;
    margin-bottom: 14px;
    font-style: italic;
}

.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-container.ac-emphasis {
    border: 1px solid #e8e9ea;
    border-left: 3px solid #0079c1;
    border-radius: 6px;
    padding: 12px;
    margin-bottom: 12px;
    background: #f8f9fa;
}

.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input.ac-textInput,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface textarea.ac-input.ac-textInput,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input.ac-numberInput,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input.ac-dateInput,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input.ac-timeInput,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface select.ac-input.ac-multichoiceInput,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input-text,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input-number,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input-date,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-choiceSetInput {
    border-color: #0079c1;
    border-radius: 4px;
    padding: 8px 10px;
    font-size: 13px;
}

.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox {
    border: none;
    padding: 8px 34px 8px 10px;
    font-size: 13px;
    background: transparent;
    box-shadow: none;
}

.process-view-panel .adaptive-card-host__surface .ac-input.ac-textInput:focus,
.process-view-panel .adaptive-card-host__surface textarea.ac-input.ac-textInput:focus,
.process-view-panel .adaptive-card-host__surface .ac-input.ac-numberInput:focus,
.process-view-panel .adaptive-card-host__surface .ac-input.ac-dateInput:focus,
.process-view-panel .adaptive-card-host__surface select.ac-input.ac-multichoiceInput:focus,
.process-view-panel .adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered:focus,
.process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:focus-within,
.process-view-panel .adaptive-card-host__surface .ac-input-text:focus,
.process-view-panel .adaptive-card-host__surface .ac-input-number:focus,
.process-view-panel .adaptive-card-host__surface .ac-input-date:focus,
.process-view-panel .adaptive-card-host__surface .ac-choiceSetInput:focus {
    border-color: #0079c1;
    box-shadow: 0 0 0 3px rgba(0, 121, 193, 0.15);
}

.process-view-panel .adaptive-card-host__surface .ac-input.ac-textInput:disabled,
.process-view-panel .adaptive-card-host__surface textarea.ac-input.ac-textInput:disabled,
.process-view-panel .adaptive-card-host__surface select.ac-input.ac-multichoiceInput:disabled,
.process-view-panel .adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered:disabled,
.process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:has(.ac-choiceSetInput-filtered-textbox:disabled) {
    background: #f1f3f4;
    border-color: #d5d7d8;
    cursor: not-allowed;
}

.process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox:disabled {
    background: transparent;
    border: none;
    color: #9aa0a6;
    cursor: not-allowed;
}

.process-view-panel .adaptive-card-host__surface .ac-input.ac-toggleInput {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: auto;
    padding: 0;
    border: none;
    background: transparent;
    width: 100%;
    box-sizing: border-box;
    cursor: pointer;
}

.process-view-panel .adaptive-card-host__surface .ac-input.ac-toggleInput input[type="checkbox"] {
    appearance: none;
    width: 36px;
    height: 20px;
    margin: 0;
    border-radius: 10px;
    background: #d5d7d8;
    position: relative;
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color 0.15s;
}

.process-view-panel .adaptive-card-host__surface .ac-input.ac-toggleInput input[type="checkbox"]::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #ffffff;
    transition: transform 0.15s;
}

.process-view-panel .adaptive-card-host__surface .ac-input.ac-toggleInput input[type="checkbox"]:checked {
    background: #0079c1;
}

.process-view-panel .adaptive-card-host__surface .ac-input.ac-toggleInput input[type="checkbox"]:checked::before {
    transform: translateX(16px);
}

.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-expanded,
.emit-shell:not(.emit-dark) .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-multiSelect:not([data-emit-manifold-pills]) {
    border: 1px solid #0079c1;
    border-radius: 4px;
    padding: 10px 12px;
    background: #ffffff;
    width: 100%;
    box-sizing: border-box;
}

.process-view-panel .adaptive-card-host__surface [data-emit-manifold-pills].ac-input.ac-choiceSetInput-multiSelect {
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
}

.process-view-panel .adaptive-card-host__surface .ac-columnSet {
    margin-bottom: 4px;
}

.process-view-panel .adaptive-card-host__surface .ac-pushButton.style-positive {
    width: 100%;
    margin-top: 4px;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-label {
    color: rgba(255, 255, 255, 0.72);
}

.emit-dark .process-view-panel__header {
    border-bottom-color: rgba(255, 255, 255, 0.12);
}

.emit-dark .process-view-panel__title {
    color: rgba(255, 255, 255, 0.92);
}

.emit-dark .process-view-panel__subtitle {
    color: rgba(255, 255, 255, 0.54);
}

.emit-dark .process-view-panel__close.mud-icon-button {
    border-color: rgba(255, 255, 255, 0.14);
}

.emit-dark .process-view-panel.measurement-panel {
    background: #121212;
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.45);
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-container.ac-emphasis {
    border-color: rgba(255, 255, 255, 0.12);
    border-left-color: #4DB1BC;
    background: rgba(255, 255, 255, 0.04);
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-textBlock.ac-subtle {
    color: rgba(255, 255, 255, 0.54);
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-textInput,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-numberInput,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-dateInput,
.emit-dark .process-view-panel .adaptive-card-host__surface select.ac-input.ac-multichoiceInput,
.emit-dark .process-view-panel .adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container {
    background: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.92);
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-textInput:focus,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-numberInput:focus,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-dateInput:focus,
.emit-dark .process-view-panel .adaptive-card-host__surface select.ac-input.ac-multichoiceInput:focus,
.emit-dark .process-view-panel .adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered:focus,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container:focus-within {
    border-color: #4DB1BC;
    box-shadow: 0 0 0 3px rgba(77, 177, 188, 0.18);
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-textInput:read-only,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-textInput[disabled] {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.72);
}

.measurement-panel .adaptive-card-host__surface .ac-actionSet {
    display: none !important;
}

.measurement-panel__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-top: 1px solid #d5d7d8;
    flex-shrink: 0;
}

.emit-dark .measurement-panel__footer {
    border-top-color: rgba(255, 255, 255, 0.12);
}

.measurement-panel__footer-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.measurement-panel__cancel.mud-button-root {
    color: #0079c1;
    text-transform: none;
    font-weight: 600;
}

.emit-dark .measurement-panel__cancel.mud-button-root {
    color: #4DB1BC;
}

.measurement-panel__save-draft.mud-button-root {
    background: #5f6368 !important;
    color: #ffffff !important;
    text-transform: none;
    font-weight: 600;
    border-radius: 999px;
    box-shadow: none;
}

.emit-dark .measurement-panel__save-draft.mud-button-root {
    background: #333333 !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

.measurement-panel__save-validate.mud-button-root {
    background: #0079c1 !important;
    color: #ffffff !important;
    text-transform: none;
    font-weight: 600;
    border-radius: 999px;
    box-shadow: none;
}

.emit-dark .measurement-panel__save-validate.mud-button-root {
    background: #4DB1BC !important;
    color: #121212 !important;
}

.measurement-panel .adaptive-card-host__surface .ac-container.ac-emphasis > .ac-columnSet:first-child {
    margin-bottom: 8px;
}

.measurement-panel .adaptive-card-host__surface .emit-collapsible-header {
    cursor: pointer;
    user-select: none;
}

.measurement-panel .adaptive-card-host__surface .emit-collapsible-header:hover {
    opacity: 0.92;
}

.measurement-panel .adaptive-card-host__surface .emit-collapsible-header:focus-visible {
    outline: 2px solid rgba(77, 177, 188, 0.65);
    outline-offset: 2px;
    border-radius: 4px;
}

.measurement-panel .adaptive-card-host__surface [id^="collapsibleChevron_"] {
    font-size: 1.05rem;
    line-height: 1;
    min-width: 1.25rem;
    text-align: right;
}

.measurement-panel .adaptive-card-host__surface .ac-container.ac-emphasis .ac-textBlock[aria-label="separator"],
.measurement-panel .adaptive-card-host__surface .ac-container.ac-emphasis .ac-textBlock.ac-separator {
    margin-top: 8px;
    margin-bottom: 12px;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-toggleInput input[type="checkbox"] {
    background: rgba(255, 255, 255, 0.22);
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-toggleInput input[type="checkbox"]:checked {
    background: #4DB1BC;
}

/* Measurement panel dark mode — override Adaptive Cards inline host-config colors */
.emit-dark .process-view-panel.measurement-panel {
    background-color: #121212 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.45);
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-adaptiveCard {
    background: transparent !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-container.ac-emphasis {
    background-color: #1e1e1e !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    border-left-color: #4DB1BC !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-textBlock {
    color: rgba(255, 255, 255, 0.87) !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-textBlock.ac-subtle {
    color: rgba(255, 255, 255, 0.54) !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-label {
    color: rgba(255, 255, 255, 0.72) !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-textInput,
.emit-dark .process-view-panel .adaptive-card-host__surface textarea.ac-input.ac-textInput,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-numberInput,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-dateInput,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-timeInput,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input-text,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input-number,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input-date,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-choiceSetInput {
    background-color: #2a2a2a !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-expanded,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-multiSelect:not([data-emit-manifold-pills]) {
    background-color: #2a2a2a !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface [data-emit-manifold-pills].ac-input.ac-choiceSetInput-multiSelect {
    background: transparent !important;
    border: none !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface select.ac-input.ac-multichoiceInput,
.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-container {
    background-color: #2a2a2a !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='rgba(255,255,255,0.54)' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 12px !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface input.ac-input.ac-multichoiceInput.ac-choiceSetInput-filtered {
    background-color: #2a2a2a !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    background-image: none !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-choiceSetInput-filtered-textbox {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: rgba(255, 255, 255, 0.92) !important;
    background-image: none !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface select.ac-input.ac-multichoiceInput option {
    background-color: #2a2a2a;
    color: rgba(255, 255, 255, 0.92);
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-label,
.emit-dark .adaptive-card-host__surface--dark .ac-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin-bottom: 6px;
    display: block;
    color: rgba(255, 255, 255, 0.85) !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-label .ac-label-suffix,
.emit-dark .adaptive-card-host__surface--dark .ac-label .ac-label-suffix {
    color: #ff8a80 !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-container.ac-emphasis,
.emit-dark .adaptive-card-host__surface--dark .ac-container.ac-emphasis {
    background-color: #1e1e1e !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    border-left-color: #4DB1BC !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-textBlock,
.emit-dark .adaptive-card-host__surface--dark .ac-textBlock {
    color: rgba(255, 255, 255, 0.87) !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-textBlock.ac-subtle,
.emit-dark .adaptive-card-host__surface--dark .ac-textBlock.ac-subtle {
    color: rgba(255, 255, 255, 0.54) !important;
}

.emit-dark .process-view-panel .adaptive-card-host__surface .ac-input.ac-toggleInput .ac-textBlock,
.emit-dark .adaptive-card-host__surface--dark .ac-input.ac-toggleInput .ac-textBlock {
    color: rgba(255, 255, 255, 0.87) !important;
}

.process-view-main {
    min-width: 280px;
}

/* ---- Collapsed module nav rail ---- */
.cv-workspace-nav--collapsed {
    width: 56px;
    min-width: 56px;
}

.cv-workspace-nav--collapsed .cv-workspace-nav-title,
.cv-workspace-nav--collapsed .cv-workspace-nav-badges,
.cv-workspace-nav--collapsed .cv-workspace-nav-group-label,
.cv-workspace-nav--collapsed .cv-workspace-nav-item span {
    display: none;
}

.cv-workspace-nav--collapsed .cv-workspace-nav-header {
    overflow: visible;
    padding: 8px 6px;
}

.cv-workspace-nav-toggle.mud-icon-button {
    touch-action: manipulation;
}

.cv-workspace-nav--collapsed .cv-workspace-nav-header .d-flex {
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.cv-workspace-nav--collapsed .cv-workspace-nav-item {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}

/* ---- Capture mobile / PWA (US-40) ---- */
.emit-nav-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 150;
}

.emit-sidebar--mobile-hidden {
    position: fixed;
    left: -240px;
    width: 220px;
    min-width: 220px;
    transition: left 0.2s ease;
    pointer-events: none;
    visibility: hidden;
}

.emit-sidebar--mobile-drawer {
    position: fixed;
    left: 0;
    top: 0;
    width: 220px;
    min-width: 220px;
    z-index: 200;
    box-shadow: 4px 0 16px rgba(0, 0, 0, 0.2);
    pointer-events: auto;
    visibility: visible;
    padding-top: env(safe-area-inset-top, 0);
}

.cv-workspace-nav-mobile-toggle {
    position: absolute;
    top: 8px;
    left: max(8px, env(safe-area-inset-left, 0));
    z-index: 20;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 12px;
    border: 1px solid #0079c1;
    border-radius: 4px;
    background: var(--mud-palette-surface);
    color: var(--mud-palette-primary);
    font-weight: 600;
}

.cv-workspace-nav-mobile-toggle[hidden] {
    display: none !important;
}

.cv-workspace-nav-backdrop {
    position: fixed;
    inset: 0;
    z-index: 175;
    border: 0;
    padding: 0;
    background: rgba(0, 0, 0, 0.45);
}

.cv-workspace-nav--mobile-hidden {
    position: fixed;
    left: -240px;
    visibility: hidden;
    pointer-events: none;
}

.cv-workspace-nav--mobile-drawer {
    position: fixed;
    top: 0;
    bottom: 0;
    left: env(safe-area-inset-left, 0);
    z-index: 180;
    width: min(280px, calc(100vw - env(safe-area-inset-left, 0) - 48px));
    min-width: min(280px, calc(100vw - env(safe-area-inset-left, 0) - 48px));
    padding-top: env(safe-area-inset-top, 0);
    padding-bottom: env(safe-area-inset-bottom, 0);
    box-shadow: 4px 0 16px rgba(0, 0, 0, 0.24);
}

.cv-capture-header {
    position: sticky;
    top: 0;
    z-index: 10;
    background-color: #e8e9ea;
    padding-top: env(safe-area-inset-top, 0);
    padding-bottom: 8px;
    margin-bottom: 12px;
}

.cv-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
    gap: 12px;
}

.cv-kpi-tile {
    min-width: 0;
}

.capture-touch-targets .mud-icon-button,
.capture-touch-targets .cv-workspace-nav-item,
.capture-touch-target,
.capture-touch-targets .mud-button-root {
    min-height: 44px;
    min-width: 44px;
}

.capture-touch-targets .cv-workspace-nav-item {
    min-width: 100%;
}

@media (max-width: 768px), (max-width: 956px) and (pointer: coarse) {
    .emit-content-header {
        padding-left: max(12px, env(safe-area-inset-left, 0));
        padding-right: max(12px, env(safe-area-inset-right, 0));
    }

    .cv-workspace-main {
        padding: 64px 16px 12px;
        padding-left: max(16px, env(safe-area-inset-left, 0));
        padding-right: max(16px, env(safe-area-inset-right, 0));
        padding-bottom: max(16px, env(safe-area-inset-bottom, 0));
    }

    .cv-capture-header {
        margin-left: calc(-1 * max(16px, env(safe-area-inset-left, 0)));
        margin-right: calc(-1 * max(16px, env(safe-area-inset-right, 0)));
        padding-left: max(16px, env(safe-area-inset-left, 0));
        padding-right: max(16px, env(safe-area-inset-right, 0));
    }

    .process-view-surface {
        flex-direction: column;
    }

    .process-view-main {
        min-width: 0;
        width: 100%;
    }

    .process-view-surface .process-view-panel {
        flex: 1 1 100%;
        min-width: 0;
        max-width: none;
        width: 100%;
    }

    .process-view-panel.measurement-panel {
        position: fixed;
        inset: 0;
        z-index: 300;
        max-width: none;
        border-radius: 0;
        padding-top: env(safe-area-inset-top, 0);
        padding-bottom: env(safe-area-inset-bottom, 0);
    }

    .measurement-panel .adaptive-card-host__surface .ac-columnSet {
        flex-direction: column !important;
    }

    .measurement-panel .adaptive-card-host__surface .ac-column {
        width: 100% !important;
        flex: 1 1 100% !important;
    }

    .process-view-panel__actions {
        padding-bottom: env(safe-area-inset-bottom, 0);
    }

    .emit-schedule-editor-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 299;
        background: rgba(0, 0, 0, 0.4);
    }

    .emit-schedule-editor-item {
        position: fixed;
        inset: max(12px, env(safe-area-inset-top, 0))
               max(12px, env(safe-area-inset-right, 0))
               max(12px, env(safe-area-inset-bottom, 0))
               max(12px, env(safe-area-inset-left, 0));
        z-index: 300;
        width: auto !important;
        max-width: none !important;
        overflow-y: auto;
    }

    .emit-schedule-editor {
        min-height: 100%;
    }

    .emit-save-sync {
        gap: 4px;
    }

    .emit-save-sync-timestamp,
    .emit-save-sync-secondary {
        display: none;
    }

    .emit-content-header-actions {
        gap: 4px;
        min-width: 0;
    }

    .emit-save-sync .mud-button-root {
        min-width: 0;
        padding-inline: 6px;
    }

    .emit-save-status--error {
        flex-wrap: wrap;
        justify-content: flex-end;
        min-width: 0;
    }

    .emit-save-status--error .emit-save-status-message {
        max-width: min(40vw, 180px);
        white-space: normal;
    }
}

.emit-dark .cv-capture-header {
    background-color: #1a1a1a;
}

/* Ask EMIT — shared full-page and shell-drawer conversation surface. */
.emit-content-header-actions,
.ask-emit-page-title,
.ask-emit-history-header,
.ask-emit-input-row,
.ask-emit-thinking {
    display: flex;
    align-items: center;
}

.emit-content-header-actions {
    gap: 12px;
}

.ask-emit-page {
    display: grid;
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
    min-height: calc(100vh - 100px);
    max-width: 1280px;
    margin: 0 auto;
    border: 1px solid #d5d7d8;
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}

.ask-emit-history {
    padding: 20px;
    background: #f5f7fa;
    border-right: 1px solid #d5d7d8;
}

.ask-emit-history-header {
    justify-content: space-between;
    margin-bottom: 12px;
}

.ask-emit-history-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ask-emit-history-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    width: 100%;
    padding: 10px;
    text-align: left;
    border: 1px solid #d5d7d8;
    border-radius: 6px;
    background: #fff;
    color: #141414;
}

.ask-emit-history-item small {
    color: #697078;
}

.ask-emit-page-main {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 28px;
}

.ask-emit-page-title {
    gap: 14px;
    margin-bottom: 20px;
}

.ask-emit-conversation {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
}

.ask-emit-prompt-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.ask-emit-transcript {
    display: flex;
    min-height: 260px;
    flex: 1;
    flex-direction: column;
    gap: 14px;
    overflow-y: auto;
    padding: 12px 4px 18px;
}

.ask-emit-empty {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
}

.ask-emit-message {
    max-width: 82%;
    padding: 12px 14px;
    border-radius: 10px;
}

.ask-emit-message--user {
    align-self: flex-end;
    background: #e4f3fb;
}

.ask-emit-message--assistant {
    align-self: flex-start;
    background: #f1f3f4;
}

.ask-emit-message-label {
    margin-bottom: 4px;
    font-size: 0.72rem;
    font-weight: 700;
    color: #52606b;
}

.ask-emit-message-body {
    white-space: pre-wrap;
}

.ask-emit-citations {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    font-size: 0.75rem;
}

.ask-emit-thinking {
    gap: 8px;
    color: #52606b;
}

.ask-emit-input-row {
    gap: 8px;
}

.ask-emit-input-row .mud-input-control {
    flex: 1;
}

.ask-emit-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1090;
    background: rgba(7, 30, 38, 0.2);
}

.ask-emit-drawer {
    position: fixed;
    z-index: 1100;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    width: min(420px, 100vw);
    flex-direction: column;
    border-left: 1px solid #d5d7d8;
    background: #fff;
    box-shadow: -4px 0 24px rgba(7, 30, 38, 0.16);
}

.ask-emit-drawer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid #d5d7d8;
}

.ask-emit-drawer-body {
    display: flex;
    min-height: 0;
    flex: 1;
    padding: 16px;
}

.emit-dark .ask-emit-page,
.emit-dark .ask-emit-history-item,
.emit-dark .ask-emit-drawer {
    color: rgba(255, 255, 255, 0.87);
    background: #1a1a1a;
    border-color: rgba(255, 255, 255, 0.12);
}

.emit-dark .ask-emit-history,
.emit-dark .ask-emit-message--assistant {
    background: #242424;
    border-color: rgba(255, 255, 255, 0.12);
}

.emit-dark .ask-emit-message--user {
    background: #143c50;
}

@media (max-width: 800px) {
    .emit-ask-emit-trigger .mud-button-label {
        font-size: 0;
    }

    .ask-emit-page {
        display: flex;
        min-height: calc(100vh - 76px);
        flex-direction: column;
    }

    .ask-emit-history {
        border-right: 0;
        border-bottom: 1px solid #d5d7d8;
    }

    .ask-emit-page-main {
        min-height: 520px;
        padding: 16px;
    }
}