/**
 * Estilos de la PÁGINA contenedora (no del formulario: el widget vive en un
 * Shadow DOM y trae su propio CSS aislado). Aquí solo maquetamos el wrapper para
 * que se vea como una página integrada de la tienda, no como un modal flotante.
 */

.ndx-incidencias-page {
  padding: 30px 0 50px;
}

.ndx-incidencias-container {
  max-width: 980px;
  margin: 0 auto;
  padding: 0 15px;
}

.ndx-incidencias-header {
  margin-bottom: 25px;
  text-align: left;
}

.ndx-incidencias-header h1 {
  margin-bottom: 10px;
}

.ndx-incidencias-header p {
  max-width: 760px;
  margin-bottom: 0;
  line-height: 1.5;
}

/* Reserva de espacio mientras el widget remoto carga (evita salto de layout). */
#ndx-incidencias {
  min-height: 350px;
}

.ndx-incidencias-status {
  margin-top: 20px;
  padding: 15px;
  border-radius: 4px;
}

.ndx-incidencias-status--error {
  color: #721c24;
  background: #f8d7da;
  border: 1px solid #f5c6cb;
}

/**
 * RESPALDO — si tras instalar siguiera apareciendo el título del page-header del
 * tema (algunos temas no usan el bloque `page_header_container`), descomenta esto.
 * Este CSS solo se carga en la página de incidencias, así que no afecta al resto.
 */
/*
.page-header { display: none; }
*/