/* Custom SearXNG Theme - Matching eby Server Dashboard */

@font-face {
    font-family: 'Agave';
    src: url('/fonts/Agave/agave regular Nerd Font Complete.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html {
    font-family: 'Agave', monospace, sans-serif !important;
}

/* --- Global / Body Styles --- 
body {
    background-color: #eeeeed !important;
    color: #0c0001 !important;
}

/* --- Typography & Headers --- 
h1, h2, h3, h4, h5, h6, 
.title, #search_header h1 {
    color: #ecf0f1 !important;
}

/* --- Search Header & Input Container --- 
#search, 
#search_header, 
#search_wrapper,
.search_box {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Search Input Bar 
#q, 
input[type="text"], 
.search_box input {
    background: rgba(128, 128, 128, 0.4) !important;
    color: #ecf0f1 !important;
    border: 1px solid rgba(100, 100, 100, 0.5) !important;
    border-radius: 8px !important;
    font-family: 'Agave', monospace, sans-serif !important;
    padding: 10px 14px !important;
    transition: background-color 0.3s, border-color 0.3s !important;
}

#q:focus, 
input[type="text"]:focus {
    background: rgba(128, 128, 128, 0.7) !important;
    border-color: rgba(200, 200, 200, 0.6) !important;
    outline: none !important;
}

/* Search Buttons 
button[type="submit"], 
.btn-primary,
.search_button {
    background: rgba(128, 128, 128, 0.4) !important;
    color: #ecf0f1 !important;
    border: 1px solid rgba(100, 100, 100, 0.5) !important;
    border-radius: 8px !important;
    font-family: 'Agave', monospace, sans-serif !important;
    transition: background-color 0.3s !important;
}

button[type="submit"]:hover, 
.btn-primary:hover {
    background: rgba(128, 128, 128, 0.7) !important;
}

/* --- Categories & Navigation Tabs --- */

#categories {
    background: transparent !important;
    margin-top: 16px !important;
    margin-bottom: 16px !important;
    text-align: center !important;
}

#categories label, .category label, #categories a {
    color: #0c1011 !important;
    opacity: 0.7;
    transition: opacity 0.2s !important;
}

#categories input[type="checkbox"]:checked + label, #categories label.active, #categories a.active {
    color: #000000 !important;
    opacity: 1 !important;
}

/* --- Search Results Cards --- */
article.result, .result, .result-default {
    background: rgba(255, 170, 128, 0.05) !important;
    border: 1px solid rgba(100, 100, 100, 0.1) !important;
    border-radius: 8px !important;
    padding: 14px 18px !important;
    margin-bottom: 16px !important;
    transition: background-color 0.2s !important;
}

article.result:hover, .result:hover {
    background: rgba(255, 170, 128, 0.1) !important;
}

/* Result Links and Typography 
.result h3 a, 
.result a, 
.result-title {
    color: #ecf0f1 !important;
    font-family: 'Agave', monospace, sans-serif !important;
    text-decoration: none !important;
}

.result h3 a:hover {
    text-decoration: underline !important;
}

.result .url, 
.result .result-url,
.result .host {
    color: rgba(236, 240, 241, 0.6) !important;
    font-size: 0.85rem !important;
}

.result .content, 
.result-content {
    color: #ecf0f1 !important;
    font-size: 0.95rem !important;
}

/* --- Sidebar & Infoboxes --- 
#sidebar, 
.infobox, 
#sidebar .widget {
    background: rgba(128, 128, 128, 0.4) !important;
    border: 1px solid rgba(100, 100, 100, 0.5) !important;
    border-radius: 8px !important;
    color: #ecf0f1 !important;
}

/* --- Footer & Pagination --- 
#footer, 
.pagination, 
#pagination {
    background: transparent !important;
    color: #ecf0f1 !important;
    font-family: 'Agave', monospace, sans-serif !important;
}

.pagination a, 
#pagination a {
    background: rgba(128, 128, 128, 0.4) !important;
    color: #ecf0f1 !important;
    border: 1px solid rgba(100, 100, 100, 0.5) !important;
    border-radius: 6px !important;
    padding: 6px 12px !important;
}

.pagination a:hover, 
#pagination a:hover {
    background: rgba(128, 128, 128, 0.7) !important;
}

*/

:root {
  --color-btn-background: #ffaa7f;
  --color-categories-item-border-selected: #ffaa7f;
  --color-categories-item-selected-font: #ffaa7f;
  --color-search-background-hover: #ffaa7f;
  --color-toolkit-checkbox-input-border: #ffaa7f;
  --color-toolkit-checkbox-onoff-on-mark-background: #ffaa7f;
}

.index .title {
  background: none !important;
  max-height: 1rem;
  margin: 4rem auto;
}

.index .title::before {
  content: "SearXNG";
  display: block;
  font-size: 5rem;
  font-weight: bold;
  color: #ffaa7f;
  line-height: 6rem;
}

@media screen and (max-width: 35em) {
  .index .title::before {
    font-size: 3rem;
    line-height: 4rem;
  }
}

.page_with_header .logo {
  display: none;
}

.page_with_header > a[href="/"] {
  display: inline-block;
}

.page_with_header > a[href="/"]::before {
  content: "SearXNG";
  font-size: 4rem;
  font-weight: bold;
  color: #ffaa7f;
}

@media screen and (max-width: 35em) {
  .page_with_header > a[href="/"]::before {
    font-size: 2.5rem;
  }
}