/* public/assets/css/editor.css — Estilos del editor EPK y print */

/* ─── Scrollbar ──────────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: rgba(15,23,42,0.6); }
::-webkit-scrollbar-thumb { background: rgba(100,116,139,0.5); border-radius: 4px; }

/* ─── Elementos contenteditable (editor inline) ──────────────────────────── */
[contenteditable="true"] {
  outline: none;
  transition: all 0.2s ease;
  cursor: text;
}
[contenteditable="true"]:hover {
  background-color: rgba(255,255,255,0.08);
  box-shadow: 0 0 0 2px var(--accent-color, #06b6d4);
  border-radius: 4px;
}
[contenteditable="true"]:focus {
  background-color: rgba(0,0,0,0.4);
  box-shadow: 0 0 0 2px var(--accent-hover, #22d3ee);
  border-radius: 4px;
}

/* ─── Exportación PDF Vectorial de Alta Fidelidad (@media print) ──────────── */

@page {
  size: A4 portrait;
  margin: 10mm 8mm;
}

@media print {
  *, *::before, *::after {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    color-adjust: exact !important;
  }

  html, body {
    background-color: var(--bg-primary, #090d16) !important;
    color: var(--text-main, #f8fafc) !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  /* Ocultar elementos de UI y controles de navegación */
  .no-print, header, nav, button, input, textarea, select, .no-pdf, .toast {
    display: none !important;
  }

  main {
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    display: block !important;
  }

  /* Ajustar contenedor del EPK al ancho completo imprimible */
  .epk-preview-container, #epkLiveContainer, #epkPreview {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: transparent !important;
    overflow: visible !important;
  }

  /* Evitar cortes indeseados dentro de secciones */
  section, .group\/sec, article, div[id^="sec"] {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    margin-bottom: 1.5rem !important;
  }

  /* Mantener estilos de tarjetas y rejillas */
  .grid {
    display: grid !important;
  }
  .flex {
    display: flex !important;
  }

  /* Preservar hipervínculos interactivos sin subrayado feo */
  a {
    text-decoration: none !important;
    color: inherit !important;
  }

  /* Asegurar imágenes nítidas en la impresión */
  img {
    max-width: 100% !important;
    page-break-inside: avoid !important;
  }

  iframe {
    max-height: 120px !important;
    border-radius: 8px !important;
  }
}