/* Same controls as the Lobby; engineering diagrams keep their scientific palette. */
.circuit-actions {display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;margin:20px auto;max-width:980px;}
html[data-v30-ui] body .circuit-actions :is(.btn-calculate,#btn-pdf-circuito,.btn-clear) {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;height:auto;margin:0;padding:12px 16px;font:500 13px/1.3 var(--font-sans);border:1px solid var(--ie-rule);border-radius:3px;box-shadow:none;white-space:normal;cursor:pointer;}
html[data-v30-ui] body .circuit-actions .btn-calculate {background:var(--ie-ink);color:var(--ie-bg);border-color:var(--ie-ink);}
html[data-v30-ui] body .circuit-actions #btn-pdf-circuito {background:var(--ie-surface);color:var(--ie-ink);}
html[data-v30-ui] body .circuit-actions .btn-clear {background:transparent;color:#b42318;border-color:#b42318;}
html[data-v30-ui][data-theme=dark] body .circuit-actions .btn-clear {color:#fda29b;border-color:#fda29b;}
.circuit-actions :is(button,a):focus-visible {outline:2px solid var(--accent);outline-offset:3px;}

/* Remoção definitiva de abas recolhíveis no relatório */
details.obs-result-detail > summary { display: none !important; }
details.obs-result-detail { border: none !important; padding: 0 !important; }

/* The legacy editor writes inline colors. These overrides are deliberately
   limited to UI panels and controls; SVG fills, formulas and images are untouched. */
body.v30-circuit .prop-popover {box-sizing:border-box;width:min(580px,calc(100vw - 32px))!important;max-width:calc(100vw - 32px)!important;max-height:calc(100vh - 32px)!important;max-height:calc(100dvh - 32px)!important;overflow:auto!important;background:var(--ie-surface)!important;color:var(--ie-ink)!important;border:1px solid var(--ie-rule)!important;border-radius:6px!important;padding:20px!important;box-shadow:0 16px 50px #0003!important;}
body.v30-circuit .prop-popover :is(h3,h4,h5,label) {color:var(--ie-ink)!important;font-family:var(--font-sans);}
body.v30-circuit .prop-popover .section-block {background:var(--ie-bg)!important;border-color:var(--ie-rule)!important;border-radius:3px!important;}
body.v30-circuit .prop-popover :is(button,.btn-pop,.btn-sm) {min-height:40px;padding:8px 12px!important;border:1px solid var(--ie-rule)!important;border-radius:3px!important;background:var(--ie-raised)!important;color:var(--ie-ink)!important;box-shadow:none!important;font:500 12px var(--font-sans)!important;}
body.v30-circuit .prop-popover :is([data-act=save],#save-btn) {background:var(--ie-ink)!important;color:var(--ie-bg)!important;border-color:var(--ie-ink)!important;}
body.v30-circuit #side-image-popover {background:var(--ie-surface)!important;color:var(--ie-ink)!important;border:1px solid var(--ie-rule)!important;border-radius:6px!important;max-height:calc(100vh - 32px)!important;max-height:calc(100dvh - 32px)!important;overflow:auto!important;}
html[data-theme=dark] body.v30-circuit .prop-popover div[style*="background"] {background:var(--ie-bg)!important;color:var(--ie-ink)!important;border-color:var(--ie-rule)!important;}
html[data-theme=dark] body.v30-circuit .prop-popover :is(div[style*="color"],span[style*="background"]) {color:var(--ie-ink)!important;}
html[data-theme=dark] body.v30-circuit .prop-popover span[style*="background"] {background:var(--ie-raised)!important;}
body.v30-circuit #side-image-popover > div:first-child > div {color:var(--ie-ink)!important;}
.circuit-reference {border-top:1px solid var(--ie-rule);margin-top:18px;padding-top:14px;}
.circuit-reference summary {cursor:pointer;min-height:44px;display:list-item;color:var(--ie-ink);font:500 13px/1.6 var(--font-sans);}
body.v30-circuit .circuit-reference #side-image-popover {position:static!important;inset:auto!important;width:100%!important;max-width:none!important;max-height:none!important;box-sizing:border-box;box-shadow:none!important;margin-top:10px;}

/* ==========================================================================
   Circuito Térmico: Camadas e Resultados com Legibilidade Perfeita (Claro/Escuro)
   ========================================================================== */

/* Camadas (Layers List) - Tema Claro */
body.v30-circuit .layer-card {
  background: var(--ie-surface, #ffffff) !important;
  border: 1px solid var(--ie-rule, #e2e8f0) !important;
  color: var(--ie-ink, #0f172a) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
body.v30-circuit .layer-card.selected {
  background: var(--ie-raised, #f8fafc) !important;
  border-color: var(--ie-accent, #d9761e) !important;
  box-shadow: 0 0 0 1px var(--ie-accent, #d9761e), 0 4px 14px rgba(217,118,30,0.15) !important;
}
body.v30-circuit .layer-card-title {
  color: var(--ie-muted, #64748b) !important;
}
body.v30-circuit .layer-card-name {
  color: var(--ie-ink, #0f172a) !important;
}
body.v30-circuit .layer-card-body {
  color: var(--ie-ink, #1e293b) !important;
}
body.v30-circuit .layer-card-body strong {
  color: var(--ie-ink, #0f172a) !important;
}
body.v30-circuit .layer-card-body div {
  color: var(--ie-ink, #1e293b) !important;
}
body.v30-circuit .layer-pill {
  background: var(--ie-raised, #f1f5f9) !important;
  color: var(--ie-muted, #475569) !important;
  border: 1px solid var(--ie-rule, #cbd5e1) !important;
}
body.v30-circuit .layer-card-action {
  background: var(--ie-surface, #ffffff) !important;
  color: var(--ie-ink, #475569) !important;
  border: 1px solid var(--ie-rule, #cbd5e1) !important;
}

/* Camadas (Layers List) - Tema Escuro */
html[data-theme="dark"] body.v30-circuit .layer-card {
  background: var(--ie-surface, #171a1d) !important;
  border: 1px solid var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.35) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card.selected {
  background: var(--ie-raised, #1e2226) !important;
  border-color: var(--ie-accent, #f07b3f) !important;
  box-shadow: 0 0 0 1px var(--ie-accent, #f07b3f), 0 4px 18px rgba(0,0,0,0.45) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-title {
  color: var(--ie-muted, #b6b2aa) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-name {
  color: #ffffff !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-body {
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-body strong {
  color: #ffffff !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-body div {
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-status {
  color: #4ade80 !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-status::before {
  background: #4ade80 !important;
  box-shadow: 0 0 0 3px rgba(74,222,128,0.2) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-status.invalid {
  color: #fda29b !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-status.invalid::before {
  background: #f04438 !important;
  box-shadow: 0 0 0 3px rgba(240,68,56,0.2) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-pill {
  background: var(--ie-raised, #1e2226) !important;
  color: var(--ie-muted, #b6b2aa) !important;
  border: 1px solid var(--ie-rule, #2d3135) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-action {
  background: var(--ie-raised, #1e2226) !important;
  color: var(--ie-ink, #ebe8e1) !important;
  border: 1px solid var(--ie-rule, #2d3135) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-action:hover {
  background: var(--ie-surface, #171a1d) !important;
  color: var(--ie-accent, #f07b3f) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-card-action.layer-delete {
  color: #fda29b !important;
}
html[data-theme="dark"] body.v30-circuit .layer-icon {
  background: var(--ie-raised, #1e2226) !important;
  border-color: var(--ie-rule, #2d3135) !important;
}
html[data-theme="dark"] body.v30-circuit .layer-flow-connector {
  color: var(--ie-muted, #b6b2aa) !important;
}

/* Indicadores de tipo de camada no tema escuro */
html[data-theme="dark"] body.v30-circuit .layer-card--solid { border-left: 4px solid var(--ie-accent, #f07b3f) !important; }
html[data-theme="dark"] body.v30-circuit .layer-card--fluid { border-left: 4px solid #38bdf8 !important; }
html[data-theme="dark"] body.v30-circuit .layer-card--parallel { border-left: 4px solid #a855f7 !important; }
html[data-theme="dark"] body.v30-circuit .layer-card--finned { border-left: 4px solid #2dd4bf !important; }

/* Painéis estruturais do Circuito Térmico em Tema Escuro */
html[data-theme="dark"] body.v30-circuit :is(.section-card, .layers-panel, .circuit-panel, .results-card) {
  background: var(--ie-surface, #171a1d) !important;
  border: 1px solid var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.35) !important;
}
html[data-theme="dark"] body.v30-circuit :is(.panel-title, .section-title, .main-title, h1, h2, h3, h4) {
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit .main-subtitle {
  color: var(--ie-muted, #b6b2aa) !important;
}

/* Resultados do Cálculo - Tema Escuro */
html[data-theme="dark"] body.v30-circuit #results {
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-panel {
  background: var(--ie-surface, #171a1d) !important;
  border: 1px solid var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-panel-title {
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-panel-sub {
  color: var(--ie-muted, #b6b2aa) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-badge {
  background: var(--ie-raised, #1e2226) !important;
  color: var(--ie-accent, #f07b3f) !important;
  border: 1px solid var(--ie-rule, #2d3135) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-metric-card {
  background: var(--ie-surface, #171a1d) !important;
  border: 1px solid var(--ie-rule, #2d3135) !important;
  border-top: 3px solid var(--ie-accent, #f07b3f) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-metric-label {
  color: var(--ie-muted, #b6b2aa) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-metric-value {
  color: #ffffff !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-metric-unit {
  color: var(--ie-muted, #b6b2aa) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-metric-note {
  color: var(--ie-faint, #96928a) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-metric-card div[style*="font-family"] {
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-formula-box {
  background: var(--ie-bg, #101214) !important;
  border: 1px solid var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-formula-line {
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-formula-line strong {
  color: var(--ie-accent, #f07b3f) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-formula-line .result {
  color: #ffffff !important;
  font-weight: 700;
}
html[data-theme="dark"] body.v30-circuit #results table.res-table {
  background: var(--ie-surface, #171a1d) !important;
  border-color: var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results table.res-table th {
  background: var(--ie-raised, #1e2226) !important;
  color: var(--ie-ink, #ebe8e1) !important;
  border-color: var(--ie-rule, #2d3135) !important;
}
html[data-theme="dark"] body.v30-circuit #results table.res-table td {
  background: transparent !important;
  color: var(--ie-ink, #ebe8e1) !important;
  border-color: var(--ie-rule, #2d3135) !important;
}
html[data-theme="dark"] body.v30-circuit #results table.res-table tr:hover td {
  background: var(--ie-raised, #1e2226) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-balance-eq {
  background: var(--ie-bg, #101214) !important;
  border-color: var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-balance-eq div {
  color: var(--ie-muted, #b6b2aa) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-interface-box {
  background: var(--ie-raised, #1e2226) !important;
  border-color: var(--ie-rule, #2d3135) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-interface-box .lbl {
  color: var(--ie-muted, #b6b2aa) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-interface-box .val {
  color: #ffffff !important;
  font-weight: 700 !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-check {
  background: var(--ie-raised, #1e2226) !important;
  border-color: var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-empty {
  color: var(--ie-muted, #b6b2aa) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-empty strong {
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results .res-empty span {
  color: var(--ie-muted, #b6b2aa) !important;
}

/* Neutralização de gradientes claros hardcoded nos passos em tema escuro */
html[data-theme="dark"] body.v30-circuit #results div[style*="background: linear-gradient"],
html[data-theme="dark"] body.v30-circuit #results div[style*="background:linear-gradient"] {
  background: var(--ie-surface, #171a1d) !important;
  border-color: var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results div[style*="background: #fff"],
html[data-theme="dark"] body.v30-circuit #results div[style*="background:#fff"],
html[data-theme="dark"] body.v30-circuit #results div[style*="background: white"],
html[data-theme="dark"] body.v30-circuit #results div[style*="background:white"] {
  background: var(--ie-surface, #171a1d) !important;
  border-color: var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #results :is(p, span, div)[style*="color: #666"],
html[data-theme="dark"] body.v30-circuit #results :is(p, span, div)[style*="color:#666"] {
  color: var(--ie-muted, #b6b2aa) !important;
}
html[data-theme="dark"] body.v30-circuit #results canvas {
  background: var(--ie-surface, #171a1d) !important;
}
html[data-theme="dark"] body.v30-circuit #planar-params-controls {
  background: var(--ie-surface, #171a1d) !important;
  border-color: var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #planar-params-controls label {
  color: var(--ie-ink, #ebe8e1) !important;
}
html[data-theme="dark"] body.v30-circuit #planar-params-controls input {
  background: var(--ie-raised, #1e2226) !important;
  border-color: var(--ie-rule, #2d3135) !important;
  color: var(--ie-ink, #ebe8e1) !important;
}

@media(max-width:720px){
  .circuit-actions{display:grid;grid-template-columns:minmax(0,1fr);}
  body.v30-circuit .prop-popover{position:fixed!important;left:16px!important;top:16px!important;transform:none!important;}
}
@media(prefers-reduced-motion:reduce){.circuit-actions button{transition:none;}}