/* ===== SRP Commerce Suite — Step checkout (v1.2.3) =====
   v1.2.3 (S2): migrado de <style> inline a asset encolado (solo checkout).
   R1: candado del botón pagar por clase .srp-place-locked (un <button disabled>
   no despacha clicks: el popup explicativo nunca se abría). R2: overlay AJAX
   oscuro. R3: scroll-margin + reduced-motion (JS). R4: progreso sticky móvil.
   R5: :hover solo en dispositivos con hover. R6: focus-visible. R7: paso de
   pago usable a 320px. R8: gutter del contenedor. R9: select2 prefijo, alturas
   y accent-color. R10: tokens unificados (hairlines rgba, radius 10, cupón con
   acento border-top como el skin). */

/* D7: layout de página (se imprime tras el skin y gana). */
body.woocommerce-checkout { background:#0a0a0a; }
/* F6 (v1.2.2): cabecera de página sobre los pasos (mono/uppercase discreto). */
.srp-checkout-heading { max-width:760px; margin:0 auto 18px; display:flex; flex-direction:column; gap:4px; }
.srp-checkout-heading-title { color:#fff; font-size:22px; font-weight:700; line-height:1.2; }
.srp-checkout-heading-sub { font-family:'Share Tech Mono',monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:#FF6D00; }
/* R8: gutter lateral de 12px en pantallas estrechas (nunca pega a los bordes). */
.srp-checkout-heading, #srp-steps, #srp-step-account { width:calc(100% - 24px); max-width:760px; box-sizing:border-box; }
/* DIS-1 (v1.4.0): SIN overflow:hidden — creaba un contexto de recorte que
   anulaba el position:sticky de .srp-progress. Las esquinas redondeadas se
   mantienen redondeando directamente progreso/cabeceras. */
#srp-steps, #srp-step-account { background:#0a0a0a; color:#fff; border:1px solid rgba(255,255,255,.08); border-radius:12px; margin-bottom:24px; margin-left:auto; margin-right:auto; }
/* Esquinas del contenedor sin overflow:hidden: las pintan cabecera y cuerpo. */
#srp-steps > .srp-step:first-of-type > .srp-step-head, #srp-step-account > .srp-step-head { border-top-left-radius:11px; border-top-right-radius:11px; }
#srp-steps > .srp-step:last-of-type > .srp-step-head, #srp-step-account > .srp-step-body { border-bottom-left-radius:11px; border-bottom-right-radius:11px; }
#srp-steps > .srp-step:last-of-type.srp-step-active > .srp-step-head { border-bottom-left-radius:0; border-bottom-right-radius:0; }
#srp-steps #order_review, #srp-steps #order_review_heading { background:#0a0a0a; color:#fff; }
/* D6: heading normalizado + nota de confianza. */
#srp-steps #order_review_heading { font-family:inherit !important; font-size:15px; font-weight:700; letter-spacing:0; text-transform:none; color:#fff; border-bottom:1px solid rgba(255,255,255,.08); padding-bottom:10px; }
.srp-secure-note { margin:12px 0 0; font-size:12px; color:#8c8c8c; text-align:center; }

/* R2: overlay AJAX de Woo (blockUI) en oscuro, spinner con acento naranja. */
body.woocommerce-checkout .blockUI.blockOverlay { background-color:rgba(10,10,10,.55) !important; }
body.woocommerce-checkout .blockUI.blockOverlay::before { border-top-color:#FF6D00 !important; }
body.woocommerce-checkout .blockUI.blockMsg { background:#141419 !important; color:#F5F5F7 !important; border:1px solid #262626 !important; border-radius:12px !important; }

/* D1 + DIS-2 (v1.4.0): barra de progreso global. El PHP la imprime como shell
   propio ANTES del paso 1 (fuera del form) → tarjeta independiente. Si el JS
   crea el fallback dentro de #srp-steps, queda integrada en el contenedor. */
.srp-progress { padding:14px 18px 12px; background:#111; border:1px solid rgba(255,255,255,.08); border-radius:12px; width:calc(100% - 24px); max-width:760px; box-sizing:border-box; margin:0 auto 18px; }
#srp-steps > .srp-progress { width:auto; max-width:none; margin:0; border:none; border-bottom:1px solid rgba(255,255,255,.08); border-radius:11px 11px 0 0; }
.srp-progress-text { display:block; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#a8a8a8; margin-bottom:8px; }
.srp-progress-track { display:block; height:4px; background:#262626; border-radius:2px; overflow:hidden; }
.srp-progress-bar { display:block; height:100%; width:0; background:linear-gradient(90deg,#FF6D00,#ffa04d); border-radius:2px; transition:width .4s ease; }
/* R4 + DIS-1: barra de progreso sticky en móvil (contexto siempre visible);
   ya no hay overflow:hidden en ancestros que lo anule. */
@media (max-width:768px) {
	.srp-progress { position:sticky; top:8px; z-index:30; box-shadow:0 6px 16px rgba(0,0,0,.45); }
}

/* M8: solo visible para lectores de pantalla. */
.srp-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* Ocultar el aviso nativo de login de Woo (lo sustituye el paso 1). */
.woocommerce .woocommerce-form-login-toggle, .woocommerce-form-login-toggle { display:none !important; }

/* --- Cabecera de cada paso --- */
/* R3: scroll-margin para que scrollIntoView no pegue el paso al borde superior. */
.srp-step { border-bottom:1px solid rgba(255,255,255,.08); scroll-margin-top:96px; }
.srp-step:last-child { border-bottom:none; }
.srp-step-head { display:flex; align-items:center; gap:14px; padding:16px 18px; cursor:default; background:#111; border-left:4px solid transparent; }
.srp-step-active .srp-step-head { border-left-color:#FF6D00; background:#161616; }
.srp-step-done .srp-step-head { border-left-color:#1db954; }
.srp-step-num { flex:0 0 34px; height:34px; border-radius:50%; background:#262626; color:#fff; font-weight:700; font-size:16px; display:flex; align-items:center; justify-content:center; }
.srp-step-active .srp-step-num { background:#FF6D00; color:#101014; }
/* DIS-9 (v1.4.0): el estado "done" no depende solo del color — el número se
   sustituye por un ✓ (funciona también en móvil, donde la pill se oculta). */
.srp-step-done .srp-step-num { background:rgba(29,185,84,.14); border:1px solid #1db954; font-size:0; }
.srp-step-done .srp-step-num::after { content:"✓"; font-size:15px; line-height:1; color:#1db954; }
.srp-step-titles { display:flex; flex-direction:column; gap:3px; flex:1; }
.srp-step-title { font-size:17px; font-weight:700; color:#fff; }
.srp-step-help { font-size:13px; color:#a8a8a8; line-height:1.45; }
.srp-step-state { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:#b5b5b5; background:#1c1c1c; border:1px solid rgba(255,255,255,.08); min-width:44px; min-height:24px; display:inline-flex; align-items:center; justify-content:center; padding:0 10px; border-radius:20px; white-space:nowrap; }
.srp-step-active .srp-step-state { color:#101014; background:#FF6D00; border-color:#FF6D00; }
.srp-step-done .srp-step-state { color:#0a0a0a; background:#1db954; }
.srp-step-head[role="button"] { cursor:pointer; }
/* R6: foco visible con teclado (acento naranja). */
.srp-step-head:focus-visible { outline:2px solid #FF6D00; outline-offset:-2px; border-radius:4px; }
.srp-btn:focus-visible, #place_order:focus-visible, .srp-login-toggle-btn:focus-visible,
.srp-step-edit:focus-visible, .srp-add-optional:focus-visible, .srp-optional-toggle:focus-visible, .srp-draft-clear:focus-visible { outline:2px solid #FF6D00; outline-offset:2px; }
/* D5: transiciones de estado. */
.srp-step-num, .srp-step-state { transition:background .3s ease, color .3s ease; }

/* --- Cuerpo de cada paso (colapsable) --- */
.srp-step-body { display:none; padding:18px; }
.srp-step-active .srp-step-body { display:block; animation:srpStepIn .28s ease; }
@keyframes srpStepIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }

/* --- Botones de navegación (acento corporativo naranja; ronda 2: radius 12 + Share Tech Mono, mismo token que #place_order) --- */
.srp-step-actions { display:flex; justify-content:space-between; gap:12px; margin-top:22px; }
.srp-btn { display:inline-block; border:none; border-radius:12px; cursor:pointer; font-family:'Share Tech Mono',monospace; font-size:15px; font-weight:700; padding:14px 28px; text-decoration:none; transition:transform .1s ease, box-shadow .1s ease; } /* ronda 2: token CTA = #place_order (mono + radius 12) */
.srp-btn-next { background:#FF6D00; color:#101014; flex:1; text-align:center; }
.srp-btn-back { background:#262626; color:#ccc; }

/* --- Paso 1: cuenta / login --- */
.srp-account-logged { color:#e8e8e8; font-size:15px; margin:0; }
.srp-account-logged strong { color:#fff; }
.srp-account-login-row { margin:0 0 4px; }
/* Ronda 2: target táctil ≥24px también en desktop (padding vertical). */
.srp-login-toggle-btn { background:none; border:none; padding:6px 0; display:inline-block; color:#ffa04d; font-size:14.5px; font-weight:700; text-decoration:underline; cursor:pointer; }
.srp-account-login { margin:14px 0 4px; padding:16px; background:#111; border:1px solid rgba(255,255,255,.08); border-radius:8px; }
.srp-account-login .woocommerce-form-login { max-width:none; }
.srp-field-help { font-size:12.5px; color:#8c8c8c; margin:8px 0 0; }
#srp-account-slot .woocommerce-account-fields { margin-top:14px; }
.srp-step-empty { color:#a8a8a8; font-size:14px; margin:0; }

/* --- Candado del pago (DIS-5 + v1.4.1): cubre SOLO #payment por coordenadas
   explícitas calculadas por JS (top/left/width/height) — #payment nunca se
   mueve de sitio (moverlo recargaría los iframes de las pasarelas). El
   resumen del pedido (#order_review) queda siempre visible e interactuable. --- */
.srp-step[data-step="payment"] .srp-step-body { position:relative; }
.srp-pay-lock { position:absolute; z-index:20; border-radius:8px; background:rgba(10,10,10,.94); backdrop-filter:blur(2px); display:flex; align-items:center; justify-content:center; text-align:center; cursor:pointer; transition:opacity .35s ease; }
.srp-pay-lock-inner { max-width:340px; padding:24px; }
.srp-lock-icon { display:block; margin-bottom:10px; color:#FF6D00; }
.srp-lock-icon svg { width:38px; height:38px; }
.srp-secure-icon svg { width:13px; height:13px; vertical-align:-2px; margin-right:5px; }
.srp-pay-lock strong { color:#fff; font-size:18px; display:block; margin-bottom:6px; }
.srp-pay-lock p { color:#a8a8a8; font-size:14px; line-height:1.5; margin:0; }
.srp-pay-lock.srp-unlocked { opacity:0; transform:scale(.98); transition:opacity .35s ease, transform .35s ease; pointer-events:none; }

/* --- Formularios en negro --- */
#srp-steps .woocommerce-billing-fields h3,
#srp-steps .woocommerce-shipping-fields h3,
#srp-steps .woocommerce-additional-fields h3 { color:#fff; font-size:15px; }
#srp-steps .woocommerce-additional-fields h3 { display:none; } /* el título ya lo da el paso 4 */
#srp-steps .form-row, #srp-step-account .form-row { margin-bottom:16px; }
#srp-steps label, #srp-step-account label { color:#e8e8e8 !important; font-size:14px; font-weight:600; display:block; margin-bottom:6px; font-family:inherit !important; letter-spacing:0 !important; text-transform:none !important; }
/* DIS-7 (ronda 2): un solo color de marcador required/error en todo el plugin (#ff5964, AA sobre #0a0a0a) */
#srp-steps .required, #srp-step-account .required { color:#ff5964 !important; }
#srp-steps .optional, #srp-step-account .optional { color:#8c8c8c; font-weight:400; }
/* F2 (v1.2.2): el tema pinta las ayudas .description como tooltip azul con
   texto gris oscuro (ilegible). Override: fondo transparente, texto claro,
   sin flechas/posicionamiento de tooltip. */
#srp-steps .description, #srp-step-account .description,
#srp-steps .form-row .description, #srp-step-account .form-row .description {
	display:block; background:transparent !important; background-color:transparent !important;
	color:#c9c9c9 !important; font-size:12.5px; margin-top:5px; line-height:1.45;
	padding:0 !important; box-shadow:none !important; border:none !important; position:static !important;
}
#srp-steps .description::before, #srp-steps .description::after,
#srp-step-account .description::before, #srp-step-account .description::after { content:none !important; display:none !important; }

/* F3 (v1.2.2) + R10 (v1.2.3): aviso "Have a coupon?" integrado con el diseño
   oscuro; el acento pasa de border-left:4px a border-top:1px (patrón del skin). */
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
	background:#111 !important; border:1px solid rgba(255,255,255,.08) !important; border-top:1px solid #FF6D00 !important;
	border-radius:10px; color:#F5F5F7 !important; padding:14px 18px !important;
}
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before,
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::after { content:none !important; display:none !important; }
body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info .showcoupon { color:#FF6D00; text-decoration:underline; }
/* Formulario de cupón desplegado: mismo lenguaje oscuro + botón naranja mono. */
body.woocommerce-checkout form.checkout_coupon {
	background:#111 !important; border:1px solid rgba(255,255,255,.08) !important; border-radius:10px;
	padding:16px 18px !important; color:#F5F5F7; margin-top:12px;
}
body.woocommerce-checkout form.checkout_coupon .form-row input.input-text,
body.woocommerce-checkout form.checkout_coupon input[type="text"] {
	background:#1a1a1a !important; color:#fff !important; border:1px solid #3a3a3a !important;
	border-radius:10px; padding:12px 14px; font-size:15px;
}
body.woocommerce-checkout form.checkout_coupon input:focus { border-color:#FF6D00 !important; outline:none; box-shadow:0 0 0 2px rgba(255,109,0,.28); }
body.woocommerce-checkout form.checkout_coupon button.button,
body.woocommerce-checkout form.checkout_coupon .button {
	background:#FF6D00 !important; color:#101014 !important; border:none !important; border-radius:8px !important;
	font-family:'Share Tech Mono',monospace !important; font-size:12px !important; font-weight:700 !important;
	letter-spacing:.14em !important; text-transform:uppercase !important; padding:12px 22px !important;
}
/* v1.4.3: cupón reubicado dentro de #order_review, entre la tabla del total
   y los métodos de pago — aire arriba/abajo y sin margen extra del aviso. */
body.woocommerce-checkout .srp-coupon-slot { margin:6px 0 18px; }
body.woocommerce-checkout .srp-coupon-slot .woocommerce-form-coupon-toggle { margin:0; }
body.woocommerce-checkout .srp-coupon-slot .woocommerce-form-coupon-toggle .woocommerce-info { margin:0 0 0 !important; }
body.woocommerce-checkout .srp-coupon-slot form.checkout_coupon { margin-bottom:0 !important; }

/* F4 (v1.2.2): teléfono + prefijo en la MISMA fila (patrón form-row-first/last
   de Woo: float 38%/60%). En <480px vuelven a ancho completo (ronda 2: una
   línea hasta 360px). */
body.woocommerce-checkout #billing_phone_prefix_field { float:left; width:38%; clear:left; }
body.woocommerce-checkout #billing_phone_field { float:right; width:60%; clear:none; }
body.woocommerce-checkout #billing_phone_prefix_field .description,
body.woocommerce-checkout #billing_phone_field .description { clear:both; }
/* R9: el select2 del prefijo nunca desborda su media columna. */
body.woocommerce-checkout #billing_phone_prefix_field .select2-container { width:100% !important; }
/* Ronda 2: prefijo + teléfono en UNA línea hasta 360px (apilado solo <480px). */
@media (max-width:480px) {
	body.woocommerce-checkout #billing_phone_prefix_field,
	body.woocommerce-checkout #billing_phone_field { float:none; width:100%; clear:both; }
}

/* F5 (v1.2.2): el tema flota #order_review a ~48% y estrangula el paso 5.
   Dentro de los pasos, el resumen va a ancho completo y en UNA columna. */
#srp-steps .srp-step[data-step="payment"] .srp-step-body #order_review,
#srp-steps .srp-step[data-step="payment"] .srp-step-body .woocommerce-checkout-review-order {
	width:100% !important; float:none !important; max-width:100% !important; margin-left:0 !important; margin-right:0 !important;
}
#srp-steps .srp-step[data-step="payment"] .srp-step-body #order_review_heading { width:100% !important; float:none !important; max-width:100% !important; }
/* Cualquier layout de 2 columnas del tema dentro de los pasos → 1 columna fluida. */
#srp-steps .col2-set, #srp-steps .col2-set .col-1, #srp-steps .col2-set .col-2,
#srp-step-account .col2-set, #srp-step-account .col2-set .col-1, #srp-step-account .col2-set .col-2 {
	width:100% !important; float:none !important; max-width:100% !important; margin-left:0 !important; margin-right:0 !important;
}
/* Tablas del resumen: scroll horizontal si no cupieran. */
#srp-steps .srp-step[data-step="payment"] .srp-step-body #order_review { overflow-x:auto; }
#srp-steps .srp-step[data-step="payment"] .srp-step-body .shop_table { min-width:100%; }
@media (max-width:768px) {
	#srp-steps .srp-step[data-step="payment"] .srp-step-body #order_review,
	#srp-steps .srp-step[data-step="payment"] .srp-step-body #order_review_heading { width:100% !important; float:none !important; }
}
/* R9/R10: inputs nativos con altura mínima 46px (táctil) y radius 10. */
#srp-steps input[type="text"], #srp-steps input[type="email"], #srp-steps input[type="tel"],
#srp-steps input[type="number"], #srp-steps input[type="password"], #srp-steps select,
#srp-steps textarea, #srp-steps #order_review input, #srp-steps #order_review select, #srp-steps #order_review textarea,
#srp-step-account input[type="text"], #srp-step-account input[type="email"], #srp-step-account input[type="tel"],
#srp-step-account input[type="password"], #srp-step-account select {
	width:100%; min-height:46px; background:#1a1a1a !important; color:#fff !important;
	border:1px solid #3a3a3a !important; border-radius:10px; padding:12px 14px; font-size:15px;
}
/* R9: checkboxes con acento naranja y tamaño táctil coherente. */
#srp-steps input[type="checkbox"], #srp-step-account input[type="checkbox"] { accent-color:#FF6D00; width:18px; height:18px; }
/* D2: foco naranja. */
#srp-steps input:focus, #srp-steps select:focus, #srp-steps textarea:focus, #srp-step-account input:focus, #srp-step-account select:focus {
	border-color:#FF6D00 !important; outline:none; box-shadow:0 0 0 2px rgba(255,109,0,.28);
}
/* D4: contraste de placeholders. */
#srp-steps input::placeholder, #srp-step-account input::placeholder { color:#8c8c8c; }
#srp-steps .select2-container--default .select2-selection--single { background:#1a1a1a; border:1px solid #3a3a3a; border-radius:10px; min-height:46px; }
#srp-steps .select2-container--default .select2-selection--single .select2-selection__rendered { color:#fff; line-height:44px; }
#srp-steps .select2-container--default .select2-selection--single .select2-selection__arrow { height:44px; }
/* DIS-3 (v1.4.0): selectWoo anexa el dropdown a <body> — los selectores
   scopeados a #srp-steps no aplicaban. Skin dark a nivel de página checkout. */
body.woocommerce-checkout .select2-dropdown { background:#141419; border:1px solid rgba(255,255,255,.12); border-radius:10px; }
body.woocommerce-checkout .select2-results__option { color:#F5F5F7; }
body.woocommerce-checkout .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable,
body.woocommerce-checkout .select2-container--default .select2-results__option--highlighted[aria-selected] { background:#FF6D00; color:#101014; }
body.woocommerce-checkout .select2-container--default .select2-results__option[aria-selected="true"],
body.woocommerce-checkout .select2-container--default .select2-results__option[data-selected="true"] { background:#262626; color:#F5F5F7; }
body.woocommerce-checkout .select2-search--dropdown .select2-search__field { background:#1a1a1a; border:1px solid rgba(255,255,255,.12); border-radius:8px; color:#F5F5F7; }
body.woocommerce-checkout .select2-search--dropdown .select2-search__field:focus { border-color:#FF6D00; outline:none; box-shadow:0 0 0 2px rgba(255,109,0,.28); }

/* Campo con error */
#srp-steps .woocommerce-invalid-required-field input,
#srp-steps .woocommerce-invalid-required-field select,
#srp-steps .woocommerce-invalid-required-field textarea {
	border-color:#e2122a !important; box-shadow:0 0 0 2px rgba(226,18,42,.3) !important; background:#1f1214 !important;
}
#srp-steps .woocommerce-invalid-required-field label { color:#ff5964 !important; }
/* DIS-10 (v1.4.0): mensaje de error inline junto al campo (aria-describedby). */
.srp-field-error { color:#ff5964; font-size:12.5px; margin-top:6px; display:block; }

/* --- Resumen del pedido --- */
#srp-steps #order_review .shop_table, #srp-steps #order_review .shop_table th, #srp-steps #order_review .shop_table td {
	background:#0f0f0f; color:#eee; border-color:rgba(255,255,255,.08);
}
#srp-steps #order_review .shop_table thead th { color:#fff; }
/* D3: total del pedido en naranja mono. */
#srp-steps #order_review .order-total .amount { font-family:'Share Tech Mono',monospace; color:#FF6D00; font-size:20px; }

/* --- Métodos de pago ---
   R7 (v1.2.3): el doble panel (skin de Woo + paso) se libera — el contenedor
   #payment queda transparente dentro de los pasos y los logos caben a 320px. */
#srp-steps #payment { background:transparent !important; border:none !important; padding:0; }
#srp-steps #payment ul.payment_methods li { border-bottom:none; }
#srp-steps #payment label { color:#fff !important; }
#srp-steps #payment li.wc_payment_method > label { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
#srp-steps #payment .wc_payment_methods li label img { max-height:22px; max-width:64px; width:auto; vertical-align:middle; margin-left:6px; }
#srp-steps #payment div.payment_box { background:#1b1b1b !important; color:#cfcfcf !important; }
#srp-steps #payment div.payment_box::before { border-bottom-color:#1b1b1b !important; }
#srp-steps #payment .wc-payment-form input, #srp-steps #payment .wc-payment-form select { background:#1a1a1a; color:#fff; border:1px solid #3a3a3a; }

/* --- BOTÓN DE PAGAR: réplica del botón "tramitar pedido" del carrito (skin) --- */
#place_order {
	width:100% !important; min-height:52px !important; background:#FF6D00 !important; color:#101014 !important;
	border:none !important; border-radius:12px !important;
	font-family:'Share Tech Mono',monospace !important; font-size:12px !important; font-weight:700 !important;
	letter-spacing:.16em !important; text-transform:uppercase !important;
	padding:14px 20px !important; margin-top:10px; cursor:pointer; transition:background .15s ease;
}
/* R1 (v1.2.3): el candado ya NO usa disabled (un botón disabled no despacha
   clicks y el popup explicativo nunca se abría). Estado bloqueado por clase. */
/* DIS-8 (v1.4.0): el botón bloqueado SÍ responde (abre el popup vía el
   candado), así que no aplica la exención de "componente inactivo": texto
   #b5b5b5 (5.9:1) y candado SVG como prefijo (lo inyecta el JS). */
#place_order.srp-place-locked { background:#3a3a3a !important; color:#b5b5b5 !important; cursor:not-allowed; }
#place_order.srp-place-locked:hover { background:#3a3a3a !important; color:#b5b5b5 !important; }
#place_order .srp-btn-lock svg { width:14px; height:14px; vertical-align:-2px; margin-right:2px; }

/* --- TÉRMINOS Y CONDICIONES --- */
/* DIS-6 (v1.4.0): estado NEUTRO (hairline + fondo #111 + checkbox naranja).
   El rojo (#e2122a borde + fondo #1c1205) solo con .srp-terms-flash o
   .woocommerce-invalid — reservado a errores según el sistema de marca. */
.woocommerce-terms-and-conditions-wrapper, #payment .form-row.terms {
	background:#111 !important; border:1px solid rgba(255,255,255,.12) !important;
	border-radius:8px; padding:14px 16px !important; margin:14px 0 !important;
}
.woocommerce-terms-and-conditions-wrapper.srp-terms-flash, .woocommerce-terms-and-conditions-wrapper.woocommerce-invalid,
#payment .form-row.terms.srp-terms-flash, #payment .form-row.terms.woocommerce-invalid {
	background:#1c1205 !important; border:1px solid #e2122a !important;
}
.woocommerce-terms-and-conditions-wrapper label, #payment .form-row.terms label {
	color:#fff !important; font-size:15px !important; font-weight:700 !important; display:flex !important;
	align-items:center; gap:10px; cursor:pointer; line-height:1.4;
}
.woocommerce-terms-and-conditions-wrapper input[type="checkbox"], #payment .form-row.terms input[type="checkbox"] {
	width:22px !important; height:22px !important; min-width:22px; accent-color:#FF6D00; cursor:pointer;
}
.woocommerce-terms-and-conditions-wrapper a, #payment .form-row.terms a { color:#ffa04d; text-decoration:underline; }
.srp-terms-flash { animation:srpTermsFlash .55s ease 3; }
@keyframes srpTermsFlash {
	0%, 100% { box-shadow:0 0 0 0 rgba(226,18,42,0); }
	50% { box-shadow:0 0 0 8px rgba(226,18,42,.55); }
}

/* --- Popup de campos pendientes (con ayuda por campo) --- */
.srp-modal { position:fixed; inset:0; z-index:99999; background:rgba(0,0,0,.8); display:flex; align-items:center; justify-content:center; padding:20px; }
.srp-modal[hidden] { display:none; }
.srp-modal-box { background:#141414; border:1px solid #2e2e2e; border-top:4px solid #e2122a; border-radius:14px; max-width:440px; width:100%; padding:26px; color:#fff; text-align:center; box-shadow:0 20px 60px rgba(0,0,0,.6); max-height:85vh; overflow:auto; }
.srp-modal-title { color:#fff; font-size:19px; margin:0 0 14px; }
.srp-modal-list { text-align:left; margin:0 0 18px; padding-left:22px; color:#e8e8e8; font-size:14.5px; line-height:1.6; }
.srp-modal-list li { margin-bottom:10px; }
.srp-modal-list li::marker { color:#e2122a; }
.srp-modal-list .srp-modal-help { display:block; color:#a8a8a8; font-size:12.5px; line-height:1.45; }
.srp-modal-list .srp-modal-note { color:#e8e8e8; }
.srp-modal-close { width:100%; background:#e2122a; color:#fff; }

/* R5: los :hover solo aplican en dispositivos con hover real y puntero fino
   (en táctil un :hover "pegado" ensuciaba la UI tras el tap). */
@media (hover:hover) and (pointer:fine) {
	.srp-step-head[role="button"]:hover { background:#1a1a1a; }
	.srp-btn-next:hover { background:#ff8a3d; color:#101014; transform:translateY(-1px); box-shadow:0 4px 14px rgba(255,109,0,.35); }
	.srp-btn-back:hover { background:#333; color:#fff; }
	.srp-login-toggle-btn:hover { color:#fff; }
	body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info .showcoupon:hover { color:#ff8a3d; }
	body.woocommerce-checkout form.checkout_coupon button.button:hover { background:#ff8a3d !important; color:#101014 !important; }
	#place_order:hover { background:#F5F5F7 !important; color:#101014 !important; }
	#place_order.srp-place-locked:hover { background:#3a3a3a !important; color:#8c8c8c !important; }
	.srp-modal-close:hover { background:#c40e24; }
}

/* --- Responsive (D8: móvil 360px) --- */
@media (max-width:640px) {
	.srp-step { scroll-margin-top:76px; } /* R3: menos offset en móvil */
	.srp-step-head { padding:13px 12px; gap:10px; }
	.srp-step-title { font-size:15px; }
	.srp-step-help { font-size:12px; }
	.srp-step-state { font-size:10.5px; padding:4px 8px; }
	.srp-step:not(.srp-step-active) .srp-step-help { display:none; }
	.srp-step:not(.srp-step-active) .srp-step-state { display:none; }
	.srp-step-num { flex-basis:30px; height:30px; font-size:14px; }
	.srp-login-toggle-btn { display:inline-block; padding:12px 0; font-size:15px; }
	.srp-step-body { padding:14px; }
	.srp-btn { padding:13px 18px; font-size:14px; }
	.srp-step-actions { flex-direction:column; }
	.srp-modal-box { padding:20px; }
}

/* D5 + P2-4 (v1.4.0): respeto a prefers-reduced-motion — cubre la animación de
   entrada, la barra, el flash de términos, la transición del candado, el
   spinner scs-spin y el translateY de los hover. */
@media (prefers-reduced-motion:reduce) {
	.srp-step-active .srp-step-body { animation:none; }
	.srp-progress-bar, .srp-progress-fill { transition:none; }
	.srp-terms-flash { animation:none; }
	.srp-pay-lock, .srp-pay-lock.srp-unlocked { transition:none; }
	.scs-spinner, .scs-spin { animation:none; }
	.srp-btn, #place_order { transition:none; }
	.srp-btn-next:hover { transform:none; box-shadow:none; }
}

/* ===== v1.2.5 ===== */
/* Teléfono obligatorio — capa CSS de respaldo al JS (el tema puede re-renderizar
   el campo después de la carga). Oculta "(optional)" y añade el asterisco solo
   si el label no tiene ya un marcador required (evita doble asterisco). */
body.woocommerce-checkout label[for="billing_phone"] .optional,
body.woocommerce-checkout label[for="billing_phone_prefix"] .optional { display:none !important; }
body.woocommerce-checkout label[for="billing_phone"]:not(:has(abbr.required)):not(:has(span.required))::after,
body.woocommerce-checkout label[for="billing_phone_prefix"]:not(:has(abbr.required)):not(:has(span.required))::after { content:" *"; color:#FF6D00; font-weight:700; }

/* Radios de métodos de pago: tamaño controlado (el tema los infla con flex) */
#srp-steps #payment .wc_payment_methods li input.input-radio,
#srp-steps #payment input[type="radio"] {
	width:18px !important; height:18px !important; min-width:18px !important; max-width:18px !important;
	flex:0 0 18px !important; margin:0 !important; accent-color:#FF6D00;
}
/* Paneles/cajas de pago vacías (p. ej. hueco bajo PayPal): ocultas */
#srp-steps #payment div.payment_box:empty { display:none !important; }
#srp-steps #payment .wc_payment_methods li:empty { display:none !important; }

/* ===== v1.4.0 ===== */

/* T3: resumen colapsado del paso completado (solo visible con done y NO activo). */
.srp-step-summary { display:none; align-items:center; gap:10px; margin-top:2px; }
.srp-step-done:not(.srp-step-active) .srp-step-summary { display:flex; }
.srp-step-summary-text { font-size:13px; color:#8A8A92; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.srp-step-edit { flex:0 0 auto; background:none; border:none; padding:0; min-height:24px; color:#FF6D00; font-size:13px; font-weight:700; text-decoration:underline; cursor:pointer; }
@media (hover:hover) and (pointer:fine) {
	.srp-step-edit:hover, .srp-add-optional:hover, .srp-optional-toggle:hover, .srp-draft-clear:hover { color:#ff8a3d; }
}

/* T4: express checkout al inicio del paso 5 (botones reubicados por JS). */
.srp-express-checkout { text-align:center; margin:0 0 20px; padding-bottom:18px; border-bottom:1px solid rgba(255,255,255,.08); }
.srp-express-label { font-family:'Share Tech Mono',monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:#8A8A92; margin:0 0 12px; }
.srp-express-buttons { display:flex; flex-direction:column; align-items:center; gap:10px; }
.srp-express-buttons > * { max-width:100%; }
.srp-express-buttons #wc-stripe-payment-request-button-separator { color:#8A8A92; font-size:12px; margin:0; }

/* T12: trust badges tras la zona de pago (iconos SVG inline, no emoji). */
.srp-trust-badges { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:10px 18px; margin:18px 0 0; padding-top:14px; border-top:1px solid rgba(255,255,255,.08); }
.srp-trust-badge { display:inline-flex; align-items:center; gap:7px; font-size:12px; color:#8A8A92; }
.srp-trust-badge + .srp-trust-badge { border-left:1px solid rgba(255,255,255,.12); padding-left:18px; }
.srp-trust-icon { display:inline-flex; color:#FF6D00; }
.srp-trust-icon svg { width:15px; height:15px; }
@media (max-width:640px) {
	.srp-trust-badges { gap:8px 12px; }
	.srp-trust-badge + .srp-trust-badge { border-left:none; padding-left:0; }
}

/* T13: campos opcionales colapsados tras un enlace (paso 4: notas del pedido). */
.srp-optional-collapsed { display:none !important; }
/* Ronda 2: componente "Add optional" UNIFICADO — misma clase en scs-fields.js
   (address_2/company/VAT) y en el paso 4 (notas). Sin estilos inline. */
.srp-add-optional, .srp-optional-toggle { background:transparent; border:none; padding:0; min-height:24px; margin:0 0 16px; color:#ffa04d; font-size:13.5px; text-decoration:underline; cursor:pointer; }

/* ===== Ronda 2 (audit round 2) ===== */

/* T11: feedback visual del autocompletado CP→provincia (halo naranja 1.5 s;
   el JS lo aplica al select o al .select2-selection si selectWoo lo oculta). */
.srp-autofilled { box-shadow:0 0 0 2px rgba(255,109,0,.45) !important; transition:box-shadow .3s; }

/* T2-note: aviso "draft restored" bajo la barra de progreso. */
.srp-draft-note { max-width:760px; width:calc(100% - 24px); box-sizing:border-box; margin:-8px auto 14px; font-size:12.5px; color:#8A8A92; text-align:center; }
#srp-steps > .srp-draft-note { width:auto; max-width:none; margin:0; padding:0 18px 10px; text-align:left; }
.srp-draft-clear { background:transparent; border:none; padding:0; min-height:24px; color:#ffa04d; font-size:12.5px; text-decoration:underline; cursor:pointer; }

/* Ronda 2 (processing): spinner inline en #place_order (mismo token que el
   spinner del carrito; keyframes locales por si el skin está OFF). */
.srp-btn-spinner { display:inline-block; width:14px; height:14px; border:2px solid rgba(16,16,20,.3); border-top-color:#101014; border-radius:50%; animation:scs-spin .7s linear infinite; vertical-align:-2px; margin-right:4px; }
@keyframes scs-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) {
	.srp-btn-spinner { animation:none; }
}

/* B7: zona de pago de respaldo (cuando no existe #payment) — altura mínima
   para alojar el candado sin cubrir el resumen del pedido. */

/* ===================== v1.5.0 ===================== */

/* T1: tilde verde en campos correctamente rellenados (feedback positivo;
   la clase la pone scs-steps.js solo cuando el campo visible tiene un valor
   que pasa su validación — email/teléfono/NIF-ES con checksum real). */
#srp-steps .form-row.srp-field-ok > label::after,
#srp-steps .form-row.srp-field-ok > .woocommerce-input-wrapper + label::after {
	content:' ✓';
	color:#1db954;
	font-weight:700;
}
#srp-steps .form-row.srp-field-ok input:not([type="checkbox"]):not([type="radio"]),
#srp-steps .form-row.srp-field-ok select,
#srp-steps .form-row.srp-field-ok textarea,
#srp-steps .form-row.srp-field-ok .select2-container .select2-selection {
	border-color:rgba(29,185,84,.55) !important;
	transition:border-color .25s;
}
/* Si la fila conserva marca de error, el error manda (la tilde se limpia por JS,
   pero doble seguridad visual ante condiciones de carrera). */
#srp-steps .form-row.woocommerce-invalid-required-field > label::after,
#srp-steps .form-row.woocommerce-invalid > label::after { content:none; }

/* Petición cliente (v1.5.0): aviso BIEN VISIBLE en el paso 1 — las credenciales
   se crean automáticamente SOLO si no existe cuenta previa; si ya la hay, hay
   que iniciar sesión para continuar. */
.srp-account-notice {
	display:flex; gap:10px; align-items:flex-start;
	margin:14px 0 6px; padding:12px 14px;
	background:#141419;
	border:1px solid rgba(255,109,0,.45); border-left:3px solid #FF6D00;
	border-radius:8px;
	color:#F5F5F7; font-size:13.5px; line-height:1.55;
}
.srp-account-notice p { margin:0; }
.srp-account-notice-icon { color:#FF6D00; flex:0 0 auto; font-size:15px; line-height:1.4; }

/* NIF/CIF oculto cuando billing_country !== 'ES' (la visibilidad la controla el
   inline style desde scs-fields.js; la clase queda como gancho para temas). */
#srp-steps .form-row.srp-nif-hidden { display:none; }