/** * Phone Validation Styles * All World Countries Support * Ras Soma Theme */ .phone-input-wrapper{position:relative;display:flex;align-items:stretch;background:var(--lpds-color-surface,#fff);border:1px solid var(--lpds-color-border,#e2e8f0);border-radius:var(--radius-md,8px);overflow:visible;transition:all 0.2s ease}.phone-input-wrapper:focus-within{border-color:var(--lpds-color-navy,#0f172a);box-shadow:0 0 0 3px rgba(15,23,42,0.12)}.country-selector{display:flex;align-items:center;gap:6px;padding:12px 10px;background:var(--lpds-color-surface-elevated,#f8fafc);border:none;border-right:1px solid var(--lpds-color-border,#e2e8f0);cursor:pointer;transition:all 0.2s ease;flex-shrink:0;min-width:95px}[dir="rtl"] .country-selector{border-right:none;border-left:1px solid var(--lpds-color-border,#e2e8f0)}.country-selector:hover{background:var(--lpds-color-navy-faint,rgba(15,23,42,0.06))}.country-selector .country-flag{font-size:20px;line-height:1}.country-selector .country-code{font-size:13px;font-weight:600;color:var(--lpds-color-navy,#0f172a);font-family:'SF Mono','Monaco',monospace}.country-selector .chevron{width:12px;height:12px;color:var(--lpds-color-navy-muted,#64748b);transition:transform 0.2s ease;flex-shrink:0}.country-selector[aria-expanded="true"] .chevron{transform:rotate(180deg)}.phone-input-wrapper input[type="tel"],.phone-input-wrapper input[name="phone"]{flex:1;border:none !important;background:transparent !important;padding:12px 15px !important;font-size:15px !important;color:var(--lpds-color-navy,#0f172a) !important;outline:none !important;box-shadow:none !important;min-width:0}.phone-input-wrapper input::placeholder{color:var(--lpds-color-navy-muted,#64748b)}.phone-error{display:block;width:100%;margin-top:6px;font-size:12px;line-height:1.35;color:#ef4444}.country-dropdown{position:fixed;width:300px;max-width:min(300px,92vw);background:var(--lpds-color-surface,#fff);border:1px solid var(--lpds-color-border,#e2e8f0);border-radius:var(--radius-md,8px);box-shadow:0 12px 48px rgba(0,0,0,0.18);z-index:999999;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity 0.18s ease,transform 0.18s ease,visibility 0.18s ease;overflow:hidden}.country-dropdown.active{opacity:1;visibility:visible;transform:translateY(0)}.country-search{padding:10px;border-bottom:1px solid var(--lpds-color-border,#e2e8f0);background:var(--lpds-color-surface-elevated,#f8fafc)}.country-search-input{width:100%;padding:10px 12px;border:1px solid var(--lpds-color-border,#e2e8f0);border-radius:var(--radius-sm,6px);font-size:14px;background:var(--lpds-color-surface,#fff);outline:none;transition:border-color 0.2s ease}.country-search-input:focus{border-color:var(--lpds-color-navy,#0f172a)}.country-options{max-height:280px;overflow-y:auto;overscroll-behavior:contain}.country-options::-webkit-scrollbar{width:6px}.country-options::-webkit-scrollbar-track{background:var(--lpds-color-surface-elevated,#f8fafc)}.country-options::-webkit-scrollbar-thumb{background:var(--lpds-color-navy-muted,#94a3b8);border-radius:3px}.country-options::-webkit-scrollbar-thumb:hover{background:var(--lpds-color-navy-muted,#64748b)}.country-option{display:flex;align-items:center;gap:10px;padding:10px 12px;cursor:pointer;transition:background 0.15s ease;border-bottom:1px solid var(--lpds-color-navy-faint,rgba(15,23,42,0.08))}.country-option:last-child{border-bottom:none}.country-option:hover{background:var(--lpds-color-surface-elevated,#f8fafc)}.country-option .country-flag{font-size:20px;line-height:1;flex-shrink:0}.country-option .country-name{flex:1;font-size:14px;color:var(--lpds-color-navy,#0f172a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.country-option .country-code{font-size:12px;font-weight:600;color:var(--lpds-color-navy-muted,#64748b);font-family:'SF Mono','Monaco',monospace;flex-shrink:0}.form-group .phone-input-wrapper{width:100%}@media (max-width:480px){.country-dropdown{width:auto;max-width:calc(100vw - 8px);transform:translateY(-10px)}.country-dropdown.active{transform:translateY(0)}.country-selector{min-width:85px;padding:10px 8px}.country-selector .country-code{font-size:12px}.phone-input-wrapper input[type="tel"],.phone-input-wrapper input[name="phone"]{padding:10px 12px !important;font-size:14px !important}.country-options{max-height:220px}}@media (prefers-color-scheme:dark){.country-dropdown{background:#1a1a2e;border-color:#333}.country-search{background:#16162a;border-color:#333}.country-search-input{background:#1a1a2e;border-color:#333;color:#fff}.country-option{border-color:#333}.country-option:hover{background:#16162a}.country-option .country-name{color:#fff}}[dir="rtl"] .country-option{flex-direction:row-reverse}[dir="rtl"] .country-selector{flex-direction:row-reverse}@keyframes dropdownFadeIn{from{opacity:0;transform:translateY(-10px) scale(0.98)}to{opacity:1;transform:translateY(0) scale(1)}}.country-dropdown.active{animation:dropdownFadeIn 0.2s ease forwards}.country-option.selected{background:var(--lpds-color-navy-faint,rgba(15,23,42,0.08))}.country-option.selected .country-name{color:var(--lpds-color-navy,#0f172a);font-weight:600}.phone-input-wrapper.loading::after{content:'';position:absolute;right:15px;top:50%;transform:translateY(-50%);width:16px;height:16px;border:2px solid var(--lpds-color-border,#e2e8f0);border-top-color:#7F7F7F;border-radius:50%;animation:spin 0.8s linear infinite}@keyframes spin{to{transform:translateY(-50%) rotate(360deg)}}.phone-input-wrapper.error{border-color:var(--lpds-color-error,#b91c1c) !important}.phone-input-wrapper.error:focus-within{box-shadow:0 0 0 3px rgba(229,115,115,0.15)}.phone-input-wrapper.valid{border-color:var(--lpds-color-success,#15803d) !important}.phone-input-wrapper.valid:focus-within{box-shadow:0 0 0 3px rgba(76,175,80,0.15)}.country-option[data-iso="EG"],.country-option[data-iso="SA"],.country-option[data-iso="AE"],.country-option[data-iso="KW"],.country-option[data-iso="QA"],.country-option[data-iso="OM"],.country-option[data-iso="BH"]{background:linear-gradient(135deg,rgba(13,92,109,0.03),transparent)}.iti{width:100%}.iti__dropdown-container{pointer-events:auto !important}.iti__country-list{max-height:250px;overflow-y:auto;pointer-events:auto !important}