/* ═══════════════════════════════════════════════════════════════════════
   EHDM Optimization Layer — hover & interaction polish
   ───────────────────────────────────────────────────────────────────────
   All layout / colour lives inline in the render functions (portable,
   works even when this file fails to load). This stylesheet only adds
   hover feedback, cursor affordance, and a print reset — the kind of
   thing you can't do cleanly with inline styles.
   ═══════════════════════════════════════════════════════════════════════ */

.ehdm-optim-layer {
  contain: layout style;
}

.ehdm-optim-section > summary {
  transition: background-color .12s ease;
}
.ehdm-optim-section > summary:hover {
  background-color: rgba(212, 175, 55, .04);
}
.ehdm-optim-section > summary::-webkit-details-marker { display: none; }
.ehdm-optim-section > summary::marker { content: ''; }
.ehdm-optim-section[open] > summary { border-bottom: 1px solid var(--border); }
.ehdm-optim-section[open] > summary > span:last-child { transform: rotate(180deg); display: inline-block; }
.ehdm-optim-section > summary > span:last-child { transition: transform .18s ease; }

/* Copy buttons in previews / controls */
.ehdm-optim-layer button {
  transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}
.ehdm-optim-layer button:hover {
  background-color: rgba(212, 175, 55, .18) !important;
  border-color: rgba(212, 175, 55, .70) !important;
}

/* Suno version selector pill row — active pill glows subtly */
.ehdm-optim-layer button[onclick*="setSunoVersion"] {
  min-width: 42px;
}

/* Preview blocks — better mono spacing */
.ehdm-optim-layer pre,
.ehdm-optim-layer .ehdm-mono {
  tab-size: 2;
}

@media print {
  /* When the user prints a snapshot, expand every collapsed section so
     nothing is silently omitted from the printed report. */
  .ehdm-optim-section { break-inside: avoid; }
  .ehdm-optim-section:not([open]) > div { display: block !important; }
  .ehdm-optim-layer button { display: none !important; }
}