/* ============================================================
   Woo Vietnam Address v1.7
   ============================================================ */

/* Ẩn field không cần */
#billing_postcode_field,  #shipping_postcode_field,
#billing_city_field,      #shipping_city_field,
#billing_country_field,   #shipping_country_field,
#billing_address_2_field, #shipping_address_2_field,
#billing_last_name_field, #shipping_last_name_field,
#billing_company_field,   #shipping_company_field {
    display: none !important;
}

/* ============================================================
   LAYOUT – flex column, từng field xếp theo order
   ============================================================ */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 16px !important;
}

/* Mặc định full width */
.woocommerce-billing-fields__field-wrapper > p,
.woocommerce-shipping-fields__field-wrapper > p {
    width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Half width cho first_name, phone, province, district */
#billing_first_name_field,
#shipping_first_name_field,
#billing_phone_field,
#billing_province_field,
#shipping_province_field,
#billing_district_field,
#shipping_district_field {
    width: calc(50% - 8px) !important;
}

/* ============================================================
   THỨ TỰ
   Hàng 1: first_name | phone
   Hàng 2: email (full)
   Hàng 3: province | district
   Hàng 4: ward (full)
   Hàng 5: address_1 (full)
   ============================================================ */
#billing_first_name_field  { order: 1 !important; }
#billing_phone_field       { order: 2 !important; }
#billing_email_field       { order: 3 !important; }
#billing_province_field    { order: 4 !important; }
#billing_district_field    { order: 5 !important; }
#billing_ward_field        { order: 6 !important; }
#billing_address_1_field   { order: 7 !important; }

#shipping_first_name_field { order: 1 !important; }
#shipping_province_field   { order: 2 !important; }
#shipping_district_field   { order: 3 !important; }
#shipping_ward_field       { order: 4 !important; }
#shipping_address_1_field  { order: 5 !important; }

/* Đẩy field ẩn xuống đáy */
#billing_last_name_field,   #shipping_last_name_field,
#billing_country_field,     #shipping_country_field,
#billing_state_field,       #shipping_state_field,
#billing_city_field,        #shipping_city_field,
#billing_postcode_field,    #shipping_postcode_field,
#billing_address_2_field,   #shipping_address_2_field,
#billing_company_field,     #shipping_company_field {
    order: 99 !important;
}

/* ============================================================
   SELECT2 style
   ============================================================ */
#billing_province_field .select2-container,
#billing_district_field .select2-container,
#billing_ward_field .select2-container,
#shipping_province_field .select2-container,
#shipping_district_field .select2-container,
#shipping_ward_field .select2-container {
    width: 100% !important;
}

#billing_province_field .select2-selection--single,
#billing_district_field .select2-selection--single,
#billing_ward_field .select2-selection--single,
#shipping_province_field .select2-selection--single,
#shipping_district_field .select2-selection--single,
#shipping_ward_field .select2-selection--single {
    height: 42px !important;
    border: 1px solid #e1e1e1 !important;
    border-radius: 3px !important;
    background: #fff !important;
}

#billing_province_field .select2-selection__rendered,
#billing_district_field .select2-selection__rendered,
#billing_ward_field .select2-selection__rendered,
#shipping_province_field .select2-selection__rendered,
#shipping_district_field .select2-selection__rendered,
#shipping_ward_field .select2-selection__rendered {
    line-height: 40px !important;
    padding: 0 12px !important;
    color: #333 !important;
    font-size: 14px !important;
}

#billing_province_field .select2-selection__arrow,
#billing_district_field .select2-selection__arrow,
#billing_ward_field .select2-selection__arrow,
#shipping_province_field .select2-selection__arrow,
#shipping_district_field .select2-selection__arrow,
#shipping_ward_field .select2-selection__arrow {
    height: 40px !important;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #000 !important;
}

.select2-search__field {
    font-size: 14px !important;
    padding: 6px 10px !important;
}

/* Province label */
#billing_province_field label,
#shipping_province_field label {
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
    display: block !important;
    color: #333 !important;
}

/* ============================================================
   CHECKOUT FORM – STYLE ĐẸP HƠN
   ============================================================ */

/* Label */
.woocommerce-checkout .form-row label,
.woocommerce-checkout .woocommerce-input-wrapper label {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #555 !important;
    letter-spacing: .03em !important;
    margin-bottom: 5px !important;
    display: block !important;
}

/* Input + Select + Textarea */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
    height: 44px !important;
    padding: 0 14px !important;
    font-size: 14px !important;
    color: #333 !important;
    background: #fafafa !important;
    border: 1.5px solid #e0e0e0 !important;
    border-radius: 8px !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color .2s, box-shadow .2s, background .2s !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
.woocommerce-checkout .form-row textarea {
    height: auto !important;
    padding: 12px 14px !important;
    min-height: 80px !important;
}

/* Focus – gradient xanh tím */
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
    border-color: #6c3fe8 !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(108,63,232,.12) !important;
}

/* Select arrow */
.woocommerce-checkout .form-row select {
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23888' d='M5 6L0 0h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-color: #fafafa !important;
    padding-right: 36px !important;
}

/* Flatsome fl-label */
.woocommerce-checkout .fl-label {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #555 !important;
}

/* Select2 style đồng bộ */
.woocommerce-checkout .select2-container--default .select2-selection--single {
    height: 44px !important;
    border: 1.5px solid #e0e0e0 !important;
    border-radius: 8px !important;
    background: #fafafa !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 42px !important;
    padding: 0 14px !important;
    font-size: 14px !important;
    color: #333 !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px !important;
}
.woocommerce-checkout .select2-container--default.select2-container--focus .select2-selection--single,
.woocommerce-checkout .select2-container--default.select2-container--open .select2-selection--single {
    border-color: #6c3fe8 !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(108,63,232,.12) !important;
}

/* Inject province field đồng bộ */
#billing_province_field select,
#shipping_province_field select {
    height: 44px !important;
    padding: 0 36px 0 14px !important;
    font-size: 14px !important;
    border: 1.5px solid #e0e0e0 !important;
    border-radius: 8px !important;
    background-color: #fafafa !important;
}
#billing_province_field select:focus,
#shipping_province_field select:focus {
    border-color: #6c3fe8 !important;
    box-shadow: 0 0 0 3px rgba(108,63,232,.12) !important;
    background: #fff !important;
}

/* Section title */
.woocommerce-checkout h3 {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #333 !important;
    padding-bottom: 10px !important;
    border-bottom: 2px solid #6c3fe8 !important;
    margin-bottom: 20px !important;
}

/* ============================================================
   LABEL – reset về static, để theme tự xử lý
   ============================================================ */
.woocommerce-checkout .form-row .woocommerce-input-wrapper {
    position: static !important;
    display: block !important;
}

.woocommerce-checkout .form-row .woocommerce-input-wrapper > label,
.woocommerce-checkout .form-row > label {
    position: static !important;
    transform: none !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #555 !important;
    pointer-events: auto !important;
    background: transparent !important;
    padding: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
    max-width: 100% !important;
    display: block !important;
    margin-bottom: 5px !important;
}

/* Flatsome fl-wrap – reset luôn */
.woocommerce-checkout .fl-wrap {
    position: relative !important;
}
.woocommerce-checkout .fl-wrap .fl-label {
    position: static !important;
    transform: none !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #555 !important;
    display: block !important;
    margin-bottom: 5px !important;
}