/* PrimeOps shared theme. Opt in with <html class="po-theme">.
   Theme values live here; page styles should use tokens, not color literals. */
:root {
  --po-bg: #f5f6fa;
  --po-surface: #ffffff;
  --po-surface-raised: #eef2f9;
  --po-text: #1f2937;
  --po-muted: #58677c;
  --po-border: #d6deea;
  --po-input-border: #8595ab;
  --po-primary: #24548a;
  --po-primary-hover: #193f6c;
  --po-on-primary: #ffffff;
  --po-link: #24548a;
  --po-danger: #ab2832;
  --po-danger-hover: #8b2029;
  --po-error: #b42332;
  --po-focus: #346ca6;
  --po-info-bg: #dbeafe;
  --po-info-text: #194a85;
  --po-warning-bg: #fff3dd;
  --po-warning-text: #70420b;
  --po-warning-strong: #fbd59a;
  --po-warning-hover: #f6c270;
  --po-warning-border: #a87533;
  --po-missing-bg: #fff3d2;
  --po-missing-text: #704b00;
  --po-backdrop: #17223599;
  --po-shadow: 0 12px 36px #17223526;
  --po-font: Arial, sans-serif;
  --po-radius: 10px;
  --po-control-radius: 6px;
  --po-space: 16px;
}
:root.dark-mode {
  --po-bg: #0b1020;
  --po-surface: #111827;
  --po-surface-raised: #1e293b;
  --po-text: #e5edf8;
  --po-muted: #a9bbd0;
  --po-border: #334155;
  --po-input-border: #64748b;
  --po-primary: #24548a;
  --po-primary-hover: #326aa8;
  --po-link: #b9dcff;
  --po-danger: #912b39;
  --po-danger-hover: #ad3546;
  --po-error: #ff9fa9;
  --po-focus: #93c5fd;
  --po-info-bg: #133355;
  --po-info-text: #b9dcff;
  --po-warning-bg: #3b2a14;
  --po-warning-text: #ffdd9c;
  --po-warning-strong: #614219;
  --po-warning-hover: #80571e;
  --po-warning-border: #b7873d;
  --po-missing-bg: #3a3214;
  --po-missing-text: #ffe2a0;
  --po-backdrop: #020617cc;
  --po-shadow: 0 12px 36px #00000066;
}
@layer primeops-base {
html.po-theme { color-scheme: light; background: var(--po-bg); }
html.po-theme.dark-mode { color-scheme: dark; }
.po-theme body { margin: 0; font: 15px/1.45 var(--po-font); background: var(--po-bg); color: var(--po-text); }
.po-theme *, .po-theme *::before, .po-theme *::after { box-sizing: border-box; }
.po-theme main { max-width: 1400px; margin: auto; padding: 20px; }
.po-theme h1 { font-size: 1.7rem; line-height: 1.2; margin: 0 0 8px; }
.po-theme h2 { font-size: 1.2rem; line-height: 1.3; margin: 0 0 14px; }
.po-theme main :is(section,.panel) { background: var(--po-surface); border: 1px solid var(--po-border); border-radius: var(--po-radius); padding: 18px; margin: 14px 0; }
.po-theme :is(.muted,.sub,small) { color: var(--po-muted); }
.po-theme main a { color: var(--po-link); }
.po-theme :is(.error,.warn,#error) { color: var(--po-error); }
.po-theme label { display: flex; flex-direction: column; gap: 5px; font-weight: 600; }
.po-theme small { font-weight: normal; }
.po-theme :is(button,input,select,textarea) { font: inherit; border: 1px solid var(--po-input-border); border-radius: var(--po-control-radius); padding: 9px; }
.po-theme :is(input,select,textarea) { background: var(--po-surface); color: var(--po-text); min-width: 0; }
.po-theme :is(input,textarea)::placeholder { color: var(--po-muted); opacity: 1; }
.po-theme input[type=checkbox] { accent-color: var(--po-primary); }
.po-theme button { background: var(--po-primary); color: var(--po-on-primary); cursor: pointer; }
.po-theme button:hover:not(:disabled) { background: var(--po-primary-hover); }
.po-theme button.secondary { background: var(--po-surface); color: var(--po-link); }
.po-theme button.secondary:hover:not(:disabled) { background: var(--po-surface-raised); }
.po-theme button.danger { background: var(--po-danger); }
.po-theme button.danger:hover:not(:disabled) { background: var(--po-danger-hover); }
.po-theme button:disabled { opacity: .5; cursor: not-allowed; }
.po-theme :is(button,input,select,textarea,a,summary):focus-visible { outline: 2px solid var(--po-focus); outline-offset: 2px; }
.po-theme :is(.actions,.buttons,.toolbar,.controls) { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.po-theme :is(.toolbar,.controls) { justify-content: space-between; }
.po-theme table { width: 100%; border-collapse: collapse; color: var(--po-text); background: var(--po-surface); }
.po-theme :is(th,td) { padding: 10px 8px; border-bottom: 1px solid var(--po-border); text-align: left; }
.po-theme th { background: var(--po-surface-raised); }
.po-theme :is(.layout,.table-area,.planner-scroll) { overflow: auto; }
.po-theme dialog { background: var(--po-surface); color: var(--po-text); border: 1px solid var(--po-input-border); border-radius: var(--po-radius); padding: 20px; max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); overflow: auto; box-shadow: var(--po-shadow); }
.po-theme dialog::backdrop { background: var(--po-backdrop); }
.po-theme form { display: grid; gap: 14px; }
.po-theme label.wide { grid-column: 1/-1; }
.po-theme .po-check-option { flex-direction: row; align-items: center; gap: 8px; padding: 10px; background: var(--po-surface-raised); border: 1px solid var(--po-input-border); border-radius: var(--po-control-radius); }
.po-theme :is(#status,.notice) { min-height: 22px; }
.po-theme .app-menu { max-width: 1400px; }
.po-theme.dark-mode:not(.psychedelic-mode) .app-menu { background: var(--po-surface); border: 1px solid var(--po-border); }
@media (max-width: 800px) {
  .po-theme main { padding: 8px; }
  .po-theme main :is(section,.panel) { padding: 14px; }
  .po-theme h1 { font-size: 1.4rem; }
}
}
/* Psychedelic retains its animated presentation layer in psychedelic.css.
   Tokens also cover shared components that layer does not explicitly override. */
:root.psychedelic-mode {
  --po-bg: #050611;
  --po-surface: #090d20;
  --po-surface-raised: #262042;
  --po-text: #eef7ff;
  --po-muted: #c2caef;
  --po-border: #7461a8;
  --po-input-border: #00dfff;
  --po-primary: #6125a0;
  --po-primary-hover: #7934be;
  --po-link: #83f1ff;
  --po-error: #ff91b5;
  --po-focus: #00e5ff;
  --po-info-bg: #10375d;
  --po-info-text: #89f4ff;
  --po-warning-bg: #45250c;
  --po-warning-text: #ffe48b;
  --po-warning-strong: #633218;
  --po-warning-hover: #804019;
  --po-warning-border: #ffbc47;
  --po-missing-bg: #423811;
  --po-missing-text: #fff09c;
}
html.po-theme.psychedelic-mode main a { color: var(--po-link) !important; }

/* Shared semantic states used by operations, reports and timekeeping. */
:root {
  --po-info-border: #bfdbfe;
  --po-success-bg: #e8f6ea;
  --po-success-text: #166534;
  --po-success-border: #bbf7d0;
  --po-success-solid: #15803d;
  --po-danger-bg: #fef2f2;
  --po-danger-text: #991b1b;
  --po-danger-border: #fecaca;
  --po-warning-solid: #b45309;
  --po-accent-bg: #eef2ff;
  --po-accent-text: #3730a3;
  --po-accent-border: #c7d2fe;
  --po-secondary-solid: #58677c;
}
:root.dark-mode {
  --po-info-border: #294d78;
  --po-success-bg: #10291c;
  --po-success-text: #8ce9a8;
  --po-success-border: #285d38;
  --po-success-solid: #15803d;
  --po-danger-bg: #321518;
  --po-danger-text: #ffadb5;
  --po-danger-border: #6c2a30;
  --po-warning-solid: #f59e0b;
  --po-accent-bg: #29245a;
  --po-accent-text: #c4b5fd;
  --po-accent-border: #514a91;
  --po-secondary-solid: #475569;
}

@layer primeops-base {
  .po-theme a { color: var(--po-link); }
  .po-theme :is(.hint,.subtitle,.empty) { color: var(--po-muted); }
  .po-theme :is(input,select,textarea):disabled { background: var(--po-surface-raised); color: var(--po-muted); }
  .po-theme input[type=submit] { background: var(--po-primary); color: var(--po-on-primary); cursor: pointer; }
  .po-theme [hidden] { display: none !important; }
  .po-theme :is(.page,.container,.panel,.card,.controls,.toolbar,.field) { min-width: 0; }
}
/* Semantic data and form text stay solid while headings and navigation animate. */
html.po-theme.psychedelic-mode :is(td,th,td span,th span,label,input,select,textarea,.status,.status-pill,.event-badge,.permission-pill,.unit-status-badge,.hour-pill,.start-pill,.engine-detail-stat,.modal,.engine-modal,.cause-code-modal) {
  background-image: none !important;
  -webkit-text-fill-color: currentColor !important;
  animation: none !important;
  text-shadow: none !important;
}
html.po-theme.psychedelic-mode :is(.modal,.engine-modal,.cause-code-modal) :is(h2,h3,label,p,span,td,th) {
  background-image: none !important;
  -webkit-text-fill-color: currentColor !important;
  color: var(--po-text) !important;
  animation: none !important;
  text-shadow: none !important;
}
/* Screen theme must never produce white ink or neon effects in printed reports. */
@media print {
  html.po-theme {
    --po-bg: #f5f6fa !important;
    --po-surface: #ffffff !important;
    --po-surface-raised: #eef2f9 !important;
    --po-text: #1f2937 !important;
    --po-muted: #58677c !important;
    --po-border: #d6deea !important;
    --po-input-border: #8595ab !important;
    --po-primary: #24548a !important;
    --po-primary-hover: #193f6c !important;
    --po-on-primary: #ffffff !important;
    --po-link: #24548a !important;
    --po-danger: #ab2832 !important;
    --po-danger-hover: #8b2029 !important;
    --po-error: #b42332 !important;
    --po-focus: #346ca6 !important;
    --po-info-bg: #dbeafe !important;
    --po-info-text: #194a85 !important;
    --po-warning-bg: #fff3dd !important;
    --po-warning-text: #70420b !important;
    --po-warning-strong: #fbd59a !important;
    --po-warning-hover: #f6c270 !important;
    --po-warning-border: #a87533 !important;
    --po-missing-bg: #fff3d2 !important;
    --po-missing-text: #704b00 !important;
    --po-backdrop: #17223599 !important;
    --po-shadow: 0 12px 36px #17223526 !important;
    --po-font: Arial, sans-serif !important;
    --po-radius: 10px !important;
    --po-control-radius: 6px !important;
    --po-space: 16px !important;
    --po-info-border: #bfdbfe !important;
    --po-success-bg: #e8f6ea !important;
    --po-success-text: #166534 !important;
    --po-success-border: #bbf7d0 !important;
    --po-success-solid: #15803d !important;
    --po-danger-bg: #fef2f2 !important;
    --po-danger-text: #991b1b !important;
    --po-danger-border: #fecaca !important;
    --po-warning-solid: #b45309 !important;
    --po-accent-bg: #eef2ff !important;
    --po-accent-text: #3730a3 !important;
    --po-accent-border: #c7d2fe !important;
    --po-secondary-solid: #58677c !important;
    color-scheme: light;
  }
  html.po-theme, html.po-theme body { background: #fff !important; color: #111827 !important; }
  html.po-theme .app-menu { display: none !important; }
  html.po-theme.psychedelic-mode *, html.po-theme.psychedelic-mode *::before, html.po-theme.psychedelic-mode *::after {
    animation: none !important; box-shadow: none !important; text-shadow: none !important;
    background-image: none !important; -webkit-text-fill-color: currentColor !important;
    color: #111827 !important; background-color: transparent !important; filter: none !important;
  }
}

/* Solid text must reset the transparent foreground from rainbow text clipping. */
html.po-theme.psychedelic-mode :is(td,th,td span,th span,label,.status,.status-pill,.event-badge,.permission-pill,.unit-status-badge,.hour-pill,.start-pill,.engine-detail-stat) {
  color: var(--po-state-text, var(--po-text)) !important;
}
.po-theme :is(.complete,.applied,.running,.startup,.success) { --po-state-text: var(--po-success-text); }
.po-theme :is(.incomplete,.pending,.maintenance,.warm,.warning,.warn) { --po-state-text: var(--po-warning-text); }
.po-theme :is(.not-started,.trip,.unknown,.hot,.error) { --po-state-text: var(--po-danger-text); }
.po-theme :is(.available,.cold,.ok) { --po-state-text: var(--po-info-text); }
html.po-theme.psychedelic-mode a:not(.app-menu__link):not(.app-menu__brand) { color: var(--po-link) !important; }
html.po-theme.psychedelic-mode a:is(.button,.button-link,.nav-button):not(.secondary) { color: var(--po-on-primary) !important; }
@media print {
  html.po-theme.psychedelic-mode body { background: #fff !important; }
  html.po-theme.psychedelic-mode :is(td,th,td span,th span,label,.status,.status-pill,.event-badge,.permission-pill,.unit-status-badge,.hour-pill,.start-pill,.engine-detail-stat) { color: #111827 !important; }
}