:root,
:root.theme-simple,
:root.theme-dark,
:root.theme-macchiato,
html,
html.theme-simple,
html.theme-dark,
html.theme-macchiato {
--color-base-font: #EBEBEB !important;
--color-base-font-rgb: 235, 235, 235 !important;
--color-base-background: #191919 !important;
--color-base-background-mobile: #191919 !important;
--color-url-font: #FB521F !important;
--color-url-visited-font: #FB521F !important;
--color-header-background: #191919 !important;
--color-header-border: transparent !important;
--color-footer-background: #191919 !important;
--color-footer-border: #5A5A5A !important;
--color-sidebar-background: #191919 !important;
--color-sidebar-border: transparent !important;
--color-search-background: #3A3A3A !important;
--color-search-font: #EBEBEB !important;
--color-search-background-hover: #424242 !important;
--color-search-border: transparent !important;
--color-btn-background: #FB521F !important;
--color-btn-font: #EBEBEB !important;
--color-result-background: #191919 !important;
--color-result-border: transparent !important;
--color-result-url-font: #B8B8B8 !important;
--color-result-link-font: #FB521F !important;
--color-result-link-font-highlight: #FB521F !important;
--color-result-link-visited-font: #FB521F !important;
--color-result-description-highlight-font: #EBEBEB !important;
--color-result-publishdate-font: #B8B8B8 !important;
--color-result-engines-font: #B8B8B8 !important;
--color-result-search-url-border: transparent !important;
--color-result-detail-background: #191919 !important;
--color-result-detail-hr: transparent !important;
--color-result-vim-selected: #3A3A3A !important;
--color-result-vim-arrow: #45DA64 !important;
--color-categories-item-selected-font: #45DA64 !important;
--color-categories-item-border-selected: #45DA64 !important;
--color-toolkit-checkbox-onoff-on-mark-background: #45DA64 !important;
--color-toolkit-checkbox-input-border: #45DA64 !important;
}
html,
body,
body.index_endpoint,
#main_index,
.index,
footer {
background: #191919 !important;
color: #EBEBEB !important;
}
/* Links stay orange until hover. */
a,
.result h3 a,
.result a,
.result_header a,
.result__title a,
.result .url a,
.result_url a,
footer a {
color: #FB521F !important;
}
a:hover,
a:focus,
.result h3 a:hover,
.result h3 a:focus,
.result a:hover,
.result a:focus,
.result_header a:hover,
.result_header a:focus,
.result__title a:hover,
.result__title a:focus,
.result .url a:hover,
.result .url a:focus,
.result_url a:hover,
.result_url a:focus,
footer a:hover,
footer a:focus {
color: #45DA64 !important;
}
/* Make Default top nav item. Uses an existing SearXNG-style magnifying glass icon. */
#links_on_top .link_on_top_make_default,
#links_on_top .link_on_top_make_default:link,
#links_on_top .link_on_top_make_default:visited,
#links_on_top .link_on_top_make_default span,
#links_on_top .link_on_top_make_default svg,
#links_on_top .link_on_top_make_default svg path {
color: #EBEBEB !important;
stroke: currentColor !important;
}
#links_on_top .link_on_top_make_default:hover,
#links_on_top .link_on_top_make_default:focus,
#links_on_top .link_on_top_make_default:hover span,
#links_on_top .link_on_top_make_default:focus span,
#links_on_top .link_on_top_make_default:hover svg,
#links_on_top .link_on_top_make_default:focus svg,
#links_on_top .link_on_top_make_default:hover svg path,
#links_on_top .link_on_top_make_default:focus svg path {
color: #45DA64 !important;
stroke: #45DA64 !important;
}
/* Top nav icons and labels: white normally, green on hover/focus. */
#links_on_top a,
#links_on_top a:link,
#links_on_top a:visited,
#links_on_top a span,
#links_on_top a svg,
#links_on_top a svg path {
color: #EBEBEB !important;
stroke: currentColor !important;
}
#links_on_top a:hover,
#links_on_top a:focus,
#links_on_top a:hover span,
#links_on_top a:focus span,
#links_on_top a:hover svg,
#links_on_top a:focus svg,
#links_on_top a:hover svg path,
#links_on_top a:focus svg path {
color: #45DA64 !important;
stroke: #45DA64 !important;
}
/* Hide disabled categories in Preferences.
These categories are intentionally unavailable in this deployment. */
body.preferences_endpoint input#category_map,
body.preferences_endpoint input[name="category_map"],
body.preferences_endpoint input[value="map"],
body.preferences_endpoint label[for="category_map"],
body.preferences_endpoint label[for="map"],
body.preferences_endpoint .category_map,
body.preferences_endpoint .category-map,
body.preferences_endpoint [id*="category_map"],
body.preferences_endpoint [class*="category_map"],
body.preferences_endpoint [data-category="map"],
body.preferences_endpoint tr:has(input#category_map),
body.preferences_endpoint tr:has(input[name="category_map"]),
body.preferences_endpoint tr:has(input[value="map"]),
body.preferences_endpoint li:has(input#category_map),
body.preferences_endpoint li:has(input[name="category_map"]),
body.preferences_endpoint li:has(input[value="map"]),
body.preferences_endpoint fieldset:has(input#category_map),
body.preferences_endpoint fieldset:has(input[name="category_map"]),
body.preferences_endpoint fieldset:has(input[value="map"]),
body.preferences_endpoint .engine-group:has(input#category_map),
body.preferences_endpoint .engine-group:has(input[name="category_map"]),
body.preferences_endpoint .engine-group:has(input[value="map"]),
#preferences input#category_map,
#preferences input[name="category_map"],
#preferences input[value="map"],
#preferences label[for="category_map"],
#preferences label[for="map"],
#preferences .category_map,
#preferences .category-map,
#preferences [id*="category_map"],
#preferences [class*="category_map"],
#preferences [data-category="map"],
#preferences tr:has(input#category_map),
#preferences tr:has(input[name="category_map"]),
#preferences tr:has(input[value="map"]),
#preferences li:has(input#category_map),
#preferences li:has(input[name="category_map"]),
#preferences li:has(input[value="map"]),
#preferences fieldset:has(input#category_map),
#preferences fieldset:has(input[name="category_map"]),
#preferences fieldset:has(input[value="map"]),
#preferences .engine-group:has(input#category_map),
#preferences .engine-group:has(input[name="category_map"]),
#preferences .engine-group:has(input[value="map"]),
body.preferences_endpoint input#category_science,
body.preferences_endpoint input[name="category_science"],
body.preferences_endpoint input[value="science"],
body.preferences_endpoint label[for="category_science"],
body.preferences_endpoint label[for="science"],
body.preferences_endpoint .category_science,
body.preferences_endpoint .category-science,
body.preferences_endpoint [id*="category_science"],
body.preferences_endpoint [class*="category_science"],
body.preferences_endpoint [data-category="science"],
body.preferences_endpoint tr:has(input#category_science),
body.preferences_endpoint tr:has(input[name="category_science"]),
body.preferences_endpoint tr:has(input[value="science"]),
body.preferences_endpoint li:has(input#category_science),
body.preferences_endpoint li:has(input[name="category_science"]),
body.preferences_endpoint li:has(input[value="science"]),
body.preferences_endpoint fieldset:has(input#category_science),
body.preferences_endpoint fieldset:has(input[name="category_science"]),
body.preferences_endpoint fieldset:has(input[value="science"]),
body.preferences_endpoint .engine-group:has(input#category_science),
body.preferences_endpoint .engine-group:has(input[name="category_science"]),
body.preferences_endpoint .engine-group:has(input[value="science"]),
#preferences input#category_science,
#preferences input[name="category_science"],
#preferences input[value="science"],
#preferences label[for="category_science"],
#preferences label[for="science"],
#preferences .category_science,
#preferences .category-science,
#preferences [id*="category_science"],
#preferences [class*="category_science"],
#preferences [data-category="science"],
#preferences tr:has(input#category_science),
#preferences tr:has(input[name="category_science"]),
#preferences tr:has(input[value="science"]),
#preferences li:has(input#category_science),
#preferences li:has(input[name="category_science"]),
#preferences li:has(input[value="science"]),
#preferences fieldset:has(input#category_science),
#preferences fieldset:has(input[name="category_science"]),
#preferences fieldset:has(input[value="science"]),
#preferences .engine-group:has(input#category_science),
#preferences .engine-group:has(input[name="category_science"]),
#preferences .engine-group:has(input[value="science"]),
body.preferences_endpoint input#category_files,
body.preferences_endpoint input[name="category_files"],
body.preferences_endpoint input[value="files"],
body.preferences_endpoint label[for="category_files"],
body.preferences_endpoint label[for="files"],
body.preferences_endpoint .category_files,
body.preferences_endpoint .category-files,
body.preferences_endpoint [id*="category_files"],
body.preferences_endpoint [class*="category_files"],
body.preferences_endpoint [data-category="files"],
body.preferences_endpoint tr:has(input#category_files),
body.preferences_endpoint tr:has(input[name="category_files"]),
body.preferences_endpoint tr:has(input[value="files"]),
body.preferences_endpoint li:has(input#category_files),
body.preferences_endpoint li:has(input[name="category_files"]),
body.preferences_endpoint li:has(input[value="files"]),
body.preferences_endpoint fieldset:has(input#category_files),
body.preferences_endpoint fieldset:has(input[name="category_files"]),
body.preferences_endpoint fieldset:has(input[value="files"]),
body.preferences_endpoint .engine-group:has(input#category_files),
body.preferences_endpoint .engine-group:has(input[name="category_files"]),
body.preferences_endpoint .engine-group:has(input[value="files"]),
#preferences input#category_files,
#preferences input[name="category_files"],
#preferences input[value="files"],
#preferences label[for="category_files"],
#preferences label[for="files"],
#preferences .category_files,
#preferences .category-files,
#preferences [id*="category_files"],
#preferences [class*="category_files"],
#preferences [data-category="files"],
#preferences tr:has(input#category_files),
#preferences tr:has(input[name="category_files"]),
#preferences tr:has(input[value="files"]),
#preferences li:has(input#category_files),
#preferences li:has(input[name="category_files"]),
#preferences li:has(input[value="files"]),
#preferences fieldset:has(input#category_files),
#preferences fieldset:has(input[name="category_files"]),
#preferences fieldset:has(input[value="files"]),
#preferences .engine-group:has(input#category_files),
#preferences .engine-group:has(input[name="category_files"]),
#preferences .engine-group:has(input[value="files"]) {
display: none !important;
}
/* Hide unwanted search categories on search/results pages.
Preferences are handled separately above. */
body.results_endpoint #categories input#category_map,
body.results_endpoint #categories input[name="category_map"],
body.results_endpoint #categories input[value="map"],
body.results_endpoint #categories label[for="category_map"],
body.results_endpoint #categories label[for="map"],
body.results_endpoint #categories .category_map,
body.results_endpoint #categories .category-map,
body.results_endpoint #categories [id*="category_map"],
body.results_endpoint #categories [class*="category_map"],
body.results_endpoint #categories [data-category="map"],
body.search_endpoint:not(.index_endpoint) #categories input#category_map,
body.search_endpoint:not(.index_endpoint) #categories input[name="category_map"],
body.search_endpoint:not(.index_endpoint) #categories input[value="map"],
body.search_endpoint:not(.index_endpoint) #categories label[for="category_map"],
body.search_endpoint:not(.index_endpoint) #categories label[for="map"],
body.search_endpoint:not(.index_endpoint) #categories .category_map,
body.search_endpoint:not(.index_endpoint) #categories .category-map,
body.search_endpoint:not(.index_endpoint) #categories [id*="category_map"],
body.search_endpoint:not(.index_endpoint) #categories [class*="category_map"],
body.search_endpoint:not(.index_endpoint) #categories [data-category="map"],
body.results_endpoint #categories input#category_science,
body.results_endpoint #categories input[name="category_science"],
body.results_endpoint #categories input[value="science"],
body.results_endpoint #categories label[for="category_science"],
body.results_endpoint #categories label[for="science"],
body.results_endpoint #categories .category_science,
body.results_endpoint #categories .category-science,
body.results_endpoint #categories [id*="category_science"],
body.results_endpoint #categories [class*="category_science"],
body.results_endpoint #categories [data-category="science"],
body.search_endpoint:not(.index_endpoint) #categories input#category_science,
body.search_endpoint:not(.index_endpoint) #categories input[name="category_science"],
body.search_endpoint:not(.index_endpoint) #categories input[value="science"],
body.search_endpoint:not(.index_endpoint) #categories label[for="category_science"],
body.search_endpoint:not(.index_endpoint) #categories label[for="science"],
body.search_endpoint:not(.index_endpoint) #categories .category_science,
body.search_endpoint:not(.index_endpoint) #categories .category-science,
body.search_endpoint:not(.index_endpoint) #categories [id*="category_science"],
body.search_endpoint:not(.index_endpoint) #categories [class*="category_science"],
body.search_endpoint:not(.index_endpoint) #categories [data-category="science"],
body.results_endpoint #categories input#category_files,
body.results_endpoint #categories input[name="category_files"],
body.results_endpoint #categories input[value="files"],
body.results_endpoint #categories label[for="category_files"],
body.results_endpoint #categories label[for="files"],
body.results_endpoint #categories .category_files,
body.results_endpoint #categories .category-files,
body.results_endpoint #categories [id*="category_files"],
body.results_endpoint #categories [class*="category_files"],
body.results_endpoint #categories [data-category="files"],
body.search_endpoint:not(.index_endpoint) #categories input#category_files,
body.search_endpoint:not(.index_endpoint) #categories input[name="category_files"],
body.search_endpoint:not(.index_endpoint) #categories input[value="files"],
body.search_endpoint:not(.index_endpoint) #categories label[for="category_files"],
body.search_endpoint:not(.index_endpoint) #categories label[for="files"],
body.search_endpoint:not(.index_endpoint) #categories .category_files,
body.search_endpoint:not(.index_endpoint) #categories .category-files,
body.search_endpoint:not(.index_endpoint) #categories [id*="category_files"],
body.search_endpoint:not(.index_endpoint) #categories [class*="category_files"],
body.search_endpoint:not(.index_endpoint) #categories [data-category="files"] {
display: none !important;
}
/* Category tabs are navigation links, not pills. Keep them clickable. */
#categories,
.categories,
.search_categories {
position: relative !important;
z-index: 10 !important;
background: transparent !important;
}
#categories a,
#categories a:link,
#categories a:visited,
#categories label,
#categories .category,
.categories a,
.categories a:link,
.categories a:visited,
.categories label,
.categories .category,
.search_categories a,
.search_categories a:link,
.search_categories a:visited,
.search_categories label,
.search_categories .category {
color: #EBEBEB !important;
background: transparent !important;
box-shadow: none !important;
border-radius: 0 !important;
text-decoration: none !important;
position: relative !important;
z-index: 11 !important;
pointer-events: auto !important;
}
#categories a,
#categories label,
.categories a,
.categories label,
.search_categories a,
.search_categories label {
border: 0 !important;
border-bottom: 2px solid transparent !important;
}
#categories svg,
#categories svg path,
.categories svg,
.categories svg path,
.search_categories svg,
.search_categories svg path {
color: currentColor !important;
stroke: currentColor !important;
}
#categories a:hover,
#categories a:focus,
#categories label:hover,
#categories label:focus,
.categories a:hover,
.categories a:focus,
.categories label:hover,
.categories label:focus,
.search_categories a:hover,
.search_categories a:focus,
.search_categories label:hover,
.search_categories label:focus {
color: #45DA64 !important;
}
#categories a:hover svg,
#categories a:focus svg,
#categories a:hover svg path,
#categories a:focus svg path,
#categories label:hover svg,
#categories label:focus svg,
#categories label:hover svg path,
#categories label:focus svg path,
.categories a:hover svg,
.categories a:focus svg,
.categories a:hover svg path,
.categories a:focus svg path,
.search_categories a:hover svg,
.search_categories a:focus svg,
.search_categories a:hover svg path,
.search_categories a:focus svg path {
color: #45DA64 !important;
stroke: #45DA64 !important;
}
#categories .category input:checked + label,
#categories .category input:checked ~ label,
#categories .category.selected,
#categories .category.selected label,
#categories .category.current,
#categories .category.current label,
#categories .category.active,
#categories .category.active label,
.categories .category input:checked + label,
.categories .category input:checked ~ label,
.categories .category.selected,
.categories .category.selected label,
.categories .category.current,
.categories .category.current label,
.categories .category.active,
.categories .category.active label,
.search_categories .category input:checked + label,
.search_categories .category input:checked ~ label,
.search_categories .category.selected,
.search_categories .category.selected label,
.search_categories .category.current,
.search_categories .category.current label,
.search_categories .category.active,
.search_categories .category.active label {
color: #45DA64 !important;
background: transparent !important;
box-shadow: none !important;
border-radius: 0 !important;
border-bottom-color: #45DA64 !important;
}
/* Infobox headings: center the title inside its inset heading box. */
.infobox h2.title,
.infobox .title h2,
aside.infobox h2.title {
display: block !important;
width: fit-content !important;
max-width: calc(100% - 2rem) !important;
min-width: 8rem !important;
margin: 0.45rem auto 1rem auto !important;
padding: 0.35rem 1rem !important;
text-align: center !important;
line-height: 1.2 !important;
box-sizing: border-box !important;
}
.infobox h2.title bdi,
.infobox .title h2 bdi,
aside.infobox h2.title bdi {
display: block !important;
width: 100% !important;
text-align: center !important;
}
.infobox h2.title + img,
aside.infobox h2.title + img {
display: block !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* PrivacySafe About page intro section. */
.privacysafe-about-intro,
.privacysafe-help {
margin: 0 0 2rem 0 !important;
padding: 0 0 1rem 0 !important;
color: #EBEBEB !important;
}
.privacysafe-about-intro h1,
.privacysafe-help h1 {
color: #EBEBEB !important;
font-weight: 700 !important;
}
.privacysafe-about-intro p,
.privacysafe-help p {
color: #EBEBEB !important;
font-size: 1.05rem !important;
line-height: 1.55 !important;
}
.privacysafe-about-intro a,
.privacysafe-help a {
color: #FB521F !important;
}
.privacysafe-about-intro a:hover,
.privacysafe-about-intro a:focus,
.privacysafe-help a:hover,
.privacysafe-help a:focus {
color: #45DA64 !important;
}
/* Info-page tabs, including About Us, should follow the same green active/hover behavior. */
.tabs a,
.tabs a:link,
.tabs a:visited,
.info-page .tabs a,
.info-page .tabs a:link,
.info-page .tabs a:visited {
color: #FB521F !important;
}
.tabs a:hover,
.tabs a:focus,
.tabs a.active,
.tabs a[aria-current="page"],
.info-page .tabs a:hover,
.info-page .tabs a:focus,
.info-page .tabs a.active,
.info-page .tabs a[aria-current="page"] {
color: #45DA64 !important;
border-color: #45DA64 !important;
}
/* Search term highlights should never turn links green. They should only be semi-bold. */
.result a .highlight,
.result a span.highlight,
.result h3 a .highlight,
.result h3 a span.highlight,
.result_header a .highlight,
.result__title a .highlight,
.result .content .highlight,
.result-content .highlight,
.highlight,
mark {
color: inherit !important;
background: transparent !important;
font-weight: 600 !important;
text-decoration: none !important;
}
/* Hide broad decorative divider lines. Keep borders on rounded boxes/cards and footer top line. */
hr,
#urls::before,
#urls::after,
#urls > .result::before,
#urls > .result::after,
#results::before,
#results::after,
#results > .result::before,
#results > .result::after,
.results::before,
.results::after,
.result_separator,
.result-separator,
.search_filters::before,
.search_filters::after,
#search_filters::before,
#search_filters::after,
#categories::before,
#categories::after,
.categories::before,
.categories::after,
#pagination::before,
#pagination::after {
display: none !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
header,
#search_header,
#categories,
.categories,
#search_filters,
.search_filters,
#results,
.results,
#urls,
#pagination,
.result,
.result-default,
.result-images,
.result-videos,
.result-torrent,
.result-map,
.result-code {
border-top-color: transparent !important;
border-bottom-color: transparent !important;
}
.search_box,
.dialog,
.modal,
.result-detail,
.result_detail,
.preferences,
.preferences_container,
#preferences,
.infobox,
.answer {
border-color: #5A5A5A !important;
}
.result {
border-top: 0 !important;
border-bottom: 0 !important;
}
/* Search box basics. */
.search_box {
background: #3A3A3A !important;
color: #EBEBEB !important;
border: 1px solid transparent !important;
border-radius: 999px !important;
overflow: hidden !important;
box-shadow: none !important;
}
#q {
color: #EBEBEB !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
outline: none !important;
min-height: 2.7rem !important;
padding-left: 1rem !important;
padding-right: 1rem !important;
}
#q::placeholder {
color: #B8B8B8 !important;
opacity: 1 !important;
}
#search,
#search_header,
#search_view,
.search_box {
border-top: 0 !important;
border-bottom: 0 !important;
}
/* Homepage logo. */
body.index_endpoint #main_index .index > .title,
body.index_endpoint #main_index .index > .title a {
width: min(583px, 73vw) !important;
max-width: min(583px, 73vw) !important;
margin: 0 auto 1.35rem auto !important;
padding: 0 !important;
text-align: center !important;
line-height: 0 !important;
background: transparent !important;
background-image: none !important;
box-shadow: none !important;
}
body.index_endpoint #main_index .index > .title::before,
body.index_endpoint #main_index .index > .title::after {
content: none !important;
display: none !important;
background: none !important;
background-image: none !important;
}
body.index_endpoint #main_index .index > .title h1 {
display: none !important;
visibility: hidden !important;
background: none !important;
background-image: none !important;
}
body.index_endpoint #main_index .index > .title img {
display: block !important;
width: 100% !important;
max-width: 100% !important;
height: auto !important;
max-height: 135px !important;
object-fit: contain !important;
margin: 0 auto !important;
background: transparent !important;
background-image: none !important;
}
body.index_endpoint #main_index .index > .title[style] {
background: transparent !important;
background-image: none !important;
}
.privacysafe-search-subtitle {
width: min(720px, calc(100vw - 32px)) !important;
max-width: min(720px, calc(100vw - 32px)) !important;
margin: 0.45rem auto 1.25rem auto !important;
padding: 0 0.75rem !important;
color: #EBEBEB !important;
font-size: clamp(1.05rem, 2.2vw, 1.35rem) !important;
font-weight: 600 !important;
line-height: 1.35 !important;
text-align: center !important;
box-sizing: border-box !important;
}
.privacysafe-search-subtitle a {
color: #FB521F !important;
text-decoration: none !important;
font-weight: 700 !important;
}
.privacysafe-search-subtitle a:hover,
.privacysafe-search-subtitle a:focus {
color: #45DA64 !important;
text-decoration: none !important;
}
/* Image results: use a light 40%-opacity checkerboard only behind transparent images. */
.result-images img,
.image_result img,
.images .result img,
#urls article.result-images img,
#urls .result-images img {
background-color: rgba(238, 238, 238, 0.40) !important;
background-image:
linear-gradient(45deg, rgba(76, 76, 76, 0.40) 25%, transparent 25%),
linear-gradient(-45deg, rgba(76, 76, 76, 0.40) 25%, transparent 25%),
linear-gradient(45deg, transparent 75%, rgba(76, 76, 76, 0.40) 75%),
linear-gradient(-45deg, transparent 75%, rgba(76, 76, 76, 0.40) 75%) !important;
background-size: 20px 20px !important;
background-position: 0 0, 0 10px, 10px -10px, -10px 0 !important;
}
.result-images img[src*="img_load_error.svg"],
.image_result img[src*="img_load_error.svg"],
img[src*="img_load_error.svg"] {
object-fit: contain !important;
}
/* Results-page small search logo. It is clickable and visually nudged only on the icon itself. */
#search_logo {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 30px !important;
height: 30px !important;
max-width: 30px !important;
max-height: 30px !important;
margin: 0 0.5rem 0 0 !important;
padding: 0 !important;
line-height: 0 !important;
background: transparent !important;
background-image: none !important;
color: #45DA64 !important;
text-decoration: none !important;
flex: 0 0 30px !important;
vertical-align: middle !important;
position: relative !important;
top: 14px !important;
pointer-events: auto !important;
z-index: 4 !important;
}
#search_logo img {
display: block !important;
width: 30px !important;
height: 30px !important;
max-width: 30px !important;
max-height: 30px !important;
object-fit: contain !important;
background: transparent !important;
background-image: none !important;
pointer-events: none !important;
}
#search_logo:hover,
#search_logo:focus {
color: #45DA64 !important;
text-decoration: none !important;
}
svg#search_logo {
display: none !important;
}
/* Homepage search width only. Do not constrain results-page header/category layout. */
#main_index #search,
#main_index .search_box,
body.index_endpoint #search,
body.index_endpoint .search_box {
max-width: 720px !important;
}
/* PrivacySafe pill shape for inputs and true buttons only. */
input[type="search"],
input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"],
textarea,
select {
border-radius: 999px !important;
}
input[type="search"],
input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"] {
min-height: 2.7rem !important;
padding-left: 1rem !important;
padding-right: 1rem !important;
}
textarea {
border-radius: 1.35rem !important;
padding: 0.85rem 1rem !important;
}
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.btn,
.button,
a.btn,
form button,
form input[type="submit"],
#send_search,
.search_box button,
.search_box input[type="submit"] {
border-radius: 999px !important;
}
#categories a,
#categories label,
.categories a,
.categories label,
.search_categories a,
.search_categories label,
#links_on_top a,
#links_on_top a span {
border-radius: 0 !important;
}
/* Autocomplete: never allow a blank panel to become a full-height mobile overlay. */
.search_box {
position: relative !important;
}
.autocomplete,
.autocomplete.open,
.search_box .autocomplete,
.search_box .autocomplete.open {
height: auto !important;
min-height: 0 !important;
max-height: 40vh !important;
overflow-y: auto !important;
background: #3A3A3A !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
}
.autocomplete:empty,
.autocomplete ul:empty,
.autocomplete:not(:has(li)),
.search_box .autocomplete:not(:has(li)) {
display: none !important;
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
}
.autocomplete ul {
height: auto !important;
min-height: 0 !important;
max-height: 40vh !important;
overflow-y: auto !important;
}
/* Mobile and narrow viewport: affect the search input only, not #search_header or #search_view. */
@media (max-width: 700px) {
html,
body,
body.index_endpoint,
body.search_endpoint {
min-height: 100% !important;
overflow-x: hidden !important;
}
#main_index,
#main_results,
main,
form#search,
#search,
.search_box {
height: auto !important;
min-height: 0 !important;
max-height: none !important;
}
form#search:focus-within,
#search:focus-within,
.search_box:focus-within {
position: static !important;
inset: auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
margin-left: auto !important;
margin-right: auto !important;
overflow: visible !important;
transform: none !important;
}
.autocomplete,
.autocomplete.open,
.autocomplete ul,
#search .autocomplete,
#search .autocomplete.open,
.search_box .autocomplete,
.search_box .autocomplete.open {
position: absolute !important;
top: calc(100% + 0.35rem) !important;
left: 0 !important;
right: 0 !important;
width: auto !important;
height: auto !important;
min-height: 0 !important;
max-height: 40vh !important;
overflow-y: auto !important;
z-index: 50 !important;
}
.autocomplete:empty,
.autocomplete ul:empty,
.autocomplete:not(:has(li)),
.search_box .autocomplete:not(:has(li)) {
display: none !important;
height: 0 !important;
max-height: 0 !important;
min-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
}
}
footer {
border-top: 1px solid #5A5A5A !important;
}
footer p {
color: #EBEBEB !important;
}
@media (max-width: 700px) {
body.index_endpoint #main_index .index > .title {
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
margin-bottom: 1.1rem !important;
}
body.index_endpoint #main_index .index > .title img {
width: 100% !important;
max-height: 95px !important;
}
.privacysafe-search-subtitle {
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
margin-top: 0.35rem !important;
margin-bottom: 1rem !important;
font-size: 1.05rem !important;
font-weight: 600 !important;
}
body.index_endpoint #search,
body.index_endpoint .search_box,
#main_index #search,
#main_index .search_box {
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
min-width: 0 !important;
margin-left: auto !important;
margin-right: auto !important;
box-sizing: border-box !important;
}
}
/* FINAL PrivacySafe UI corrections. */
/* Do not show duplicate homepage logo assets. */
body.index_endpoint #main_index .index > .title,
body.index_endpoint #main_index .index > .title a {
background: transparent !important;
background-image: none !important;
}
body.index_endpoint #main_index .index > .title::before,
body.index_endpoint #main_index .index > .title::after {
content: none !important;
display: none !important;
background: none !important;
background-image: none !important;
}
body.index_endpoint #main_index .index > .title img:not(:first-of-type) {
display: none !important;
}
/* Restore semibold subtitle styling. */
.privacysafe-search-subtitle {
width: min(720px, calc(100vw - 32px)) !important;
max-width: min(720px, calc(100vw - 32px)) !important;
margin: 0.45rem auto 1.25rem auto !important;
padding: 0 0.75rem !important;
color: #EBEBEB !important;
font-size: clamp(1.05rem, 2.2vw, 1.35rem) !important;
font-weight: 600 !important;
line-height: 1.35 !important;
text-align: center !important;
box-sizing: border-box !important;
}
.privacysafe-search-subtitle a {
color: #FB521F !important;
text-decoration: none !important;
font-weight: 700 !important;
}
.privacysafe-search-subtitle a:hover,
.privacysafe-search-subtitle a:focus {
color: #45DA64 !important;
text-decoration: none !important;
}
/* Restore top menu hover behavior. */
#links_on_top a:hover,
#links_on_top a:focus,
#links_on_top a:hover *,
#links_on_top a:focus *,
.link_on_top_about:hover,
.link_on_top_about:focus,
.link_on_top_donate:hover,
.link_on_top_donate:focus,
.link_on_top_preferences:hover,
.link_on_top_preferences:focus,
.link_on_top_make_default:hover,
.link_on_top_make_default:focus,
.link_on_top_about:hover *,
.link_on_top_about:focus *,
.link_on_top_donate:hover *,
.link_on_top_donate:focus *,
.link_on_top_preferences:hover *,
.link_on_top_preferences:focus *,
.link_on_top_make_default:hover *,
.link_on_top_make_default:focus *,
.link_on_top_make_default:hover *,
.link_on_top_make_default:focus * {
color: #45DA64 !important;
stroke: #45DA64 !important;
}
/* Autocomplete shell stays transparent. Only the actual suggestion list gets a gray panel. */
.search_box {
position: relative !important;
overflow: visible !important;
}
.autocomplete,
.autocomplete.open,
#search .autocomplete,
#search .autocomplete.open,
.search_box .autocomplete,
.search_box .autocomplete.open {
position: absolute !important;
top: calc(100% + 0.35rem) !important;
left: 0 !important;
right: 0 !important;
width: auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
overflow: visible !important;
z-index: 60 !important;
}
.autocomplete ul,
.search_box .autocomplete ul,
#search .autocomplete ul {
display: block !important;
width: 100% !important;
max-height: min(16rem, 38vh) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
margin: 0 !important;
padding: 0.35rem 0 !important;
background: #3A3A3A !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
}
.autocomplete:empty,
.autocomplete ul:empty,
.autocomplete:not(:has(li)),
.search_box .autocomplete:empty,
.search_box .autocomplete ul:empty,
.search_box .autocomplete:not(:has(li)),
#search .autocomplete:empty,
#search .autocomplete ul:empty,
#search .autocomplete:not(:has(li)) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
width: 0 !important;
min-width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
overflow: hidden !important;
}
/* Mobile: compact pill field plus graceful suggestion dropdown. */
@media (max-width: 700px) {
#search,
form#search,
#search_header,
#search_view,
#main_index #search,
#main_results #search {
position: static !important;
inset: auto !important;
transform: none !important;
min-height: 0 !important;
height: auto !important;
max-height: none !important;
background: transparent !important;
box-shadow: none !important;
overflow: visible !important;
}
.search_box,
.search_box:focus,
.search_box:focus-within,
#search .search_box,
#search .search_box:focus,
#search .search_box:focus-within,
form#search .search_box,
form#search .search_box:focus,
form#search .search_box:focus-within {
display: flex !important;
align-items: center !important;
position: relative !important;
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
min-width: 0 !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
margin-left: auto !important;
margin-right: auto !important;
padding: 0 !important;
overflow: visible !important;
background: #3A3A3A !important;
border: 1px solid transparent !important;
border-radius: 999px !important;
box-shadow: none !important;
}
#q,
#q:focus,
input#q,
input#q:focus {
flex: 1 1 auto !important;
width: auto !important;
min-width: 0 !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
line-height: 2.85rem !important;
padding: 0 1rem !important;
margin: 0 !important;
overflow: hidden !important;
background: transparent !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
}
#clear_search,
#send_search,
.search_box button,
.search_box input[type="submit"] {
flex: 0 0 2.85rem !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
width: 2.85rem !important;
min-width: 2.85rem !important;
max-width: 2.85rem !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
.autocomplete,
.autocomplete.open,
#search .autocomplete,
#search .autocomplete.open,
.search_box .autocomplete,
.search_box .autocomplete.open {
top: calc(100% + 0.35rem) !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
.autocomplete ul,
#search .autocomplete ul,
.search_box .autocomplete ul {
max-height: min(12rem, 34vh) !important;
background: #3A3A3A !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
}
}
/* FINAL OVERRIDES: PrivacySafe interaction, pill inputs, About tab, and mobile autocomplete. */
/* Green hover/focus for top menu, tabs, category nav, buttons, and controls. */
#links_on_top a:hover,
#links_on_top a:focus,
#links_on_top a:hover *,
#links_on_top a:focus *,
.link_on_top_about:hover,
.link_on_top_about:focus,
.link_on_top_donate:hover,
.link_on_top_donate:focus,
.link_on_top_preferences:hover,
.link_on_top_preferences:focus,
.link_on_top_make_default:hover,
.link_on_top_make_default:focus,
.link_on_top_about:hover *,
.link_on_top_about:focus *,
.link_on_top_donate:hover *,
.link_on_top_donate:focus *,
.link_on_top_preferences:hover *,
.link_on_top_preferences:focus *,
.link_on_top_make_default:hover *,
.link_on_top_make_default:focus *,
.tabs a:hover,
.tabs a:focus,
.info-page .tabs a:hover,
.info-page .tabs a:focus,
#categories a:hover,
#categories a:focus,
#categories label:hover,
#categories label:focus,
.categories a:hover,
.categories a:focus,
.categories label:hover,
.categories label:focus,
.search_categories a:hover,
.search_categories a:focus,
.search_categories label:hover,
.search_categories label:focus,
button:hover,
button:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="button"]:hover,
input[type="button"]:focus,
.btn:hover,
.btn:focus,
.button:hover,
.button:focus {
color: #45DA64 !important;
stroke: #45DA64 !important;
border-color: #45DA64 !important;
}
/* Keep normal links orange until hover. */
a,
a:link,
a:visited {
color: #FB521F !important;
}
a:hover,
a:focus {
color: #45DA64 !important;
}
/* Restore true pill styling for search fields and buttons. */
.search_box,
#q,
input[type="search"],
input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"],
select {
border-radius: 999px !important;
}
.search_box {
position: relative !important;
display: flex !important;
align-items: center !important;
overflow: visible !important;
background: #3A3A3A !important;
border: 1px solid transparent !important;
box-shadow: none !important;
}
#q,
input#q {
background: transparent !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
}
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.btn,
.button,
a.btn,
form button,
form input[type="submit"],
#send_search,
#clear_search,
.search_box button,
.search_box input[type="submit"] {
border-radius: 999px !important;
}
/* Category tabs are not pill buttons. */
#categories a,
#categories label,
.categories a,
.categories label,
.search_categories a,
.search_categories label {
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
/* Restore semibold homepage subtitle. */
.privacysafe-search-subtitle {
width: min(720px, calc(100vw - 32px)) !important;
max-width: min(720px, calc(100vw - 32px)) !important;
margin: 0.45rem auto 1.25rem auto !important;
padding: 0 0.75rem !important;
color: #EBEBEB !important;
font-size: clamp(1.05rem, 2.2vw, 1.35rem) !important;
font-weight: 600 !important;
line-height: 1.35 !important;
text-align: center !important;
box-sizing: border-box !important;
}
.privacysafe-search-subtitle a {
color: #FB521F !important;
text-decoration: none !important;
font-weight: 700 !important;
}
.privacysafe-search-subtitle a:hover,
.privacysafe-search-subtitle a:focus {
color: #45DA64 !important;
}
/* Do not show duplicate homepage logo assets. */
body.index_endpoint #main_index .index > .title,
body.index_endpoint #main_index .index > .title a {
background: transparent !important;
background-image: none !important;
}
body.index_endpoint #main_index .index > .title::before,
body.index_endpoint #main_index .index > .title::after {
content: none !important;
display: none !important;
background: none !important;
background-image: none !important;
}
body.index_endpoint #main_index .index > .title img:not(:first-of-type) {
display: none !important;
}
/* Autocomplete shell stays transparent. Only the actual suggestions list is gray. */
.autocomplete,
.autocomplete.open,
#search .autocomplete,
#search .autocomplete.open,
.search_box .autocomplete,
.search_box .autocomplete.open {
position: absolute !important;
top: calc(100% + 0.35rem) !important;
left: 0 !important;
right: 0 !important;
width: auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
overflow: visible !important;
z-index: 60 !important;
}
.autocomplete ul,
.search_box .autocomplete ul,
#search .autocomplete ul {
display: block !important;
width: 100% !important;
max-height: min(16rem, 38vh) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
margin: 0 !important;
padding: 0.35rem 0 !important;
background: #3A3A3A !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
}
.autocomplete li:hover,
.autocomplete li:focus,
.autocomplete a:hover,
.autocomplete a:focus {
background: #424242 !important;
color: #45DA64 !important;
}
.autocomplete:empty,
.autocomplete ul:empty,
.autocomplete:not(:has(li)),
.search_box .autocomplete:empty,
.search_box .autocomplete ul:empty,
.search_box .autocomplete:not(:has(li)),
#search .autocomplete:empty,
#search .autocomplete ul:empty,
#search .autocomplete:not(:has(li)) {
display: none !important;
visibility: hidden !important;
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
width: 0 !important;
min-width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
overflow: hidden !important;
}
/* Mobile: compact pill search field with graceful autocomplete dropdown. */
@media (max-width: 700px) {
#search,
form#search,
#search_header,
#search_view,
#main_index #search,
#main_results #search {
position: static !important;
inset: auto !important;
transform: none !important;
min-height: 0 !important;
height: auto !important;
max-height: none !important;
background: transparent !important;
box-shadow: none !important;
overflow: visible !important;
}
.search_box,
.search_box:focus,
.search_box:focus-within,
#search .search_box,
#search .search_box:focus,
#search .search_box:focus-within,
form#search .search_box,
form#search .search_box:focus,
form#search .search_box:focus-within {
display: flex !important;
align-items: center !important;
position: relative !important;
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
min-width: 0 !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
margin-left: auto !important;
margin-right: auto !important;
padding: 0 !important;
overflow: visible !important;
background: #3A3A3A !important;
border: 1px solid transparent !important;
border-radius: 999px !important;
box-shadow: none !important;
}
#q,
#q:focus,
input#q,
input#q:focus {
flex: 1 1 auto !important;
width: auto !important;
min-width: 0 !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
line-height: 2.85rem !important;
padding: 0 1rem !important;
margin: 0 !important;
overflow: hidden !important;
background: transparent !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
}
#clear_search,
#send_search,
.search_box button,
.search_box input[type="submit"] {
flex: 0 0 2.85rem !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
width: 2.85rem !important;
min-width: 2.85rem !important;
max-width: 2.85rem !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
.autocomplete ul,
#search .autocomplete ul,
.search_box .autocomplete ul {
max-height: min(12rem, 34vh) !important;
}
}
/* FINAL SMALL FIXES: tab alignment, green hover, pill search, mobile autocomplete. */
/* Info-page tabs: use real text, normal line-height, and aligned underline. */
.info-page .tabs a,
.tabs a,
.info-page nav a,
.info-page nav a:link,
.info-page nav a:visited {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-height: 2.4rem !important;
line-height: 1.2 !important;
padding: 0.45rem 0.75rem 0.55rem 0.75rem !important;
vertical-align: middle !important;
font-size: 0.95rem !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
.info-page .tabs a.active,
.tabs a.active,
.info-page nav a.active,
.info-page nav a[aria-current="page"] {
color: #45DA64 !important;
border-bottom: 2px solid #45DA64 !important;
}
/* Green hover/focus for menu items, tabs, categories, links, buttons, and controls. */
#links_on_top a:hover,
#links_on_top a:focus,
#links_on_top a:hover *,
#links_on_top a:focus *,
.link_on_top_about:hover,
.link_on_top_about:focus,
.link_on_top_donate:hover,
.link_on_top_donate:focus,
.link_on_top_preferences:hover,
.link_on_top_preferences:focus,
.link_on_top_make_default:hover,
.link_on_top_make_default:focus,
.link_on_top_about:hover *,
.link_on_top_about:focus *,
.link_on_top_donate:hover *,
.link_on_top_donate:focus *,
.link_on_top_preferences:hover *,
.link_on_top_preferences:focus *,
.link_on_top_make_default:hover *,
.link_on_top_make_default:focus *,
.info-page .tabs a:hover,
.info-page .tabs a:focus,
.tabs a:hover,
.tabs a:focus,
.info-page nav a:hover,
.info-page nav a:focus,
#categories a:hover,
#categories a:focus,
#categories label:hover,
#categories label:focus,
.categories a:hover,
.categories a:focus,
.categories label:hover,
.categories label:focus,
.search_categories a:hover,
.search_categories a:focus,
.search_categories label:hover,
.search_categories label:focus,
button:hover,
button:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="button"]:hover,
input[type="button"]:focus,
.btn:hover,
.btn:focus,
.button:hover,
.button:focus {
color: #45DA64 !important;
stroke: #45DA64 !important;
border-color: #45DA64 !important;
}
/* Search fields and true buttons stay pill-shaped. */
.search_box,
#q,
input[type="search"],
input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"],
select {
border-radius: 999px !important;
}
.search_box {
position: relative !important;
display: flex !important;
align-items: center !important;
background: #3A3A3A !important;
border: 1px solid transparent !important;
overflow: visible !important;
box-shadow: none !important;
}
#q,
input#q {
background: transparent !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
}
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.btn,
.button,
a.btn,
form button,
form input[type="submit"],
#send_search,
#clear_search,
.search_box button,
.search_box input[type="submit"] {
border-radius: 999px !important;
}
/* Category tabs are navigation, not pill buttons. */
#categories a,
#categories label,
.categories a,
.categories label,
.search_categories a,
.search_categories label {
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
/* Autocomplete shell is transparent. Only a real suggestions list gets a gray rounded panel. */
.autocomplete,
.autocomplete.open,
#search .autocomplete,
#search .autocomplete.open,
.search_box .autocomplete,
.search_box .autocomplete.open {
position: absolute !important;
top: calc(100% + 0.35rem) !important;
left: 0 !important;
right: 0 !important;
width: auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
overflow: visible !important;
z-index: 60 !important;
}
.autocomplete ul,
#search .autocomplete ul,
.search_box .autocomplete ul {
display: block !important;
width: 100% !important;
max-height: min(16rem, 38vh) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
margin: 0 !important;
padding: 0.35rem 0 !important;
background: #3A3A3A !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
}
.autocomplete li,
.autocomplete li *,
.autocomplete a,
.autocomplete span {
background: transparent !important;
}
.autocomplete li:hover,
.autocomplete li:focus-within,
.autocomplete a:hover,
.autocomplete a:focus {
background: #424242 !important;
color: #45DA64 !important;
}
/* Empty autocomplete shells must be invisible. This handles the gray-box bug. */
.autocomplete:empty,
.autocomplete ul:empty,
#search .autocomplete:empty,
#search .autocomplete ul:empty,
.search_box .autocomplete:empty,
.search_box .autocomplete ul:empty {
display: none !important;
visibility: hidden !important;
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
width: 0 !important;
min-width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
overflow: hidden !important;
}
/* Mobile: prevent the focused search container from becoming a gray panel. */
@media (max-width: 700px) {
#search,
form#search,
#search_header,
#search_view,
#main_index #search,
#main_results #search,
#search:focus,
#search:focus-within,
form#search:focus,
form#search:focus-within,
#search_header:focus,
#search_header:focus-within,
#search_view:focus,
#search_view:focus-within {
position: static !important;
inset: auto !important;
transform: none !important;
min-height: 0 !important;
height: auto !important;
max-height: none !important;
background: transparent !important;
box-shadow: none !important;
overflow: visible !important;
}
.search_box,
.search_box:focus,
.search_box:focus-within,
#search .search_box,
#search .search_box:focus,
#search .search_box:focus-within,
form#search .search_box,
form#search .search_box:focus,
form#search .search_box:focus-within {
display: flex !important;
align-items: center !important;
position: relative !important;
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
min-width: 0 !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
margin-left: auto !important;
margin-right: auto !important;
padding: 0 !important;
overflow: visible !important;
background: #3A3A3A !important;
border: 1px solid transparent !important;
border-radius: 999px !important;
box-shadow: none !important;
}
#q,
#q:focus,
input#q,
input#q:focus {
flex: 1 1 auto !important;
width: auto !important;
min-width: 0 !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
line-height: 2.85rem !important;
padding: 0 1rem !important;
margin: 0 !important;
overflow: hidden !important;
background: transparent !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
}
#clear_search,
#send_search,
.search_box button,
.search_box input[type="submit"] {
flex: 0 0 2.85rem !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
width: 2.85rem !important;
min-width: 2.85rem !important;
max-width: 2.85rem !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
.autocomplete,
.autocomplete.open,
#search .autocomplete,
#search .autocomplete.open,
.search_box .autocomplete,
.search_box .autocomplete.open {
top: calc(100% + 0.35rem) !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
.autocomplete ul,
#search .autocomplete ul,
.search_box .autocomplete ul {
max-height: min(12rem, 34vh) !important;
background: #3A3A3A !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
}
}
/* FINAL AUTOCOMPLETE BACKDROP FIX:
Keep the useful rounded suggestions box, but make every larger focus/autocomplete shell transparent.
This prevents the huge gray panel behind the suggestion list on mobile and small screens. */
@media (max-width: 700px) {
#search,
form#search,
#search_header,
#search_view,
#search:focus,
form#search:focus,
#search_header:focus,
#search_view:focus,
#search:focus-within,
form#search:focus-within,
#search_header:focus-within,
#search_view:focus-within,
#main_index #search,
#main_index #search_header,
#main_index #search_view,
body.index_endpoint #search,
body.index_endpoint #search_header,
body.index_endpoint #search_view {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
box-shadow: none !important;
border: 0 !important;
min-height: 0 !important;
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
.search_box,
.search_box:focus,
.search_box:focus-within,
#search .search_box,
#search .search_box:focus,
#search .search_box:focus-within {
background: #3A3A3A !important;
border-radius: 999px !important;
overflow: visible !important;
}
.autocomplete,
.autocomplete.open,
#autocomplete,
#autocomplete.open,
.autocomplete_container,
.autocomplete-container,
.autocomplete__container,
#search .autocomplete,
#search .autocomplete.open,
#search #autocomplete,
.search_box .autocomplete,
.search_box .autocomplete.open,
.search_box #autocomplete {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
box-shadow: none !important;
border: 0 !important;
outline: 0 !important;
padding: 0 !important;
margin-top: 0.35rem !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
overflow: visible !important;
}
.autocomplete > div,
#autocomplete > div,
.autocomplete_container > div,
.autocomplete-container > div,
.autocomplete__container > div {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
box-shadow: none !important;
border: 0 !important;
min-height: 0 !important;
}
.autocomplete ul,
#autocomplete ul,
.autocomplete_container ul,
.autocomplete-container ul,
.autocomplete__container ul,
#search .autocomplete ul,
#search #autocomplete ul,
.search_box .autocomplete ul,
.search_box #autocomplete ul {
background: #3A3A3A !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
max-height: min(12rem, 34vh) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
}
.autocomplete:empty,
#autocomplete:empty,
.autocomplete_container:empty,
.autocomplete-container:empty,
.autocomplete__container:empty,
.autocomplete ul:empty,
#autocomplete ul:empty {
display: none !important;
visibility: hidden !important;
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
width: 0 !important;
min-width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
overflow: hidden !important;
}
}
/* FINAL TARGETED MOBILE GRAY-PANEL FIX:
The gray panel is the focused search layout container, not the suggestions list.
Keep the search pill and the suggestions list, but force every outer focused wrapper
to be transparent and non-panel-sized on small screens. */
@media (max-width: 700px) {
body.index_endpoint:has(#q:focus) #main_index,
body.index_endpoint:has(#q:focus) main,
body.index_endpoint:has(#q:focus) form#search,
body.index_endpoint:has(#q:focus) #search,
body.index_endpoint:has(#q:focus) #search_header,
body.index_endpoint:has(#q:focus) #search_view,
body.index_endpoint:has(#q:focus) .search_box,
body.search_endpoint:has(#q:focus) #main_results,
body.search_endpoint:has(#q:focus) main,
body.search_endpoint:has(#q:focus) form#search,
body.search_endpoint:has(#q:focus) #search,
body.search_endpoint:has(#q:focus) #search_header,
body.search_endpoint:has(#q:focus) #search_view,
body.search_endpoint:has(#q:focus) .search_box {
min-height: 0 !important;
height: auto !important;
max-height: none !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
box-shadow: none !important;
}
body.index_endpoint:has(#q:focus) form#search,
body.index_endpoint:has(#q:focus) #search,
body.index_endpoint:has(#q:focus) #search_header,
body.index_endpoint:has(#q:focus) #search_view,
body.search_endpoint:has(#q:focus) form#search,
body.search_endpoint:has(#q:focus) #search,
body.search_endpoint:has(#q:focus) #search_header,
body.search_endpoint:has(#q:focus) #search_view {
display: block !important;
position: static !important;
inset: auto !important;
transform: none !important;
overflow: visible !important;
padding: 0 !important;
margin-left: auto !important;
margin-right: auto !important;
border: 0 !important;
}
body.index_endpoint:has(#q:focus) .search_box,
body.search_endpoint:has(#q:focus) .search_box,
form#search:has(#q:focus) .search_box,
#search:has(#q:focus) .search_box,
#search_header:has(#q:focus) .search_box,
#search_view:has(#q:focus) .search_box {
display: flex !important;
align-items: center !important;
position: relative !important;
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
min-width: 0 !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
padding: 0 !important;
margin-left: auto !important;
margin-right: auto !important;
overflow: visible !important;
background: #3A3A3A !important;
background-color: #3A3A3A !important;
background-image: none !important;
border: 1px solid transparent !important;
border-radius: 999px !important;
box-shadow: none !important;
}
body.index_endpoint:has(#q:focus) #q,
body.search_endpoint:has(#q:focus) #q,
form#search:has(#q:focus) #q,
#search:has(#q:focus) #q,
#search_header:has(#q:focus) #q,
#search_view:has(#q:focus) #q {
flex: 1 1 auto !important;
width: auto !important;
min-width: 0 !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
line-height: 2.85rem !important;
padding: 0 1rem !important;
margin: 0 !important;
overflow: hidden !important;
background: transparent !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
}
body.index_endpoint:has(#q:focus) #clear_search,
body.index_endpoint:has(#q:focus) #send_search,
body.index_endpoint:has(#q:focus) .search_box button,
body.search_endpoint:has(#q:focus) #clear_search,
body.search_endpoint:has(#q:focus) #send_search,
body.search_endpoint:has(#q:focus) .search_box button {
flex: 0 0 2.85rem !important;
width: 2.85rem !important;
min-width: 2.85rem !important;
max-width: 2.85rem !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
/* Only the list gets a visible gray panel. The autocomplete container itself is transparent. */
body.index_endpoint:has(#q:focus) .autocomplete,
body.index_endpoint:has(#q:focus) .autocomplete.open,
body.index_endpoint:has(#q:focus) #autocomplete,
body.search_endpoint:has(#q:focus) .autocomplete,
body.search_endpoint:has(#q:focus) .autocomplete.open,
body.search_endpoint:has(#q:focus) #autocomplete,
form#search:has(#q:focus) .autocomplete,
form#search:has(#q:focus) .autocomplete.open,
form#search:has(#q:focus) #autocomplete {
display: block !important;
position: absolute !important;
top: calc(100% + 0.35rem) !important;
left: 0 !important;
right: 0 !important;
width: auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
border: 0 !important;
box-shadow: none !important;
overflow: visible !important;
z-index: 80 !important;
}
body.index_endpoint:has(#q:focus) .autocomplete ul,
body.index_endpoint:has(#q:focus) #autocomplete ul,
body.search_endpoint:has(#q:focus) .autocomplete ul,
body.search_endpoint:has(#q:focus) #autocomplete ul,
form#search:has(#q:focus) .autocomplete ul,
form#search:has(#q:focus) #autocomplete ul {
display: block !important;
width: 100% !important;
max-height: min(12rem, 34vh) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
margin: 0 !important;
padding: 0.35rem 0 !important;
background: #3A3A3A !important;
background-color: #3A3A3A !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
}
body.index_endpoint:has(#q:focus) .autocomplete:not(:has(li)),
body.index_endpoint:has(#q:focus) #autocomplete:not(:has(li)),
body.search_endpoint:has(#q:focus) .autocomplete:not(:has(li)),
body.search_endpoint:has(#q:focus) #autocomplete:not(:has(li)),
form#search:has(#q:focus) .autocomplete:not(:has(li)),
form#search:has(#q:focus) #autocomplete:not(:has(li)) {
display: none !important;
visibility: hidden !important;
width: 0 !important;
height: 0 !important;
min-width: 0 !important;
min-height: 0 !important;
max-width: 0 !important;
max-height: 0 !important;
overflow: hidden !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
}
}
/* Hide footer on mobile except the main homepage. */
@media (max-width: 700px) {
body:not(.index_endpoint) footer {
display: none !important;
}
}
/* Image results: no PrivacySafe rounding, margin, padding, sizing, or layout overrides.
Keep SearXNG's upstream image grid untouched. */
/* FINAL PREFERENCES OUTLINE BUTTONS:
Preferences action buttons should match the secondary outline buttons from the 429 page. */
#preferences input[type="submit"],
#preferences input[type="reset"],
#preferences input[type="button"],
#preferences button:not(#send_search):not(#clear_search),
#preferences .button,
#preferences .btn,
.preferences input[type="submit"],
.preferences input[type="reset"],
.preferences input[type="button"],
.preferences button:not(#send_search):not(#clear_search),
.preferences .button,
.preferences .btn,
.preferences_container input[type="submit"],
.preferences_container input[type="reset"],
.preferences_container input[type="button"],
.preferences_container button:not(#send_search):not(#clear_search),
.preferences_container .button,
.preferences_container .btn,
#main_preferences input[type="submit"],
#main_preferences input[type="reset"],
#main_preferences input[type="button"],
#main_preferences button:not(#send_search):not(#clear_search),
#main_preferences .button,
#main_preferences .btn,
form[action*="preferences"] input[type="submit"],
form[action*="preferences"] input[type="reset"],
form[action*="preferences"] input[type="button"],
form[action*="preferences"] button:not(#send_search):not(#clear_search),
form[action*="preferences"] .button,
form[action*="preferences"] .btn,
body.preferences_endpoint input[type="submit"],
body.preferences_endpoint input[type="reset"],
body.preferences_endpoint input[type="button"],
body.preferences_endpoint button:not(#send_search):not(#clear_search),
body.preferences_endpoint .button,
body.preferences_endpoint .btn,
body.preferences input[type="submit"],
body.preferences input[type="reset"],
body.preferences input[type="button"],
body.preferences button:not(#send_search):not(#clear_search),
body.preferences .button,
body.preferences .btn {
appearance: none !important;
-webkit-appearance: none !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
min-width: 4.5rem !important;
max-width: none !important;
min-height: 2.6rem !important;
height: auto !important;
padding: 0.6rem 1.2rem !important;
margin: 0.25rem !important;
border-radius: 999px !important;
border: 1px solid #5A5A5A !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
color: #EBEBEB !important;
-webkit-text-fill-color: #EBEBEB !important;
font-size: 1rem !important;
font-weight: 700 !important;
line-height: 1.1 !important;
text-indent: 0 !important;
letter-spacing: normal !important;
text-transform: none !important;
text-align: center !important;
text-decoration: none !important;
white-space: nowrap !important;
overflow: visible !important;
opacity: 1 !important;
box-shadow: none !important;
cursor: pointer !important;
}
#preferences input[type="submit"]:hover,
#preferences input[type="submit"]:focus,
#preferences input[type="reset"]:hover,
#preferences input[type="reset"]:focus,
#preferences input[type="button"]:hover,
#preferences input[type="button"]:focus,
#preferences button:not(#send_search):not(#clear_search):hover,
#preferences button:not(#send_search):not(#clear_search):focus,
#preferences .button:hover,
#preferences .button:focus,
#preferences .btn:hover,
#preferences .btn:focus,
.preferences input[type="submit"]:hover,
.preferences input[type="submit"]:focus,
.preferences input[type="reset"]:hover,
.preferences input[type="reset"]:focus,
.preferences input[type="button"]:hover,
.preferences input[type="button"]:focus,
.preferences button:not(#send_search):not(#clear_search):hover,
.preferences button:not(#send_search):not(#clear_search):focus,
.preferences .button:hover,
.preferences .button:focus,
.preferences .btn:hover,
.preferences .btn:focus,
.preferences_container input[type="submit"]:hover,
.preferences_container input[type="submit"]:focus,
.preferences_container input[type="reset"]:hover,
.preferences_container input[type="reset"]:focus,
.preferences_container input[type="button"]:hover,
.preferences_container input[type="button"]:focus,
.preferences_container button:not(#send_search):not(#clear_search):hover,
.preferences_container button:not(#send_search):not(#clear_search):focus,
.preferences_container .button:hover,
.preferences_container .button:focus,
.preferences_container .btn:hover,
.preferences_container .btn:focus,
#main_preferences input[type="submit"]:hover,
#main_preferences input[type="submit"]:focus,
#main_preferences input[type="reset"]:hover,
#main_preferences input[type="reset"]:focus,
#main_preferences input[type="button"]:hover,
#main_preferences input[type="button"]:focus,
#main_preferences button:not(#send_search):not(#clear_search):hover,
#main_preferences button:not(#send_search):not(#clear_search):focus,
#main_preferences .button:hover,
#main_preferences .button:focus,
#main_preferences .btn:hover,
#main_preferences .btn:focus,
form[action*="preferences"] input[type="submit"]:hover,
form[action*="preferences"] input[type="submit"]:focus,
form[action*="preferences"] input[type="reset"]:hover,
form[action*="preferences"] input[type="reset"]:focus,
form[action*="preferences"] input[type="button"]:hover,
form[action*="preferences"] input[type="button"]:focus,
form[action*="preferences"] button:not(#send_search):not(#clear_search):hover,
form[action*="preferences"] button:not(#send_search):not(#clear_search):focus,
form[action*="preferences"] .button:hover,
form[action*="preferences"] .button:focus,
form[action*="preferences"] .btn:hover,
form[action*="preferences"] .btn:focus,
body.preferences_endpoint input[type="submit"]:hover,
body.preferences_endpoint input[type="submit"]:focus,
body.preferences_endpoint input[type="reset"]:hover,
body.preferences_endpoint input[type="reset"]:focus,
body.preferences_endpoint input[type="button"]:hover,
body.preferences_endpoint input[type="button"]:focus,
body.preferences_endpoint button:not(#send_search):not(#clear_search):hover,
body.preferences_endpoint button:not(#send_search):not(#clear_search):focus,
body.preferences_endpoint .button:hover,
body.preferences_endpoint .button:focus,
body.preferences_endpoint .btn:hover,
body.preferences_endpoint .btn:focus,
body.preferences input[type="submit"]:hover,
body.preferences input[type="submit"]:focus,
body.preferences input[type="reset"]:hover,
body.preferences input[type="reset"]:focus,
body.preferences input[type="button"]:hover,
body.preferences input[type="button"]:focus,
body.preferences button:not(#send_search):not(#clear_search):hover,
body.preferences button:not(#send_search):not(#clear_search):focus,
body.preferences .button:hover,
body.preferences .button:focus,
body.preferences .btn:hover,
body.preferences .btn:focus {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
color: #45DA64 !important;
-webkit-text-fill-color: #45DA64 !important;
border-color: #45DA64 !important;
text-decoration: none !important;
opacity: 1 !important;
box-shadow: none !important;
}
#preferences button *,
#preferences .button *,
#preferences .btn *,
.preferences button *,
.preferences .button *,
.preferences .btn *,
.preferences_container button *,
.preferences_container .button *,
.preferences_container .btn *,
#main_preferences button *,
#main_preferences .button *,
#main_preferences .btn *,
form[action*="preferences"] button *,
form[action*="preferences"] .button *,
form[action*="preferences"] .btn * {
color: inherit !important;
-webkit-text-fill-color: inherit !important;
fill: currentColor !important;
stroke: currentColor !important;
opacity: 1 !important;
}
/* Do not let this preference-button styling affect navigation tabs or category controls. */
#categories a,
#categories label,
.categories a,
.categories label,
.search_categories a,
.search_categories label,
#links_on_top a,
#links_on_top a span,
.tabs a,
.info-page .tabs a {
background: transparent !important;
background-color: transparent !important;
border-radius: 0 !important;
}
/* FINAL EXACT PREFERENCES ACTION BUTTONS:
Targets the actual Preferences footer markup:
*/
#preferences input[type="submit"],
#preferences form input[type="submit"],
.preferences input[type="submit"],
.preferences form input[type="submit"],
.preferences_container input[type="submit"],
.preferences_container form input[type="submit"],
body.preferences_endpoint input[type="submit"],
body.preferences_endpoint form input[type="submit"],
form[action*="preferences"] input[type="submit"],
.right.preferences_back a,
.preferences_back a,
#preferences .right.preferences_back a,
#preferences .preferences_back a,
.preferences .right.preferences_back a,
.preferences .preferences_back a,
.preferences_container .right.preferences_back a,
.preferences_container .preferences_back a,
body.preferences_endpoint .right.preferences_back a,
body.preferences_endpoint .preferences_back a {
appearance: none !important;
-webkit-appearance: none !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 4.5rem !important;
min-height: 2.6rem !important;
width: auto !important;
max-width: none !important;
height: auto !important;
margin: 0.25rem !important;
padding: 0.6rem 1.2rem !important;
border: 1px solid #45DA64 !important;
border-radius: 999px !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
color: #EBEBEB !important;
-webkit-text-fill-color: #EBEBEB !important;
font-size: 1rem !important;
font-weight: 700 !important;
line-height: 1.1 !important;
letter-spacing: normal !important;
text-align: center !important;
text-decoration: none !important;
text-indent: 0 !important;
text-transform: none !important;
white-space: nowrap !important;
overflow: visible !important;
opacity: 1 !important;
box-shadow: none !important;
cursor: pointer !important;
}
/* Keep the action group together and aligned. */
.right.preferences_back,
#preferences .right.preferences_back,
.preferences .right.preferences_back,
.preferences_container .right.preferences_back,
body.preferences_endpoint .right.preferences_back {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
float: none !important;
width: auto !important;
height: auto !important;
min-width: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
vertical-align: middle !important;
}
/* On hover/focus, fill the whole button green. */
#preferences input[type="submit"]:hover,
#preferences input[type="submit"]:focus,
#preferences form input[type="submit"]:hover,
#preferences form input[type="submit"]:focus,
.preferences input[type="submit"]:hover,
.preferences input[type="submit"]:focus,
.preferences form input[type="submit"]:hover,
.preferences form input[type="submit"]:focus,
.preferences_container input[type="submit"]:hover,
.preferences_container input[type="submit"]:focus,
.preferences_container form input[type="submit"]:hover,
.preferences_container form input[type="submit"]:focus,
body.preferences_endpoint input[type="submit"]:hover,
body.preferences_endpoint input[type="submit"]:focus,
body.preferences_endpoint form input[type="submit"]:hover,
body.preferences_endpoint form input[type="submit"]:focus,
form[action*="preferences"] input[type="submit"]:hover,
form[action*="preferences"] input[type="submit"]:focus,
.right.preferences_back a:hover,
.right.preferences_back a:focus,
.preferences_back a:hover,
.preferences_back a:focus,
#preferences .right.preferences_back a:hover,
#preferences .right.preferences_back a:focus,
#preferences .preferences_back a:hover,
#preferences .preferences_back a:focus,
.preferences .right.preferences_back a:hover,
.preferences .right.preferences_back a:focus,
.preferences .preferences_back a:hover,
.preferences .preferences_back a:focus,
.preferences_container .right.preferences_back a:hover,
.preferences_container .right.preferences_back a:focus,
.preferences_container .preferences_back a:hover,
.preferences_container .preferences_back a:focus,
body.preferences_endpoint .right.preferences_back a:hover,
body.preferences_endpoint .right.preferences_back a:focus,
body.preferences_endpoint .preferences_back a:hover,
body.preferences_endpoint .preferences_back a:focus {
border-color: #45DA64 !important;
background: #45DA64 !important;
background-color: #45DA64 !important;
background-image: none !important;
color: #191919 !important;
-webkit-text-fill-color: #191919 !important;
text-decoration: none !important;
opacity: 1 !important;
box-shadow: none !important;
}
/* Keep nested text/icons readable inside these buttons. */
.right.preferences_back a *,
.preferences_back a *,
#preferences input[type="submit"] *,
.preferences input[type="submit"] *,
.preferences_container input[type="submit"] *,
body.preferences_endpoint input[type="submit"] * {
color: inherit !important;
-webkit-text-fill-color: inherit !important;
fill: currentColor !important;
stroke: currentColor !important;
opacity: 1 !important;
}
/* FINAL PREFERENCES ACTION BUTTONS:
Match the 404 page action buttons, but slimmer.
Save is the primary orange button. Reset defaults and Back are secondary outline buttons. */
input[type="submit"][value="Save"],
#preferences input[type="submit"][value="Save"],
.preferences input[type="submit"][value="Save"],
.preferences_container input[type="submit"][value="Save"],
body.preferences_endpoint input[type="submit"][value="Save"],
form[action*="preferences"] input[type="submit"][value="Save"] {
appearance: none !important;
-webkit-appearance: none !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
min-width: 4.25rem !important;
min-height: 2.25rem !important;
height: 2.25rem !important;
padding: 0.42rem 1rem !important;
margin: 0.25rem !important;
border: 1px solid transparent !important;
border-radius: 999px !important;
background: #FB521F !important;
background-color: #FB521F !important;
background-image: none !important;
color: #EBEBEB !important;
-webkit-text-fill-color: #EBEBEB !important;
font-family: inherit !important;
font-size: 0.95rem !important;
font-weight: 800 !important;
line-height: 1 !important;
letter-spacing: normal !important;
text-align: center !important;
text-decoration: none !important;
text-indent: 0 !important;
text-transform: none !important;
white-space: nowrap !important;
overflow: visible !important;
opacity: 1 !important;
box-shadow: none !important;
cursor: pointer !important;
vertical-align: middle !important;
}
.right.preferences_back > a[href="/clear_cookies"],
.right.preferences_back > a[href="/"],
.preferences_back > a[href="/clear_cookies"],
.preferences_back > a[href="/"],
#preferences .preferences_back > a[href="/clear_cookies"],
#preferences .preferences_back > a[href="/"],
.preferences .preferences_back > a[href="/clear_cookies"],
.preferences .preferences_back > a[href="/"],
.preferences_container .preferences_back > a[href="/clear_cookies"],
.preferences_container .preferences_back > a[href="/"],
body.preferences_endpoint .preferences_back > a[href="/clear_cookies"],
body.preferences_endpoint .preferences_back > a[href="/"] {
appearance: none !important;
-webkit-appearance: none !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
min-width: 4.25rem !important;
min-height: 2.25rem !important;
height: 2.25rem !important;
padding: 0.42rem 1rem !important;
margin: 0.25rem !important;
border: 1px solid #5A5A5A !important;
border-radius: 999px !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
color: #EBEBEB !important;
-webkit-text-fill-color: #EBEBEB !important;
font-family: inherit !important;
font-size: 0.95rem !important;
font-weight: 800 !important;
line-height: 1 !important;
letter-spacing: normal !important;
text-align: center !important;
text-decoration: none !important;
text-indent: 0 !important;
text-transform: none !important;
white-space: nowrap !important;
overflow: visible !important;
opacity: 1 !important;
box-shadow: none !important;
cursor: pointer !important;
vertical-align: middle !important;
}
.right.preferences_back,
#preferences .right.preferences_back,
.preferences .right.preferences_back,
.preferences_container .right.preferences_back,
body.preferences_endpoint .right.preferences_back {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
float: none !important;
width: auto !important;
height: auto !important;
min-width: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
vertical-align: middle !important;
}
input[type="submit"][value="Save"]:hover,
input[type="submit"][value="Save"]:focus,
#preferences input[type="submit"][value="Save"]:hover,
#preferences input[type="submit"][value="Save"]:focus,
.preferences input[type="submit"][value="Save"]:hover,
.preferences input[type="submit"][value="Save"]:focus,
.preferences_container input[type="submit"][value="Save"]:hover,
.preferences_container input[type="submit"][value="Save"]:focus,
body.preferences_endpoint input[type="submit"][value="Save"]:hover,
body.preferences_endpoint input[type="submit"][value="Save"]:focus,
form[action*="preferences"] input[type="submit"][value="Save"]:hover,
form[action*="preferences"] input[type="submit"][value="Save"]:focus {
border-color: #45DA64 !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
color: #45DA64 !important;
-webkit-text-fill-color: #45DA64 !important;
text-decoration: none !important;
box-shadow: none !important;
opacity: 1 !important;
}
.right.preferences_back > a[href="/clear_cookies"]:hover,
.right.preferences_back > a[href="/clear_cookies"]:focus,
.right.preferences_back > a[href="/"]:hover,
.right.preferences_back > a[href="/"]:focus,
.preferences_back > a[href="/clear_cookies"]:hover,
.preferences_back > a[href="/clear_cookies"]:focus,
.preferences_back > a[href="/"]:hover,
.preferences_back > a[href="/"]:focus,
#preferences .preferences_back > a[href="/clear_cookies"]:hover,
#preferences .preferences_back > a[href="/clear_cookies"]:focus,
#preferences .preferences_back > a[href="/"]:hover,
#preferences .preferences_back > a[href="/"]:focus,
.preferences .preferences_back > a[href="/clear_cookies"]:hover,
.preferences .preferences_back > a[href="/clear_cookies"]:focus,
.preferences .preferences_back > a[href="/"]:hover,
.preferences .preferences_back > a[href="/"]:focus,
.preferences_container .preferences_back > a[href="/clear_cookies"]:hover,
.preferences_container .preferences_back > a[href="/clear_cookies"]:focus,
.preferences_container .preferences_back > a[href="/"]:hover,
.preferences_container .preferences_back > a[href="/"]:focus,
body.preferences_endpoint .preferences_back > a[href="/clear_cookies"]:hover,
body.preferences_endpoint .preferences_back > a[href="/clear_cookies"]:focus,
body.preferences_endpoint .preferences_back > a[href="/"]:hover,
body.preferences_endpoint .preferences_back > a[href="/"]:focus {
border-color: #45DA64 !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
color: #45DA64 !important;
-webkit-text-fill-color: #45DA64 !important;
text-decoration: none !important;
box-shadow: none !important;
opacity: 1 !important;
}
/* FINAL DROPDOWN CORNER FIX:
Dropdown/select inputs should be softly rounded, not full pill buttons. */
select,
select:focus,
.preferences select,
.preferences select:focus,
.preferences_container select,
.preferences_container select:focus,
#preferences select,
#preferences select:focus,
body.preferences_endpoint select,
body.preferences_endpoint select:focus,
form[action*="preferences"] select,
form[action*="preferences"] select:focus,
.search_filters select,
.search_filters select:focus,
#search_filters select,
#search_filters select:focus {
border-radius: 0.65rem !important;
background-color: #30333A !important;
color: #EBEBEB !important;
min-height: 2.35rem !important;
height: auto !important;
padding-top: 0.35rem !important;
padding-bottom: 0.35rem !important;
box-shadow: none !important;
}
/* Keep text inputs/search fields pill-shaped. This intentionally does not include select. */
input[type="search"],
input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"],
.search_box,
#q {
border-radius: 999px !important;
}
/* Browser add-search prompt immediately above the footer divider line.
Hidden by default and shown only on the main index endpoint. */
.privacysafe-add-search {
display: none !important;
}
body.index_endpoint .privacysafe-add-search {
display: block !important;
width: min(720px, calc(100vw - 32px)) !important;
max-width: min(720px, calc(100vw - 32px)) !important;
margin: 0 auto 0 auto !important;
padding: 0.65rem 0.75rem 0.45rem 0.75rem !important;
color: #EBEBEB !important;
font-size: clamp(1rem, 2vw, 1.15rem) !important;
font-weight: 500 !important;
line-height: 1.35 !important;
text-align: center !important;
box-sizing: border-box !important;
}
body.index_endpoint .privacysafe-add-search p {
margin: 0 0 0.45rem 0 !important;
padding: 0 !important;
color: #EBEBEB !important;
}
body.index_endpoint .privacysafe-add-search button {
appearance: none !important;
-webkit-appearance: none !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-height: 2.6rem !important;
padding: 0.55rem 1.1rem !important;
border: 1px solid #45DA64 !important;
border-radius: 999px !important;
background: transparent !important;
color: #EBEBEB !important;
font: inherit !important;
font-weight: 700 !important;
line-height: 1.1 !important;
cursor: pointer !important;
box-shadow: none !important;
}
body.index_endpoint .privacysafe-add-search button:hover,
body.index_endpoint .privacysafe-add-search button:focus {
background: #45DA64 !important;
color: #191919 !important;
border-color: #45DA64 !important;
}
body.index_endpoint .privacysafe-add-search code {
color: #EBEBEB !important;
background: #3A3A3A !important;
border-radius: 0.35rem !important;
padding: 0.1rem 0.3rem !important;
}
body.index_endpoint .privacysafe-add-search-manual {
font-size: 0.92rem !important;
color: #B8B8B8 !important;
}
body:not(.index_endpoint) .privacysafe-add-search {
display: none !important;
}
@media (max-width: 700px) {
body.index_endpoint .privacysafe-add-search {
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
padding-top: 0.55rem !important;
padding-bottom: 0.35rem !important;
font-size: 0.98rem !important;
}
}
/* Homepage donation prompt immediately above the footer divider line.
Hidden by default and shown only on the main index endpoint. */
.privacysafe-home-donation {
display: none !important;
}
body.index_endpoint .privacysafe-home-donation {
display: block !important;
width: min(720px, calc(100vw - 32px)) !important;
max-width: min(720px, calc(100vw - 32px)) !important;
margin: 0 auto 0 auto !important;
padding: 0.65rem 0.75rem 1rem 0.75rem !important;
color: #EBEBEB !important;
font-size: clamp(1rem, 2vw, 1.15rem) !important;
font-weight: 500 !important;
line-height: 1.35 !important;
text-align: center !important;
box-sizing: border-box !important;
}
body.index_endpoint .privacysafe-home-donation p {
margin: 0 !important;
padding: 0 !important;
color: #EBEBEB !important;
}
body.index_endpoint .privacysafe-home-donation a {
color: #FB521F !important;
text-decoration: none !important;
font-weight: 700 !important;
}
body.index_endpoint .privacysafe-home-donation a:hover,
body.index_endpoint .privacysafe-home-donation a:focus {
color: #45DA64 !important;
text-decoration: none !important;
}
body:not(.index_endpoint) .privacysafe-home-donation {
display: none !important;
}
@media (max-width: 700px) {
body.index_endpoint .privacysafe-home-donation {
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
padding-top: 0.55rem !important;
padding-bottom: 0.85rem !important;
font-size: 0.98rem !important;
}
}
/* Empty /search page fix:
SearXNG can render a homepage-style page at /search without the index_endpoint body class.
Scope these rules to search_endpoint pages that still use #main_index so real results pages are not affected. */
body.search_endpoint #main_index .index > .title,
body.search_endpoint #main_index .index > .title a {
width: min(583px, 73vw) !important;
max-width: min(583px, 73vw) !important;
margin: 0 auto 1.35rem auto !important;
padding: 0 !important;
text-align: center !important;
line-height: 0 !important;
background: transparent !important;
background-image: none !important;
box-shadow: none !important;
}
body.search_endpoint #main_index .index > .title::before,
body.search_endpoint #main_index .index > .title::after {
content: none !important;
display: none !important;
background: none !important;
background-image: none !important;
}
body.search_endpoint #main_index .index > .title h1 {
display: none !important;
visibility: hidden !important;
background: none !important;
background-image: none !important;
}
body.search_endpoint #main_index .index > .title img {
display: block !important;
width: 100% !important;
max-width: 100% !important;
height: auto !important;
max-height: 135px !important;
object-fit: contain !important;
margin: 0 auto !important;
background: transparent !important;
background-image: none !important;
}
body.search_endpoint #main_index .index > .title[style] {
background: transparent !important;
background-image: none !important;
}
body.search_endpoint #main_index .index > .title img:not(:first-of-type) {
display: none !important;
}
body.search_endpoint #main_index ~ .privacysafe-home-donation {
display: block !important;
width: min(720px, calc(100vw - 32px)) !important;
max-width: min(720px, calc(100vw - 32px)) !important;
margin: 0 auto 0 auto !important;
padding: 0.65rem 0.75rem 1rem 0.75rem !important;
color: #EBEBEB !important;
font-size: clamp(1rem, 2vw, 1.15rem) !important;
font-weight: 500 !important;
line-height: 1.35 !important;
text-align: center !important;
box-sizing: border-box !important;
}
body.search_endpoint #main_index ~ .privacysafe-home-donation p {
margin: 0 !important;
padding: 0 !important;
color: #EBEBEB !important;
}
body.search_endpoint #main_index ~ .privacysafe-home-donation a {
color: #FB521F !important;
text-decoration: none !important;
font-weight: 700 !important;
}
body.search_endpoint #main_index ~ .privacysafe-home-donation a:hover,
body.search_endpoint #main_index ~ .privacysafe-home-donation a:focus {
color: #45DA64 !important;
text-decoration: none !important;
}
/* Rounded corners for search-result thumbnails and infobox images only.
This intentionally includes img_load_error.svg so transparent checkerboard placeholders
get the same rounded corners. Do not change margins, sizing, display, positioning,
overflow, or the image-result grid layout. */
body.results_endpoint #urls article.result-images > a > img.image_thumbnail,
body.results_endpoint #urls .result-images > a > img.image_thumbnail,
body.results_endpoint aside.infobox > img:not([src*="empty_favicon.svg"]):not([src*="favicon"]),
body.results_endpoint aside.infobox dd img:not([src*="empty_favicon.svg"]):not([src*="favicon"]) {
border-radius: 0.75rem !important;
background-clip: padding-box !important;
}
/* FINAL MOBILE AUTOCOMPLETE BACKDROP FIX:
Prevent the focused autocomplete state from painting a large gray panel behind the
search box. The search pill and the actual suggestions list remain visible. */
@media (max-width: 700px) {
body.index_endpoint:has(#q:focus) #main_index,
body.index_endpoint:has(#q:focus) main,
body.index_endpoint:has(#q:focus) .index,
body.index_endpoint:has(#q:focus) form#search,
body.index_endpoint:has(#q:focus) #search,
body.index_endpoint:has(#q:focus) #search_header,
body.index_endpoint:has(#q:focus) #search_view,
body.search_endpoint:has(#q:focus) #main_index,
body.search_endpoint:has(#q:focus) main,
body.search_endpoint:has(#q:focus) .index,
body.search_endpoint:has(#q:focus) form#search,
body.search_endpoint:has(#q:focus) #search,
body.search_endpoint:has(#q:focus) #search_header,
body.search_endpoint:has(#q:focus) #search_view {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
box-shadow: none !important;
border-color: transparent !important;
}
body.index_endpoint:has(#q:focus) .search_box,
body.search_endpoint:has(#q:focus) .search_box,
form#search:has(#q:focus) .search_box,
#search:has(#q:focus) .search_box,
#search_header:has(#q:focus) .search_box,
#search_view:has(#q:focus) .search_box {
background: #3A3A3A !important;
background-color: #3A3A3A !important;
background-image: none !important;
border: 1px solid transparent !important;
border-radius: 999px !important;
box-shadow: none !important;
overflow: visible !important;
}
body.index_endpoint:has(#q:focus) .autocomplete,
body.index_endpoint:has(#q:focus) .autocomplete.open,
body.index_endpoint:has(#q:focus) #autocomplete,
body.index_endpoint:has(#q:focus) #autocomplete.open,
body.search_endpoint:has(#q:focus) .autocomplete,
body.search_endpoint:has(#q:focus) .autocomplete.open,
body.search_endpoint:has(#q:focus) #autocomplete,
body.search_endpoint:has(#q:focus) #autocomplete.open,
form#search:has(#q:focus) .autocomplete,
form#search:has(#q:focus) .autocomplete.open,
form#search:has(#q:focus) #autocomplete,
form#search:has(#q:focus) #autocomplete.open,
#search:has(#q:focus) .autocomplete,
#search:has(#q:focus) .autocomplete.open,
#search:has(#q:focus) #autocomplete,
#search:has(#q:focus) #autocomplete.open,
.search_box:has(#q:focus) .autocomplete,
.search_box:has(#q:focus) .autocomplete.open,
.search_box:has(#q:focus) #autocomplete,
.search_box:has(#q:focus) #autocomplete.open {
display: block !important;
position: absolute !important;
top: calc(100% + 0.35rem) !important;
left: 0 !important;
right: 0 !important;
width: auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
overflow: visible !important;
z-index: 90 !important;
}
body.index_endpoint:has(#q:focus) .autocomplete ul,
body.index_endpoint:has(#q:focus) #autocomplete ul,
body.search_endpoint:has(#q:focus) .autocomplete ul,
body.search_endpoint:has(#q:focus) #autocomplete ul,
form#search:has(#q:focus) .autocomplete ul,
form#search:has(#q:focus) #autocomplete ul,
#search:has(#q:focus) .autocomplete ul,
#search:has(#q:focus) #autocomplete ul,
.search_box:has(#q:focus) .autocomplete ul,
.search_box:has(#q:focus) #autocomplete ul {
display: block !important;
width: 100% !important;
max-height: min(12rem, 34vh) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
margin: 0 !important;
padding: 0.35rem 0 !important;
background: #3A3A3A !important;
background-color: #3A3A3A !important;
background-image: none !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
}
body.index_endpoint:has(#q:focus) .autocomplete:not(:has(li)),
body.index_endpoint:has(#q:focus) #autocomplete:not(:has(li)),
body.search_endpoint:has(#q:focus) .autocomplete:not(:has(li)),
body.search_endpoint:has(#q:focus) #autocomplete:not(:has(li)),
form#search:has(#q:focus) .autocomplete:not(:has(li)),
form#search:has(#q:focus) #autocomplete:not(:has(li)),
#search:has(#q:focus) .autocomplete:not(:has(li)),
#search:has(#q:focus) #autocomplete:not(:has(li)),
.search_box:has(#q:focus) .autocomplete:not(:has(li)),
.search_box:has(#q:focus) #autocomplete:not(:has(li)) {
display: none !important;
visibility: hidden !important;
width: 0 !important;
height: 0 !important;
min-width: 0 !important;
min-height: 0 !important;
max-width: 0 !important;
max-height: 0 !important;
overflow: hidden !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
}
}
/* FINAL ACTUAL MARKUP FIXES:
Actual SearXNG category labels are inside .category_name. Results autocomplete
runs under #main_results/body.results_endpoint, so override that markup directly. */
button[name="category_it"] .category_name,
.category_checkbox:has(input#checkbox_it) .category_name,
.category_checkbox:has(input[name="category_it"]) .category_name,
label[for="checkbox_it"] .category_name {
font-size: 0 !important;
line-height: 0 !important;
}
button[name="category_it"] .category_name::after,
.category_checkbox:has(input#checkbox_it) .category_name::after,
.category_checkbox:has(input[name="category_it"]) .category_name::after,
label[for="checkbox_it"] .category_name::after {
content: "IT" !important;
display: inline !important;
font-size: 1rem !important;
line-height: 1.2 !important;
}
button[name="category_social media"] .category_name,
button[name="category_socialmedia"] .category_name,
button[name="category_social_media"] .category_name,
.category_checkbox:has(input#checkbox_social_media) .category_name,
.category_checkbox:has(input#checkbox_socialmedia) .category_name,
.category_checkbox:has(input[name="category_social media"]) .category_name,
.category_checkbox:has(input[name="category_socialmedia"]) .category_name,
.category_checkbox:has(input[name="category_social_media"]) .category_name,
label[for="checkbox_social_media"] .category_name,
label[for="checkbox_socialmedia"] .category_name {
font-size: 0 !important;
line-height: 0 !important;
}
button[name="category_social media"] .category_name::after,
button[name="category_socialmedia"] .category_name::after,
button[name="category_social_media"] .category_name::after,
.category_checkbox:has(input#checkbox_social_media) .category_name::after,
.category_checkbox:has(input#checkbox_socialmedia) .category_name::after,
.category_checkbox:has(input[name="category_social media"]) .category_name::after,
.category_checkbox:has(input[name="category_socialmedia"]) .category_name::after,
.category_checkbox:has(input[name="category_social_media"]) .category_name::after,
label[for="checkbox_social_media"] .category_name::after,
label[for="checkbox_socialmedia"] .category_name::after {
content: "Social" !important;
display: inline !important;
font-size: 1rem !important;
line-height: 1.2 !important;
}
@media (max-width: 700px) {
body.results_endpoint:has(#q:focus) #main_results,
body.results_endpoint:has(#q:focus) form#search,
body.results_endpoint:has(#q:focus) #search,
body.results_endpoint:has(#q:focus) #search_header,
body.results_endpoint:has(#q:focus) #search_view,
#main_results:has(#q:focus),
#main_results:has(#q:focus) form#search,
#main_results:has(#q:focus) #search,
#main_results:has(#q:focus) #search_header,
#main_results:has(#q:focus) #search_view {
display: block !important;
position: static !important;
inset: auto !important;
width: auto !important;
max-width: none !important;
min-height: 0 !important;
height: auto !important;
max-height: none !important;
padding: 0 !important;
overflow: visible !important;
transform: none !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
box-shadow: none !important;
border-color: transparent !important;
}
body.results_endpoint:has(#q:focus) .search_box,
#main_results:has(#q:focus) .search_box,
form#search:has(#q:focus) .search_box {
display: flex !important;
align-items: center !important;
position: relative !important;
width: calc(100vw - 32px) !important;
max-width: calc(100vw - 32px) !important;
min-width: 0 !important;
height: 2.85rem !important;
min-height: 2.85rem !important;
max-height: 2.85rem !important;
margin-left: auto !important;
margin-right: auto !important;
padding: 0 !important;
overflow: visible !important;
background: #3A3A3A !important;
background-color: #3A3A3A !important;
background-image: none !important;
border: 1px solid transparent !important;
border-radius: 999px !important;
box-shadow: none !important;
}
body.results_endpoint:has(#q:focus) .search_box > :not(.autocomplete),
#main_results:has(#q:focus) .search_box > :not(.autocomplete) {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
box-shadow: none !important;
}
body.results_endpoint:has(#q:focus) .autocomplete,
body.results_endpoint:has(#q:focus) .autocomplete.open,
body.results_endpoint:has(#q:focus) #autocomplete,
#main_results:has(#q:focus) .autocomplete,
#main_results:has(#q:focus) .autocomplete.open,
#main_results:has(#q:focus) #autocomplete,
form#search:has(#q:focus) .autocomplete,
form#search:has(#q:focus) .autocomplete.open,
form#search:has(#q:focus) #autocomplete {
display: block !important;
position: absolute !important;
top: calc(100% + 0.35rem) !important;
left: 0 !important;
right: 0 !important;
width: auto !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
overflow: visible !important;
z-index: 90 !important;
}
body.results_endpoint:has(#q:focus) .autocomplete ul,
body.results_endpoint:has(#q:focus) #autocomplete ul,
#main_results:has(#q:focus) .autocomplete ul,
#main_results:has(#q:focus) #autocomplete ul,
form#search:has(#q:focus) .autocomplete ul,
form#search:has(#q:focus) #autocomplete ul {
display: block !important;
width: 100% !important;
height: auto !important;
min-height: 0 !important;
max-height: min(12rem, 34vh) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
margin: 0 !important;
padding: 0.35rem 0 !important;
background: #3A3A3A !important;
background-color: #3A3A3A !important;
background-image: none !important;
border: 1px solid #5A5A5A !important;
border-radius: 1rem !important;
box-shadow: 0 18px 48px rgb(0 0 0 / 35%) !important;
}
body.results_endpoint:has(#q:focus) .autocomplete:not(:has(li)),
body.results_endpoint:has(#q:focus) #autocomplete:not(:has(li)),
#main_results:has(#q:focus) .autocomplete:not(:has(li)),
#main_results:has(#q:focus) #autocomplete:not(:has(li)),
form#search:has(#q:focus) .autocomplete:not(:has(li)),
form#search:has(#q:focus) #autocomplete:not(:has(li)) {
display: none !important;
visibility: hidden !important;
width: 0 !important;
height: 0 !important;
min-width: 0 !important;
min-height: 0 !important;
max-width: 0 !important;
max-height: 0 !important;
overflow: hidden !important;
padding: 0 !important;
margin: 0 !important;
border: 0 !important;
box-shadow: none !important;
}
}