/* Smarty Autocomplete Wrapper */ .smarty-autocomplete-wrapper { position: relative; width: 100%; display: block; } /* Autocomplete Suggestion Dropdown List * Portaled to by JS — top/left/width are set programmatically * via getBoundingClientRect, so this element is immune to any * overflow:hidden or CSS transform on ancestor Divi containers. */ .smarty-suggestions-dropdown { position: absolute; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1); z-index: 999999; list-style: none; margin: 0; padding: 0; overflow: hidden; box-sizing: border-box; font-family: inherit; text-align: left; } /* Individual Suggestion Item */ .smarty-suggestion-item { padding: 12px 16px; cursor: pointer; border-bottom: 1px solid #edf2f7; transition: background-color 0.2s ease, padding-left 0.2s ease; display: flex; flex-direction: column; box-sizing: border-box; line-height: 1.4; } .smarty-suggestion-item:last-child { border-bottom: none; } /* Suggestion Hover State */ .smarty-suggestion-item:hover { background-color: #f7fafc; padding-left: 20px; color: #1a202c; } /* Street Address Highlight */ .smarty-suggestion-item .street-line { font-size: 15px; font-weight: 600; color: #2d3748; } /* City, State, Zip text */ .smarty-suggestion-item .city-state-zip { font-size: 13px; color: #718096; margin-top: 2px; } /* Loader Styles */ .findProvider__loading { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.85); z-index: 999; align-items: center; justify-content: center; border-radius: 8px; } .lds-ripple { display: inline-block; position: relative; width: 80px; height: 80px; } .lds-ripple div { position: absolute; border: 4px solid #3182ce; opacity: 1; border-radius: 50%; animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite; } .lds-ripple div:nth-child(2) { animation-delay: -0.5s; } @keyframes lds-ripple { 0% { top: 36px; left: 36px; width: 0; height: 0; opacity: 0; } 4.9% { top: 36px; left: 36px; width: 0; height: 0; opacity: 0; } 5% { top: 36px; left: 36px; width: 0; height: 0; opacity: 1; } 100% { top: 0px; left: 0px; width: 72px; height: 72px; opacity: 0; } } /* Message Styles */ .findProvider__message { margin-top: 10px; font-size: 14px; font-weight: 500; } .findProvider__message--error { color: #e53e3e; background: #fff5f5; border: 1px solid #feb2b2; padding: 8px 12px; border-radius: 6px; display: block; line-height: 1.5; } .findProvider__message--success { color: #38a169; }