/* WooCommerce Gift Cards Pro – formulario de compra */
.wgcp-form {
	--wgcp-accent: #7f54b3;
	--wgcp-accent-contrast: #ffffff;
	--wgcp-text: inherit;
	--wgcp-muted: #6b6b6b;
	--wgcp-border: #d9d4ce;
	--wgcp-surface: #ffffff;
	--wgcp-surface-alt: #f7f5f2;
	--wgcp-error: #b32d2e;
	--wgcp-radius: 10px;
	--wgcp-gap: 24px;
	color: var(--wgcp-text);
	margin: 0 0 2em;
	box-sizing: border-box;
}
.wgcp-form *,
.wgcp-form *::before,
.wgcp-form *::after { box-sizing: border-box; }
.wgcp-form [hidden] { display: none !important; }

.wgcp-grid { display: grid; gap: var(--wgcp-gap); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 880px) {
	.wgcp-layout-columns .wgcp-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
	.wgcp-preview-sticky { position: sticky; top: 24px; }
}
.wgcp-title { margin: 0 0 .6em; }

/* Vista previa */
.wgcp-preview-label { margin: 0 0 .5em; font-size: .85em; text-transform: uppercase; letter-spacing: .08em; color: var(--wgcp-muted); }
.wgcp-card {
	position: relative;
	width: 100%;
	aspect-ratio: var(--wgcp-ratio, 1.6);
	border-radius: var(--wgcp-radius);
	background-color: #333;
	background-size: cover;
	background-position: center;
	overflow: hidden;
	box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .45), 0 2px 6px rgba(0, 0, 0, .08);
	container-type: inline-size;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	transition: background-image .25s ease;
}
.wgcp-card.wgcp-font-serif { font-family: Georgia, "Times New Roman", serif; }
.wgcp-card-overlay { position: absolute; inset: 0; pointer-events: none; }
.wgcp-el {
	position: absolute;
	line-height: 1.25;
	font-size: calc(var(--wgcp-size, 3) * 1cqw);
	overflow-wrap: anywhere;
	white-space: normal;
	text-shadow: 0 1px 2px rgba(0, 0, 0, .25);
}
.wgcp-el-value { white-space: pre-line; }
.wgcp-el-label:empty { display: none; }
.wgcp-el-label { margin-right: .3em; opacity: .9; }
.wgcp-style-bold { font-weight: 700; }
.wgcp-style-italic { font-style: italic; }
.wgcp-style-mono { font-family: "DejaVu Sans Mono", Menlo, Consolas, monospace; letter-spacing: .06em; }
.wgcp-el-message .wgcp-el-value { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
.wgcp-preview-note { margin: .6em 0 0; font-size: .85em; color: var(--wgcp-muted); }
.wgcp-btn-link { background: none; border: 0; padding: 0; margin-top: .4em; color: var(--wgcp-accent); text-decoration: underline; cursor: pointer; font: inherit; }
.wgcp-btn-link:focus-visible { outline: 2px solid var(--wgcp-accent); outline-offset: 2px; }

/* Bloques */
.wgcp-fieldset { border: 0; padding: 0; margin: 0 0 var(--wgcp-gap); min-width: 0; }
.wgcp-legend { font-weight: 600; font-size: 1.05em; margin: 0 0 .6em; padding: 0; }
.wgcp-required { color: var(--wgcp-error); margin-left: .15em; }
.wgcp-optional { font-weight: 400; color: var(--wgcp-muted); font-size: .9em; }
.wgcp-help { margin: .35em 0 0; font-size: .85em; color: var(--wgcp-muted); }
.wgcp-error { margin: .35em 0 0; font-size: .875em; color: var(--wgcp-error); font-weight: 600; }
.wgcp-error:empty { display: none; }

/* Importes */
.wgcp-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.wgcp-chip { position: relative; cursor: pointer; margin: 0; }
.wgcp-chip input,
.wgcp-design input,
.wgcp-delivery-option input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.wgcp-chip span {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 84px; padding: .7em 1.1em;
	border: 1.5px solid var(--wgcp-border); border-radius: 999px;
	background: var(--wgcp-surface); font-weight: 600;
	transition: border-color .15s, background-color .15s, color .15s, box-shadow .15s;
}
.wgcp-chip:hover span { border-color: var(--wgcp-accent); }
.wgcp-chip input:checked + span { background: var(--wgcp-accent); border-color: var(--wgcp-accent); color: var(--wgcp-accent-contrast); }
.wgcp-chip input:focus-visible + span,
.wgcp-design input:focus-visible + .wgcp-design-thumb,
.wgcp-delivery-option input:focus-visible + .wgcp-delivery-body { outline: 3px solid var(--wgcp-accent); outline-offset: 2px; }
.wgcp-custom-amount { margin-top: 12px; max-width: 260px; }
.wgcp-custom-amount label { display: block; font-size: .9em; margin-bottom: .3em; }
.wgcp-input-money { position: relative; }
.wgcp-input-money input { padding-right: 2.2em !important; }
.wgcp-currency { position: absolute; right: .9em; top: 50%; transform: translateY(-50%); color: var(--wgcp-muted); pointer-events: none; }

/* Diseños */
.wgcp-design-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 12px; }
.wgcp-design { position: relative; cursor: pointer; margin: 0; display: block; text-align: center; }
.wgcp-design-thumb { display: block; border-radius: calc(var(--wgcp-radius) * .7); overflow: hidden; border: 2px solid transparent; aspect-ratio: 1.6; background: var(--wgcp-surface-alt); transition: border-color .15s, transform .15s; }
.wgcp-design-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wgcp-design:hover .wgcp-design-thumb { transform: translateY(-2px); }
.wgcp-design input:checked + .wgcp-design-thumb { border-color: var(--wgcp-accent); box-shadow: 0 0 0 2px var(--wgcp-accent); }
.wgcp-design-name { display: block; font-size: .85em; margin-top: .35em; }

/* Entrega */
.wgcp-delivery-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.wgcp-delivery-option { position: relative; cursor: pointer; margin: 0; }
.wgcp-delivery-body { display: block; height: 100%; padding: 14px 16px 14px 44px; border: 1.5px solid var(--wgcp-border); border-radius: var(--wgcp-radius); background: var(--wgcp-surface); transition: border-color .15s, background-color .15s; position: relative; }
.wgcp-delivery-body::before { content: ""; position: absolute; left: 16px; top: 16px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--wgcp-border); background: #fff; }
.wgcp-delivery-option input:checked + .wgcp-delivery-body { border-color: var(--wgcp-accent); background: var(--wgcp-surface-alt); }
.wgcp-delivery-option input:checked + .wgcp-delivery-body::before { border-color: var(--wgcp-accent); box-shadow: inset 0 0 0 4px #fff; background: var(--wgcp-accent); }
.wgcp-delivery-body strong { display: block; }
.wgcp-delivery-body small { display: block; color: var(--wgcp-muted); margin-top: .25em; line-height: 1.4; }

/* Cuándo enviar */
.wgcp-send-when { margin-top: 14px; padding: 14px 16px; border-radius: var(--wgcp-radius); background: var(--wgcp-surface-alt); }
.wgcp-sublegend { margin: 0 0 .5em; font-weight: 600; }
.wgcp-segmented { display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 4px; border-radius: 999px; background: var(--wgcp-surface); border: 1.5px solid var(--wgcp-border); }
.wgcp-segment { position: relative; margin: 0; cursor: pointer; }
.wgcp-segment input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.wgcp-segment span { display: inline-block; padding: .55em 1.1em; border-radius: 999px; font-weight: 600; transition: background-color .15s, color .15s; }
.wgcp-segment input:checked + span { background: var(--wgcp-accent); color: var(--wgcp-accent-contrast); }
.wgcp-segment input:focus-visible + span { outline: 3px solid var(--wgcp-accent); outline-offset: 2px; }
.wgcp-schedule { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 12px; align-items: flex-end; }
.wgcp-schedule-field { display: flex; flex-direction: column; gap: .3em; flex: 1 1 160px; }
.wgcp-schedule-field label { font-size: .9em; font-weight: 500; }
.wgcp-schedule .wgcp-help { flex-basis: 100%; margin: 0; }
.wgcp-form input[type="date"], .wgcp-form input[type="time"] { width: 100%; padding: .7em .9em; border: 1.5px solid var(--wgcp-border); border-radius: calc(var(--wgcp-radius) * .6); background: var(--wgcp-surface); font: inherit; color: inherit; }
.wgcp-form .wgcp-invalid input[type="date"], .wgcp-form .wgcp-invalid input[type="time"] { border-color: var(--wgcp-error); }

/* Campos */
.wgcp-row { margin-bottom: 16px; }
.wgcp-row > label { display: block; font-weight: 500; margin-bottom: .35em; }
.wgcp-form input[type="text"],
.wgcp-form input[type="email"],
.wgcp-form textarea {
	width: 100%; padding: .75em .9em; border: 1.5px solid var(--wgcp-border); border-radius: calc(var(--wgcp-radius) * .6);
	background: var(--wgcp-surface); font: inherit; color: inherit; line-height: 1.4;
}
.wgcp-form input:focus,
.wgcp-form textarea:focus { outline: none; border-color: var(--wgcp-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--wgcp-accent) 20%, transparent); }
.wgcp-form .wgcp-invalid input,
.wgcp-form .wgcp-invalid textarea,
.wgcp-form [aria-invalid="true"] { border-color: var(--wgcp-error) !important; }
.wgcp-counter { text-align: right; }

/* Resumen y botón */
.wgcp-summary { background: var(--wgcp-surface-alt); border-radius: var(--wgcp-radius); padding: 14px 18px; margin-bottom: 16px; }
.wgcp-summary-title { margin: 0 0 .4em; font-weight: 600; }
.wgcp-summary dl { display: grid; grid-template-columns: auto 1fr; gap: .25em 1em; margin: 0; font-size: .95em; }
.wgcp-summary dt { color: var(--wgcp-muted); margin: 0; }
.wgcp-summary dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }
.wgcp-messages:empty { display: none; }
.wgcp-messages { margin-bottom: 12px; padding: 12px 14px; border-radius: calc(var(--wgcp-radius) * .6); }
.wgcp-messages.is-error { background: #fbeaea; color: var(--wgcp-error); }
.wgcp-messages.is-success { background: #e9f6ec; color: #1e6b34; }
.wgcp-messages a { color: inherit; font-weight: 700; }
.wgcp-form .wgcp-submit { width: 100%; padding: 1em 1.4em; font-size: 1.05em; border-radius: calc(var(--wgcp-radius) * .6); background: var(--wgcp-accent); color: var(--wgcp-accent-contrast); border: 0; cursor: pointer; }
.wgcp-form .wgcp-submit:hover { filter: brightness(1.07); }
.wgcp-form .wgcp-submit[disabled] { opacity: .6; cursor: progress; }
.wgcp-notice { padding: 12px 16px; border-left: 4px solid #dba617; background: #fcf9e8; }
.wgcp-form .screen-reader-text { position: absolute !important; clip: rect(1px, 1px, 1px, 1px); width: 1px; height: 1px; overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
	.wgcp-form * { transition: none !important; }
}
