/**
 * Widget de reserva — estilos aislados de Divi (todo bajo .dmr-widget, prefijo .dmr-).
 * Estética: tarjeta limpia, acento rojo marca, chips y wizard tipo aerolínea.
 */

.dmr-widget {
	--dmr-primary: #b4231f;
	--dmr-primary-dark: #8f1b18;
	--dmr-ink: #1f2430;
	--dmr-muted: #6b7280;
	--dmr-line: #e5e7eb;
	--dmr-bg: #ffffff;
	--dmr-ok: #0e8a4c;
	--dmr-radius: 14px;
	font-size: 16px;
	line-height: 1.5;
	color: var(--dmr-ink);
	max-width: 560px;
	margin: 0 auto;
}

.dmr-widget *, .dmr-widget *::before, .dmr-widget *::after { box-sizing: border-box; }

.dmr-card {
	background: var(--dmr-bg);
	border: 1px solid var(--dmr-line);
	border-radius: var(--dmr-radius);
	box-shadow: 0 10px 30px rgba(31, 36, 48, .08);
	padding: 28px;
}

/* ---------- pasos ---------- */
.dmr-steps { display: flex; align-items: center; margin-bottom: 24px; }
.dmr-step {
	display: flex; align-items: center; gap: 8px;
	font-size: 13px; font-weight: 600; color: var(--dmr-muted); white-space: nowrap;
}
.dmr-step-n {
	display: inline-flex; align-items: center; justify-content: center;
	width: 26px; height: 26px; border-radius: 50%;
	background: #eef0f3; color: var(--dmr-muted); font-size: 13px;
}
.dmr-step.is-active { color: var(--dmr-ink); }
.dmr-step.is-active .dmr-step-n { background: var(--dmr-primary); color: #fff; }
.dmr-step.is-done .dmr-step-n { background: var(--dmr-ok); color: #fff; }
.dmr-step-line { flex: 1; height: 2px; background: var(--dmr-line); margin: 0 10px; }

/* ---------- campos ---------- */
.dmr-field { margin-bottom: 18px; }
.dmr-field label {
	display: block; font-size: 13px; font-weight: 600;
	letter-spacing: .02em; margin-bottom: 6px; color: var(--dmr-ink);
}
.dmr-widget input[type="text"],
.dmr-widget input[type="email"],
.dmr-widget input[type="tel"],
.dmr-widget input[type="date"],
.dmr-widget input[type="time"],
.dmr-widget select,
.dmr-widget textarea {
	width: 100%; padding: 12px 14px;
	border: 1.5px solid var(--dmr-line); border-radius: 10px;
	font-size: 16px; color: var(--dmr-ink); background: #fff;
	transition: border-color .15s ease;
}
.dmr-widget input:focus, .dmr-widget select:focus, .dmr-widget textarea:focus {
	outline: none; border-color: var(--dmr-primary);
	box-shadow: 0 0 0 3px rgba(180, 35, 31, .12);
}
.dmr-row { display: flex; gap: 16px; }
.dmr-row .dmr-field { flex: 1; }
.dmr-hint { display: block; margin-top: 5px; font-size: 12.5px; color: var(--dmr-muted); }

/* ---------- chips (horarios / duración) ---------- */
.dmr-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.dmr-chip {
	padding: 10px 18px; border: 1.5px solid var(--dmr-line); border-radius: 999px;
	background: #fff; font-size: 15px; font-weight: 600; color: var(--dmr-ink);
	cursor: pointer; transition: all .15s ease;
}
.dmr-chip:hover { border-color: var(--dmr-primary); }
.dmr-chip.is-on { background: var(--dmr-primary); border-color: var(--dmr-primary); color: #fff; }

/* ---------- stepper personas ---------- */
.dmr-stepper {
	display: inline-flex; align-items: center; gap: 0;
	border: 1.5px solid var(--dmr-line); border-radius: 10px; overflow: hidden;
}
.dmr-stepper button {
	width: 44px; height: 46px; border: none; background: #f6f7f9;
	font-size: 20px; cursor: pointer; color: var(--dmr-ink);
}
.dmr-stepper button:hover { background: #eceef1; }
.dmr-stepper span { min-width: 52px; text-align: center; font-weight: 700; font-size: 17px; }

/* ---------- extras / encuentro ---------- */
.dmr-extra {
	display: flex; align-items: center; gap: 10px; padding: 12px 14px;
	border: 1.5px dashed var(--dmr-line); border-radius: 10px;
	margin-bottom: 18px; font-size: 15px; cursor: pointer;
}
.dmr-extra-precio {
	margin-left: auto; font-weight: 700; color: var(--dmr-primary); white-space: nowrap;
}
.dmr-meeting {
	font-size: 14px; color: var(--dmr-muted);
	background: #f6f7f9; border-radius: 10px; padding: 10px 14px; margin: 0 0 18px;
}

/* ---------- navegación ---------- */
.dmr-nav { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; }
.dmr-btn {
	background: var(--dmr-primary); color: #fff; border: none;
	padding: 14px 28px; border-radius: 10px;
	font-size: 16px; font-weight: 700; cursor: pointer;
	transition: background .15s ease, transform .1s ease;
}
.dmr-btn:hover { background: var(--dmr-primary-dark); }
.dmr-btn:active { transform: scale(.98); }
.dmr-btn:disabled { background: #cfd3d9; cursor: not-allowed; }
.dmr-btn-link {
	background: none; border: none; color: var(--dmr-muted);
	font-size: 15px; cursor: pointer; padding: 14px 6px;
}
.dmr-btn-link:hover { color: var(--dmr-ink); }

/* ---------- calendario desplegable ---------- */
.dmr-date-btn {
	width: 100%; text-align: left; padding: 12px 14px;
	border: 1.5px solid var(--dmr-line); border-radius: 10px;
	background: #fff; font-size: 16px; color: var(--dmr-ink); cursor: pointer;
}
.dmr-date-btn:hover { border-color: var(--dmr-primary); }
.dmr-cal {
	margin-top: 8px; padding: 14px;
	border: 1.5px solid var(--dmr-line); border-radius: 12px;
	background: #fff; box-shadow: 0 8px 24px rgba(31, 36, 48, .10);
}
.dmr-cal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.dmr-cal-head span { font-weight: 700; font-size: 15px; }
.dmr-cal-head button {
	width: 34px; height: 34px; border: 1.5px solid var(--dmr-line); border-radius: 8px;
	background: #fff; font-size: 18px; cursor: pointer; color: var(--dmr-ink);
}
.dmr-cal-head button:disabled { opacity: .3; cursor: default; }
.dmr-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.dmr-cal-dow { text-align: center; font-size: 12px; font-weight: 700; color: var(--dmr-muted); padding: 4px 0; }
.dmr-cal-day {
	aspect-ratio: 1; border: none; border-radius: 8px; background: #f6f7f9;
	font-size: 14px; font-weight: 600; color: var(--dmr-ink); cursor: pointer;
}
.dmr-cal-day:hover:not(:disabled) { background: var(--dmr-primary); color: #fff; }
.dmr-cal-day:disabled { background: transparent; color: #c9ced6; cursor: default; text-decoration: line-through; }
.dmr-cal-day.is-sel { background: var(--dmr-primary); color: #fff; }

/* ---------- cupón a mano ---------- */
.dmr-promo-row { display: flex; gap: 8px; }
.dmr-promo-row input { flex: 1; text-transform: uppercase; }
.dmr-btn-sec {
	background: #fff; border: 1.5px solid var(--dmr-primary); color: var(--dmr-primary);
	padding: 0 20px; border-radius: 10px; font-size: 15px; font-weight: 700; cursor: pointer;
}
.dmr-btn-sec:hover { background: var(--dmr-primary); color: #fff; }
.dmr-promo-ok { display: block; margin-top: 5px; font-size: 13px; font-weight: 700; color: var(--dmr-ok); }
.dmr-promo-bad { display: block; margin-top: 5px; font-size: 13px; font-weight: 600; color: #b32d2e; }

/* ---------- barra de precio en vivo ---------- */
.dmr-pricebar {
	display: flex; justify-content: space-between; align-items: center; gap: 10px;
	margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--dmr-line);
	font-size: 15px;
}
.dmr-pricebar strong { font-size: 20px; color: var(--dmr-primary); }
.dmr-pricebar s { color: var(--dmr-muted); font-weight: 400; margin-right: 4px; }
.dmr-promo-tag {
	background: #eafaf1; color: var(--dmr-ok);
	font-size: 12.5px; font-weight: 700; padding: 4px 10px; border-radius: 999px;
}

/* ---------- resumen (paso 3) ---------- */
.dmr-summary {
	background: #f9fafb; border: 1px solid var(--dmr-line);
	border-radius: 12px; padding: 18px 20px; margin-bottom: 18px;
}
.dmr-summary h4 { margin: 0 0 10px; font-size: 17px; }
.dmr-summary ul { list-style: none; margin: 0; padding: 0; font-size: 14.5px; }
.dmr-summary li { padding: 3px 0; }
.dmr-line { display: flex; justify-content: space-between; gap: 12px; }
.dmr-disc { color: var(--dmr-ok); font-weight: 600; }
.dmr-total {
	border-top: 1px solid var(--dmr-line); margin-top: 8px; padding-top: 10px !important;
	font-weight: 800; font-size: 17px;
}
.dmr-auth-note {
	font-size: 13.5px; color: var(--dmr-muted);
	background: #fff8e6; border-radius: 10px; padding: 10px 14px; margin: 0 0 16px;
}
.dmr-consent {
	display: flex; gap: 10px; align-items: flex-start;
	font-size: 13.5px; color: var(--dmr-ink); margin-bottom: 18px; cursor: pointer;
}
.dmr-consent input { margin-top: 3px; }
.dmr-consent a { color: var(--dmr-primary); text-decoration: underline; }
.dmr-payment { margin-bottom: 18px; min-height: 0; }

/* ---------- estados ---------- */
.dmr-error {
	color: #b32d2e; background: #fdeeee; border-radius: 10px;
	padding: 10px 14px; font-size: 14px; margin: 0 0 14px;
}
.dmr-loading { text-align: center; color: var(--dmr-muted); padding: 30px 0; }
.dmr-success { text-align: center; padding: 44px 28px; }
.dmr-success-icon {
	width: 64px; height: 64px; margin: 0 auto 16px;
	border-radius: 50%; background: var(--dmr-ok); color: #fff;
	font-size: 34px; line-height: 64px;
}
.dmr-success h3 { margin: 0 0 10px; font-size: 22px; }
.dmr-success p { color: var(--dmr-muted); font-size: 15px; margin: 0; }

/* ---------- responsive ---------- */
@media (max-width: 520px) {
	.dmr-card { padding: 20px 16px; border-radius: 12px; }
	.dmr-row { flex-direction: column; gap: 0; }
	.dmr-step { font-size: 0; gap: 0; } /* solo círculos en móvil */
	.dmr-step .dmr-step-n { font-size: 13px; }
	.dmr-nav { flex-direction: column-reverse; gap: 8px; }
	.dmr-nav .dmr-btn { width: 100%; }
}
