/*
Theme Name: BioCore Child
Theme URI: https://biocoresupplement.shop
Description: Tema hijo de Hostinger AI theme con la landing nativa de Digestive Enzyme Pro Blend como plantilla de pagina.
Author: Simple Media
Template: hostinger-ai-theme
Version: 1.17
Text Domain: biocore-child
*/

/* Los estilos de la landing viven dentro de su propia plantilla (template-landing.php).
   Este archivo declara el tema hijo y aplica la identidad de marca al carrito y checkout. */

/* ===== Identidad BioCore en Carrito y Checkout (WooCommerce blocks) ===== */

/* Boton principal (Proceed to Checkout / Place Order): protagonista, en morado de marca */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-proceed-to-checkout-block a,
.wc-block-cart .wc-block-components-button:not(.is-link),
.wc-block-checkout .wc-block-components-button:not(.is-link) {
    background: #6B57C8 !important;
    border-color: #6B57C8 !important;
    color: #fff !important;
    border-radius: 999px !important;
    font-weight: 800 !important;
    padding: 16px 24px !important;
    box-shadow: 0 10px 24px -8px rgba(107, 87, 200, .55) !important;
    transition: background .15s ease, transform .15s ease !important;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.wp-block-woocommerce-proceed-to-checkout-block a:hover {
    background: #4A3A9E !important;
    border-color: #4A3A9E !important;
    transform: translateY(-1px);
}

/* Banner de ENVIO GRATIS arriba del carrito (solo en el contenedor exterior) */
.wp-block-woocommerce-cart::before {
    content: "🚚 FREE SHIPPING";
    display: block;
    background: #F1ECFC;
    color: #4A3A9E;
    border: 1.5px solid #6B57C8;
    border-radius: 12px;
    padding: 12px 16px;
    font-weight: 800;
    font-size: .95rem;
    text-align: center;
    margin-bottom: 18px;
}

/* Linea de confianza debajo del boton de checkout */
.wc-block-cart__submit:after,
.wp-block-woocommerce-proceed-to-checkout-block:after {
    content: "🔒 Secure checkout";
    display: block;
    text-align: center;
    font-size: .8rem;
    color: #6B57C8;
    font-weight: 700;
    margin-top: 10px;
}

/* Titulos del carrito/checkout con el caracter de la marca */
.wc-block-cart h1,
.wc-block-checkout h1,
.entry-title,
.wp-block-post-title {
    letter-spacing: -0.01em;
    font-weight: 900;
}

/* Acentos morados: links, precios de oferta y totales */
.wc-block-cart a:not(.wc-block-components-button),
.wc-block-components-product-name {
    color: #4A3A9E;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-product-price__value.is-discounted {
    color: #6B57C8;
    font-weight: 800;
}
.wc-block-components-sale-badge {
    background: #6B57C8;
    color: #fff;
    border: 0;
    border-radius: 6px;
}

/* reCAPTCHA: a la esquina inferior derecha, mas pequeno y casi transparente.
   NO se oculta del todo (eso exigiria texto legal de Google). Al pasar el dedo
   o el mouse vuelve a verse completo. */
.grecaptcha-badge {
    bottom: 6px !important;
    right: 2px !important;
    transform: scale(.55) !important;
    transform-origin: bottom right !important;
    opacity: .18 !important;
    transition: opacity .2s ease, transform .2s ease !important;
}
.grecaptcha-badge:hover,
.grecaptcha-badge:focus-within {
    opacity: 1 !important;
    transform: scale(1) !important;
}

/* reCAPTCHA: ocultarlo por completo SOLO en el carrito (ahi no hay formulario de
   pago ni login, asi que no protege nada). En el checkout sigue visible y en regla. */
.woocommerce-cart .grecaptcha-badge {
    display: none !important;
}

/* ===== ARREGLO 1: Carrito más limpio (solo en la página del carrito) ===== */
/* Oculta los pagos express (PayPal, Apple Pay, Google Pay) y el separador "OR"
   ÚNICAMENTE en el carrito, para que "Proceed to Checkout" sea el protagonista.
   Estos pagos SIGUEN disponibles en el checkout (otra página), donde sí convienen.
   Todo va limitado a .woocommerce-cart, así que el checkout no se toca. */
.woocommerce-cart .wp-block-woocommerce-cart-express-payment-block,
.woocommerce-cart .wc-block-cart__payment-options,
.woocommerce-cart .wc-block-components-express-payment,
.woocommerce-cart .wc-block-components-express-payment--cart,
.woocommerce-cart .wc-block-components-express-payment-continue-rule,
.woocommerce-cart .wc-block-components-express-payment-continue-rule--cart,
.woocommerce-cart .ppc-button-wrapper,
.woocommerce-cart .ppcp-button-wrapper,
.woocommerce-cart .ppcp-messages,
.woocommerce-cart [data-pp-message],
.woocommerce-cart .wc-block-components-payment-method-icons {
    display: none !important;
}

/* Que el botón "Proceed to Checkout" respire arriba al quedar solo */
.woocommerce-cart .wp-block-woocommerce-proceed-to-checkout-block {
    margin-top: 8px;
}


/* ============================================================
   FORMULARIO DE SUSCRIPCION (WPForms #205) EN EL BANNER CTA
   Hace que WPForms se vea como el formulario original de la
   landing: en linea, pildoras redondeadas, sobre el morado.
   Solo aplica dentro de .banner, no toca otros formularios.
   ============================================================ */

.banner .wpforms-container,
.banner .wpforms-container-full { margin: 0 !important; max-width: 100%; }

.banner .wpforms-form {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.banner .wpforms-form .wpforms-field {
    padding: 0;
    flex: 1 1 180px;
    min-width: 0;
}

/* Label oculto a la vista pero legible por lectores de pantalla.
   El placeholder ya comunica el campo a quien ve la pantalla. */
.banner .wpforms-form .wpforms-field-label {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.banner .wpforms-form .wpforms-required-label { display: none; }

.banner .wpforms-form input[type="text"],
.banner .wpforms-form input[type="email"] {
    width: 100%;
    border: 0;
    border-radius: 999px;
    padding: 15px 22px;
    font-family: 'Manrope', system-ui, -apple-system, sans-serif;
    font-size: .95rem;
    color: #17121F;
    box-sizing: border-box;
}

.banner .wpforms-form input[type="text"]:focus-visible,
.banner .wpforms-form input[type="email"]:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 1px;
}

.banner .wpforms-form .wpforms-submit-container {
    padding: 0;
    flex: 0 0 auto;
}

.banner .wpforms-form button[type="submit"] {
    background: #17121F;
    color: #fff;
    border: 0;
    border-radius: 999px;
    padding: 15px 28px;
    font-family: 'Manrope', system-ui, -apple-system, sans-serif;
    font-weight: 800;
    font-size: .95rem;
    line-height: 1.2;
    cursor: pointer;
    transition: background .2s ease;
}
.banner .wpforms-form button[type="submit"]:hover { background: #000; }
.banner .wpforms-form button[type="submit"]:disabled { opacity: .6; cursor: default; }

/* Errores de validacion, legibles sobre el fondo morado */
.banner .wpforms-form .wpforms-error {
    color: #FFD9D9;
    font-size: .82rem;
    margin-top: 6px;
}
.banner .wpforms-form input.wpforms-error { border: 2px solid #FFB3B3; }

/* Mensaje de confirmacion tras suscribirse */
.banner .wpforms-confirmation-container,
.banner .wpforms-confirmation-container-full {
    background: rgba(255, 255, 255, .15) !important;
    border: 0 !important;
    color: #fff !important;
    border-radius: 16px;
    padding: 18px 22px;
    margin: 0;
}
.banner .wpforms-confirmation-container p,
.banner .wpforms-confirmation-container-full p {
    color: #fff !important;
    margin: 0;
}

@media (max-width: 840px) {
    .banner .wpforms-form { flex-direction: column; }
    .banner .wpforms-form .wpforms-field,
    .banner .wpforms-form .wpforms-submit-container {
        width: 100%;
        flex: 1 1 auto;
    }
    .banner .wpforms-form button[type="submit"] { width: 100%; }
}