/* impulsoweb Leads — formularios, popup y botón flotante.
   Usa las variables del theme impulsoweb si existen (con valores de respaldo). */
.iwl-form {
	--_teal: var(--iw-teal, #03859A);
	--_teal-d: var(--iw-teal-d, #026278);
	--_teal-l: var(--iw-teal-l, #2FB3C6);
	--_navy: var(--iw-navy, #10283C);
	--_line: var(--iw-line, rgba(3, 133, 154, .28));
	display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px;
	background: rgba(11, 29, 44, .7); border: 1px solid var(--_line); border-radius: 18px; padding: 34px;
	backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
	color: var(--iw-text, #C9D6E0); font-family: var(--iw-body-font, 'Roboto', sans-serif); box-sizing: border-box;
}
.iwl-form *, .iwl-form *::before, .iwl-form *::after { box-sizing: border-box; }
.iwl-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.iwl-full { grid-column: 1 / -1; }
.iwl-form label { font-size: .8rem; font-weight: 500; color: #fff; }
.iwl-form label span { color: var(--_teal-l); }
.iwl-form input, .iwl-form select, .iwl-form textarea {
	font: inherit; font-size: .93rem; color: #fff; width: 100%; margin: 0;
	background: rgba(16, 40, 60, .6); border: 1px solid rgba(201, 214, 224, .2); border-radius: 10px; padding: 12px 14px;
	transition: border-color .2s, box-shadow .2s;
}
.iwl-form input::placeholder, .iwl-form textarea::placeholder { color: rgba(201, 214, 224, .45); }
.iwl-form select {
	appearance: none; -webkit-appearance: none; padding-right: 36px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%232FB3C6' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 14px center;
}
.iwl-form select option, .iwl-form select optgroup { background: var(--_navy); color: #fff; }
.iwl-form textarea { min-height: 110px; resize: vertical; }
.iwl-form input:focus, .iwl-form select:focus, .iwl-form textarea:focus { outline: 0; border-color: var(--_teal); box-shadow: 0 0 0 3px rgba(3, 133, 154, .25); }
.iwl-field.has-error input, .iwl-field.has-error select, .iwl-field.has-error textarea { border-color: #F87171; }
.iwl-error { color: #FCA5A5; font-size: .78rem; }
.iwl-submit {
	grid-column: 1 / -1; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	font-family: var(--iw-head-font, 'Poppins', sans-serif); font-weight: 600; font-size: 1rem;
	background: var(--_teal); color: #fff; border: 0; border-radius: 12px; padding: 15px; cursor: pointer;
	box-shadow: 0 8px 24px -8px rgba(3, 133, 154, .7); transition: background .25s, transform .25s;
}
.iwl-submit:hover { background: var(--_teal-d); transform: translateY(-2px); }
.iwl-submit:disabled { opacity: .7; cursor: wait; transform: none; }
.iwl-submit svg { width: 18px; height: 18px; }
.iwl-status { margin: 0; font-size: .9rem; min-height: 0; }
.iwl-status:empty { display: none; }
.iwl-status.is-ok { color: #6EE7B7; background: rgba(16, 185, 129, .1); border: 1px solid rgba(16, 185, 129, .3); padding: 12px 14px; border-radius: 10px; }
.iwl-status.is-error { color: #FCA5A5; }
.iwl-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Popup (dialog) ---------- */
.iwl-modal { border: 0; padding: 0; background: transparent; max-width: 460px; width: calc(100% - 32px); overflow: visible; color: inherit; }
.iwl-modal::backdrop { background: rgba(5, 12, 20, .72); backdrop-filter: blur(4px); }
.iwl-modal[open] { animation: iwl-pop .3s cubic-bezier(.2, .8, .2, 1); }
@keyframes iwl-pop { from { opacity: 0; transform: translateY(16px) scale(.98); } }
.iwl-modal .iwl-form { grid-template-columns: 1fr; background: var(--iw-navy, #10283C); position: relative; padding: 30px 28px 26px; box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .7), 0 0 60px -20px rgba(3, 133, 154, .5); }
.iwl-modal-head { display: flex; gap: 16px; align-items: center; margin-bottom: 4px; padding-right: 26px; }
.iwl-modal-head h2 { font-family: var(--iw-head-font, 'Poppins', sans-serif); color: #fff; font-size: 1.2rem; margin: 0 0 4px; line-height: 1.2; }
.iwl-modal-head p { margin: 0; font-size: .88rem; line-height: 1.45; }
.iwl-modal-icon { flex: none; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: rgba(3, 133, 154, .16); border: 1px solid rgba(3, 133, 154, .45); color: var(--iw-teal-l, #2FB3C6); }
.iwl-modal-icon svg { width: 26px; height: 26px; }
.iwl-close { position: absolute; top: 12px; right: 14px; background: none; border: 0; color: rgba(255, 255, 255, .7); font-size: 1.8rem; line-height: 1; cursor: pointer; padding: 4px 8px; }
.iwl-close:hover { color: #fff; }
html.iwl-lock { overflow: hidden; }

/* ---------- Botón flotante y shortcode ---------- */
.iwl-fab {
	position: fixed; right: 22px; bottom: 22px; z-index: 60; width: 58px; height: 58px; border-radius: 50%;
	background: var(--iw-teal, #03859A); color: #fff; display: grid; place-items: center;
	box-shadow: 0 10px 30px -8px rgba(3, 133, 154, .9); transition: background .25s, transform .25s;
}
.iwl-fab:hover { background: var(--iw-teal-d, #026278); transform: scale(1.06); color: #fff; }
.iwl-fab svg { width: 28px; height: 28px; }
.iwl-wa-inline { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--iw-teal-l, #2FB3C6); text-decoration: none; }
.iwl-wa-inline svg { width: 18px; height: 18px; }

@media (max-width: 640px) {
	.iwl-form { grid-template-columns: 1fr; padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
	.iwl-modal[open] { animation: none; }
}
