/**
 * Phone Field Styles
 * App-specific styles for intl-tel-input phone fields
 * 
 * Note: Basic form field styles (border, border-radius, outline, box-shadow, focus) 
 * are provided by the frontend theme's .form input styles.
 * This file only contains intl-tel-input library-specific customizations.
 */

/* App-specific sizing - extends theme's .form input */
.intl-tel-input-field {
    width: 100% !important;
    height: 50px !important;
    background: transparent !important;
    /* Theme's .form input provides: border, border-radius, outline, box-shadow */
}

/* Allow intl-tel-input to manage padding when initialized */
.iti--show-selected-dial-code .intl-tel-input-field {
    padding-left: 52px !important;
}

/* For RTL languages */
[dir=rtl] .iti--show-selected-dial-code .intl-tel-input-field {
    padding-right: 52px !important;
    padding-left: 6px !important;
}

/* Adjust for intl-tel-input flag dropdown */
.iti {
    width: 100%;
}

.iti__flag-container {
    left: 0;
}

.iti__selected-flag {
    padding: 0 8px 0 8px;
    display: flex !important;
    align-items: center;
    visibility: visible !important;
}

/* Ensure dial code is always visible when separateDialCode is true */
.iti--show-selected-dial-code .iti__selected-dial-code {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-right: 4px;
}

/* Ensure flag container is visible */
.iti__flag-container {
    visibility: visible !important;
    display: flex !important;
}

/* Helper text and error messages */
.phone-field-helper {
    display: block;
    margin-top: 8px;
    font-size: 0.875rem;
    color: #6c757d;
    line-height: 1.4;
}

.phone-field-error {
    display: block;
    margin-top: 4px;
    font-size: 0.875rem;
    color: #dc3545;
    line-height: 1.4;
}

/* Invalid state styling */
.intl-tel-input-field.is-invalid {
    border-color: #dc3545 !important;
}

.intl-tel-input-field.is-invalid:focus {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}