/* para-publicadores.css — estilos bajo #kit-pagina.
   Usa tokens de tokens.css: --catodo, --hueso, --bronce. */
#kit-pagina {
    max-width: 72rem;
    margin-inline: auto;
  }
#kit-pagina .datos-cab,
#kit-pagina .datos-bloque,
#kit-pagina .datos-ia {
    max-width: 70ch;
  }
#kit-pagina .datos-bloque {
    margin-block: var(--ds-esp-6);
  }
#kit-pagina .herramientas-rotulo {
    margin: 0 0 var(--ds-esp-3);
    color: var(--hueso-2);
    font: 500 var(--ds-rotulo)/1.4 var(--condensada);
    letter-spacing: var(--tracking-texto);
  }
#kit-pagina .datos-ia {
    color: var(--hueso-3);
  }
#kit-pagina .abrir-ficha {
    display: inline-flex;
    align-items: center;
    min-height: var(--alto-menu-herramientas);
    color: var(--hueso-2);
    text-decoration-color: var(--bronce);
  }
#kit-pagina .abrir-ficha:hover {
    color: var(--catodo);
  }
#kit-pagina .kit-ficha {
    margin-bottom: var(--ds-esp-5);
  }
#kit-pagina .kit-ficha:last-child {
    margin-bottom: 0;
  }
#kit-pagina .kit-codigo {
    display: flex;
    flex-direction: column;
    gap: var(--ds-esp-1);
    margin-top: var(--ds-esp-2);
    font: 400 var(--ds-cuerpo)/var(--ds-linea-cuerpo) var(--datos);
  }
#kit-pagina .kit-textarea {
    width: 100%;
    box-sizing: border-box;
    padding: var(--ds-esp-2);
    border: 1px solid var(--bronce);
    border-radius: 8px;
    background: var(--panel);
    color: var(--hueso);
    font: 400 .875rem/1.5 var(--datos);
    resize: vertical;
  }
#kit-pagina .kit-textarea:focus {
    border-color: var(--catodo);
    outline: 2px solid var(--catodo);
    outline-offset: 1px;
  }
#kit-pagina .kit-copiar {
    align-self: flex-end;
    min-height: var(--alto-menu-herramientas);
    background: none;
    border: 1px solid var(--bronce);
    color: var(--hueso);
    padding: var(--ds-esp-1) var(--ds-esp-2);
    font: inherit;
    cursor: pointer;
    border-radius: 8px;
    transition: border-color var(--t-seccion) cubic-bezier(.16, 1, .3, 1),
                color var(--t-seccion) cubic-bezier(.16, 1, .3, 1);
  }
#kit-pagina .kit-copiar:hover,
#kit-pagina .kit-copiar:focus-visible {
    border-color: var(--catodo);
    color: var(--catodo);
  }
#kit-pagina .kit-copiar:active {
    filter: brightness(.9);
  }
#kit-pagina .kit-estado {
    margin-top: var(--ds-esp-1);
    font-size: var(--ds-rotulo);
    color: var(--hueso-3);
  }
#kit-pagina .kit-estado-ok {
    color: var(--catodo);
  }
#kit-pagina .kit-preview,
#kit-pagina .kit-iframe {
    width: 100%;
    margin: var(--ds-esp-3) 0;
    background: transparent;
    border: 1px solid var(--bronce);
    border-radius: 14px;
    overflow: hidden;
  }
#kit-pagina .kit-vista {
    margin-inline: 0;
  }
#kit-pagina .kit-preview img,
#kit-pagina .kit-preview iframe,
#kit-pagina .kit-iframe img,
#kit-pagina .kit-iframe iframe {
    width: 100%;
    height: auto;
    display: block;
  }
/* Responsive: debajo de 600px el boton de copiar tiene tamaño reducido */
@media (max-width: 599px) {
  #kit-pagina .kit-copiar {
    font-size: var(--ds-rotulo);
    padding: var(--ds-esp-2) var(--ds-esp-3);
  }
}