/* Shared readable surfaces. Keep the existing theme IDs and saved choices. */
html[data-oto760-theme] {
  color-scheme: light;
  --theme-radius: 9px;
  --theme-shadow: 0 3px 12px rgb(24 47 77 / 6%);
  --navy-2: var(--navy);
  --panel: var(--soft);
  --warm: var(--surface);
  --theme-header-ink: #ffffff;
  --theme-header-muted: #d8e5f7;
  --theme-grid: transparent;
  --theme-grid-major: transparent;
  scrollbar-color: var(--line) var(--soft);
}

html[data-oto760-theme="ocean"] {
  --navy: #123566;
  --teal: #1559c5;
  --cyan: #94c0ff;
  --ink: #1b304e;
  --muted: #516683;
  --surface: #ffffff;
  --soft: #f3f7fd;
  --line: #bbcee7;
  --oto760-page: #edf3fc;
  --oto760-accent-soft: #e3edff;
  --theme-grid: rgb(36 88 160 / 5%);
  --theme-grid-major: rgb(36 88 160 / 6%);
}

html[data-oto760-theme="emerald"] {
  --navy: #194b40;
  --teal: #176c53;
  --cyan: #98d4c0;
  --ink: #243b32;
  --muted: #516b5e;
  --surface: #ffffff;
  --soft: #f4f8f5;
  --line: #bdd3c6;
  --oto760-page: #eff5f1;
  --oto760-accent-soft: #e1f0e7;
  --theme-header-muted: #d7ede4;
}

html[data-oto760-theme="night"] {
  color-scheme: light;
  --navy: #1c2c43;
  --teal: #355d88;
  --cyan: #a7c5ed;
  --ink: #24364e;
  --muted: #586b82;
  --surface: #ffffff;
  --soft: #f3f5f9;
  --line: #c0ccdb;
  --oto760-page: #edf1f6;
  --oto760-accent-soft: #e1eaf5;
}

html[data-oto760-theme="copper"] {
  --navy: #593f30;
  --teal: #984b25;
  --cyan: #e9c3a5;
  --ink: #3e3028;
  --muted: #756050;
  --surface: #fffefd;
  --soft: #fbf7f1;
  --line: #dbc7b4;
  --oto760-page: #f7f1e9;
  --oto760-accent-soft: #f6e7d9;
  --theme-header-muted: #f3e2d1;
}

html[data-oto760-theme="ice"] {
  --navy: #17566b;
  --teal: #087f95;
  --cyan: #9bdde5;
  --ink: #233b59;
  --muted: #59718d;
  --surface: #ffffff;
  --soft: #f3f9fc;
  --line: #b9cdec;
  --oto760-page: #eff8fc;
  --oto760-accent-soft: #e4efff;
  --theme-header-muted: #d9f0f5;
}

html[data-oto760-theme="newhollnd"] {
  --navy: #0759ad;
  --teal: #0759ad;
  --cyan: #efc456;
  --ink: #213955;
  --muted: #576d86;
  --surface: #ffffff;
  --soft: #f4f8fd;
  --line: #bcd1e7;
  --oto760-page: #eef4fa;
  --oto760-accent-soft: #fff3d3;
  --theme-header-muted: #e0edfc;
  --theme-brand-gold: #dda827;
}

html[data-oto760-theme="showcase"] {
  --navy: #243c46;
  --teal: #246d77;
  --cyan: #abd8d6;
  --ink: #24343b;
  --muted: #606e72;
  --surface: #ffffff;
  --soft: #f7f8f6;
  --line: #d7e0dd;
  --oto760-page: #f6f5f1;
  --oto760-accent-soft: #e8f3f1;
  --theme-header-muted: #dceae9;
  --theme-radius: 14px;
  --theme-shadow: 0 5px 18px rgb(32 55 61 / 5%);
}

html[data-oto760-theme] body {
  color: var(--ink);
  background: var(--oto760-page);
  -webkit-font-smoothing: antialiased;
}

html[data-oto760-theme] .dashboard-wrap {
  background-color: var(--oto760-page) !important;
  background-image:
    linear-gradient(var(--theme-grid-major) 1px, transparent 1px),
    linear-gradient(90deg, var(--theme-grid-major) 1px, transparent 1px),
    linear-gradient(var(--theme-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--theme-grid) 1px, transparent 1px);
  background-size: 100px 100px, 100px 100px, 20px 20px, 20px 20px;
}

html[data-oto760-theme] :is(.app-header, .oto760-unified-dashboard-head,
  .oto760-stock-roll-navigation > header, .oto760-stock-roll-results > header,
  .oto760-web-start-brand, .quick-action-bar, .oto760-web-start-trigger) {
  color: var(--theme-header-ink) !important;
  background: var(--navy) !important;
  border-color: color-mix(in srgb, var(--navy) 75%, white) !important;
  box-shadow: none !important;
}

html[data-oto760-theme] .app-header { padding-block: 14px; }
html[data-oto760-theme] .app-title :is(h1, h2, strong) { color: #ffffff; }
html[data-oto760-theme] .app-title :is(p, small) { color: var(--theme-header-muted); }
html[data-oto760-theme] .app-header .eyebrow { color: var(--theme-header-muted); }
html[data-oto760-theme] .app-header .user-pill {
  color: #ffffff !important;
  background: rgb(255 255 255 / 8%) !important;
  border-color: rgb(255 255 255 / 30%) !important;
}

html[data-oto760-theme] .dashboard-wrap > .summary-strip {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html[data-oto760-theme] :is(
  .workflow-column,
  .waiting-column,
  .finance-report-column,
  .daily-column
) > header {
  color: var(--theme-header-ink) !important;
  background: linear-gradient(
    110deg,
    var(--navy),
    color-mix(in srgb, var(--navy) 78%, var(--cyan) 22%)
  ) !important;
  border-bottom: 3px solid var(--cyan) !important;
  box-shadow: none !important;
}

html[data-oto760-theme] .workflow-column > header :is(span, strong) {
  color: var(--theme-header-ink) !important;
}

html[data-oto760-theme] .workflow-column > header small {
  color: var(--theme-header-muted) !important;
}

html[data-oto760-theme] .workflow-column > header b {
  color: var(--theme-header-ink) !important;
  background: color-mix(in srgb, var(--cyan) 28%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--cyan) 55%, transparent) !important;
}

#oto380FinanceColumn .oto380-finance-general::before {
  display: none !important;
  content: none !important;
}
html[data-oto760-theme] .quick-action-trigger { color: #ffffff !important; }
html[data-oto760-theme] .quick-action-trigger:hover { background: rgb(255 255 255 / 12%) !important; }

html[data-oto760-theme="ocean"] :is(.app-title h1, .module-heading h2,
  .oto760-panel-settings-page-identity strong, .oto760-panel-theme-heading strong) {
  font-family: "Bahnschrift", "Segoe UI", sans-serif;
  font-weight: 650;
  letter-spacing: -.015em;
}

html[data-oto760-theme] :is(.department-button, .oto760-overview-view-button,
  .secondary-button, .module-close) {
  border-color: var(--line) !important;
  border-radius: var(--theme-radius) !important;
  color: var(--ink) !important;
  background: var(--surface) !important;
  box-shadow: none !important;
}

html[data-oto760-theme] :is(.department-button, .oto760-overview-view-button) {
  min-height: 38px;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 650;
}

html[data-oto760-theme] .department-button:is(.active, .selected, .is-selected, [aria-pressed="true"]),
html[data-oto760-theme] .oto760-overview-view-button:is(.active, .is-active, .selected, [aria-pressed="true"]),
html[data-oto760-theme] .primary-button {
  color: #ffffff !important;
  background: var(--teal) !important;
  border-color: var(--teal) !important;
  box-shadow: inset 0 -2px 0 rgb(0 0 0 / 12%) !important;
}

html[data-oto760-theme] :is(.secondary-button, .oto760-overview-view-button):hover:not(:disabled) {
  border-color: var(--teal) !important;
}

html[data-oto760-theme] :is(button, input, select, textarea, a):focus-visible {
  outline: 2px solid #111827 !important;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px #fff !important;
}

html[data-oto760-theme] :is(button:disabled, select:disabled, input:disabled) {
  opacity: 1 !important;
  color: var(--ink) !important;
  background: var(--soft) !important;
  border: 1px dashed var(--ink) !important;
  cursor: not-allowed;
}
html[data-oto760-theme] button:disabled > :is(span, strong, small) {
  color: inherit !important;
}
html[data-oto760-theme] input::placeholder,
html[data-oto760-theme] textarea::placeholder { color: var(--muted); opacity: 1; }
html[data-oto760-theme] :is(input[type="checkbox"], input[type="radio"], input[type="range"]) {
  accent-color: var(--teal);
}
html[data-oto760-theme] :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="color"]) {
  color: var(--ink);
  background-color: var(--surface);
  border-color: var(--line);
}
html[data-oto760-theme] :is(input, select, textarea)[aria-invalid="true"] {
  border-color: var(--danger) !important;
  outline-color: var(--danger) !important;
}

html[data-oto760-theme] :is(.summary-strip, .module-header, .module-toolbar,
  .module-footer, .module-metrics) {
  color: var(--ink);
  background: var(--soft) !important;
  border-color: var(--line) !important;
}
html[data-oto760-theme] :is(.module-frame, .record-frame, .transaction-frame,
  .workflow-column, .oto760-stock-roll-shell, .oto760-stock-roll-results,
  .oto760-web-start-panel, .quick-action-menu) {
  color: var(--ink);
  background-color: var(--surface) !important;
  border-color: var(--line) !important;
  border-radius: 12px;
}
html[data-oto760-theme] .module-window { backdrop-filter: none; }
html[data-oto760-theme] .module-mark { color: var(--teal); background: var(--oto760-accent-soft); }
html[data-oto760-theme] .module-heading p { color: var(--muted); }
html[data-oto760-theme] .module-table { color: var(--ink); font-variant-numeric: tabular-nums; }
html[data-oto760-theme] .module-table th { background: var(--navy); color: #ffffff; }
html[data-oto760-theme] .module-table tbody tr:not(.selected):nth-child(even) > td {
  background-color: var(--soft);
}
html[data-oto760-theme] .module-table tbody tr.selected > td {
  background-color: var(--oto760-accent-soft);
}

html[data-oto760-theme] :is(.oto760-stock-roll-card, .oto760-stock-tree-button) {
  color: var(--ink) !important;
  background: var(--surface) !important;
  border-color: var(--line) !important;
  border-radius: var(--theme-radius) !important;
  box-shadow: var(--theme-shadow) !important;
}
html[data-oto760-theme] .oto760-stock-roll-card { transition: border-color 140ms ease; }
html[data-oto760-theme] .oto760-stock-roll-card:hover {
  transform: none !important;
  border-color: var(--teal) !important;
}
html[data-oto760-theme] .oto760-stock-tree-button:is(.is-active, .active, [aria-expanded="true"]) {
  color: var(--teal) !important;
  background: var(--oto760-accent-soft) !important;
  border-color: var(--teal) !important;
  box-shadow: inset 3px 0 0 var(--teal) !important;
}
html[data-oto760-theme] .oto760-stock-tree-copy { color: var(--ink); font-size: 13px; line-height: 1.4; }
html[data-oto760-theme] .oto760-stock-tree-meta { color: var(--muted); font-size: 11px; }
html[data-oto760-theme] .oto760-stock-roll-card-barcode { color: var(--ink); font-size: 14px; }
html[data-oto760-theme] .oto760-stock-roll-card-detail { color: var(--muted); line-height: 1.45; }
html[data-oto760-theme] .oto760-stock-roll-card-footer { border-color: var(--line); }
html[data-oto760-theme] .oto760-stock-roll-card-price { color: var(--teal) !important; font-variant-numeric: tabular-nums; }
html[data-oto760-theme="ocean"] .oto760-stock-roll-card-price {
  font-family: "Cascadia Mono", "Consolas", monospace;
  font-size: 16px;
  font-weight: 700;
}
html[data-oto760-theme] .oto760-stock-roll-search {
  color: var(--ink) !important;
  background: var(--surface) !important;
  border-color: var(--line) !important;
}

html[data-oto760-theme] .oto760-stock-roll-search-scope {
  color: var(--navy) !important;
  background: var(--surface) !important;
  border-color: color-mix(in srgb, var(--navy) 55%, var(--line)) !important;
  box-shadow: 0 2px 8px rgb(3 25 52 / 16%) !important;
}
html[data-oto760-theme] .oto760-stock-roll-search-input {
  color: var(--ink) !important;
  background: transparent !important;
  font-size: 14px;
}
html[data-oto760-theme] .oto760-stock-roll-search-input::placeholder { color: var(--muted) !important; }
html[data-oto760-theme] .oto760-stock-roll-search-scope-option {
  color: var(--navy) !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

html[data-oto760-theme] .oto760-stock-roll-search-scope-option:hover {
  color: var(--ink) !important;
  background: color-mix(in srgb, var(--cyan) 24%, var(--surface)) !important;
}

html[data-oto760-theme] .oto760-stock-roll-search-scope-check {
  color: var(--navy) !important;
  background: var(--surface) !important;
  border-color: var(--navy) !important;
}

html[data-oto760-theme]
  .oto760-stock-roll-search-scope-option:has(input:checked) {
  color: var(--theme-header-ink) !important;
  background: var(--navy) !important;
}

html[data-oto760-theme]
  .oto760-stock-roll-search-scope-option > span:last-child {
  color: var(--navy) !important;
}

html[data-oto760-theme]
  .oto760-stock-roll-search-scope-option:has(input:checked) > span:last-child {
  color: var(--theme-header-ink) !important;
}

html[data-oto760-theme]
  .oto760-stock-roll-search-scope-option input:checked
  + .oto760-stock-roll-search-scope-check {
  color: var(--navy) !important;
  background: var(--surface) !important;
  border-color: var(--surface) !important;
}

html[data-oto760-theme] .oto760-stock-roll-search-scope-option:focus-within {
  outline-color: var(--cyan) !important;
}

/* Larger theme miniatures instead of tiny, truncated color swatches. */
html[data-oto760-theme] .oto760-web-theme-section.oto760-panel-settings-page {
  background: var(--oto760-page) !important;
  border-color: var(--line) !important;
  border-radius: 12px !important;
}
html[data-oto760-theme] .oto760-panel-settings-page > .oto760-panel-settings-page-header {
  color: #ffffff !important;
  background: var(--navy) !important;
  border-radius: 11px 11px 0 0 !important;
}
html[data-oto760-theme] .oto760-panel-settings-page-identity small { color: var(--theme-header-muted); }
html[data-oto760-theme] .oto760-panel-theme-heading { color: var(--ink); }
html[data-oto760-theme] .oto760-panel-theme-heading small { color: var(--muted); }
html[data-oto760-theme] .oto760-panel-settings-scroll .oto760-web-theme-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)) !important;
  gap: 12px !important;
}
html[data-oto760-theme] .oto760-web-theme-grid > button {
  grid-template-columns: 74px minmax(0, 1fr) 22px;
  min-height: 100px;
  gap: 12px;
  padding: 14px !important;
  color: var(--ink) !important;
  background: var(--surface) !important;
  border: 1px solid var(--line);
  border-radius: 10px !important;
  box-shadow: none;
  transform: none !important;
}
html[data-oto760-theme] .oto760-web-theme-grid > button strong {
  font-size: 14px;
  line-height: 1.3;
  white-space: normal;
}
html[data-oto760-theme] .oto760-web-theme-grid > button small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  white-space: normal;
}
html[data-oto760-theme] .oto760-web-theme-grid > button.selected {
  background: var(--soft) !important;
  border-color: var(--teal) !important;
  box-shadow: inset 3px 0 0 var(--teal), 0 0 0 1px var(--teal) !important;
}
html[data-oto760-theme] .oto760-web-theme-grid > button > b {
  width: 22px;
  height: 22px;
  font-size: 13px;
}
html[data-oto760-theme] .oto760-web-theme-palette {
  position: relative;
  box-sizing: border-box;
  width: 74px;
  height: 54px;
  grid-template-columns: 16px 1fr;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 4px;
  padding: 15px 5px 5px;
  border: 1px solid #b8c9dc;
  border-radius: 5px;
  background: #ffffff;
}
html[data-oto760-theme] .oto760-web-theme-palette::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 10px;
  background: var(--theme-preview-heading);
}
html[data-oto760-theme] .oto760-web-theme-palette > i { border-radius: 2px; }
html[data-oto760-theme] .oto760-web-theme-palette > i:first-child { grid-row: 1 / -1; }
html[data-oto760-theme] [data-oto760-theme-choice="ocean"] .oto760-web-theme-palette {
  background-image: linear-gradient(#dce7fa 1px, transparent 1px), linear-gradient(90deg, #dce7fa 1px, transparent 1px);
  background-size: 8px 8px;
}

/* Ice palette follows the supplied white cards and blue selected outline. */
html[data-oto760-theme="ice"] .dashboard-wrap {
  background-image: linear-gradient(135deg, #eff9fc, #f7fbfd 55%, #edf5fc);
  background-size: auto;
}
html[data-oto760-theme="ice"] :is(.oto760-stock-roll-card, .oto760-stock-tree-button) {
  border-color: #b9cdec !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 14px rgb(33 98 124 / 6%) !important;
}
html[data-oto760-theme="ice"] .oto760-stock-tree-button:is(.is-active, .active, [aria-expanded="true"]) {
  color: #233b59 !important;
  background: #e4eeff !important;
  border-color: #2464dc !important;
  box-shadow: inset 4px 0 0 #2464dc !important;
}
html[data-oto760-theme="ice"] .oto760-stock-tree-button[aria-expanded="true"]:not(.is-active):not(.active) {
  color: var(--ink) !important;
  background: #ffffff !important;
  border-color: #b9cdec !important;
  box-shadow: 0 4px 14px rgb(33 98 124 / 6%) !important;
}
html[data-oto760-theme="ice"] .oto760-web-theme-grid > button.selected {
  background: #e4eeff !important;
  border-color: #2464dc !important;
  box-shadow: inset 3px 0 0 #2464dc, 0 0 0 1px #2464dc !important;
}

/* Showcase keeps product imagery neutral and lets content lead the page. */
html[data-oto760-theme="showcase"] .dashboard-wrap {
  background-image: linear-gradient(135deg, #f6f5f1, #f3f8f7);
  background-size: auto;
}
html[data-oto760-theme="showcase"] header.app-header {
  color: var(--ink) !important;
  background: #ffffff !important;
  border-bottom: 1px solid var(--line) !important;
}
html[data-oto760-theme="showcase"] .app-title :is(h1, h2, strong) {
  color: var(--ink) !important;
  font-family: "Bahnschrift", "Segoe UI", sans-serif;
  letter-spacing: -.02em;
}
html[data-oto760-theme="showcase"] .app-title :is(p, small),
html[data-oto760-theme="showcase"] .app-header .eyebrow {
  color: var(--muted) !important;
}
html[data-oto760-theme="showcase"] .header-actions {
  color: var(--ink);
}
html[data-oto760-theme="showcase"] .app-header .user-pill {
  color: var(--ink) !important;
  background: var(--soft) !important;
  border-color: var(--line) !important;
}
html[data-oto760-theme="showcase"] .summary-strip {
  background: transparent !important;
  border-color: transparent !important;
}
html[data-oto760-theme="showcase"] .oto760-stock-roll-card-grid {
  gap: 16px !important;
}
html[data-oto760-theme="showcase"] .oto760-stock-roll-card {
  padding: 14px;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: var(--theme-shadow) !important;
}
html[data-oto760-theme="showcase"] .oto760-stock-roll-card-media {
  border-radius: 10px;
  background: #f7f8f6;
}
html[data-oto760-theme="showcase"] .oto760-stock-roll-card-media img {
  object-fit: contain;
}
html[data-oto760-theme="showcase"] .oto760-stock-roll-card-content {
  row-gap: 5px;
}
html[data-oto760-theme="showcase"] .oto760-stock-roll-card-barcode {
  color: var(--ink);
  font-size: 15px;
  line-height: 1.4;
}
html[data-oto760-theme="showcase"] .oto760-stock-roll-card-footer {
  padding-top: 12px;
  border-color: #e5ebe8;
}
html[data-oto760-theme="showcase"] .oto760-stock-roll-card-price {
  color: var(--teal) !important;
  font-size: 17px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}
html[data-oto760-theme="showcase"] .oto760-stock-tree-button {
  border-radius: 12px !important;
  box-shadow: none !important;
}
html[data-oto760-theme="showcase"] .oto760-stock-roll-card-cart-button {
  color: #ffffff !important;
  background: var(--teal) !important;
  border: 1px solid var(--teal) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
html[data-oto760-theme="showcase"] .oto760-web-theme-grid > button.selected {
  background: #e8f3f1 !important;
}

/* Newhollnd: blue structure, gold selection accents, white work surfaces. */
html[data-oto760-theme="newhollnd"] .app-header {
  border-bottom: 3px solid var(--theme-brand-gold) !important;
}
html[data-oto760-theme="newhollnd"] .department-button:is(.active, .selected, .is-selected, [aria-pressed="true"]),
html[data-oto760-theme="newhollnd"] .oto760-overview-view-button:is(.active, .is-active, .selected, [aria-pressed="true"]) {
  color: #17375c !important;
  background: var(--theme-brand-gold) !important;
  border-color: var(--theme-brand-gold) !important;
}
html[data-oto760-theme="newhollnd"] .oto760-web-start-home {
  color: #0759ad !important;
  background: var(--theme-brand-gold) !important;
}
html[data-oto760-theme="newhollnd"] .oto760-stock-tree-button:is(.is-active, .active) {
  color: #213955 !important;
  background: #fff6df !important;
  border-color: #c89724 !important;
  box-shadow: inset 4px 0 0 var(--theme-brand-gold) !important;
}
html[data-oto760-theme="newhollnd"] .oto760-web-theme-grid > button.selected {
  background: #fff6df !important;
  border-color: #c89724 !important;
  box-shadow: inset 3px 0 0 var(--theme-brand-gold), 0 0 0 1px #c89724 !important;
}

@media (min-width: 1251px) and (max-width: 1700px) {
  html[data-oto760-theme] .oto760-panel-settings-scroll .oto760-web-theme-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 1250px) {
  html[data-oto760-theme] .oto760-panel-settings-scroll .oto760-web-theme-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px) {
  html[data-oto760-theme] .oto760-panel-settings-scroll .oto760-web-theme-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html[data-oto760-theme] .oto760-web-theme-grid > button { min-height: 88px; }
  html[data-oto760-theme] .app-header { padding: 12px; }
  html[data-oto760-theme] .department-button { padding: 8px 12px; }
}
/* Theme-aware backlighting without filters, moving layers or pulsing effects. */
html[data-oto760-theme] :is(.oto760-stock-roll-card, .oto760-stock-tree-button,
  .oto760-web-theme-grid > button, .workflow-column, .module-metric),
html[data-oto760-theme] .oto760-stock-tree-button:is(.is-active, .active, [aria-expanded="true"]),
html[data-oto760-theme] .oto760-web-theme-grid > button.selected,
html[data-oto760-theme="ice"] .oto760-stock-tree-button[aria-expanded="true"]:not(.is-active):not(.active) {
  box-shadow:
    inset var(--theme-backlight-stripe, 0px) 0 0 var(--theme-backlight-accent, var(--teal)),
    0 3px 10px rgb(27 53 74 / 5%),
    0 0 16px color-mix(in srgb, var(--theme-backlight-accent, var(--teal)) 13%, transparent) !important;
  transition: box-shadow 160ms ease, border-color 160ms ease;
}

html[data-oto760-theme] .oto760-stock-tree-button:is(.is-active, .active, [aria-expanded="true"]),
html[data-oto760-theme] .oto760-web-theme-grid > button.selected {
  --theme-backlight-stripe: 3px;
}
html[data-oto760-theme="ice"] .oto760-stock-tree-button:is(.is-active, .active),
html[data-oto760-theme="ice"] .oto760-web-theme-grid > button.selected {
  --theme-backlight-accent: #2464dc;
}
html[data-oto760-theme="ice"] .oto760-stock-tree-button[aria-expanded="true"]:not(.is-active):not(.active) {
  --theme-backlight-stripe: 0px;
}
html[data-oto760-theme="newhollnd"] .oto760-stock-tree-button:is(.is-active, .active),
html[data-oto760-theme="newhollnd"] .oto760-web-theme-grid > button.selected {
  --theme-backlight-accent: var(--theme-brand-gold);
}

@media (hover: hover) {
  html[data-oto760-theme] :is(.oto760-stock-roll-card, .oto760-stock-tree-button,
    .oto760-web-theme-grid > button):hover:not(:disabled) {
    box-shadow:
      inset var(--theme-backlight-stripe, 0px) 0 0 var(--theme-backlight-accent, var(--teal)),
      0 4px 14px rgb(27 53 74 / 7%),
      0 0 22px color-mix(in srgb, var(--theme-backlight-accent, var(--teal)) 23%, transparent) !important;
  }
}

html[data-oto760-theme] :is(.oto760-stock-roll-card, .oto760-stock-tree-button,
  .oto760-web-theme-grid > button):focus-visible {
  box-shadow:
    inset var(--theme-backlight-stripe, 0px) 0 0 var(--theme-backlight-accent, var(--teal)),
    0 0 22px color-mix(in srgb, var(--theme-backlight-accent, var(--teal)) 23%, transparent) !important;
}

html[data-oto760-theme] :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="color"]):not([type="file"]):not([type="button"]):not([type="submit"]) {
  box-shadow: 0 0 9px color-mix(in srgb, var(--theme-backlight-accent, var(--teal)) 11%, transparent);
  transition: box-shadow 160ms ease, border-color 160ms ease;
}
html[data-oto760-theme] :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="color"]):not([type="file"]):not([type="button"]):not([type="submit"]):focus {
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--theme-backlight-accent, var(--teal)) 13%, transparent),
    0 0 15px color-mix(in srgb, var(--theme-backlight-accent, var(--teal)) 21%, transparent);
}
html[data-oto760-theme] :is(input, select, textarea)[aria-invalid="true"] {
  --theme-backlight-accent: var(--danger);
}

html[data-oto760-theme] :is(.module-table, #creditTableBody) td:is(:hover, :focus-within) {
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--teal) 28%, transparent),
    inset 0 0 16px color-mix(in srgb, var(--teal) 9%, transparent);
}

@media (prefers-reduced-motion: reduce) {
  html[data-oto760-theme] :is(.oto760-web-theme-grid > button, .oto760-stock-roll-card,
    .oto760-stock-tree-button, .workflow-column, .module-metric, input, select, textarea) {
    transition: none !important;
  }
}
@media print {
  html[data-oto760-theme] .dashboard-wrap { background: #ffffff !important; }
}
/* Keep the header panel-settings control inside the active theme palette. */
html[data-oto760-theme] .app-header .oto760-header-panel-settings {
  color: var(--theme-header-ink) !important;
  background: var(--teal) !important;
  border-color: color-mix(in srgb, var(--teal) 62%, white) !important;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--teal) 24%, transparent) !important;
}

html[data-oto760-theme] .app-header .oto760-header-panel-settings:hover,
html[data-oto760-theme] .app-header .oto760-header-panel-settings:focus-visible {
  color: var(--theme-header-ink) !important;
  background: color-mix(in srgb, var(--teal) 84%, white) !important;
  border-color: color-mix(in srgb, var(--teal) 48%, white) !important;
}
/* Continue the active theme beneath the transparent dock carrier area. */
html[data-oto760-theme] body {
  background-color: var(--oto760-page) !important;
  background-image:
    linear-gradient(var(--theme-grid-major) 1px, transparent 1px),
    linear-gradient(90deg, var(--theme-grid-major) 1px, transparent 1px),
    linear-gradient(var(--theme-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--theme-grid) 1px, transparent 1px) !important;
  background-size: 100px 100px, 100px 100px, 20px 20px, 20px 20px !important;
}

html[data-oto760-theme="ice"] body {
  background-image: linear-gradient(135deg, #eff9fc, #f7fbfd 55%, #edf5fc) !important;
  background-size: auto !important;
}

html[data-oto760-theme="showcase"] body {
  background-image: linear-gradient(135deg, #f6f5f1, #f3f8f7) !important;
  background-size: auto !important;
}
