/**
 * Thai Address WooCommerce - v2.0.7
 * Phone: +66 now in value (not visual prefix)
 * City: Enhanced value protection
 */

/* Hide state dropdown arrow */
svg.wc-blocks-components-select__expand {
    display: none !important;
}

/* ===================================
   PHONE FIELD - VALUE INCLUDES +66
   =================================== */

/* No special styling needed - +66 is now part of the value */

/* ===================================
   PROVINCE/STATE FIELD
   =================================== */

.wc-block-components-address-form__state::after {
    content: " " !important;
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 11px !important;
    color: #888 !important;
    pointer-events: none !important;
}

/* Province field - DISABLED */
.wc-block-components-address-form__state .wc-block-components-combobox,
.wc-block-components-address-form__state .components-combobox,
[class*="state"] .wc-block-components-combobox {
    pointer-events: none !important;
    opacity: 0.7 !important;
    background: #f5f5f5 !important;
}

/* ===================================
   ADDRESS_2 FIELD
   =================================== */

/* Hide address_2 toggle button */
.wc-block-components-address-form__address_2-toggle,
button[class*="address_2"],
.wc-block-components-address-address-wrapper__address_2-toggle {
    display: none !important;
}

/* Always show address_2 field */
.wc-block-components-address-form__address_2,
[class*="address_2"]:not(button):not(.toggle) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
}

/* ===================================
   THAI ADDRESS AUTOCOMPLETE DROPDOWN
   =================================== */

.thai-address-dropdown {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 999999 !important;
    background: #fff !important;
    border: 2px solid #22c55e !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.15) !important;
    max-height: 320px !important;
    overflow-y: auto !important;
    margin-top: 4px !important;
    display: none;
}

.thai-address-dropdown.active {
    display: block !important;
}

.thai-dropdown-item {
    padding: 14px 16px !important;
    cursor: pointer !important;
    border-bottom: 1px solid #f1f5f9 !important;
    font-size: 14px !important;
    color: #334155 !important;
    background: #fff !important;
    transition: all 0.15s ease !important;
    line-height: 1.5 !important;
}

.thai-dropdown-item:last-child {
    border-bottom: none !important;
}

.thai-dropdown-item:hover,
.thai-dropdown-item.highlighted {
    background: #f0fdf4 !important;
    color: #166534 !important;
}

.thai-dropdown-item .thai-item-main {
    font-weight: 500 !important;
    color: #1e293b !important;
}

.thai-dropdown-item .thai-item-detail {
    font-size: 13px !important;
    color: #64748b !important;
    margin-top: 2px !important;
}

.thai-dropdown-item .thai-separator {
    color: #cbd5e1 !important;
    margin: 0 6px !important;
}

.thai-dropdown-item .thai-postcode {
    background: #e0f2fe !important;
    color: #0369a1 !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    margin-left: 8px !important;
}

.thai-dropdown-empty {
    padding: 20px 16px !important;
    text-align: center !important;
    color: #94a3b8 !important;
    font-size: 14px !important;
}

.thai-dropdown-loading {
    padding: 20px 16px !important;
    text-align: center !important;
    color: #64748b !important;
}

/* ===================================
   INPUT WRAPPER
   =================================== */

.thai-input-wrapper {
    position: relative !important;
}

/* Highlight matching text in dropdown */
.thai-highlight {
    background: #fef08a !important;
    padding: 0 1px !important;
    border-radius: 2px !important;
}

/* ===================================
   SCROLLBAR STYLING
   =================================== */

.thai-address-dropdown::-webkit-scrollbar {
    width: 8px;
}

.thai-address-dropdown::-webkit-scrollbar-track {
    background: #f8fafc;
}

.thai-address-dropdown::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.thai-address-dropdown::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* ===================================
   POSTCODE FIELD WITH DROPDOWN
   =================================== */

.thai-postcode-container {
    position: relative !important;
    margin-bottom: 16px !important;
    width: 100% !important;
    grid-column: 1 / -1 !important;
}

.thai-postcode-container label {
    position: absolute !important;
    top: 50% !important;
    left: 17px !important;
    transform: translateY(-50%) !important;
    font-size: 1em !important;
    color: #757575 !important;
    pointer-events: none !important;
    transition: all 0.2s ease !important;
}

.thai-postcode-container.has-value label,
.thai-postcode-container input:focus + label,
.thai-postcode-container.is-active label {
    top: 8px !important;
    transform: translateY(0) !important;
    font-size: 0.75em !important;
}

.thai-postcode-container input {
    width: 100% !important;
    padding: 24px 16px 8px 16px !important;
    border: 1px solid rgba(0,0,0,0.23) !important;
    border-radius: 4px !important;
    font-size: 1em !important;
    outline: none !important;
    box-sizing: border-box !important;
    min-height: 56px !important;
}

.thai-postcode-container input:focus {
    border-color: #22c55e !important;
    border-width: 2px !important;
}

/* ===================================
   SUBDISTRICT FIELD - FULL WIDTH
   =================================== */

.thai-subdistrict-container {
    position: relative !important;
    margin-bottom: 16px !important;
    width: 100% !important;
    grid-column: 1 / -1 !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
}

.thai-subdistrict-container label {
    position: absolute !important;
    top: 50% !important;
    left: 17px !important;
    transform: translateY(-50%) !important;
    font-size: 1em !important;
    color: #757575 !important;
    pointer-events: none !important;
    transition: all 0.2s ease !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    font-weight: normal !important;
}

.thai-subdistrict-container.has-value label,
.thai-subdistrict-container input:focus + label,
.thai-subdistrict-container.is-active label {
    top: 8px !important;
    transform: translateY(0) !important;
    font-size: 0.75em !important;
}

.thai-subdistrict-container input {
    width: 100% !important;
    padding: 24px 16px 8px 16px !important;
    border: 1px solid rgba(0,0,0,0.23) !important;
    border-radius: 4px !important;
    font-size: 1em !important;
    outline: none !important;
    transition: border-color 0.2s !important;
    box-sizing: border-box !important;
    background: #fff !important;
    min-height: 56px !important;
}

.thai-subdistrict-container input:focus {
    border-color: #22c55e !important;
    border-width: 2px !important;
}

.thai-subdistrict-container input::placeholder {
    color: transparent !important;
}

/* ===================================
   CITY FIELD - PREVENT VALUE CLEARING
   =================================== */

/* Visual feedback for city field with value */
input[id$="-city"].has-value {
    background-color: #fafafa !important;
}

/* Prevent transition flash */
input[id$="-city"] {
    transition: background-color 0.2s ease !important;
}

input#shipping-phone 
{
height:55px!important;
}