/* D'Shop — tarjetas de regalo: compra, uso en el pago y Mi cuenta. */

/* Compra */
.regalo { max-width: 1100px; margin: 0 auto; padding: var(--space-6) 16px var(--space-10); }
.regalo__cuerpo { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; align-items: start; }
.regalo__form, .regalo__info { display: grid; gap: 18px; }
.regalo__form h2, .regalo__info h2 { margin: 0; font-family: var(--font-display); font-size: 34px; font-weight: 700; line-height: 1.05; }
.regalo__info h3 { margin: 6px 0 0; font-size: 16px; }
.regalo__form .ds-field { max-width: none; }
.regalo__montos { border: 0; margin: 0; padding: 0; display: grid; gap: 12px; }
.regalo__sugeridos { display: flex; flex-wrap: wrap; gap: 8px; }
.regalo__monto { height: 44px; padding: 0 18px; font: 600 16px var(--font-sans); color: var(--morado); background: var(--fondo); border: 1px solid var(--morado); border-radius: var(--radius-full); cursor: pointer; }
.regalo__monto:hover { background: var(--lavanda-claro); }
.regalo__monto:focus-visible { outline: 2px solid transparent; box-shadow: var(--focus-ring); }
.regalo__mensaje { height: auto; padding: 10px 14px; resize: vertical; }
.regalo__nota { margin: 0; font-size: 14px; color: var(--tinta-suave); }
.regalo__info { padding: 28px; background: var(--fondo-suave); border-radius: var(--radius-md); }
.regalo__info ol, .regalo__info ul { margin: 0; padding-left: 20px; display: grid; gap: 8px; }
.regalo .suave { color: var(--tinta-suave); font-weight: 400; }
.regalo__avisos { margin-bottom: var(--space-4); }
@media (max-width: 800px) {
	.regalo__cuerpo { grid-template-columns: 1fr; gap: 28px; }
	.regalo__form h2, .regalo__info h2 { font-size: 28px; }
}

/* Avisos (sin descuentos) */
.regalo-aviso { margin: 0 0 var(--space-4); padding: 14px var(--space-4); background: #fff4cc; border-radius: var(--radius-md); color: var(--tinta); font-weight: 500; max-width: none; }

/* Pago: usar el saldo */
.regalo-pago { margin: 0 0 var(--space-4); padding: var(--space-4); background: var(--fondo-suave); border-radius: var(--radius-md); display: grid; gap: 10px; }
.regalo-pago h3 { margin: 0; font-size: 16px; }
.regalo-pago p { margin: 0; font-size: 14px; }
.regalo-pago__fila { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.regalo-pago__fila .ds-input { flex: 1 1 140px; max-width: 200px; }
.regalo-pago__ok { color: var(--exito); font-weight: 600; }
.regalo-pago__error { color: var(--error); font-weight: 600; min-height: 0; }
.regalo-pago__error:empty { display: none; }

/* Mi cuenta */
.regalo-resumen { display: flex; flex-direction: column; gap: 4px; padding: 20px 24px; background: var(--morado); color: var(--sobre-morado); border-radius: var(--radius-md); max-width: 360px; }
.regalo-resumen span { font-size: 14px; letter-spacing: .06em; text-transform: uppercase; }
.regalo-resumen strong { font-family: var(--font-display); font-size: 40px; line-height: 1; }
.regalo-canje { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.regalo-canje .ds-field { flex: 1 1 260px; max-width: 360px; }
.regalo-tarjeta { display: grid; gap: 14px; padding: 20px; border: 1px solid var(--linea); border-radius: var(--radius-md); background: var(--fondo); }
.regalo-tarjeta__cabecera { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.regalo-tarjeta__codigo { font: 700 20px ui-monospace, Menlo, Consolas, monospace; letter-spacing: .06em; color: var(--morado-profundo); }
.regalo-tarjeta__estado { padding: 4px 12px; font-size: 13px; font-weight: 600; border-radius: var(--radius-full); background: var(--lavanda-claro); color: var(--morado); }
.regalo-tarjeta--activa .regalo-tarjeta__estado { background: #dff3e8; color: #14633c; }
.regalo-tarjeta--vencida .regalo-tarjeta__estado, .regalo-tarjeta--anulada .regalo-tarjeta__estado, .regalo-tarjeta--agotada .regalo-tarjeta__estado { background: #eceaee; color: #4d4155; }
.regalo-tarjeta__datos { display: flex; flex-wrap: wrap; gap: 8px 32px; margin: 0; }
.regalo-tarjeta__datos div { display: grid; gap: 2px; }
.regalo-tarjeta__datos dt { font-size: 13px; color: var(--tinta-suave); }
.regalo-tarjeta__datos dd { margin: 0; }
.regalo-tarjeta__mensaje { margin: 0; padding: 10px 14px; border-left: 4px solid var(--morado); background: var(--fondo-suave); font-style: italic; }
.regalo-tarjeta__historial summary { cursor: pointer; font-weight: 600; color: var(--morado); }
.regalo-tarjeta__historial table { width: 100%; margin-top: 10px; border-collapse: collapse; font-size: 14px; }
.regalo-tarjeta__historial th, .regalo-tarjeta__historial td { padding: 8px 6px; text-align: left; border-bottom: 1px solid var(--linea); }
.regalo-nota { margin: 0; font-size: 14px; color: var(--tinta-suave); }

/* La página de compra usa todo el ancho (las demás páginas de texto son angostas). */
.pagina__contenido:has(.regalo) { max-width: 1100px; }
.regalo__foto { width: 100%; max-width: 320px; height: auto; margin: 0 auto; border-radius: var(--radius-md); display: block; }