/* Native Phone Country Selector Styling e8469ea0 */

/* Target the specific field groups to align them inline */
.elementor-field-group-phone_prefix {
    flex: 0 0 110px !important;
    max-width: 110px !important;
    margin-right: 10px !important;
}

.elementor-field-group-phone_number {
    flex: 1 !important;
}

/* Base input styling for unified appearance */
#form-field-phone_prefix,
#form-field-phone_number {
    background-color: transparent !important;
    color: var(--text, #f5f1ea) !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 16px !important;
    border: none !important;
    border-bottom: 1px solid var(--border, rgba(245, 241, 234, 0.08)) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 10px 0 !important;
    height: auto !important;
    transition: border-color 0.23s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Custom arrow for select to keep clean appearance */
#form-field-phone_prefix {
    cursor: pointer;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%239a948a'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 5px center !important;
    background-size: 16px !important;
    padding-right: 20px !important;
}

/* Focus states */
#form-field-phone_prefix:focus,
#form-field-phone_number:focus {
    border-bottom: 1px solid var(--gold, #c9a87c) !important;
    outline: none !important;
}

/* Option Dropdown List Styling */
#form-field-phone_prefix option {
    background-color: var(--bg-elevated, #131313) !important;
    color: var(--text, #f5f1ea) !important;
    padding: 10px !important;
}

/* Style choice highlighting */
#form-field-phone_prefix option:checked,
#form-field-phone_prefix option:hover {
    background-color: #161616 !important;
    color: var(--gold, #c9a87c) !important;
}