/* ==========================================================
   Jaguar Checkout Perú - PRO 1.0.4 SIMETRIA FIX
   Layout ordenado + resumen premium con imágenes de producto
========================================================== */

:root{
    --jcp-primary:#6b2a12;
    --jcp-primary-dark:#421606;
    --jcp-gold:#f0c232;
    --jcp-blue:#1273de;
    --jcp-text:#0f1b33;
    --jcp-muted:#6d778a;
    --jcp-border:#dfe5ee;
    --jcp-soft:#f7f9fc;
    --jcp-white:#ffffff;
    --jcp-shadow:0 18px 45px rgba(15,27,51,.10);
    --jcp-radius:18px;
}

.jcp-shell{
    max-width:1180px !important;
    margin:0 auto !important;
    padding:10px 18px 34px !important;
    color:var(--jcp-text) !important;
}

.jcp-shell .jcp-head{
    margin-bottom:20px !important;
}

.jcp-shell .jcp-kicker{
    display:inline-flex !important;
    align-items:center !important;
    gap:7px !important;
    font-size:13px !important;
    font-weight:700 !important;
    color:var(--jcp-primary) !important;
    background:#fff7dc !important;
    border:1px solid rgba(240,194,50,.45) !important;
    padding:7px 12px !important;
    border-radius:999px !important;
}

.jcp-shell .jcp-kicker:before{
    content:'🔒';
    font-size:13px;
}

.jcp-shell .jcp-head h2{
    font-size:30px !important;
    line-height:1.15 !important;
    margin:12px 0 7px !important;
    font-weight:850 !important;
    letter-spacing:-.02em !important;
    color:var(--jcp-text) !important;
}

.jcp-shell .jcp-head p{
    margin:0 !important;
    color:var(--jcp-muted) !important;
    font-size:15px !important;
}

.jcp-shell form.checkout{
    display:grid !important;
    grid-template-columns:minmax(0,640px) minmax(340px,390px) !important;
    gap:34px !important;
    justify-content:center !important;
    align-items:start !important;
}

.jcp-shell form.checkout .woocommerce-NoticeGroup,
.jcp-shell form.checkout .woocommerce-form-coupon-toggle,
.jcp-shell form.checkout .woocommerce-form-login-toggle{
    grid-column:1 / -1 !important;
    grid-row:auto !important;
}

/* FIX PRO: evita que el resumen baje debajo del formulario */
.jcp-shell form.checkout > #customer_details{grid-column:1 / 2 !important;grid-row:2 !important;}
.jcp-shell form.checkout > #order_review{grid-column:2 / 3 !important;grid-row:2 !important;}
.jcp-shell form.checkout > #order_review_heading{display:none !important;}

.jcp-shell #customer_details{
    grid-column:1 / 2 !important;
    grid-row:2 !important;
    width:100% !important;
}

.jcp-shell #order_review_heading{
    display:none !important;
}

.jcp-shell #order_review{
    grid-column:2 / 3 !important;
    grid-row:2 !important;
    width:100% !important;
    position:sticky !important;
    top:24px !important;
    align-self:start !important;
    background:var(--jcp-white) !important;
    border:1px solid var(--jcp-border) !important;
    border-radius:var(--jcp-radius) !important;
    box-shadow:var(--jcp-shadow) !important;
    padding:26px !important;
    overflow:hidden !important;
}

.jcp-shell #order_review:before{
    content:'Resumen del pedido';
    display:block !important;
    font-size:22px !important;
    line-height:1.2 !important;
    font-weight:850 !important;
    letter-spacing:-.01em !important;
    color:var(--jcp-text) !important;
    margin:0 0 22px !important;
    padding-bottom:16px !important;
    border-bottom:1px solid var(--jcp-border) !important;
}

.jcp-shell .woocommerce-billing-fields,
.jcp-shell .woocommerce-additional-fields{
    background:var(--jcp-white) !important;
    border:1px solid var(--jcp-border) !important;
    border-radius:var(--jcp-radius) !important;
    box-shadow:0 16px 38px rgba(15,27,51,.06) !important;
    padding:26px !important;
    margin-bottom:18px !important;
}

.jcp-shell .woocommerce-billing-fields > h3,
.jcp-shell .woocommerce-additional-fields > h3{
    font-size:22px !important;
    margin:0 0 22px !important;
    padding-bottom:16px !important;
    border-bottom:1px solid var(--jcp-border) !important;
    font-weight:850 !important;
    letter-spacing:-.01em !important;
}

.jcp-shell form.checkout .woocommerce-billing-fields__field-wrapper{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    column-gap:16px !important;
    row-gap:16px !important;
    width:100% !important;
    align-items:start !important;
}

.jcp-shell form.checkout .woocommerce-billing-fields__field-wrapper .form-row,
.jcp-shell form.checkout .woocommerce-billing-fields__field-wrapper .form-row-first,
.jcp-shell form.checkout .woocommerce-billing-fields__field-wrapper .form-row-last,
.jcp-shell form.checkout .woocommerce-billing-fields__field-wrapper .form-row-wide,
.jcp-shell .woocommerce-additional-fields .form-row{
    width:100% !important;
    float:none !important;
    clear:none !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
}

.jcp-shell label{
    font-size:13px !important;
    font-weight:800 !important;
    margin:0 0 8px !important;
    color:var(--jcp-text) !important;
}

.jcp-shell abbr.required{
    color:#e52020 !important;
    text-decoration:none !important;
}

.jcp-shell input.input-text,
.jcp-shell select,
.jcp-shell textarea,
.jcp-shell .select2-container .select2-selection--single{
    width:100% !important;
    height:46px !important;
    border:1px solid #d7deea !important;
    border-radius:10px !important;
    background:#fff !important;
    color:var(--jcp-text) !important;
    font-size:14px !important;
    padding:0 14px !important;
    box-shadow:0 1px 0 rgba(15,27,51,.02) !important;
    transition:border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
}

.jcp-shell textarea{
    min-height:92px !important;
    padding:13px 14px !important;
}

.jcp-shell input.input-text:focus,
.jcp-shell select:focus,
.jcp-shell textarea:focus,
.jcp-shell .select2-container--open .select2-selection--single{
    border-color:var(--jcp-gold) !important;
    box-shadow:0 0 0 4px rgba(240,194,50,.18) !important;
    outline:none !important;
}

.jcp-shell .select2-container,
.jcp-shell .select2-container .select2-selection__rendered{
    width:100% !important;
    line-height:44px !important;
}

.jcp-shell .select2-container .select2-selection__arrow{
    height:44px !important;
}

/* Orden exacto del formulario */
/* FILA 1 */
.jcp-shell #billing_first_name_field{
    grid-column:1/2!important;
    grid-row:1!important;
}

.jcp-shell #billing_last_name_field{
    grid-column:2/3!important;
    grid-row:1!important;
}

/* FILA 2 */
.jcp-shell #billing_country_field{
    grid-column:1 / 2 !important;
    grid-row:2 !important;
}

.jcp-shell #billing_state_field{
    grid-column:2 / 3 !important;
    grid-row:2 !important;
}

/* FILA 3 */
.jcp-shell #billing_provincia_field{
    grid-column:1 / 2 !important;
    grid-row:3 !important;
}

.jcp-shell #billing_city_field{
    grid-column:2 / 3 !important;
    grid-row:3 !important;
}

/* FILA 4 */
.jcp-shell #billing_phone_field{
    grid-column:1/-1!important;
    grid-row:4!important;
}

/* FILA 5 */
.jcp-shell #billing_email_field{
    grid-column:1/-1!important;
    grid-row:5!important;
}

/* FILA 6 */
.jcp-shell #billing_address_1_field{
    grid-column:1/-1!important;
    grid-row:6!important;
}

/* FILA 7 */
.jcp-shell #billing_address_2_field{
    grid-column:1/-1!important;
    grid-row:7!important;
}

.jcp-shell .woocommerce-checkout-review-order-table{
    border:0 !important;
    margin:0 0 18px !important;
    border-collapse:separate !important;
    border-spacing:0 !important;
    width:100% !important;
}

.jcp-shell .woocommerce-checkout-review-order-table th,
.jcp-shell .woocommerce-checkout-review-order-table td{
    border:0 !important;
    border-bottom:1px solid var(--jcp-border) !important;
    padding:14px 0 !important;
    font-size:14px !important;
    vertical-align:middle !important;
}

.jcp-shell .woocommerce-checkout-review-order-table thead th{
    font-size:12px !important;
    text-transform:uppercase !important;
    letter-spacing:.04em !important;
    color:var(--jcp-muted) !important;
    font-weight:850 !important;
}

.jcp-shell .woocommerce-checkout-review-order-table .product-total,
.jcp-shell .woocommerce-checkout-review-order-table td:last-child,
.jcp-shell .woocommerce-checkout-review-order-table th:last-child{
    text-align:right !important;
    white-space:nowrap !important;
}

.jcp-review-product{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    min-width:0 !important;
}

.jcp-review-thumb{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    border-radius:14px !important;
    overflow:hidden !important;
    border:1px solid var(--jcp-border) !important;
    background:#fff !important;
    box-shadow:0 6px 16px rgba(15,27,51,.08) !important;
}

.jcp-review-thumb img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    display:block !important;
}

.jcp-review-name{
    display:block !important;
    font-weight:800 !important;
    color:var(--jcp-text) !important;
    line-height:1.25 !important;
}

.jcp-shell .product-quantity{
    display:inline-flex !important;
    margin-left:6px !important;
    color:var(--jcp-muted) !important;
    font-weight:700 !important;
}

.jcp-shell .cart-subtotal th,
.jcp-shell .woocommerce-shipping-totals th,
.jcp-shell .order-total th{
    color:var(--jcp-text) !important;
    font-weight:850 !important;
}

.jcp-shell .order-total td,
.jcp-shell .order-total th{
    border-bottom:0 !important;
    padding-top:18px !important;
}

.jcp-shell .order-total .amount{
    font-size:20px !important;
    font-weight:900 !important;
    color:var(--jcp-primary) !important;
}

.jcp-shell #payment{
    background:#fff !important;
    border:0 !important;
    padding:0 !important;
}

.jcp-shell #payment ul.payment_methods{
    border:1px solid var(--jcp-border) !important;
    border-radius:16px !important;
    background:var(--jcp-soft) !important;
    padding:14px !important;
    margin:0 0 16px !important;
}

.jcp-shell #payment ul.payment_methods li{
    padding:10px 4px !important;
    font-size:14px !important;
    font-weight:800 !important;
}

.jcp-shell #payment div.payment_box{
    background:#fff !important;
    border:1px solid var(--jcp-border) !important;
    border-radius:14px !important;
    color:var(--jcp-muted) !important;
    font-size:13px !important;
    line-height:1.5 !important;
    margin:10px 0 0 !important;
}

.jcp-shell #payment div.payment_box:before{display:none !important;}

.jcp-shell .woocommerce-privacy-policy-text{
    color:var(--jcp-muted) !important;
    font-size:13px !important;
    line-height:1.55 !important;
}

.jcp-shell #place_order,
.jcp-shell button.button,
.jcp-shell .woocommerce-button{
    width:100% !important;
    min-height:52px !important;
    border-radius:14px !important;
    background:linear-gradient(135deg, var(--jcp-primary), var(--jcp-primary-dark)) !important;
    color:#fff !important;
    font-weight:900 !important;
    border:0 !important;
    box-shadow:0 12px 24px rgba(107,42,18,.22) !important;
    transition:transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

.jcp-shell #place_order:hover,
.jcp-shell button.button:hover{
    transform:translateY(-1px) !important;
    filter:brightness(1.04) !important;
    box-shadow:0 16px 30px rgba(107,42,18,.28) !important;
}

.jcp-shell .woocommerce-info{
    border-top-color:var(--jcp-gold) !important;
    background:#fffaf0 !important;
    border-radius:14px !important;
    color:var(--jcp-text) !important;
}

.jcp-shell .woocommerce-billing-fields p::before,
.jcp-shell .woocommerce-billing-fields p::after{content:none !important;display:none !important;}

@media(max-width:1024px){
    .jcp-shell form.checkout{grid-template-columns:1fr !important;gap:22px !important;}
    .jcp-shell #customer_details,
    .jcp-shell #order_review{grid-column:1 / -1 !important;grid-row:auto !important;}
    .jcp-shell #order_review{position:relative !important;top:auto !important;}
}

@media(max-width:768px){
    .jcp-shell{padding:8px 12px 26px !important;}
    .jcp-shell .woocommerce-billing-fields,
    .jcp-shell .woocommerce-additional-fields,
    .jcp-shell #order_review{padding:20px !important;}
    .jcp-shell #order_review:before{font-size:20px !important;margin-bottom:18px !important;}
    .jcp-shell form.checkout .woocommerce-billing-fields__field-wrapper{grid-template-columns:1fr !important;}
    .jcp-shell #billing_first_name_field,
    .jcp-shell #billing_last_name_field,
    .jcp-shell #jcp_document_type_field,
    .jcp-shell #jcp_dni_field,
    .jcp-shell #jcp_ruc_field,
    .jcp-shell #jcp_razon_social_field,
    .jcp-shell #billing_phone_field,
    .jcp-shell #billing_email_field,
    .jcp-shell #billing_address_1_field,
    .jcp-shell #billing_address_2_field,
    .jcp-shell #billing_country_field,
    .jcp-shell #billing_city_field,
    .jcp-shell #billing_state_field{grid-column:1 / -1 !important;grid-row:auto !important;}
    .jcp-review-thumb{width:48px !important;height:48px !important;min-width:48px !important;}
}


/* ==========================================================
   PREMIUM UI UPGRADE
========================================================== */

:root{
    --jcp-focus:#1273de;
    --jcp-coupon-bg:#fffaf0;
    --jcp-button-glow:0 14px 35px rgba(18,115,222,.18);
}

.jcp-shell{
    font-feature-settings:"ss01" on;
}

.jcp-shell .woocommerce-form-coupon-toggle{
    background:var(--jcp-coupon-bg) !important;
    border:1px solid rgba(240,194,50,.45) !important;
    border-radius:16px !important;
    padding:14px 18px !important;
    box-shadow:0 10px 25px rgba(15,27,51,.06) !important;
    transition:.25s ease !important;
}

.jcp-shell .woocommerce-form-coupon-toggle:hover{
    transform:translateY(-1px);
    box-shadow:0 16px 32px rgba(15,27,51,.10) !important;
}

.jcp-shell input.input-text,
.jcp-shell select,
.jcp-shell textarea,
.jcp-shell .select2-container .select2-selection--single{
    transition:all .25s ease !important;
    background:#fff !important;
    box-shadow:0 4px 14px rgba(15,27,51,.03) !important;
}

.jcp-shell input.input-text:hover,
.jcp-shell select:hover,
.jcp-shell textarea:hover{
    border-color:rgba(18,115,222,.35) !important;
    box-shadow:0 10px 22px rgba(18,115,222,.08) !important;
}

.jcp-shell input.input-text:focus,
.jcp-shell select:focus,
.jcp-shell textarea:focus{
    border-color:var(--jcp-focus) !important;
    box-shadow:0 0 0 4px rgba(18,115,222,.10), 0 12px 26px rgba(18,115,222,.12) !important;
    transform:translateY(-1px);
}

.jcp-shell #place_order,
.jcp-shell button.button,
.jcp-shell .woocommerce-button{
    position:relative;
    overflow:hidden;
    box-shadow:var(--jcp-button-glow) !important;
    transition:all .28s ease !important;
    letter-spacing:.02em;
}

.jcp-shell #place_order:hover,
.jcp-shell button.button:hover,
.jcp-shell .woocommerce-button:hover{
    transform:translateY(-2px) scale(1.01);
    filter:brightness(1.03);
}

.jcp-shell .shop_table{
    border-radius:18px !important;
}



/* PREMIUM ELEMENTOR CONTROLS */

.jcp-secure-badge{
    transition:all .25s ease;
}

.jcp-secure-badge:hover{
    transform:translateY(-1px);
    box-shadow:0 10px 24px rgba(0,0,0,.08);
}

.jcp-title{
    letter-spacing:-0.03em;
}

.woocommerce-form-coupon-toggle{
    position:relative;
    overflow:hidden;
}


/* ==========================================================
   ELEMENTOR LIVE COLOR FIX - Jaguar Checkout Perú
   Estos selectores permiten que los colores de Elementor
   se apliquen realmente sobre WooCommerce.
========================================================== */

.elementor-widget-jaguar_checkout_peru .jcp-shell{
    --jcp-coupon-bg: #FFF7DC;
    --jcp-coupon-border: #F5B800;
}

/* Cupón cerrado y abierto */
.elementor-widget-jaguar_checkout_peru .jcp-shell .woocommerce-form-coupon-toggle,
.elementor-widget-jaguar_checkout_peru .jcp-shell .woocommerce-info,
.elementor-widget-jaguar_checkout_peru .jcp-shell .woocommerce-form-coupon{
    background: var(--jcp-coupon-bg) !important;
}

/* Borde del cupón */
.elementor-widget-jaguar_checkout_peru .jcp-shell .woocommerce-form-coupon-toggle,
.elementor-widget-jaguar_checkout_peru .jcp-shell .woocommerce-info,
.elementor-widget-jaguar_checkout_peru .jcp-shell .woocommerce-form-coupon{
    border-color: var(--jcp-coupon-border, #F5B800) !important;
}

/* Botones WooCommerce dentro del checkout */
.elementor-widget-jaguar_checkout_peru .jcp-shell #place_order,
.elementor-widget-jaguar_checkout_peru .jcp-shell .woocommerce-form-coupon button.button,
.elementor-widget-jaguar_checkout_peru .jcp-shell button[name="apply_coupon"]{
    transition: all .25s ease !important;
}

/* Badge seguro */
.elementor-widget-jaguar_checkout_peru .jcp-secure-badge{
    border: 1px solid rgba(245,184,0,.45) !important;
}

/* Evita que estilos del tema pisen el cupón */
.elementor-widget-jaguar_checkout_peru .jcp-shell .woocommerce-info::before{
    color: inherit !important;
}


/* ==========================================================
   BADGE CHECKOUT SEGURO FIX
========================================================== */

.elementor-widget-jaguar_checkout_peru .jcp-secure-badge,
.elementor-widget-jaguar_checkout_peru .jaguar-checkout-secure-badge,
.elementor-widget-jaguar_checkout_peru .jcp-header-badge,
.elementor-widget-jaguar_checkout_peru [class*="secure-badge"],
.elementor-widget-jaguar_checkout_peru [class*="checkout-secure"]{
    display:inline-flex !important;
    align-items:center !important;
    gap:7px !important;
    width:max-content !important;
    background-color:var(--jcp-secure-badge-bg, #FFF7DC) !important;
    background:var(--jcp-secure-badge-bg, #FFF7DC) !important;
    border:1px solid rgba(245,184,0,.45) !important;
    border-radius:999px !important;
    padding:8px 14px !important;
    color:inherit !important;
}

.elementor-widget-jaguar_checkout_peru .jcp-secure-badge *,
.elementor-widget-jaguar_checkout_peru .jaguar-checkout-secure-badge *,
.elementor-widget-jaguar_checkout_peru .jcp-header-badge *{
    background:transparent !important;
}


/* ==========================================================
   REMOVE CHECKOUT SEGURO BADGE
========================================================== */

.jcp-secure-badge,
.jaguar-checkout-secure-badge,
.jcp-header-badge,
[class*="secure-badge"],
[class*="checkout-secure"]{
    display:none !important;
}


/* FORCE REMOVE CHECKOUT BADGE */

.jcp-secure-badge,
.jaguar-checkout-secure-badge,
.jcp-header-badge,
[class*="secure-badge"],
[class*="checkout-secure"],
*:has(> .jcp-secure-badge){
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    height:0 !important;
    width:0 !important;
    overflow:hidden !important;
    padding:0 !important;
    margin:0 !important;
}


/* ==========================================================
   FIX CAMPOS DUPLICADOS
   Oculta las copias inferiores de Tipo de comprobante y DNI
   sin mover la primera fila correcta.
========================================================== */

.jcp-shell #tipo_comprobante_field,
.jcp-shell #dni_field,
.jcp-shell .form-row.tipo_comprobante,
.jcp-shell .form-row.dni{
    display:none !important;
}

/* Si WooCommerce imprime dos veces el mismo ID, deja visible solo el primero */
.jcp-shell #billing_tipo_comprobante_field ~ #billing_tipo_comprobante_field,
.jcp-shell #billing_dni_field ~ #billing_dni_field{
    display:none !important;
}


/* ==========================================================
   DEEP DUPLICATE FIX
========================================================== */

.jcp-shell .jcp-duplicate-field{
    display:none !important;
}


/* ===== Datos para comprobante PRO ===== */
.jcp-tax-block{
    background:#fafafa;
    border:1px solid #ececec;
    border-radius:16px;
    padding:20px;
    margin-top:20px;
}

.jcp-tax-title{
    font-size:18px;
    font-weight:700;
    margin-bottom:15px;
}


/* ==========================================================
   FIX FINAL - Bloque Datos para comprobante ordenado
========================================================== */
.jcp-shell .jcp-tax-block{
    grid-column:1 / -1 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    column-gap:16px !important;
    row-gap:16px !important;
    width:100% !important;
    margin:30px 0 22px !important;
    padding:26px !important;
    background:#fff !important;
    border:1px solid var(--jcp-border) !important;
    border-radius:18px !important;
    box-shadow:0 16px 38px rgba(15,27,51,.06) !important;
    box-sizing:border-box !important;
}

.jcp-shell .jcp-tax-title{
    grid-column:1 / -1 !important;
    font-size:20px !important;
    font-weight:850 !important;
    margin:0 0 4px !important;
    padding-bottom:14px !important;
    border-bottom:1px solid var(--jcp-border) !important;
    color:var(--jcp-text) !important;
}

.jcp-shell .jcp-tax-block .form-row{
    width:100% !important;
    float:none !important;
    clear:none !important;
    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;
}

.jcp-shell .jcp-tax-block #jcp_document_type_field{
    grid-column:1 / 2 !important;
    grid-row:auto !important;
}

.jcp-shell .jcp-tax-block #jcp_dni_field,
.jcp-shell .jcp-tax-block #jcp_ruc_field{
    grid-column:2 / 3 !important;
    grid-row:auto !important;
}

.jcp-shell .jcp-tax-block #jcp_razon_social_field{
    grid-column:1 / -1 !important;
    grid-row:auto !important;
}

@media(max-width:768px){
    .jcp-shell .jcp-tax-block{
        grid-template-columns:1fr !important;
        padding:20px !important;
    }
    .jcp-shell .jcp-tax-block #jcp_document_type_field,
    .jcp-shell .jcp-tax-block #jcp_dni_field,
    .jcp-shell .jcp-tax-block #jcp_ruc_field,
    .jcp-shell .jcp-tax-block #jcp_razon_social_field{
        grid-column:1 / -1 !important;
    }
}
