/* Public theme selector. The stored "modern" value keeps existing preferences. */
.theme-control {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 0;
    color: var(--acom-muted, #45616a);
    font: 500 10px/1.2 var(--acom-font-ui, Arial, sans-serif);
    text-align: left;
}

.theme-control select {
    box-sizing: border-box;
    width: auto;
    min-width: 100px;
    height: 34px;
    min-height: 34px;
    margin: 0;
    padding: 5px 24px 5px 8px;
    color: var(--acom-text, #16333b);
    background: var(--acom-surface, #fff);
    border: 1px solid var(--acom-line, #a5c4cb);
    border-radius: 0;
    font: 500 13px/1.3 var(--acom-font-ui, Arial, sans-serif);
    cursor: pointer;
}

.theme-control select:focus-visible {
    outline: 2px solid var(--acom-cyan, #008da5);
    outline-offset: 2px;
}

html[lang="ja"] {
    --acom-font-ui: Inter, Arial, "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", system-ui, sans-serif;
    --acom-font-tech: "Roboto Mono", Consolas, "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", monospace;
}

html[lang="ja"] :is(.technical-label, .acom-status, .status-pill, #dynamic-content th) {
    letter-spacing: normal;
}

html.utility-page[lang="ja"] body {
    font-family: var(--acom-font-ui);
}

html[data-acom-theme="classic"] .theme-control {
    color: #333;
}

html[data-acom-theme="classic"] .theme-control select {
    color: #333;
    background: #fff;
    border-color: #b8c4cc;
    border-radius: 4px;
}

.utility-page .language-toolbar {
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 12px;
}

.utility-page .language-toolbar select {
    height: 36px;
    min-height: 36px;
}

.utility-page .method-input {
    flex-wrap: wrap;
}

.utility-page .utility-table-scroll {
    width: 100%;
    overflow-x: auto;
}

/* Utilities retain their plain light presentation outside Dark. */
html.utility-page:not([data-acom-theme="dark"]) {
    color-scheme: light;
    --acom-background: #fff;
    --acom-surface: #fff;
    --acom-text: #000;
    --acom-muted: #45616a;
    --acom-line: #ddd;
    --acom-hover: #f2f2f2;
    --acom-cyan: #008da5;
    --acom-cyan-dark: #006b7a;
}

html.utility-page[data-acom-theme="classic"] {
    --acom-background: #f9f9fb;
}

.utility-page body {
    color: var(--acom-text);
    background: var(--acom-background);
}

/* Dark uses the current layout with a shared, independently scoped palette. */
html[data-acom-theme="dark"] {
    color-scheme: dark;
    --acom-background: #0b151c;
    --acom-sidebar: #101f27;
    --acom-surface: #142832;
    --acom-white: #0e2029;
    --acom-text: #e4f3f7;
    --acom-muted: #9bb4c0;
    --acom-cyan: #56d2df;
    --acom-cyan-dark: #80dfe7;
    --acom-line: #365563;
    --acom-hover: #213c48;
    --acom-sidebar-hover: #1d3540;
    --acom-terminal: #061015;
    --acom-terminal-line: #2e5361;
    --acom-terminal-text: #d6eeed;
    --acom-terminal-cyan: #80dfe7;
    --acom-terminal-green: #75dfba;
    --acom-mint: #153e39;
    --acom-mint-pressed: #1b534a;
    --acom-mint-line: #397869;
    --acom-green: #75dfba;
    --acom-danger: #ffb2a9;
    --acom-danger-bg: #3a2228;
    --acom-text-secondary: var(--acom-muted);
    --acom-border: var(--acom-line);
    --acom-accent: var(--acom-cyan);
    background: var(--acom-background);
}

html[data-acom-theme="dark"] :is(.acom-header, .page-header) {
    background: #101f27;
}

html[data-acom-theme="dark"] .connection-block {
    background: var(--acom-surface);
}

html[data-acom-theme="dark"] .connection-card img {
    filter: invert(1);
}

html[data-acom-theme="dark"] :is(#dynamic-content, .section) :is(th, td) {
    border-bottom-color: var(--acom-line);
}

html[data-acom-theme="dark"] :is(#dynamic-content, .section) th {
    color: var(--acom-text);
    background: #214653;
}

html[data-acom-theme="dark"] #dynamic-content :is(h1, h2, h3, h4) {
    color: var(--acom-text);
}

/* A light backing keeps original black LCD pixels visible without recoloring assets. */
html[data-acom-theme="dark"] #dynamic-content td img {
    background: #edf7f5;
    box-shadow: 0 0 0 3px #edf7f5;
}

html[data-acom-theme="dark"] .danger-button {
    border-color: #a56763;
}

html[data-acom-theme="dark"] .tool-page :is(h1, h2, h3, h4, legend, summary, .setup-option strong) {
    color: var(--acom-text);
}

html[data-acom-theme="dark"] .tool-page :is(.step p, .step li, .panel p, .guide p, .guide li, .profile-card small, .connection-label, .phase, .setup-selector p, .setup-option span) {
    color: var(--acom-muted);
}

html[data-acom-theme="dark"] :is(.guide, .profile-card) {
    color: var(--acom-text);
    background: var(--acom-surface);
    border-color: var(--acom-line);
    box-shadow: none;
}

html[data-acom-theme="dark"] .profile-card:has(input:checked) {
    background: var(--acom-hover);
    border-color: var(--acom-cyan);
}

html[data-acom-theme="dark"] .progress-track {
    background: var(--acom-white);
    border-color: var(--acom-line);
}

html[data-acom-theme="dark"] .progress-fill {
    background: var(--acom-green);
}

html[data-acom-theme="dark"] .warning,
html[data-acom-theme="dark"] .flash-result--flashing {
    color: #f5d582 !important;
    background: #332d1c;
    border-color: #857240;
}

html[data-acom-theme="dark"] :is(.compatibility, .flash-result--failure) {
    color: var(--acom-danger);
    background: var(--acom-danger-bg);
    border-color: #a56763;
}

html[data-acom-theme="dark"] .flash-result--success {
    color: var(--acom-green);
    background: var(--acom-mint);
    border-color: var(--acom-mint-line);
}

html[data-acom-theme="dark"] .flash-result__action {
    color: var(--acom-text);
    background: var(--acom-surface);
    border-color: currentColor;
}

html[data-acom-theme="dark"] #confirmDialog {
    color: var(--acom-text);
    background: var(--acom-surface);
}

html[data-acom-theme="dark"] :is(.confirm-dialog__header, .confirm-dialog__footer, .confirm-dialog__safety li) {
    color: var(--acom-text);
    background: var(--acom-sidebar);
    border-color: var(--acom-line);
}

html[data-acom-theme="dark"] :is(.confirm-dialog__header h2, .confirm-dialog__summary) {
    color: var(--acom-text);
}

html[data-acom-theme="dark"] .confirm-dialog__safety strong {
    color: var(--acom-cyan-dark);
}

html[data-acom-theme="dark"] button:disabled {
    color: var(--acom-muted);
    background: var(--acom-surface);
}

html.utility-page[data-acom-theme="dark"] :is(input, select, textarea, button) {
    color: var(--acom-text);
    background: var(--acom-surface);
    border: 1px solid var(--acom-line);
}

html.utility-page[data-acom-theme="dark"] :is(th, td, #output) {
    border-color: var(--acom-line);
}

html.utility-page[data-acom-theme="dark"] th {
    background: var(--acom-hover);
}

html.utility-page[data-acom-theme="dark"] a {
    color: var(--acom-cyan-dark);
}

html.utility-page[data-acom-theme="dark"] :is(input, textarea)::placeholder {
    color: var(--acom-muted);
}