/* Readability fixes for the selected official light theme.
 * Preserve the official source files and spacing; use darker same-hue foregrounds
 * where small text sits on Bone/Sage surfaces rather than Shell.
 */
:root[data-theme="light"] {
  --tc-text-muted: #68635C;
  --tc-text-faint: var(--tc-text-muted);
  --tc-link: #4F684C;
  --tc-focus: var(--tc-link);
  --tc-ok: #1B7046;
  --tc-chart-axis: var(--tc-text-muted);
  --tc-chart-axis-faint: var(--tc-text-muted);
  --tc-chart-marker-text: var(--tc-text-muted);
}
:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder {
  color: var(--tc-text-muted);
  opacity: 1;
}
:root[data-theme="light"] :is(.chart-tooltip, .mempool-tooltip) {
  border-color: var(--tc-border-strong);
  color: var(--tc-text);
  background: var(--tc-surface);
  box-shadow: var(--tc-shadow-float);
}
:root[data-theme="light"] :is(.chart-tooltip, .mempool-tooltip) :is(strong, span b) {
  color: var(--tc-text-strong);
}
:root[data-theme="light"] :is(.chart-tooltip, .mempool-tooltip) :is(span, small) {
  color: var(--tc-text-muted);
  border-color: var(--tc-border);
  font-size: 11px;
}
:root[data-theme="light"] .chart-tooltip .rate-dot { background: var(--tc-chart-primary); }
:root[data-theme="light"] .chart-tooltip .difficulty-dot { background: var(--tc-chart-tertiary); }

/* Shared selects use the official surfaces in every interaction state. */
:root[data-theme="light"] .explorer-select-trigger {
  border-color: var(--tc-border-strong);
  border-radius: var(--tc-radius-chip);
  color: var(--tc-text-strong);
  background: var(--tc-surface);
  font-family: var(--tc-font-sans);
}
:root[data-theme="light"] .explorer-select-trigger:hover,
:root[data-theme="light"] .explorer-select.is-open .explorer-select-trigger {
  border-color: var(--tc-text-muted);
  background: var(--tc-bg-quiet);
}
:root[data-theme="light"] .explorer-select-trigger:disabled {
  color: var(--tc-text-muted);
  background: var(--tc-bg-quiet);
  opacity: 1;
  cursor: not-allowed;
}
:root[data-theme="light"] .explorer-select-chevron {
  display: flex;
  flex: 0 0 12px;
  align-items: center;
  justify-content: center;
  width: 12px;
  height: 12px;
  color: var(--tc-text-muted);
  transform-origin: center;
}
:root[data-theme="light"] .explorer-select-chevron svg { display: block; width: 12px; height: 12px; }
:root[data-theme="light"] .explorer-select-menu {
  padding: 5px;
  border-color: var(--tc-border-strong);
  border-radius: var(--tc-radius-card);
  color: var(--tc-text);
  background: var(--tc-surface);
  box-shadow: var(--tc-shadow-float);
}
:root[data-theme="light"] .explorer-select-search {
  border-color: var(--tc-border);
  border-radius: var(--tc-radius-chip);
  color: var(--tc-text);
  background: var(--tc-bg-quiet);
}
:root[data-theme="light"] .explorer-select-option {
  border-radius: var(--tc-radius-chip);
  color: var(--tc-text);
}
:root[data-theme="light"] .explorer-select-option:hover,
:root[data-theme="light"] .explorer-select-option:focus-visible {
  color: var(--tc-text-strong);
  background: var(--tc-bg-quiet);
}
:root[data-theme="light"] .explorer-select-option[aria-selected="true"] {
  color: var(--tc-text-strong);
  background: var(--tc-accent-soft);
}
:root[data-theme="light"] :is(.explorer-select-trigger, .explorer-select-option):focus-visible {
  outline: 2px solid var(--tc-focus);
  outline-offset: 2px;
}

/* The network picker sits inside the 30 px ribbon, with an optically centred
 * SVG chevron instead of a font-dependent down-arrow character. */
:root[data-theme="light"] .ribbon-network .explorer-select { min-width: 98px; }
:root[data-theme="light"] .ribbon-network .explorer-select-trigger {
  box-sizing: border-box;
  height: 24px;
  min-height: 24px;
  padding: 0 9px;
  gap: 10px;
  border: 1px solid var(--tc-border-strong);
  border-radius: var(--tc-radius-chip);
  color: var(--tc-text-strong);
  background: transparent;
  font: var(--tc-weight-medium) 11px/1 var(--tc-font-sans);
  letter-spacing: .04em;
}
:root[data-theme="light"] .ribbon-network .explorer-select-trigger:hover,
:root[data-theme="light"] .ribbon-network .explorer-select.is-open .explorer-select-trigger {
  border-color: var(--tc-text-muted);
  background: var(--tc-bg);
}
:root[data-theme="light"] .ribbon-network .explorer-select-menu {
  left: 0;
  right: auto;
  top: calc(100% + 7px);
  min-width: 144px;
}
:root[data-theme="light"] .ribbon-network .explorer-select-option {
  min-height: 34px;
  padding: 8px 10px;
  font: var(--tc-weight-medium) 12px/1.2 var(--tc-font-sans);
  letter-spacing: .03em;
}
:root[data-theme="light"] .registry-refreshing:has(.loading-cell) { opacity: 1; }