/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/


/**
 * HYBRID CSS: India Badge for Classic & Block Checkout
 * Targets #billing_phone_field (Classic) and .wc-block-components-phone-input (Blocks)
 */

/* 1. Container Setup */
#billing_phone_field, 
.wc-block-checkout__billing-fields .wc-block-components-phone-input {
    position: relative !important;
}

/* 2. The India +91 Badge */
#billing_phone_field::before,
.wc-block-checkout__billing-fields .wc-block-components-phone-input::before {
    content: "🇮🇳 +91" !important;
    position: absolute !important;
    left: 10px !important;
    /* Alignment for Classic (Bottom-up) and Blocks (Center) */
    top: 38px !important; 
    font-size: 13px !important;
    font-weight: bold !important;
    color: #333 !important;
    background: #f8f9fa !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    border: 1px solid #ced4da !important;
    z-index: 5 !important;
    pointer-events: none !important;
}

/* Adjust Block vertical alignment (React components use different spacing) */
.wc-block-checkout__billing-fields .wc-block-components-phone-input::before {
    top: 50% !important;
    transform: translateY(-50%) !important;
}

/* 3. Input Padding (Makes room for the badge) */
#billing_phone_field input,
.wc-block-checkout__billing-fields .wc-block-components-phone-input input,
.wc-block-checkout__billing-fields .wc-block-components-phone-input label {
    padding-left: 80px !important;
}

/* 4. Shipping Field Cleanup (Ensures no badge on shipping) */
#shipping_phone_field::before,
.wc-block-checkout__shipping-fields .wc-block-components-phone-input::before {
    display: none !important;
}

#shipping_phone_field input,
.wc-block-checkout__shipping-fields .wc-block-components-phone-input input {
    padding-left: 15px !important;
}