/** * Estilos del autocompletado de dominios de correo (`resources/js/email_suggest.js`). * * La lista se cuelga del con posición absoluta, no dentro del formulario, * para que ningún contenedor con `overflow: hidden` la recorte. Por eso las * coordenadas las calcula el JS y aquí sólo vive la apariencia. */ .email-suggest { position: absolute; z-index: 2000; /* Por encima de los modales de Bootstrap, que llegan a 1050. */ max-height: 328px; margin: 0; padding: .25rem 0; overflow-y: auto; list-style: none; background: #fff; border: 1px solid #e4e6ef; border-radius: 8px; box-shadow: 0 12px 28px rgba(27, 28, 49, .14); } .email-suggest[hidden] { display: none; } .email-suggest__option { padding: .6rem 1rem; font-size: 15px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; } .email-suggest__option.is-active { background: #f2f5ff; } /* Lo que el usuario ya escribió se atenúa y lo que la sugerencia agrega se resalta, para que se vea de un vistazo qué está eligiendo. */ .email-suggest__typed { color: #9a9db3; } .email-suggest__completion { color: #1b1c31; font-weight: 500; } .email-suggest::-webkit-scrollbar { width: 8px; } .email-suggest::-webkit-scrollbar-thumb { background: #d5d8e4; border-radius: 4px; } /* "¿Quisiste decir…?": va debajo del campo, en el flujo normal del formulario. */ .email-suggest-hint { margin-top: .4rem; color: #7b7f9e; font-size: 13px; line-height: 1.4; } .email-suggest-hint__fix { padding: 0; color: #2a5cff; font: inherit; text-decoration: underline; background: none; border: 0; cursor: pointer; } .email-suggest-hint__fix strong { font-weight: 600; } @media (max-width: 575.98px) { .email-suggest__option { padding: .7rem .85rem; font-size: 14px; } }