/* Wordprecero Tienda — se apoya en Bootstrap 5.3. Aquí solo: colores de marca y lo que Bootstrap no trae. */
:root {
	--wpct-azul: #2f4d88;
	--wpct-azul-oscuro: #021d49;
	--wpct-texto: #20304d;
	--wpct-fondo: #f6f8fc;
	--wpct-amarillo: #FFC107;
	--wpct-verde: #1fbf5b;
}

/* Marca sobre Bootstrap (texto siempre oscuro, nunca gris claro) */
.wpct, .wpct-portal {
	--bs-primary: #2f4d88;
	--bs-primary-rgb: 47, 77, 136;
	--bs-body-color: #20304d;
	--bs-secondary-color: #20304d;
	--bs-link-color: #2f4d88;
	--bs-link-color-rgb: 47, 77, 136;
	--bs-link-hover-color: #021d49;
	color: var(--wpct-texto);
	font-size: 14px;
}
.wpct-portal { background: var(--wpct-fondo); min-height: 100vh; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.wpct .btn-primary, .wpct-portal .btn-primary {
	--bs-btn-bg: #2f4d88; --bs-btn-border-color: #2f4d88; --bs-btn-color: #fff;
	--bs-btn-hover-bg: #021d49; --bs-btn-hover-border-color: #021d49; --bs-btn-hover-color: #fff;
	--bs-btn-active-bg: #021d49; --bs-btn-active-border-color: #021d49; --bs-btn-disabled-bg: #2f4d88;
}
.wpct .btn-outline-primary, .wpct-portal .btn-outline-primary {
	--bs-btn-color: #2f4d88; --bs-btn-border-color: #2f4d88;
	--bs-btn-hover-bg: #2f4d88; --bs-btn-hover-border-color: #2f4d88; --bs-btn-hover-color: #fff;
	--bs-btn-active-bg: #021d49; --bs-btn-active-color: #fff;
}
.wpct .nav-pills, .wpct-portal .nav-pills { --bs-nav-pills-link-active-bg: #2f4d88; --bs-nav-link-color: #20304d; --bs-nav-link-hover-color: #021d49; }
.wpct .nav-pills .nav-link:not(.active) { background: #fff; border: 1px solid #c9d3e6; }
.wpct .form-text, .wpct .wpct-ayuda { color: var(--wpct-texto); }
.wpct .table-dark { --bs-table-bg: #021d49; }
.wpct .wpct-titulo { color: var(--wpct-azul-oscuro); font-weight: 700; }
.wpct p, .wpct label, .wpct td, .wpct li { font-weight: 400; }

/* Botón de WhatsApp: verde con letras negras */
.btn-wa, .btn-wa:hover, .btn-wa:focus { background: var(--wpct-verde); border-color: var(--wpct-verde); color: #000; }
.btn-wa:hover { filter: brightness(.95); }

/* Portal */
.wpct-logo { width: auto; height: 46px; }
.wpct-tarjeta-marca { background: var(--wpct-azul-oscuro); border-radius: 1rem; }
.wpct-foto { object-fit: cover; }

/* Compra */
.wpct-precio { background: var(--wpct-azul); color: #fff; }
.wpct-precio small, .wpct-precio span { color: #fff; }
.wpct-monto { background: var(--wpct-amarillo); color: #000; border-radius: 6px; padding: 1px 8px; }
.wpct-dato-grande { color: var(--wpct-azul-oscuro); letter-spacing: .5px; }
.wpct-qr { max-width: 220px; }
.wpct-panel { display: none; }
.wpct-panel.activo { display: block; }
.wpct-trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Historial */
.wpct-resaltado td { background: #fff6dc !important; }
.wpct-codigo { background: var(--wpct-fondo); border: 1px solid #c9d3e6; border-radius: 4px; padding: 2px 6px; font-size: 12px; color: var(--wpct-azul-oscuro); white-space: nowrap; }
.wpct-regalo { background: var(--wpct-amarillo); color: #000; border-radius: 6px; padding: 1px 6px; font-size: 12px; display: inline-block; margin-top: 2px; }
.wpct-clave code { color: var(--wpct-azul-oscuro); }

/* Barra opcional de correo */
.wpct-barra-correo {
	position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 99998; max-width: 640px; margin: 0 auto;
	background: var(--wpct-azul-oscuro); color: #fff; border-radius: 12px; padding: 12px 14px; font-size: 14px;
	box-shadow: 0 6px 24px rgba(2, 29, 73, .3);
}
.wpct-barra-correo span { color: #fff; }

/* Celebración */
.wpct-confeti { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 100000; }
.wpct-toast {
	position: fixed; top: 20px; left: 50%; transform: translateX(-50%); z-index: 100001;
	width: calc(100% - 32px); max-width: 430px; background: var(--wpct-azul); color: #fff;
	border-radius: 14px; padding: 16px 18px; display: flex; flex-direction: column; gap: 8px;
	box-shadow: 0 10px 30px rgba(2, 29, 73, .35); font-size: 14px; animation: wpct-entra .4s ease-out;
}
.wpct-toast span { color: #fff; }
.wpct-toast-titulo { font-size: 16px; font-weight: 700; }
.wpct-toast-regalo { background: var(--wpct-amarillo); color: #000 !important; border-radius: 8px; padding: 6px 10px; }
.wpct-toast-auto { font-size: 12px; }
.wpct-toast .btn { align-self: flex-start; }
.wpct-toast-cerrar { position: absolute; top: 6px; right: 10px; background: none; border: 0; color: #fff; font-size: 22px; cursor: pointer; }
@keyframes wpct-entra { from { opacity: 0; transform: translate(-50%, -14px); } to { opacity: 1; transform: translate(-50%, 0); } }

/* Perfil del cliente (admin): la tarjeta de WordPress tiene ancho máximo, aquí no */
.wpct-perfil .card { max-width: none; padding: 0; margin-top: 0; }
.wpct-perfil h1, .wpct-perfil h2 { padding: 0; }
.wpct-avatar { width: 64px; height: 64px; background: var(--wpct-azul); color: #fff; font-weight: 700; }
.wpct-perfil .wpct-a-btn { font-size: 12px; padding: 3px 8px; }

/* Bootstrap 5.3.0 trae algunos colores fijos: los pasamos a la marca */
.wpct .text-bg-primary, .wpct-portal .text-bg-primary { background-color: #2f4d88 !important; color: #fff !important; }
.wpct .text-bg-warning { color: #000 !important; }
.wpct code, .wpct-portal code { color: #021d49; }
.wpct .text-primary, .wpct-portal .text-primary { color: #2f4d88 !important; }

/* Selector de país del WhatsApp */
.wpct-pais-btn { white-space: nowrap; min-width: 92px; }
.wpct-pais-panel { position: absolute; top: 100%; left: 0; right: 0; z-index: 1050; margin-top: 4px; max-width: 360px; }
.wpct-pais-lista { max-height: 260px; overflow-y: auto; }
.wpct-pais-lista .dropdown-item { font-size: 14px; color: var(--wpct-texto); padding: 7px 12px; }
.wpct-pais-lista .dropdown-item:hover, .wpct-pais-lista .dropdown-item:focus { background: var(--wpct-fondo); color: var(--wpct-azul-oscuro); }

/* Bordes de los campos más oscuros para que se distingan bien */
.wpct .form-control, .wpct .form-select, .wpct-portal .form-control, .wpct-portal .form-select { border-color: #7d8aa5; }
.wpct .form-control:focus, .wpct .form-select:focus, .wpct-portal .form-control:focus, .wpct-portal .form-select:focus { border-color: #2f4d88; box-shadow: 0 0 0 .2rem rgba(47, 77, 136, .2); }

/* Pestañas: colores forzados para que el tema no los pise (texto siempre visible) */
.wpct .nav-pills .nav-link, .wpct-portal .nav-pills .nav-link { background: #fff !important; color: #20304d !important; border: 1px solid #7d8aa5 !important; opacity: 1 !important; text-shadow: none !important; }
.wpct .nav-pills .nav-link.active, .wpct-portal .nav-pills .nav-link.active { background: #2f4d88 !important; color: #fff !important; border-color: #2f4d88 !important; }
.wpct .nav-pills .nav-link:hover:not(.active) { color: #021d49 !important; background: #f6f8fc !important; }
.wpct-pasos[hidden], .wpct-abrir-compra[hidden] { display: none !important; }

/* Llamado a la acción de compra (centrado, botón rojo con letras blancas) */
.wpct-producto { border-top: 5px solid #2f4d88 !important; }
.wpct-producto .wpct-titulo { color: #021d49 !important; }
.wpct-producto p, .wpct-producto li { color: #20304d !important; }
.wpct-producto .wpct-precio, .wpct-producto .wpct-precio span, .wpct-producto .wpct-precio small { color: #fff !important; }
.wpct-cta-logo { height: 61px; width: auto; }
.wpct-cta-desc { max-width: 560px; }
.wpct-cta-regalo { display: inline-flex; align-items: center; gap: 6px; background: #FFC107; color: #000 !important; border-radius: 50px; padding: 6px 16px; font-size: 14px; animation: wpct-brillo 2.4s ease-in-out infinite; }
.wpct-btn-rojo, .wpct-btn-rojo:focus { background: #e02424 !important; border: 0 !important; color: #fff !important; border-radius: 50px; font-size: 20px; box-shadow: 0 8px 22px rgba(224, 36, 36, .35); animation: wpct-latido 1.8s ease-in-out infinite; display: inline-flex; align-items: center; justify-content: center; }
.wpct-btn-rojo:hover { background: #b91c1c !important; color: #fff !important; transform: translateY(-2px); }
.wpct-cta-confianza .list-inline-item { margin: 0 8px 6px; }
@keyframes wpct-latido { 0%, 100% { box-shadow: 0 8px 22px rgba(224, 36, 36, .35), 0 0 0 0 rgba(224, 36, 36, .45); } 50% { box-shadow: 0 8px 22px rgba(224, 36, 36, .35), 0 0 0 12px rgba(224, 36, 36, 0); } }
@keyframes wpct-brillo { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@media (prefers-reduced-motion: reduce) { .wpct-btn-rojo, .wpct-cta-regalo { animation: none; } }
@media (max-width: 575px) { .wpct-btn-rojo { width: 100%; } }
/* Los pasos de compra también centrados */
.wpct-pasos .wpct-titulo, .wpct-pasos .card-body > p { text-align: center; }
.wpct-producto .wpct-precio { min-width: 210px; }
