/* DyL Consultas — formulario y botón flotante. Usa las variables del tema si existen. */

.dyl-lead-form { --f-gold: var(--dyl-gold, #c9a45c); --f-ink: var(--dyl-ink, #0e1a2b); --f-line: var(--dyl-line, #e6e1d6); --f-muted: var(--dyl-muted, #5b6475); color: var(--dyl-text, #1b2230); font-size: 15.5px; }
.dyl-lead-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; }
.dyl-field { margin: 0; display: flex; flex-direction: column; gap: 6px; position: relative; }
.dyl-field--full { grid-column: 1 / -1; }
.dyl-field label { font-size: 13px; font-weight: 700; letter-spacing: .02em; color: var(--f-ink); }
.dyl-field label span, .dyl-req { color: #c0392b; }
.dyl-field input, .dyl-field select, .dyl-field textarea {
	width: 100%; padding: 13px 14px; font: inherit; font-size: 15.5px; color: inherit;
	background: #fbfaf7; border: 1px solid var(--f-line); border-radius: 6px;
	transition: border-color .25s, box-shadow .25s, background .25s;
}
.dyl-field select { appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, #888 50%), linear-gradient(135deg, #888 50%, transparent 50%); background-position: calc(100% - 18px) 55%, calc(100% - 13px) 55%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 36px; }
.dyl-field textarea { resize: vertical; min-height: 110px; }
.dyl-field input:focus, .dyl-field select:focus, .dyl-field textarea:focus { outline: none; border-color: var(--f-gold); background: #fff; box-shadow: 0 0 0 4px rgba(var(--dyl-gold-rgb, 201, 164, 92), .18); }
.has-error input, .has-error select, .has-error textarea { border-color: #c0392b; background: #fff7f6; }
.dyl-field__err { color: #c0392b; font-size: 12.5px; font-weight: 600; }

.dyl-check { display: flex; gap: 10px; align-items: flex-start; margin-top: 16px; font-size: 13.5px; line-height: 1.5; color: var(--f-muted); cursor: pointer; flex-wrap: wrap; }
.dyl-check input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--f-ink); flex: none; }
.dyl-check > span { flex: 1; min-width: 0; }
.dyl-check a { color: var(--f-ink); font-weight: 700; }
.dyl-check--urgent { background: #fff6e8; border: 1px dashed #e0b25c; padding: 10px 12px; border-radius: 6px; color: #7a5210; font-weight: 600; }
.dyl-check.has-error { color: #c0392b; }
.dyl-check .dyl-field__err { flex-basis: 100%; }

.dyl-lead-form__submit { margin-top: 22px; width: 100%; justify-content: center; }
.dyl-lead-form__submit[disabled] { opacity: .7; cursor: progress; }
.dyl-lead-form:not(:has(.dyl-btn--primary)) .dyl-lead-form__submit { background: var(--f-gold); color: var(--f-ink); border: 0; padding: 15px; font-weight: 700; border-radius: 6px; }
.dyl-lead-form__note { margin: 14px 0 0; font-size: 12.5px; color: var(--f-muted); text-align: center; }
.dyl-lead-form__hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.dyl-lead-form__msg { padding: 16px 18px; border-radius: 8px; margin-bottom: 16px; font-weight: 600; }
.dyl-lead-form__msg.is-success { background: #eaf7ee; color: #145a2c; border: 1px solid #b7e2c4; }
.dyl-lead-form__msg.is-error { background: #fdeceb; color: #8e2a20; border: 1px solid #f3c1bb; }
.dyl-lead-form__live:empty { display: none; }
.dyl-lead-form__live { margin: 14px 0 0; }

@media (max-width: 640px) {
	.dyl-lead-form__grid { grid-template-columns: 1fr; }
}

/* ---------- Botón flotante ---------- */
.dyl-float { position: fixed; bottom: 22px; z-index: 90; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.dyl-float--right { right: 22px; }
.dyl-float--left { left: 22px; align-items: flex-start; }
.dyl-float__btn { position: relative; width: 60px; height: 60px; border-radius: 50%; display: grid; place-items: center; color: #fff; box-shadow: 0 12px 28px -8px rgba(0, 0, 0, .45); transition: transform .3s cubic-bezier(.2, .7, .2, 1); text-decoration: none; }
.dyl-float__btn:hover { transform: scale(1.08); color: #fff; }
.dyl-float__btn svg { width: 30px; height: 30px; }
.dyl-float__btn--wa { background: #25d366; }
.dyl-float__btn--wa::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #25d366; animation: dyl-float-ring 2.2s ease-out infinite; }
.dyl-float__btn--call { display: none; width: 50px; height: 50px; background: var(--dyl-ink, #0e1a2b); color: var(--dyl-gold, #c9a45c); }
.dyl-float__btn--call svg { width: 22px; height: 22px; }
.dyl-float__badge { position: absolute; top: -4px; right: -6px; background: var(--dyl-ink, #0e1a2b); color: var(--dyl-gold, #c9a45c); font: 700 10px/1 system-ui, sans-serif; padding: 4px 6px; border-radius: 10px; border: 1.5px solid #fff; }
@keyframes dyl-float-ring { from { transform: scale(1); opacity: .8; } to { transform: scale(1.6); opacity: 0; } }

.dyl-float__bubble { position: relative; max-width: 260px; background: #fff; color: #1b2230; padding: 14px 34px 14px 16px; border-radius: 14px; box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .35); font-size: 14px; line-height: 1.45; opacity: 0; transform: translateY(10px) scale(.96); transition: .35s cubic-bezier(.2, .7, .2, 1); }
.dyl-float__bubble.is-in { opacity: 1; transform: none; }
.dyl-float__bubble p { margin: 0; }
.dyl-float__bubble::after { content: ""; position: absolute; bottom: -7px; right: 24px; width: 14px; height: 14px; background: #fff; transform: rotate(45deg); }
.dyl-float--left .dyl-float__bubble::after { right: auto; left: 24px; }
.dyl-float__close { position: absolute; top: 4px; right: 6px; width: 26px; height: 26px; border: 0; background: transparent; font-size: 20px; line-height: 1; color: #888; cursor: pointer; }

@media (max-width: 768px) {
	.dyl-float__btn--call { display: grid; border: 1px solid var(--dyl-gold, #c9a45c); }
}

@media (max-width: 640px) {
	.dyl-float__bubble { display: none; }
	.dyl-float { bottom: 16px; }
	.dyl-float--right { right: 16px; }
	.dyl-float--left { left: 16px; }
}

@media (prefers-reduced-motion: reduce) {
	.dyl-float__btn--wa::before { animation: none; }
}