/** * Revista THC - Buscador Predictivo * Estilos del dropdown flotante de sugerencias, y un ajuste puntual al * color del título en la página real de resultados de búsqueda. * * El dropdown se inserta directamente en y se posiciona con * JavaScript vía "position:fixed" + getBoundingClientRect() del input, * para evitar que quede recortado por contenedores con overflow:hidden * o tapado por el z-index del overlay fullscreen del buscador. */ /* ------------------------------------------------------------------ */ /* Título en la página real de resultados de búsqueda (listado nativo */ /* de WordPress, fuera del dropdown). Markup confirmado del tema: */ /*

Título

*/ /* Igual que con el dropdown: el color forzado solo aplica en estado */ /* NO-hover/NO-focus, para no competir nunca con el ":hover" verde del */ /* propio tema y no romper ese comportamiento ya existente. */ /* ------------------------------------------------------------------ */ .post_title.entry-title > a:not(:hover):not(:focus) { color: #ffffff !important; } .rthc-ls-dropdown { /* top/left/width los define JS dinámicamente en cada apertura */ position: fixed; z-index: 999999; margin: 0; padding: 6px; list-style: none; background-color: rgba(18, 18, 18, 0.97); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 10px; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45); max-height: 360px; overflow-y: auto; font-family: inherit; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } .rthc-ls-dropdown[hidden] { display: none; } .rthc-ls-item { margin: 0; padding: 0; border-radius: 6px; transition: background-color 0.15s ease; } .rthc-ls-item + .rthc-ls-item { margin-top: 2px; } .rthc-ls-link { display: block; padding: 10px 14px; font-size: 15px; line-height: 1.4; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* !important es necesario: el dropdown vive en , fuera de los contenedores del tema que normalmente heredan su color de texto claro, así que una regla global del tema termina pintando el texto oscuro por defecto. Se aplica solo en estado NO-hover/NO-focus para no competir nunca con la regla ":hover" del propio tema (que ya pinta el verde correctamente) y así no romper ese comportamiento. */ .rthc-ls-link:not(:hover):not(:focus) { color: #ffffff !important; } .rthc-ls-item:hover, .rthc-ls-item.is-active { background-color: rgba(255, 255, 255, 0.08); } /* Scrollbar discreto en navegadores WebKit, para no romper la estética oscura. */ .rthc-ls-dropdown::-webkit-scrollbar { width: 6px; } .rthc-ls-dropdown::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.15); border-radius: 999px; } .rthc-ls-dropdown::-webkit-scrollbar-track { background: transparent; } /* Responsive: en mobile el buscador fullscreen suele ocupar todo el ancho, así que el dropdown hace lo mismo y se acota la altura máxima. */ @media (max-width: 767px) { .rthc-ls-dropdown { max-height: 280px; border-radius: 8px; } .rthc-ls-link { padding: 12px 14px; font-size: 16px; /* evita zoom automático en iOS al hacer focus */ } }