/* Appearance preferences. Light deliberately preserves the established portal palette. */
body[data-theme="light"] { color-scheme: light; }

.context-theme { padding: 11px 17px; border-bottom: 1px solid #e8ebe9; background: #fbfcfb; }
.theme-switcher { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.theme-switcher > span { color: #65716b; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.theme-switcher-options { display: flex; gap: 5px; padding: 3px; border: 1px solid #dfe5e2; border-radius: 9px; background: #fff; }
.theme-option { display: grid; width: 30px; min-height: 28px; padding: 0; place-items: center; border: 0; border-radius: 6px; background: transparent; box-shadow: none; color: #75807b; font-size: 14px; line-height: 1; }
.theme-option:hover { background: #f8e8f1; color: #b71971; }
.theme-option.active, .theme-option:disabled { background: #f7e2ee; color: #b71971; cursor: default; opacity: 1; }

body[data-theme="dark"] {
    color-scheme: dark;
    --ink: #edf3fa;
    --muted: #a8b5c5;
    --line: #2b3746;
    --paper: #10161f;
    --surface: #18212d;
    --brand: #e8509b;
    --brand-hover: #f06caf;
    --brand-soft: #3b2034;
    --patriq-charcoal: #eff4fa;
    --patriq-charcoal-deep: #0d131c;
    --patriq-magenta: #e8509b;
    --patriq-magenta-dark: #f06caf;
    --patriq-magenta-soft: #3b2034;
    --patriq-blush: #211724;
    --patriq-line: #2b3746;
    background: #10161f;
    color: #edf3fa;
}

body[data-theme="dark"] .dash-topbar,
body[data-theme="dark"] .dash-sidebar,
body[data-theme="dark"] .context-menu,
body[data-theme="dark"] .panel,
body[data-theme="dark"] .metric-card,
body[data-theme="dark"] .device-fact,
body[data-theme="dark"] .template-port-card,
body[data-theme="dark"] .automation-rule-card,
body[data-theme="dark"] .automation-action-card,
body[data-theme="dark"] .communication-log-entry,
body[data-theme="dark"] .value-card,
body[data-theme="dark"] .timeline-chart,
body[data-theme="dark"] .empty-state,
body[data-theme="dark"] .secondary-link,
body[data-theme="dark"] .user-row-actions > a,
body[data-theme="dark"] .user-row-actions button,
body[data-theme="dark"] .language-flag-button,
body[data-theme="dark"] .theme-switcher-options { background: #18212d; border-color: #2b3746; color: #edf3fa; }

body[data-theme="dark"] .dash-topbar,
body[data-theme="dark"] .dash-sidebar { background: #111923; border-color: #293646; }
body[data-theme="dark"] .dash-sidebar nav a { color: #b7c2cf; }
body[data-theme="dark"] .dash-sidebar nav a:hover { background: #1c2734; color: #fff; }
body[data-theme="dark"] .dash-sidebar nav a.active { background: #26203a; border-left-color: #e8509b; color: #f594c6; }
body[data-theme="dark"] .dash-brand .portal-label { border-color: #354253; }
body[data-theme="dark"] .dash-brand .portal-label strong,
body[data-theme="dark"] .user-menu strong,
body[data-theme="dark"] .context-identity strong { color: #f4f7fb; }
body[data-theme="dark"] .dash-brand .portal-label small,
body[data-theme="dark"] .user-menu small,
body[data-theme="dark"] .context-identity small,
body[data-theme="dark"] .page-heading > div > p:last-child,
body[data-theme="dark"] .panel header p { color: #a8b5c5; }

body[data-theme="dark"] input,
body[data-theme="dark"] select,
body[data-theme="dark"] textarea,
body[data-theme="dark"] .field input,
body[data-theme="dark"] .field select,
body[data-theme="dark"] .stack-form input { background: #121a24; border-color: #354454; color: #edf3fa; }
body[data-theme="dark"] input::placeholder,
body[data-theme="dark"] textarea::placeholder { color: #8290a1; }
body[data-theme="dark"] option { background: #18212d; color: #edf3fa; }
body[data-theme="dark"] .field,
body[data-theme="dark"] .field label,
body[data-theme="dark"] .field > span,
body[data-theme="dark"] .automation-rule-card label,
body[data-theme="dark"] .automation-action-card label { color: #dce5ee; }

body[data-theme="dark"] .editor-section[open] > .editor-section-summary,
body[data-theme="dark"] .panel > header,
body[data-theme="dark"] .context-identity,
body[data-theme="dark"] .context-language,
body[data-theme="dark"] .context-theme,
body[data-theme="dark"] .context-menu form,
body[data-theme="dark"] th,
body[data-theme="dark"] th,
body[data-theme="dark"] td,
body[data-theme="dark"] .communication-log-entry > header { border-color: #2b3746; }
body[data-theme="dark"] .context-language,
body[data-theme="dark"] .context-theme,
body[data-theme="dark"] th { background: #151e29; }
body[data-theme="dark"] .context-menu > a,
body[data-theme="dark"] .context-menu form button { background: #18212d; color: #d8e1ea; }
body[data-theme="dark"] .context-menu > a:hover,
body[data-theme="dark"] .context-menu form button:hover { background: #242039; color: #f19bc7; }
body[data-theme="dark"] .theme-switcher > span { color: #acb8c7; }
body[data-theme="dark"] .theme-option { color: #a6b3c3; }
body[data-theme="dark"] .theme-option:hover { background: #30233b; color: #f49dca; }
body[data-theme="dark"] .theme-option.active,
body[data-theme="dark"] .theme-option:disabled { background: #492747; color: #ffd4e8; }

body[data-theme="dark"] .dash-alert,
body[data-theme="dark"] .access-badge,
body[data-theme="dark"] .role-chip,
body[data-theme="dark"] .editor-section-count,
body[data-theme="dark"] .metric-icon { background: #3a2036; color: #f59ccb; }
body[data-theme="dark"] .device-fact > span,
body[data-theme="dark"] .template-port-summary p,
body[data-theme="dark"] .communication-log-entry time,
body[data-theme="dark"] .empty-state p,
body[data-theme="dark"] td small,
body[data-theme="dark"] .metric-card p { color: #9daaba; }
body[data-theme="dark"] .device-fact > strong,
body[data-theme="dark"] .template-port-summary h3,
body[data-theme="dark"] .panel h2,
body[data-theme="dark"] .metric-card,
body[data-theme="dark"] .page-heading h1,
body[data-theme="dark"] .empty-state strong { color: #edf3fa; }
body[data-theme="dark"] .editor-section-chevron,
body[data-theme="dark"] .template-port-chevron,
body[data-theme="dark"] .automation-chevron { background: #201929; border-color: #4a3145; color: #f59ccb; }
body[data-theme="dark"] .inline-removal-confirmation,
body[data-theme="dark"] .message-editor-dialog,
body[data-theme="dark"] .mqtt-topic-dialog,
body[data-theme="dark"] .upload-policy-dialog,
body[data-theme="dark"] .serial-settings-dialog,
body[data-theme="dark"] .electronic-invoicing-dialog { background: #1b2531; border-color: #344252; color: #edf3fa; }
body[data-theme="dark"] .shift-time-remove-confirmation { background: #261b24; border-color: #684150; color: #f2c8da; }
body[data-theme="dark"] .shift-time-remove-confirm { border-color: #c34c58; background: #b13e49; }
body[data-theme="dark"] .schedule-editor-form,
body[data-theme="dark"] .schedule-times-panel { background: #16212d; border-color: #304157; }
body[data-theme="dark"] .schedule-settings-grid label,
body[data-theme="dark"] .schedule-status-row .check-row { color: #dce8f5; }
body[data-theme="dark"] .schedule-settings-grid input,
body[data-theme="dark"] .schedule-settings-grid select,
body[data-theme="dark"] .schedule-times-panel .shift-time-controls input { background: #101a26; border-color: #35485e; color: #edf4fb; }
body[data-theme="dark"] .schedule-times-panel .shift-time-remove-button { background: #261b24; border-color: #684150; color: #f0808f; }
body[data-theme="dark"] .form-actions { background: #182432; border-color: #304157; }
body[data-theme="dark"] .form-actions > a:not(.primary-link) { background: #101a26; border-color: #35485e; color: #edf4fb; }
body[data-theme="dark"] .form-actions > a:not(.primary-link):hover { border-color: #e8509b; color: #f59ccb; }
body[data-theme="dark"] .form-loading-overlay { background: rgba(8, 12, 18, .76); }
body[data-theme="dark"] .form-loading-card { background: #1a2430; border-color: #354454; color: #edf3fa; }
body[data-theme="dark"] .language-flag-button:hover { background: #282039; }
body[data-theme="dark"] .secondary-link:hover,
body[data-theme="dark"] .user-row-actions > a:hover,
body[data-theme="dark"] .user-row-actions button:hover { border-color: #e8509b; background: #29203a; color: #f59ccb; }
body[data-theme="dark"] .brand-wordmark-light .brand-wordmark-primary { fill: #f5f7fb; }

/* The global form treatment must not split the compact search field into two surfaces. */
body[data-theme="dark"] .top-search label { background: #1b2531; border-color: #334253; color: #aab7c7; }
body[data-theme="dark"] .top-search input { background: transparent; color: #edf3fa; }
body[data-theme="dark"] .top-search label:focus-within { background: #202c39; border-color: #e8509b; }
body[data-theme="dark"] .system-health-panel { background:#182330; border-color:#334253; color:#edf3fa; box-shadow:0 16px 40px #0008; }
body[data-theme="dark"] .system-health-panel p,body[data-theme="dark"] .system-health-panel li span { color:#aab7c7; }
body[data-theme="dark"] .system-health-panel li { border-color:#2c3948; }

/* Latest values uses compact cards rather than the generic panel components. */
body[data-theme="dark"] .value-device-card { border-color: #2b3746; }
body[data-theme="dark"] .value-device-card > header { background: #151f2a; border-color: #2b3746; }
body[data-theme="dark"] .value-device-card h3,
body[data-theme="dark"] .value-port-meta strong { color: #edf3fa; }
body[data-theme="dark"] .value-device-card header p,
body[data-theme="dark"] .value-port-meta small,
body[data-theme="dark"] .value-reading small { color: #9eacbc; }
body[data-theme="dark"] .value-port-card { background: #1b2531; border-color: #344252; }
body[data-theme="dark"] .value-port-card:hover,
body[data-theme="dark"] .value-port-card:focus-visible { background: #29213a; border-color: #e8509b; box-shadow: 0 6px 16px rgba(232, 80, 155, .16); }
body[data-theme="dark"] .value-reading strong { color: #64d5a9; }
body[data-theme="dark"] .debug-device-log-link { background: #1d2835; border-color: #394858; color: #d8e3ec; }
body[data-theme="dark"] .virtual-device-badge { background: #40223a; color: #f2a0ca; }
body[data-theme="dark"] .virtual-device-open { background: #241d29; border-color: #75405f; color: #f2a0ca; }
body[data-theme="dark"] .virtual-action-toggle { background: #211c29; border-color: #51364a; }
body[data-theme="dark"] .virtual-action-toggle span { color: #f1b2d1; }
body[data-theme="dark"] .virtual-action-toggle small, body[data-theme="dark"] .virtual-control-card > header small { color: #aab7c7; }
body[data-theme="dark"] .virtual-control-card { background: #17212d; border-color: #344252; }
body[data-theme="dark"] .virtual-control-card > header strong, body[data-theme="dark"] .virtual-control-card .field > span { color: #edf3fa; }
body[data-theme="dark"] .virtual-port-number { background: #3d2239; color: #f4abd0; }
body[data-theme="dark"] .virtual-quick-actions button:not(:last-child) { background: #1d2835; border-color: #475367; color: #f2a0ca; }

/* Port-editor summaries and compact tool cards are independently styled components. */
body[data-theme="dark"] .template-port-card > .template-port-summary,
body[data-theme="dark"] .port-setting-group,
body[data-theme="dark"] .upload-policy-editor-trigger,
body[data-theme="dark"] .serial-settings-editor-trigger,
body[data-theme="dark"] .secondary-mini-button,
body[data-theme="dark"] .action-mqtt-payload-details { background: #1b2531; border-color: #344252; color: #edf3fa; }
body[data-theme="dark"] .template-port-summary h3,
body[data-theme="dark"] .port-setting-group-heading strong,
body[data-theme="dark"] .automation-copy strong,
body[data-theme="dark"] .automation-rule-card > header strong,
body[data-theme="dark"] .action-mqtt-payload-details summary { color: #edf3fa; }
body[data-theme="dark"] .template-port-summary p,
body[data-theme="dark"] .port-setting-group-heading small,
body[data-theme="dark"] .automation-copy small,
body[data-theme="dark"] .action-mqtt-payload-details > p { color: #a5b2c2; }
body[data-theme="dark"] .automation-group[open] .automation-summary,
body[data-theme="dark"] .template-port-card[open] > .template-port-summary { border-color: #344252; }
body[data-theme="dark"] .modbus-settings-group { border-color: #304157; background: #111b28; }
body[data-theme="dark"] .modbus-settings-heading,
body[data-theme="dark"] .modbus-variables-toolbar { border-color: #304157; background: #172231; }
body[data-theme="dark"] .modbus-settings-heading strong,
body[data-theme="dark"] .modbus-variables-toolbar strong,
body[data-theme="dark"] .modbus-register-row > strong,
body[data-theme="dark"] .modbus-register-row b { color: #edf4ff; }
body[data-theme="dark"] .modbus-settings-heading small,
body[data-theme="dark"] .modbus-variables-toolbar small,
body[data-theme="dark"] .modbus-register-row small,
body[data-theme="dark"] .modbus-register-empty,
body[data-theme="dark"] .modbus-register-no-matches,
body[data-theme="dark"] .modbus-register-limit-note,
body[data-theme="dark"] .modbus-security-note,
body[data-theme="dark"] .modbus-rule-unit { color: #a9b8c8; }
body[data-theme="dark"] .modbus-read-only-badge { background: #173d31; color: #8fe0bd; }
body[data-theme="dark"] .modbus-protocol-field > span { color: #a9b8c8; }
body[data-theme="dark"] .modbus-protocol-value { border-color: #304157; background: #172231; color: #edf4ff; }
body[data-theme="dark"] .modbus-variables-panel { border-color: #304157; background: #111b28; }
body[data-theme="dark"] .modbus-register-row { border-color: #26374a; }
body[data-theme="dark"] .modbus-register-limit-note { border-color: #26374a; background: #111b28; }
body[data-theme="dark"] .modbus-register-limit-note.is-limit-reached { background: #302614; color: #ffd889; }
body[data-theme="dark"] .modbus-register-row:hover,
body[data-theme="dark"] .modbus-register-row:has(input:checked) { background: #311d35; }
body[data-theme="dark"] .automation-rule-card > header { background: #232034; border-color: #3b354d; }
body[data-theme="dark"] .automation-actions { border-color: #344252; }
body[data-theme="dark"] .upload-policy-example { background: #262039; border-color: #493c59; color: #d1c2d1; }
body[data-theme="dark"] .electronic-agreement-summary > div:not(.electronic-agreement-actions),
body[data-theme="dark"] .electronic-agreement-document { background: #151f2a; border-color: #344252; color: #d4dfe9; }
body[data-theme="dark"] .electronic-agreement-status.is-active { background: #183a31; color: #7be2b7; }
body[data-theme="dark"] .electronic-agreement-status.is-pending { background: #39233a; color: #f3a5cf; }
body[data-theme="dark"] .electronic-agreement-empty p,
body[data-theme="dark"] .electronic-agreement-summary small,
body[data-theme="dark"] .electronic-invoicing-dialog > header p { color: #a8b5c5; }
body[data-theme="dark"] .electronic-agreement-summary strong,
body[data-theme="dark"] .electronic-invoicing-dialog > header h2,
body[data-theme="dark"] .electronic-agreement-document h1 { color: #edf3fa; }
body[data-theme="dark"] .electronic-agreement-confirm { background: #262039; border-color: #493c59; color: #e2d8e0; }

/* Releasing hardware is deliberately destructive, but it still needs readable contrast. */
body[data-theme="dark"] .device-release-card { background: #251d24; border-color: #4a3540; }
body[data-theme="dark"] .device-release-copy h2 { color: #ff9a92; }
body[data-theme="dark"] .device-release-copy p { color: #d5b7b7; }
body[data-theme="dark"] .device-release-code span { color: #e4b9b7; }
body[data-theme="dark"] .device-release-code strong { background: #4a2830; color: #ffd0cc; }
body[data-theme="dark"] .device-release-body .field > span { color: #f0d6d4; }

/* Usage cards follow the portal's dark surface treatment. */
body[data-theme="dark"] .usage-metrics article { background: #18212d; border-color: #2b3746; }
body[data-theme="dark"] .usage-metrics strong { color: #edf3fa; }
body[data-theme="dark"] .usage-metrics small,
body[data-theme="dark"] .usage-metrics span,
body[data-theme="dark"] .usage-empty { color: #a8b5c5; }
body[data-theme="dark"] .usage-device-deleted { background: #442127; color: #ffaea8; }
body[data-theme="dark"] .usage-total-row th,
body[data-theme="dark"] .usage-total-row td { background: #1a302b !important; border-top-color: #2bc18a; color: #edf3fa; }
body[data-theme="dark"] .integration-token { background: #0d141c; }

/* Agreement action card stays prominent in dark mode too. */
body[data-theme="dark"] .agreement-attention-card { border-color: #88412d; background: linear-gradient(135deg, #30211f, #241d22 60%, #352025); box-shadow: 0 10px 28px rgba(0,0,0,.28); }
body[data-theme="dark"] .agreement-attention-card .metric-icon { background: #522d27; color: #ffae8f; }
body[data-theme="dark"] .agreement-attention-card small { color: #f0a58d; }
body[data-theme="dark"] .agreement-attention-card strong { color: #ffd6c8; }
body[data-theme="dark"] .agreement-attention-card p { color: #d4b6ac; }
body[data-theme="dark"] .action-error-card { border-color: #8f4545; background: linear-gradient(135deg, #351d22, #25191f 60%, #3b1e22); box-shadow: 0 10px 28px rgba(0,0,0,.30); }
body[data-theme="dark"] .action-error-card .metric-icon { background: #57272d; color: #ff9b98; }
body[data-theme="dark"] .action-error-card small { color: #f3a3a0; }
body[data-theme="dark"] .action-error-card strong { color: #ffd1ce; }
body[data-theme="dark"] .action-error-card p { color: #e3b7b5; }
body[data-theme="dark"] .automation-errors-notification-warning { background: #351e24; border-color: #82464b; border-left-color: #ef665b; color: #ffd5d1; }
body[data-theme="dark"] .user-row-actions .automation-retry-action { border-color: #287c60; background: #152d26; color: #6ae0ae; }
body[data-theme="dark"] .user-row-actions .automation-retry-action:hover { border-color: #4fc78e; background: #193b30; color: #a0f0c8; }