/**
 * WPForms Smart Location Frontend & Builder Styles
 * Standard WPForms Field Sizing:
 * - Small  (wpforms-field-small):  max-width: 250px; width: 100%; (matches WPForms Small Name/Text field)
 * - Medium (wpforms-field-medium): max-width: 60%;   width: 60%;   (matches WPForms Medium field)
 * - Large  (wpforms-field-large):  max-width: 100%;  width: 100%;  (matches WPForms Large field)
 */

/* ----------------------------------------------------
 * 1. CONTAINER & WRAPPER LAYOUT
 * ---------------------------------------------------- */
div.wpforms-container .wpforms-form .wpforms-smart-location-wrap,
div.wpforms-container-full .wpforms-form .wpforms-smart-location-wrap,
body .wpforms-container .wpforms-smart-location-wrap,
.wpforms-smart-location-wrap,
.wpforms-smart-location-preview-container,
.wpforms-smart-location-preview {
    clear: both;
    display: block;
    box-sizing: border-box !important;
}

.wpforms-smart-location-wrap::after,
.wpforms-smart-location-preview::after {
    content: "";
    display: table;
    clear: both;
}

.wpforms-smart-location-wrap .wpforms-sublabel-hide {
    display: none !important;
}

/* ----------------------------------------------------
 * 2. VERTICAL FIELD STACKING & GAP BETWEEN FIELDS
 * Overrides WPForms core .wpforms-field-row .wpforms-field-row-block margin: 0 !important;
 * ---------------------------------------------------- */
div.wpforms-container .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-country,
div.wpforms-container .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-state,
div.wpforms-container-full .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-country,
div.wpforms-container-full .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-state,
body .wpforms-container .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-country,
body .wpforms-container .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-state,
.wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-country,
.wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-state,
.wpforms-smart-location-wrap .wpforms-smart-location-country,
.wpforms-smart-location-wrap .wpforms-smart-location-state,
.wpforms-smart-location-preview-country,
.wpforms-smart-location-preview-state {
    margin-bottom: 14px !important;
}

div.wpforms-container .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-country,
div.wpforms-container .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-state,
div.wpforms-container .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-city,
div.wpforms-container-full .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-country,
div.wpforms-container-full .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-state,
div.wpforms-container-full .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-city,
body .wpforms-container .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-country,
body .wpforms-container .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-state,
body .wpforms-container .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-city,
.wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-country,
.wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-state,
.wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-city,
.wpforms-smart-location-wrap .wpforms-field-row-block,
.wpforms-smart-location-preview .wpforms-field-row-block,
.wpforms-smart-location-preview > div {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    clear: both !important;
    display: block;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

div.wpforms-container .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-city,
div.wpforms-container-full .wpforms-form .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-city,
body .wpforms-container .wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-city,
.wpforms-field-row .wpforms-field-row-block.wpforms-smart-location-city,
.wpforms-smart-location-wrap .wpforms-smart-location-city,
.wpforms-smart-location-preview-city {
    margin-bottom: 0 !important;
}

/* Ensure hidden state and city fields remain hidden */
.wpforms-smart-location-wrap .wpforms-field-row-block[style*="display: none"],
.wpforms-smart-location-wrap .wpforms-field-row-block[style*="display:none"],
.wpforms-smart-location-preview > div[style*="display: none"],
.wpforms-smart-location-preview > div[style*="display:none"],
.wpforms-smart-location-preview-state[style*="display: none"],
.wpforms-smart-location-preview-state[style*="display:none"],
.wpforms-smart-location-preview-city[style*="display: none"],
.wpforms-smart-location-preview-city[style*="display:none"] {
    display: none !important;
}

/* ----------------------------------------------------
 * 3. SELECT INPUT & VERTICALLY CENTERED DROPDOWN ICON
 * ---------------------------------------------------- */
div.wpforms-container .wpforms-form .wpforms-field-row .wpforms-field-row-block select,
div.wpforms-container .wpforms-form select.wpforms-smart-location-country-select,
div.wpforms-container .wpforms-form select.wpforms-smart-location-state-select,
div.wpforms-container .wpforms-form select.wpforms-smart-location-city-select,
div.wpforms-container-full .wpforms-form select.wpforms-smart-location-country-select,
div.wpforms-container-full .wpforms-form select.wpforms-smart-location-state-select,
div.wpforms-container-full .wpforms-form select.wpforms-smart-location-city-select,
body .wpforms-container select.wpforms-smart-location-country-select,
body .wpforms-container select.wpforms-smart-location-state-select,
body .wpforms-container select.wpforms-smart-location-city-select,
select.wpforms-smart-location-country-select,
select.wpforms-smart-location-state-select,
select.wpforms-smart-location-city-select,
.wpforms-smart-location-wrap select,
.wpforms-smart-location-preview select {
    width: 100% !important;
    max-width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 12px !important;
    padding-right: 36px !important;
    line-height: 42px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="%2364748b"><path d="M7 10l5 5 5-5z"/></svg>') !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 16px 16px !important;
}

div.wpforms-container .wpforms-form .wpforms-smart-location-wrap input[type="text"],
div.wpforms-container-full .wpforms-form .wpforms-smart-location-wrap input[type="text"],
body .wpforms-container .wpforms-smart-location-wrap input[type="text"],
.wpforms-smart-location-wrap input[type="text"] {
    width: 100% !important;
    max-width: 100% !important;
    height: 42px !important;
    line-height: 42px !important;
    box-sizing: border-box !important;
}

/* ----------------------------------------------------
 * 4. STANDARD WPFORMS FIELD SIZE MATCHING
 * Small  = wpforms-field-small  = 250px max-width (matches WPForms Small Name field)
 * Medium = wpforms-field-medium = 60% max-width   (matches WPForms Medium field)
 * Large  = wpforms-field-large  = 100% max-width  (matches WPForms Large field)
 * ---------------------------------------------------- */

/* Inside WPForms Builder Canvas (#wpforms-builder):
   Allow outer field wrapper (#wpforms-field-{id}) to define width,
   and make all inner preview containers & select dropdowns 100% fluid so they never overflow the dotted preview box. */
#wpforms-builder .wpforms-smart-location-preview-container,
#wpforms-builder .wpforms-smart-location-preview,
#wpforms-builder .wpforms-smart-location-preview > div,
#wpforms-builder .wpforms-smart-location-preview select {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Frontend Small Size (250px max-width - matches WPForms Small Name/Text field) */
div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-small,
div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-small .wpforms-smart-location-wrap,
div.wpforms-container .wpforms-form .wpforms-field-small .wpforms-smart-location-wrap,
div.wpforms-container .wpforms-form .wpforms-field-small.wpforms-smart-location-wrap,
div.wpforms-container-full .wpforms-form .wpforms-smart-location-wrap.wpforms-field-small,
body .wpforms-container .wpforms-field-small .wpforms-smart-location-wrap,
body .wpforms-container .wpforms-smart-location-wrap.wpforms-field-small,
.wpforms-field-smart_location.wpforms-field-small,
.wpforms-field-smart_location.wpforms-field-small .wpforms-smart-location-wrap,
.wpforms-smart-location-wrap.wpforms-field-small {
    max-width: 250px !important;
    width: 100% !important;
}

/* Frontend Medium Size (60% max-width & 60% width - standard WPForms medium width) */
div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-medium,
div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-medium .wpforms-smart-location-wrap,
div.wpforms-container .wpforms-form .wpforms-field-medium .wpforms-smart-location-wrap,
div.wpforms-container .wpforms-form .wpforms-field-medium.wpforms-smart-location-wrap,
div.wpforms-container-full .wpforms-form .wpforms-smart-location-wrap.wpforms-field-medium,
body .wpforms-container .wpforms-field-medium .wpforms-smart-location-wrap,
body .wpforms-container .wpforms-smart-location-wrap.wpforms-field-medium,
.wpforms-field-smart_location.wpforms-field-medium,
.wpforms-field-smart_location.wpforms-field-medium .wpforms-smart-location-wrap,
.wpforms-smart-location-wrap.wpforms-field-medium {
    max-width: 60% !important;
    width: 60% !important;
}

/* Frontend Large Size (100% max-width & 100% width - full width) */
div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-large,
div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-large .wpforms-smart-location-wrap,
div.wpforms-container .wpforms-form .wpforms-field-large .wpforms-smart-location-wrap,
div.wpforms-container .wpforms-form .wpforms-field-large.wpforms-smart-location-wrap,
div.wpforms-container-full .wpforms-form .wpforms-smart-location-wrap.wpforms-field-large,
body .wpforms-container .wpforms-field-large .wpforms-smart-location-wrap,
body .wpforms-container .wpforms-smart-location-wrap.wpforms-field-large,
.wpforms-field-smart_location.wpforms-field-large,
.wpforms-field-smart_location.wpforms-field-large .wpforms-smart-location-wrap,
.wpforms-smart-location-wrap.wpforms-field-large {
    max-width: 100% !important;
    width: 100% !important;
}

/* Mobile responsive fallback */
@media (max-width: 600px) {
    div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-small,
    div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-small .wpforms-smart-location-wrap,
    .wpforms-smart-location-wrap.wpforms-field-small,
    div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-medium,
    div.wpforms-container .wpforms-form .wpforms-field-smart_location.wpforms-field-medium .wpforms-smart-location-wrap,
    body .wpforms-container .wpforms-smart-location-wrap.wpforms-field-medium,
    .wpforms-smart-location-wrap.wpforms-field-medium {
        max-width: 100% !important;
        width: 100% !important;
    }
}