/* ==========================================================================
   Hoolistic Web Toolkit · Estilo para el widget Formulario de Elementor Pro
   Se activa con la clase «hwt-form» en Avanzado → Clases CSS del widget.
   Variantes (se añaden además de hwt-form):
     hwt-form--line       campos subrayados, sin caja
     hwt-form--no-labels  oculta las etiquetas a la vista (siguen para lectores de pantalla)
     hwt-form--yellow     botón amarillo de marca con texto oscuro
   Hereda las fuentes del tema y sigue el modo oscuro de Osty.
   ========================================================================== */

.elementor-widget-form.hwt-form{
	--hwt-f-text:var(--color-contrast-higher,#262626);
	--hwt-f-soft:var(--color-contrast-medium,#6b6870);
	--hwt-f-line:var(--color-contrast-low,#d9d7d3);
	--hwt-f-bg:#fff;
	--hwt-f-focus:#fcca73;
	--hwt-f-radius:14px;
	--hwt-f-h:56px;
	--hwt-f-btn-bg:var(--color-contrast-higher,#262626);
	--hwt-f-btn-text:var(--color-bg,#fff);
	--hwt-f-check:var(--color-bg,#fff);
	--hwt-f-error:#c2410c;
}
body[data-theme="dark"] .elementor-widget-form.hwt-form,html[data-theme="dark"] .elementor-widget-form.hwt-form{
	--hwt-f-text:var(--color-contrast-higher,#f5f5f5);
	--hwt-f-soft:var(--color-contrast-medium,#a3a1a6);
	--hwt-f-line:var(--color-contrast-low,#3a3838);
	--hwt-f-bg:rgba(255,255,255,.05);
	--hwt-f-error:#fb923c;
}

/* Espacio entre filas */
.elementor-widget-form.hwt-form .elementor-form-fields-wrapper{row-gap:22px}
.elementor-widget-form.hwt-form .elementor-field-group{margin-bottom:0}

/* Etiquetas */
.elementor-widget-form.hwt-form .elementor-field-group > .elementor-field-label{
	margin:0 0 8px;padding:0;font-size:.85rem;font-weight:500;line-height:1.3;letter-spacing:.01em;color:var(--hwt-f-soft);
}
.elementor-widget-form.hwt-form .elementor-mark-required .elementor-field-label::after{color:var(--hwt-f-soft)}

/* Campos */
.elementor-widget-form.hwt-form .elementor-field-group .elementor-field-textual,
.elementor-widget-form.hwt-form .elementor-field-group .elementor-select-wrapper select{
	min-height:var(--hwt-f-h);padding:14px 18px;
	/* !important: los colores del panel de Elementor usan selectores más fuertes. */
	border:1px solid var(--hwt-f-line)!important;border-radius:var(--hwt-f-radius)!important;
	background:var(--hwt-f-bg)!important;color:var(--hwt-f-text)!important;
	font-family:inherit;font-size:1rem;line-height:1.4;box-shadow:none;
	transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease;
}
.elementor-widget-form.hwt-form .elementor-field-group textarea.elementor-field-textual{min-height:150px;resize:vertical}
.elementor-widget-form.hwt-form .elementor-field-group .elementor-field-textual::placeholder{color:var(--hwt-f-soft);opacity:.75}
.elementor-widget-form.hwt-form .elementor-field-group .elementor-field-textual:hover{border-color:var(--hwt-f-soft)!important}
.elementor-widget-form.hwt-form .elementor-field-group .elementor-field-textual:focus,
.elementor-widget-form.hwt-form .elementor-field-group .elementor-select-wrapper select:focus{
	outline:none;border-color:var(--hwt-f-text)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--hwt-f-focus) 55%,transparent);
}
@supports not (color:color-mix(in srgb,red 50%,transparent)){
	.elementor-widget-form.hwt-form .elementor-field-group .elementor-field-textual:focus{box-shadow:0 0 0 4px rgba(252,202,115,.55)}
}

/* Casilla de aceptación y casillas */
.elementor-widget-form.hwt-form .elementor-field-type-acceptance .elementor-field-subgroup,
.elementor-widget-form.hwt-form .elementor-field-type-checkbox .elementor-field-subgroup{margin-top:2px}
.elementor-widget-form.hwt-form .elementor-field-option{display:flex;align-items:flex-start;gap:10px}
.elementor-widget-form.hwt-form .elementor-field-option input[type="checkbox"],
.elementor-widget-form.hwt-form .elementor-field-option input[type="radio"]{
	flex:none;appearance:none;-webkit-appearance:none;width:22px;height:22px;margin:1px 0 0;
	border:1.5px solid var(--hwt-f-soft)!important;border-radius:7px!important;background:var(--hwt-f-bg)!important;cursor:pointer;
	display:grid;place-content:center;transition:background-color .2s ease,border-color .2s ease;
}
.elementor-widget-form.hwt-form .elementor-field-option input[type="radio"]{border-radius:50%!important}
.elementor-widget-form.hwt-form .elementor-field-option input[type="checkbox"]::before{
	content:"";width:11px;height:6px;margin-top:-3px;border:2px solid var(--hwt-f-check);border-top:0;border-right:0;transform:rotate(-45deg) scale(0);transition:transform .15s ease;
}
.elementor-widget-form.hwt-form .elementor-field-option input[type="radio"]::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--hwt-f-check);transform:scale(0);transition:transform .15s ease}
.elementor-widget-form.hwt-form .elementor-field-option input:checked{background:var(--hwt-f-text)!important;border-color:var(--hwt-f-text)!important}
.elementor-widget-form.hwt-form .elementor-field-option input:checked::before{transform:rotate(-45deg) scale(1)}
.elementor-widget-form.hwt-form .elementor-field-option input[type="radio"]:checked::before{transform:scale(1)}
.elementor-widget-form.hwt-form .elementor-field-option input:focus-visible{outline:none;box-shadow:0 0 0 4px rgba(252,202,115,.55)}
.elementor-widget-form.hwt-form .elementor-field-option label{font-size:.9rem;line-height:1.5;color:var(--hwt-f-soft);cursor:pointer}
.elementor-widget-form.hwt-form .elementor-field-option label a{color:var(--hwt-f-text);text-decoration:underline;text-underline-offset:3px}

/* Botón: píldora oscura como los botones de Osty */
.elementor-widget-form.hwt-form .e-form__buttons{margin-top:6px}
.elementor-widget-form.hwt-form .e-form__buttons .elementor-button[type="submit"]{
	min-height:var(--hwt-f-h);padding:16px 34px;border:0!important;border-radius:999px!important;
	background:var(--hwt-f-btn-bg)!important;color:var(--hwt-f-btn-text)!important;
	font-family:inherit;font-size:1rem;font-weight:600;line-height:1.2;letter-spacing:normal;text-transform:none;
	transition:transform .2s ease,opacity .2s ease,box-shadow .2s ease;
}
.elementor-widget-form.hwt-form .e-form__buttons .elementor-button[type="submit"]:hover{transform:translateY(-2px);box-shadow:0 14px 30px -18px rgba(0,0,0,.45)}
.elementor-widget-form.hwt-form .e-form__buttons .elementor-button[type="submit"]:focus-visible{outline:2px solid var(--hwt-f-text);outline-offset:4px}
.elementor-widget-form.hwt-form .e-form__buttons .elementor-button[type="submit"] .elementor-button-text{color:inherit}
.elementor-widget-form.hwt-form form.elementor-form-waiting .elementor-button[type="submit"]{opacity:.7;cursor:progress}

/* Mensajes */
.elementor-widget-form.hwt-form .elementor-message{margin-top:14px;padding:12px 16px;border-radius:12px;font-size:.95rem;line-height:1.45}
.elementor-widget-form.hwt-form .elementor-message.elementor-message-success{background:rgba(252,202,115,.22);color:var(--hwt-f-text)}
.elementor-widget-form.hwt-form .elementor-message.elementor-message-danger{background:rgba(194,65,12,.1);color:var(--hwt-f-error)}
.elementor-widget-form.hwt-form .elementor-message::before{display:none}
.elementor-widget-form.hwt-form .elementor-field-group .elementor-message{margin-top:6px;padding:0;background:none;font-size:.82rem;color:var(--hwt-f-error)}
.elementor-widget-form.hwt-form .elementor-error .elementor-field-textual{border-color:var(--hwt-f-error)!important}

/* Variante: campos subrayados */
.elementor-widget-form.hwt-form--line .elementor-field-group .elementor-field-textual{
	padding-left:0;padding-right:0;border-width:0 0 1.5px!important;border-radius:0!important;background:transparent!important;
}
.elementor-widget-form.hwt-form--line .elementor-field-group .elementor-field-textual:focus{box-shadow:0 2px 0 0 var(--hwt-f-focus)}

/* Variante: sin etiquetas visibles */
.elementor-widget-form.hwt-form--no-labels .elementor-field-group:not(.elementor-field-type-acceptance):not(.elementor-field-type-checkbox):not(.elementor-field-type-radio) > .elementor-field-label{
	position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* Variante: botón amarillo de marca (texto oscuro para que se lea) */
.elementor-widget-form.hwt-form--yellow{--hwt-f-btn-bg:#fcca73;--hwt-f-btn-text:#262626}

@media (max-width:767px){
	.elementor-widget-form.hwt-form .elementor-form-fields-wrapper{row-gap:18px}
	.elementor-widget-form.hwt-form .e-form__buttons .elementor-button[type="submit"]{width:100%}
}
@media (prefers-reduced-motion:reduce){
	.elementor-widget-form.hwt-form *{transition:none!important}
}
