/*
 * formulario-demo.css: el mensaje de resultado del formulario «Ask Demo & PoC» de la portada.
 * Archivo generado con el sitio: los cambios se hacen en su origen, no en el sitio publicado.
 *
 * El formulario se ve exactamente como siempre: esta hoja no toca sus campos, su boton ni sus estilos. Agrega solo la zona
 * del mensaje (vacia no ocupa lugar) y saca de la vista el campo trampa. Los colores son los globales del sitio (las variables
 * --e-global-color-* de su kit, con su valor de hoy por si faltaran).
 */

/* la zona del mensaje y la trampa: un renglon entero al final de los campos; mientras no hay mensaje mide 0 de alto */
.propio-formulario {
  flex: 0 0 100%;
  width: 100%;
  padding-inline: 5px; /* el de cada grupo del formulario (calc(10px/2) en la hoja del widget) */
}

/* el campo trampa: fuera de la vista y del orden de tabulacion (no display:none: hay robots que saltan lo oculto asi) */
.propio-trampa {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* la zona del mensaje: una region viva que esta siempre en la pagina (si entrara al arbol junto con su texto, un lector de
   pantalla no siempre la anuncia). Vacia, sin margen, relleno ni borde: no se ve ni empuja nada. */
.propio-estado {
  color: var(--e-global-color-37ea78e, #ffffff);
  font-family: var(--e-global-typography-text-font-family, "Roboto"), sans-serif;
  font-size: 0.95em;
  line-height: 1.45;
}

.propio-estado.propio-ok,
.propio-estado.propio-error,
.propio-estado.propio-espera {
  margin-top: 10px;
  padding: 8px 12px;
  border-inline-start: 4px solid var(--e-global-color-cb4f71d, #929293);
}

.propio-estado.propio-ok {
  border-inline-start-color: var(--e-global-color-a21c37a, #00b050);
}

.propio-estado.propio-error {
  border-inline-start-color: var(--e-global-color-55c1380, #e02427);
}