/**
 * Universal Country State City Dropdown PRO Stylesheet
 * Standardized UI matching WPForms Smart Location PRO
 */

.ucscp-location-group,
.wpforms-smart-location-wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 12px;
}

.ucscp-location-group .ucscp-field-block,
.ucscp-location-group .wpforms-one-third,
.ucscp-location-group .gfield_third,
.ucscp-location-group .elementor-field-option,
.wpforms-smart-location-wrap .wpforms-field-row-block {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    flex: none !important;
    margin-bottom: 12px !important;
}

.ucscp-location-group select,
.ucscp-location-group input[type="text"],
.wpforms-smart-location-wrap select,
.wpforms-smart-location-wrap input[type="text"] {
    width: 100% !important;
    height: 44px !important;
    padding: 8px 12px !important;
    padding-right: 36px !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    border-radius: 6px !important;
    border: 1px solid #cbd5e1 !important;
    background-color: #ffffff !important;
    box-sizing: border-box !important;
    color: #1e293b !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    
    /* Standardize and center dropdown arrow vertically */
    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: calc(100% - 14px) center !important;
    background-size: 16px !important;
}

.ucscp-location-group select:focus,
.ucscp-location-group input[type="text"]:focus,
.wpforms-smart-location-wrap select:focus,
.wpforms-smart-location-wrap input[type="text"]:focus {
    border-color: #2563eb !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15) !important;
}

.ucscp-location-group select:disabled,
.wpforms-smart-location-wrap select:disabled {
    background-color: #f1f5f9 !important;
    color: #94a3b8 !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
}

/* Builder Field Preview Styling */
.ucscp-field-preview {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 8px 0;
}

.ucscp-field-preview select {
    width: 100%;
    height: 40px;
    border-radius: 6px;
    border: 1px solid #cbd5e1;
    background-color: #f8fafc;
    color: #64748b;
    padding: 6px 12px;
}

@media (max-width: 600px) {
    .ucscp-location-group,
    .wpforms-smart-location-wrap {
        gap: 10px;
    }
}