/**
 * WooCommerce Blocks Checkout Styling
 * Ensures consistent field heights and widths for all checkout fields
 */

/* Global styles for WooCommerce block components */
.wc-block-components-select,
.wc-block-components-text-input {
    height: 48px !important;
    width: 100% !important;
    min-height: 48px !important;
    max-width: 100% !important;
    padding: 0 12px !important;
    font-size: 16px !important;
    line-height: 48px !important;
    box-sizing: border-box !important;
    border: 1px solid #8c8f94 !important;
    border-radius: 4px !important;
    background-color: #fff !important;
}

/* Ensure select elements inside block components have same height */
.wc-block-components-select select {
    height: 48px !important;
    width: 100% !important;
    padding: 0 12px !important;
    font-size: 16px !important;
    line-height: 48px !important;
    border: none !important;
    background: transparent !important;
}

/* Ensure text inputs inside block components have same height */
.wc-block-components-text-input input {
    height: 46px !important;
    padding: 0 !important;
    border: none !important;
    font-size: 16px !important;
    line-height: 46px !important;
    background: transparent !important;
}

/* Target pickup/delivery specific fields */
.aicoso-pickup-delivery-fields .wc-block-components-select,
.aicoso-pickup-delivery-fields .wc-block-components-text-input,
.aicoso-pickup-delivery-fields .components-select-control__input,
.aicoso-pickup-delivery-fields .components-text-control__input {
    height: 48px !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 12px !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
}

/* Focus states */
.wc-block-components-select:focus,
.wc-block-components-text-input:focus,
.wc-block-components-select:focus-within,
.wc-block-components-text-input:focus-within {
    border-color: #007cba !important;
    outline: none !important;
    box-shadow: 0 0 0 1px #007cba !important;
}

/* Ensure consistency in the entire checkout form */
.wc-block-checkout__form .wc-block-components-select,
.wc-block-checkout__form .wc-block-components-text-input,
.wp-block-woocommerce-checkout-contact-information-block .wc-block-components-text-input,
.wp-block-woocommerce-checkout-billing-address-block .wc-block-components-text-input,
.wp-block-woocommerce-checkout-shipping-address-block .wc-block-components-text-input {
    height: 48px !important;
    min-height: 48px !important;
}

/* Style labels consistently */
.wc-block-components-select label,
.wc-block-components-text-input label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    font-size: 14px;
    color: #1e1e1e;
}

/* Ensure dropdowns and inputs in the same row have same height */
.wc-block-checkout__form .wc-block-components-address-form .wc-block-components-select,
.wc-block-checkout__form .wc-block-components-address-form .wc-block-components-text-input {
    height: 48px !important;
}

/* Fix for any nested input or select elements */
.wc-block-checkout__form .wc-block-components-select select,
.wc-block-checkout__form .wc-block-components-text-input input[type="text"],
.wc-block-checkout__form .wc-block-components-text-input input[type="email"],
.wc-block-checkout__form .wc-block-components-text-input input[type="tel"] {
    height: 100% !important;
}

/* Responsive adjustments */
@media (max-width: 767px) {
    .wc-block-components-select,
    .wc-block-components-text-input {
        height: 48px !important;
        font-size: 16px !important;
    }
}

/* Date input wrapper with calendar icon */
.aicoso-date-input-wrap {
    position: relative;
}

.aicoso-date-input-wrap .wc-block-components-text-input {
    padding-right: 40px !important;
}

.aicoso-date-input-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 18px;
    line-height: 1;
    color: #6b6b6b;
}

/* Slightly adjust when native date input shown to avoid overlapping native calendar button */
input[type="date"].wc-block-components-text-input::-webkit-calendar-picker-indicator {
    opacity: 0.8;
}