/* LadderLab EDU V3 — biblioteca + Inspector no topo e editor Ladder com largura ampliada. */

.v3-top-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 350px);
  gap: .85rem;
  align-items: start;
  margin-bottom: .85rem;
}

.v3-top-tools .instruction-library[data-v2-enhanced="true"] {
  margin: 0;
  min-width: 0;
}

.v3-top-tools .properties-panel {
  position: sticky;
  top: .5rem;
  z-index: 24;
  max-height: 310px;
  overflow: auto;
  box-shadow: var(--ll-v2-shadow);
}

.v3-top-tools .properties-panel h2 {
  margin-bottom: .45rem;
}

.v3-top-tools .property-form {
  gap: .42rem;
}

.v3-top-tools .property-form textarea {
  min-height: 54px;
}

.v2-editor-row.v3-editor-full {
  display: block !important;
}

.v2-editor-row.v3-editor-full .v2-editor-area {
  width: 100%;
  min-width: 0;
}

.v2-editor-row.v3-editor-full .v2-properties-area:empty {
  display: none !important;
}

.v2-editor-row.v3-editor-full .ladder-editor {
  width: 100%;
}

.v3-mode-field select {
  font-weight: 750;
  color: #173247;
}

.v3-runtime-tool {
  border-color: #9fc4dd;
  background: linear-gradient(180deg, #ffffff, #edf7fd);
}

.v3-runtime-tool .tool-symbol {
  color: #005ca9;
}

/* A cena muda durante a varredura, mas os controles permanecem estáveis no DOM. */
.scenario-panel .scenario-visual {
  contain: layout paint;
}

.monitor-panel,
.ladder-editor,
.scenario-panel {
  overflow-anchor: none;
}

@media (min-width: 1051px) {
  .v2-editor-column {
    min-width: 0;
  }

  .v2-editor-column .ladder-scroll {
    max-width: 100%;
  }
}

@media (max-width: 1050px) {
  .v3-top-tools {
    grid-template-columns: 1fr;
  }

  .v3-top-tools .properties-panel {
    position: static;
    max-height: none;
  }
}

@media (max-width: 760px) {
  .v3-top-tools {
    margin-inline: -.5rem;
  }

  .v3-top-tools .properties-panel {
    border-radius: 0;
  }
}