/**
 * ESMERALDA — PREMIUM CHECKOUT
 * Rediseño completo del checkout con estética dark luxury.
 * Cargado solo en páginas checkout/order-received.
 */

/* ═══════════════════════════════════════════════════════════
   1. RESET & BASE
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout {
    background: #030706;
    color: #e5e2e1;
}

body.woocommerce-checkout *,
body.woocommerce-checkout *::before,
body.woocommerce-checkout *::after {
    box-sizing: border-box;
}

/* ═══════════════════════════════════════════════════════════
   2. PAGE BACKGROUND
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .wp-site-blocks {
    background:
        radial-gradient(ellipse 60% 40% at 0% 0%, rgba(52,211,153,.07) 0%, transparent 55%),
        radial-gradient(ellipse 40% 30% at 100% 80%, rgba(212,175,55,.04) 0%, transparent 50%),
        #030706;
    min-height: 100vh;
}

/* ═══════════════════════════════════════════════════════════
   3. MAIN PAGE + CHECKOUT SHELL — contenedores raíz
   ═══════════════════════════════════════════════════════════ */

/* Quitar padding-top inline del main anterior */
main.esm-wc-page {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* El wrapper que centra y da respiro vertical al contenido */
.esm-ckout-body {
    max-width: 1200px;
    margin: 0 auto;
    padding: 52px 32px 100px;
}

body.woocommerce-checkout .esm-checkout-shell {
    padding-top: 0;
    width: 100%;
}

body.woocommerce-checkout .esm-checkout-shell > .woocommerce {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #e5e2e1;
}

/* ═══════════════════════════════════════════════════════════
   4. CHECKOUT HEADER STRIP
   ═══════════════════════════════════════════════════════════ */

.esm-ckout-header {
    width: 100%;
    border-bottom: 1px solid rgba(52,211,153,.1);
    background: rgba(3,7,6,.9);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.esm-ckout-header__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 32px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.esm-ckout-header__brand {
    font-family: "Noto Serif", serif;
    font-size: 16px;
    font-weight: 400;
    color: #f4f4f5;
    letter-spacing: .06em;
}

.esm-ckout-header__secure {
    display: flex;
    align-items: center;
    gap: 7px;
    font-family: "Manrope", sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: rgba(52,211,153,.65);
}

.esm-ckout-header__steps {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: "Manrope", sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.esm-hstep            { color: rgba(161,161,170,.35); }
.esm-hstep--done      { color: rgba(52,211,153,.45); text-decoration: line-through; text-decoration-color: rgba(52,211,153,.3); }
.esm-hstep--active    { color: #34d399; }
.esm-hstep__arrow     { color: rgba(161,161,170,.25); font-size: 12px; }

/* ═══════════════════════════════════════════════════════════
   5. MAIN CONTENT WRAPPER
   ═══════════════════════════════════════════════════════════ */

.esm-ckout-body {
    max-width: 1200px;
    margin: 0 auto;
    padding: 48px 32px 100px;
}

/* ═══════════════════════════════════════════════════════════
   6. FORM GRID — 2 columnas
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout form.checkout,
body.woocommerce-checkout form.woocommerce-checkout {
    display: grid !important;
    grid-template-columns: 1fr 380px !important;
    gap: 0 40px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* columna izquierda */
body.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup,
body.woocommerce-checkout form.checkout > #customer_details {
    grid-column: 1 !important;
}

body.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup {
    grid-row: 1 !important;
}

body.woocommerce-checkout form.checkout > #customer_details {
    grid-row: 2 !important;
}

/* ═══════════════════════════════════════════════════════════
   7. SECCIÓN TARJETA — base reutilizable
   ═══════════════════════════════════════════════════════════ */

.esm-section-card {
    background: rgba(10,15,12,.72);
    border: 1px solid rgba(52,211,153,.12);
    border-radius: 8px;
    padding: 32px;
    position: relative;
    overflow: hidden;
}

.esm-section-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 60% at 0% 0%, rgba(52,211,153,.05) 0%, transparent 60%);
    pointer-events: none;
}

.esm-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: "Manrope", sans-serif;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .32em;
    text-transform: uppercase;
    color: rgba(52,211,153,.7);
    margin-bottom: 28px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(52,211,153,.1);
}

.esm-section-title svg {
    opacity: .6;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════
   8. CUSTOMER DETAILS (billing + shipping)
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout #customer_details {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

body.woocommerce-checkout #customer_details .col-1,
body.woocommerce-checkout #customer_details .col-2 {
    float: none !important;
    width: 100% !important;
    padding: 32px !important;
    margin: 0 !important;
    background: rgba(10,15,12,.72) !important;
    border: 1px solid rgba(52,211,153,.12) !important;
    border-radius: 8px !important;
    position: relative !important;
    overflow: hidden !important;
}

body.woocommerce-checkout #customer_details .col-1::before,
body.woocommerce-checkout #customer_details .col-2::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 60% at 0% 0%, rgba(52,211,153,.05) 0%, transparent 60%);
    pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════
   9. SECTION TITLES dentro de billing / shipping
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .woocommerce-billing-fields h3,
body.woocommerce-checkout .woocommerce-shipping-fields h3,
body.woocommerce-checkout .woocommerce-additional-fields h3 {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: .32em !important;
    text-transform: uppercase !important;
    color: rgba(52,211,153,.7) !important;
    margin: 0 0 28px !important;
    padding-bottom: 16px !important;
    border-bottom: 1px solid rgba(52,211,153,.1) !important;
}

body.woocommerce-checkout .woocommerce-billing-fields h3::before {
    content: '01';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: rgba(52,211,153,.12);
    border: 1px solid rgba(52,211,153,.25);
    border-radius: 50%;
    font-size: 8px;
    font-weight: 800;
    color: #34d399;
    letter-spacing: 0;
    flex-shrink: 0;
}

body.woocommerce-checkout .woocommerce-shipping-fields h3::before {
    content: '02';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: rgba(52,211,153,.12);
    border: 1px solid rgba(52,211,153,.25);
    border-radius: 50%;
    font-size: 8px;
    font-weight: 800;
    color: #34d399;
    letter-spacing: 0;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════
   10. FORM FIELDS GRID
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px 20px !important;
}

body.woocommerce-checkout .form-row {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
}

/* Campos de ancho completo */
body.woocommerce-checkout .form-row-wide,
body.woocommerce-checkout #billing_country_field,
body.woocommerce-checkout #billing_address_1_field,
body.woocommerce-checkout #billing_address_2_field,
body.woocommerce-checkout #billing_phone_field,
body.woocommerce-checkout #billing_email_field,
body.woocommerce-checkout #shipping_address_1_field,
body.woocommerce-checkout #shipping_address_2_field,
body.woocommerce-checkout #order_comments_field {
    grid-column: 1 / -1 !important;
}

/* ═══════════════════════════════════════════════════════════
   11. LABELS
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .form-row label,
body.woocommerce-checkout label {
    display: block !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    color: rgba(161,161,170,.75) !important;
    margin-bottom: 8px !important;
    line-height: 1 !important;
}

body.woocommerce-checkout .required {
    color: rgba(248,113,113,.7) !important;
    font-weight: 400 !important;
}

/* ═══════════════════════════════════════════════════════════
   12. INPUTS
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .input-text,
body.woocommerce-checkout input[type="text"],
body.woocommerce-checkout input[type="email"],
body.woocommerce-checkout input[type="tel"],
body.woocommerce-checkout input[type="number"],
body.woocommerce-checkout input[type="password"],
body.woocommerce-checkout select,
body.woocommerce-checkout textarea {
    width: 100% !important;
    min-height: 52px !important;
    background: rgba(5,8,7,.8) !important;
    border: 1px solid rgba(52,211,153,.18) !important;
    border-radius: 5px !important;
    color: #e5e2e1 !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    padding: 14px 16px !important;
    transition: border-color .25s ease, box-shadow .25s ease, background .25s ease !important;
    outline: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

body.woocommerce-checkout textarea {
    min-height: 110px !important;
    resize: vertical !important;
}

body.woocommerce-checkout .input-text:hover,
body.woocommerce-checkout input[type="text"]:hover,
body.woocommerce-checkout input[type="email"]:hover,
body.woocommerce-checkout input[type="tel"]:hover,
body.woocommerce-checkout select:hover {
    border-color: rgba(52,211,153,.32) !important;
    background: rgba(8,14,11,.9) !important;
}

body.woocommerce-checkout .input-text:focus,
body.woocommerce-checkout input[type="text"]:focus,
body.woocommerce-checkout input[type="email"]:focus,
body.woocommerce-checkout input[type="tel"]:focus,
body.woocommerce-checkout input[type="number"]:focus,
body.woocommerce-checkout input[type="password"]:focus,
body.woocommerce-checkout select:focus,
body.woocommerce-checkout textarea:focus {
    background: rgba(8,14,11,.95) !important;
    border-color: rgba(52,211,153,.55) !important;
    box-shadow: 0 0 0 3px rgba(52,211,153,.1), 0 0 20px rgba(52,211,153,.06) !important;
    outline: none !important;
    color: #f4f4f5 !important;
}

body.woocommerce-checkout input::placeholder,
body.woocommerce-checkout textarea::placeholder {
    color: rgba(161,161,170,.3) !important;
}

/* ═══════════════════════════════════════════════════════════
   13. SELECT2
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .select2-container .select2-selection--single {
    height: 52px !important;
    background: rgba(5,8,7,.8) !important;
    border: 1px solid rgba(52,211,153,.18) !important;
    border-radius: 5px !important;
    transition: border-color .25s ease, box-shadow .25s ease !important;
}

body.woocommerce-checkout .select2-container .select2-selection--single:hover {
    border-color: rgba(52,211,153,.32) !important;
}

body.woocommerce-checkout .select2-container--open .select2-selection--single,
body.woocommerce-checkout .select2-container--focus .select2-selection--single {
    border-color: rgba(52,211,153,.55) !important;
    box-shadow: 0 0 0 3px rgba(52,211,153,.1) !important;
}

body.woocommerce-checkout .select2-container .select2-selection__rendered {
    color: #e5e2e1 !important;
    line-height: 52px !important;
    padding-left: 16px !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 13px !important;
}

body.woocommerce-checkout .select2-container .select2-selection__arrow {
    height: 52px !important;
    right: 12px !important;
}

body.woocommerce-checkout .select2-container .select2-selection__arrow b {
    border-color: rgba(161,161,170,.4) transparent transparent !important;
}

.select2-dropdown {
    background: #0d1410 !important;
    border: 1px solid rgba(52,211,153,.22) !important;
    border-radius: 6px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,.6) !important;
}

.select2-results__option {
    color: #d4d4d8 !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 13px !important;
    padding: 10px 16px !important;
}

.select2-results__option--highlighted[aria-selected] {
    background: rgba(52,211,153,.12) !important;
    color: #d1fae5 !important;
}

.select2-results__option[aria-selected="true"] {
    background: rgba(52,211,153,.08) !important;
    color: #34d399 !important;
}

.select2-search--dropdown .select2-search__field {
    background: rgba(3,7,6,.9) !important;
    border: 1px solid rgba(52,211,153,.2) !important;
    color: #e5e2e1 !important;
    border-radius: 4px !important;
    padding: 8px 12px !important;
    font-family: "Manrope", sans-serif !important;
}

/* ═══════════════════════════════════════════════════════════
   14. COUPON TOGGLE
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout .checkout_coupon {
    background: rgba(10,15,12,.6) !important;
    border: 1px solid rgba(52,211,153,.1) !important;
    border-radius: 7px !important;
    padding: 16px 24px !important;
    margin-bottom: 24px !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 12px !important;
    color: rgba(161,161,170,.65) !important;
    text-align: center !important;
    grid-column: 1 !important;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: rgba(161,161,170,.65) !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 12px !important;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle a,
body.woocommerce-checkout .woocommerce-form-coupon-toggle .showcoupon {
    color: rgba(52,211,153,.8) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: color .2s !important;
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle a:hover {
    color: #34d399 !important;
}

body.woocommerce-checkout .checkout_coupon .form-row {
    display: flex !important;
    gap: 12px !important;
    align-items: flex-end !important;
}

body.woocommerce-checkout .checkout_coupon .form-row .input-text {
    flex: 1 !important;
}

body.woocommerce-checkout .checkout_coupon .form-row button {
    min-width: 120px !important;
    height: 52px !important;
    background: rgba(52,211,153,.12) !important;
    border: 1px solid rgba(52,211,153,.3) !important;
    color: #34d399 !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: .22em !important;
    text-transform: uppercase !important;
    border-radius: 5px !important;
    cursor: pointer !important;
    transition: all .25s ease !important;
    white-space: nowrap !important;
}

body.woocommerce-checkout .checkout_coupon .form-row button:hover {
    background: rgba(52,211,153,.2) !important;
    border-color: rgba(52,211,153,.5) !important;
}

/* ═══════════════════════════════════════════════════════════
   15. ORDER REVIEW PANEL (columna derecha)
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout #order_review_heading {
    font-family: "Manrope", sans-serif !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: .32em !important;
    text-transform: uppercase !important;
    color: rgba(52,211,153,.7) !important;
    margin: 0 !important;
    padding: 20px 24px 16px !important;
    background: rgba(8,13,10,.95) !important;
    border: 1px solid rgba(52,211,153,.14) !important;
    border-bottom: none !important;
    border-radius: 8px 8px 0 0 !important;
}

body.woocommerce-checkout #order_review {
    background: rgba(8,13,10,.92) !important;
    border: 1px solid rgba(52,211,153,.14) !important;
    border-top: none !important;
    border-radius: 0 0 8px 8px !important;
    padding: 0 !important;
    overflow: visible !important;
}

/* Panel sticky */
#esm-order-sticky-wrapper {
    grid-column: 2 !important;
    grid-row: 1 / span 10 !important;
    position: sticky !important;
    top: 88px !important;
    align-self: start !important;
    z-index: 5 !important;
    display: flex !important;
    flex-direction: column !important;
    height: fit-content !important;
}

#esm-order-sticky-wrapper #order_review_heading {
    grid-column: unset !important;
    position: static !important;
}

#esm-order-sticky-wrapper #order_review {
    grid-column: unset !important;
    position: static !important;
}

/* ═══════════════════════════════════════════════════════════
   16. ORDER REVIEW TABLE
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .woocommerce-checkout-review-order-table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table thead {
    background: rgba(52,211,153,.05) !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
    font-family: "Manrope", sans-serif !important;
    font-size: 8px !important;
    font-weight: 700 !important;
    letter-spacing: .28em !important;
    text-transform: uppercase !important;
    color: rgba(161,161,170,.5) !important;
    padding: 12px 24px !important;
    border-bottom: 1px solid rgba(52,211,153,.1) !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .cart_item td {
    padding: 16px 24px !important;
    border-bottom: 1px solid rgba(52,211,153,.07) !important;
    vertical-align: middle !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .cart_item td:first-child {
    color: #e5e2e1 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .cart_item .product-name {
    color: #e5e2e1 !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .cart_item .product-name .product-quantity {
    color: rgba(161,161,170,.5) !important;
    font-size: 11px !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .cart_item .product-total .woocommerce-Price-amount,
body.woocommerce-checkout .woocommerce-checkout-review-order-table td .woocommerce-Price-amount {
    color: #e5e2e1 !important;
    font-weight: 500 !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total td {
    border-top: 1px solid rgba(52,211,153,.12) !important;
    padding: 18px 24px !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total .woocommerce-Price-amount {
    color: #d4af37 !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    letter-spacing: .01em !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total th {
    color: rgba(161,161,170,.7) !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .2em !important;
    text-transform: uppercase !important;
    padding: 18px 24px !important;
    border-top: 1px solid rgba(52,211,153,.12) !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .cart-subtotal td,
body.woocommerce-checkout .woocommerce-checkout-review-order-table .shipping td,
body.woocommerce-checkout .woocommerce-checkout-review-order-table .cart-subtotal th,
body.woocommerce-checkout .woocommerce-checkout-review-order-table .shipping th {
    padding: 14px 24px !important;
    border-bottom: 1px solid rgba(52,211,153,.06) !important;
    color: rgba(161,161,170,.65) !important;
    font-size: 12px !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table .cart-subtotal td .woocommerce-Price-amount,
body.woocommerce-checkout .woocommerce-checkout-review-order-table .shipping td .woocommerce-Price-amount {
    color: #d1d5db !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

/* ═══════════════════════════════════════════════════════════
   17. PAYMENT SECTION
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout #payment {
    background: transparent !important;
    border-top: 1px solid rgba(52,211,153,.1) !important;
    padding: 0 !important;
    overflow: visible !important;
}

body.woocommerce-checkout #payment ul.payment_methods {
    border: none !important;
    padding: 20px 24px 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

body.woocommerce-checkout #payment ul.payment_methods li.payment_method {
    padding: 14px 0 !important;
    border-bottom: 1px solid rgba(52,211,153,.07) !important;
}

body.woocommerce-checkout #payment ul.payment_methods li.payment_method:last-child {
    border-bottom: none !important;
}

body.woocommerce-checkout #payment ul.payment_methods li label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #d4d4d8 !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
}

body.woocommerce-checkout #payment ul.payment_methods li input[type="radio"] {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    accent-color: #34d399 !important;
    cursor: pointer !important;
}

body.woocommerce-checkout #payment div.payment_box {
    background: rgba(52,211,153,.06) !important;
    border: 1px solid rgba(52,211,153,.12) !important;
    border-radius: 6px !important;
    color: #a1a1aa !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    margin: 12px 0 !important;
    overflow: visible !important;
    padding: 14px 16px !important;
}

body.woocommerce-checkout #payment div.payment_box::before {
    border-bottom-color: rgba(52,211,153,.06) !important;
}

body.woocommerce-checkout #payment .privacy-policy-text {
    padding: 0 24px !important;
    color: rgba(161,161,170,.5) !important;
    font-size: 11px !important;
    line-height: 1.65 !important;
}

body.woocommerce-checkout #payment .privacy-policy-text a {
    color: rgba(52,211,153,.65) !important;
}

/* Iframes de pago */
body.woocommerce-checkout #payment iframe,
body.woocommerce-checkout #payment .payment_box > iframe,
body.woocommerce-checkout #payment [class*="stripe"],
body.woocommerce-checkout #payment [class*="paypal"],
body.woocommerce-checkout #payment [class*="ppcp"],
body.woocommerce-checkout #payment [id*="paypal"] {
    overflow: visible !important;
    display: block !important;
    width: 100% !important;
    min-height: 44px !important;
}

body.woocommerce-checkout #order_review { overflow: visible !important; }
#esm-order-sticky-wrapper              { overflow: visible !important; }

/* ═══════════════════════════════════════════════════════════
   18. PLACE ORDER BUTTON
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .form-row.place-order {
    padding: 20px 24px 24px !important;
    margin: 0 !important;
}

body.woocommerce-checkout #place_order,
body.woocommerce-checkout button#place_order {
    display: block !important;
    width: 100% !important;
    min-height: 58px !important;
    background: linear-gradient(135deg, #34d399 0%, #059669 55%, #047857 100%) !important;
    color: #012c20 !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .3em !important;
    text-transform: uppercase !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: 0 0 40px rgba(52,211,153,.18), 0 4px 20px rgba(0,0,0,.4) !important;
    transition: all .4s cubic-bezier(.16,1,.3,1) !important;
}

body.woocommerce-checkout #place_order::after {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 60%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.15), transparent);
    transform: skewX(-20deg);
    transition: .6s;
}

body.woocommerce-checkout #place_order:hover::after {
    left: 160%;
}

body.woocommerce-checkout #place_order:hover {
    box-shadow: 0 0 60px rgba(52,211,153,.28), 0 8px 30px rgba(0,0,0,.5) !important;
    transform: translateY(-1px) !important;
}

/* ═══════════════════════════════════════════════════════════
   19. SHIPPING CHECKBOX (same as billing)
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .woocommerce-form__label-for-checkbox {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    cursor: pointer !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: .03em !important;
    text-transform: none !important;
    color: rgba(161,161,170,.75) !important;
}

body.woocommerce-checkout input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    accent-color: #34d399 !important;
    cursor: pointer !important;
    border-radius: 3px !important;
}

/* ═══════════════════════════════════════════════════════════
   20. NOTICES
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .woocommerce-NoticeGroup {
    grid-column: 1 / -1 !important;
    margin-bottom: 0 !important;
}

body.woocommerce-checkout .woocommerce-error,
body.woocommerce-checkout .woocommerce-message,
body.woocommerce-checkout .woocommerce-info {
    background: rgba(10,15,12,.8) !important;
    border-left: 3px solid rgba(52,211,153,.5) !important;
    border-radius: 6px !important;
    color: #d4d4d8 !important;
    font-family: "Manrope", sans-serif !important;
    font-size: 13px !important;
    padding: 14px 20px !important;
    margin-bottom: 16px !important;
}

body.woocommerce-checkout .woocommerce-error {
    border-left-color: rgba(248,113,113,.5) !important;
}

body.woocommerce-checkout .woocommerce-error::before {
    color: rgba(248,113,113,.7) !important;
}

/* ═══════════════════════════════════════════════════════════
   21. TRUST BADGES
   ═══════════════════════════════════════════════════════════ */

.esm-ckout-trust {
    border-top: 1px solid rgba(52,211,153,.07);
    padding: 24px 32px;
}

.esm-ckout-trust__inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 36px;
    flex-wrap: wrap;
}

.esm-trust-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: "Manrope", sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: rgba(161,161,170,.38);
}

.esm-trust-item svg {
    color: rgba(52,211,153,.32);
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════
   22. CHECKOUT HEADER STRIP (page-checkout.php)
   ═══════════════════════════════════════════════════════════ */

.esm-ckout-topbar {
    background: rgba(3,7,6,.9);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(52,211,153,.08);
}

.esm-ckout-topbar__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 32px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.esm-ckout-topbar__brand {
    font-family: "Noto Serif", serif;
    font-size: 15px;
    font-weight: 400;
    color: #f4f4f5;
    letter-spacing: .06em;
}

.esm-ckout-topbar__label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-family: "Manrope", sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: rgba(52,211,153,.65);
}

.esm-ckout-topbar__steps {
    display: flex;
    align-items: center;
    gap: 7px;
    font-family: "Manrope", sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.esm-step        { color: rgba(161,161,170,.3); }
.esm-step--done  { color: rgba(52,211,153,.45); text-decoration: line-through; text-decoration-color: rgba(52,211,153,.3); }
.esm-step--active{ color: #34d399; }
.esm-step__sep   { color: rgba(161,161,170,.22); font-size: 11px; }

/* ═══════════════════════════════════════════════════════════
   23. WOOCOMMERCE BEFORE-FORM NOTICE (login etc)
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .woocommerce-form-login-toggle,
body.woocommerce-checkout .woocommerce-form-login {
    background: rgba(10,15,12,.65) !important;
    border: 1px solid rgba(52,211,153,.1) !important;
    border-radius: 7px !important;
    padding: 20px 28px !important;
    margin-bottom: 24px !important;
    color: rgba(161,161,170,.7) !important;
    font-size: 13px !important;
}

body.woocommerce-checkout .woocommerce-form-login-toggle a {
    color: rgba(52,211,153,.8) !important;
}

/* ═══════════════════════════════════════════════════════════
   24. GLOBAL ESTILOS HEREDADOS — reset conflictos
   ═══════════════════════════════════════════════════════════ */

body.woocommerce-checkout .woocommerce::before {
    display: none !important;
}

body.woocommerce-checkout .woocommerce-breadcrumb,
body.woocommerce-checkout nav[aria-label="Breadcrumb"],
body.woocommerce-checkout .hostinger-ai-page-title,
body.woocommerce-checkout h1.entry-title,
body.woocommerce-checkout .page-title {
    display: none !important;
}

/* ═══════════════════════════════════════════════════════════
   25. RESPONSIVE — tablet
   ═══════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
    body.woocommerce-checkout form.checkout,
    body.woocommerce-checkout form.woocommerce-checkout {
        grid-template-columns: 1fr !important;
    }

    #esm-order-sticky-wrapper {
        grid-column: 1 !important;
        grid-row: auto !important;
        position: static !important;
        top: auto !important;
        width: 100% !important;
        margin-top: 24px !important;
    }

    body.woocommerce-checkout #order_review_heading {
        border-radius: 8px 8px 0 0 !important;
    }

    .esm-ckout-topbar__steps,
    .esm-ckout-topbar__brand {
        display: none;
    }

    .esm-ckout-body {
        padding: 32px 20px 80px;
    }
}

@media (max-width: 640px) {
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
    body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
        grid-template-columns: 1fr !important;
    }

    body.woocommerce-checkout #customer_details .col-1,
    body.woocommerce-checkout #customer_details .col-2 {
        padding: 24px 20px !important;
    }

    .esm-ckout-topbar__inner {
        padding: 0 20px;
        justify-content: space-between;
    }

    .esm-ckout-trust__inner {
        gap: 20px;
    }

    .esm-trust-item span { display: none; }
    .esm-trust-item svg  { width: 22px; height: 22px; color: rgba(52,211,153,.4); }
}