/* Compatibilidad visual de calculadoras y neurofisiología heredadas. */
html[data-theme="light"] body :is(
  .benzo-hero, .alerta-seguridad, .panel-conversion, .panel-resultado,
  .panel-historial, .panel-tabla, .panel-educativo,
  .dato-destacado, .resultado-card, .mensaje,
  .historial-lista > div, .educativo-grid article,
  .calc-med-toolbar, .calc-med-sidebar, .calc-med-panel, .calc-med-card,
  .calc-ped-hero, .calc-ped-sidebar, .calc-ped-panel, .calc-ped-card,
  .neuro-hero, .indicadores article, .canales-grid article,
  .experimento-card, .teoria-grid article, .proyecto-item
) {
  color: var(--text-primary);
  background: var(--surface-primary);
  border-color: var(--border-subtle);
  box-shadow: none;
}

html[data-theme="light"] body :is(
  .benzo-shell, .calc-med-shell, .calc-ped-shell, .neuro-hero
) :is(h1, h2, h3, h4, p, strong, span, small, label, legend, summary, li, dt, dd, th, td) {
  color: var(--text-primary);
}

html[data-theme="light"] body :is(
  .benzo-shell, .calc-med-shell, .calc-ped-shell, .neuro-shell
) :is(input, select, textarea) {
  color: var(--input-text);
  background: var(--input-bg);
  border-color: var(--input-border);
}

html[data-theme="light"] body :is(
  .benzo-shell, .calc-med-shell, .calc-ped-shell, .neuro-shell
) :is(input, textarea)::placeholder {
  color: var(--input-placeholder);
  opacity: 1;
}

html[data-theme="light"] body :is(
  .benzo-shell, .calc-med-shell, .calc-ped-shell
) :is(.tabla-scroll, table, .calc-med-table, .calc-ped-form) {
  color: var(--text-primary);
  background: var(--surface-primary);
  border-color: var(--border-subtle);
}

html[data-theme="light"] body .neuro-hero .alerta-lab {
  color: #684300;
  background: #fff2d2;
  border-color: #c69a4c;
}

html[data-theme="light"] body :is(.calc-ped-card.activa, .calc-med-card.activa) {
  background: var(--surface-selected-light);
  border-color: var(--accent-primary);
}

html[data-theme="light"] body .mensaje.error {
  color: #8f2924;
  background: #fff0ef;
  border-color: #d9958f;
}

html[data-theme="light"] body .mensaje.advertencia {
  color: #684300;
  background: #fff2d2;
  border-color: #c69a4c;
}

html[data-theme="light"] body :is(
  .ghost-link, .ghost-button, #recargarSofia,
  .button-row button, .input-row button
) {
  color: var(--text-primary);
  background: var(--surface-secondary);
  border-color: var(--border-subtle);
}