/* ayu Vivid for Kagi: paste into kagi.com → Settings → Appearance → Custom CSS.
 * Light colors with Kagi's light themes, dark colors with Dark / Moon Dark.
 * Theme color (Settings → Appearance): light #fcfcfc, dark #10141c.
 * Generated by build.ts from the ayu palette. Don't edit by hand. */

:root {
  --ayu-background: #fcfcfc;
  --ayu-search-bg: #ffffff;
  --ayu-search-border: #edeff1;
  --ayu-foreground: #5c6166;
  --ayu-comment: #adaeb1;
  --ayu-accent: #f29718;
  --ayu-on-accent: #0d1017;
  --ayu-accent-text: #b25c00;
  --ayu-blue: #0078bc;
  --ayu-purple: #8e5cbd;
  --ayu-green: #557e00;
  --ayu-orange: #c74e00;
  --ayu-title: #009ae1;

  --search-result-title: #009ae1;
  --result-item-title-border: transparent;
  --color-search-input: #ffffff;
  --input-bg: #ffffff;
  --color-search-input-border: #edeff1;
  --app-search-text: #5c6166;
}

.theme_dark,
.theme_moon_dark {
  --ayu-background: #10141c;
  --ayu-search-bg: #141821;
  --ayu-search-border: #1b1f29;
  --ayu-foreground: #bfbdb6;
  --ayu-comment: #5a6673;
  --ayu-accent: #e6b450;
  --ayu-on-accent: #10141c;
  --ayu-accent-text: #e6b450;
  --ayu-blue: #59c2ff;
  --ayu-purple: #d2a6ff;
  --ayu-green: #a5dc01;
  --ayu-orange: #ff8f40;
  --ayu-title: #39bae6;

  --search-result-title: #39bae6;
  --result-item-title-border: transparent;
  --color-search-input: #141821;
  --input-bg: #141821;
  --color-search-input-border: #1b1f29;
  --app-search-text: #bfbdb6;
}

body {
  font-family: sans-serif;
  font-size: 16px;
  background-color: var(--ayu-background);
  color: var(--ayu-foreground);
}

/* Search field: ayu accent outline while typing */
.search-form .search-input-container:focus-within {
  border-color: var(--ayu-accent);
}

/* Search result titles */
.__sri-title .__sri_title_link {
  color: var(--search-result-title);
  border-bottom: 1px solid var(--result-item-title-border);
}

.__sri-title .__sri_title_link:visited {
  color: var(--ayu-purple);
}

.__sri-title .__sri_title_link:hover {
  color: var(--ayu-accent-text);
  border-bottom: 1px solid var(--ayu-accent-text);
}

/* Buttons */
.btn.--yellow {
  background-color: var(--ayu-accent);
  border: 1px solid var(--ayu-accent);
  color: var(--ayu-on-accent);
  transition: ease 150ms;
}

.btn.--yellow:hover {
  background-color: var(--ayu-blue);
  border: 1px solid var(--ayu-accent);
  color: var(--ayu-background);
  transform: scale(1.05);
}

/* Outer glow on hover */
.btn.--yellow:hover::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  box-shadow: 0 0 1rem 0.5rem var(--ayu-accent);
  opacity: 0.6;
}

/* Hide unused elements */
.doggo-sit, .doggo-left, #eyes-on, #eyes-off {
  display: none;
}

/* Category buttons */
.landing-category-select button.n_se.--active,
.landing-category-select button.n_se:hover {
  border-bottom: 2px solid var(--ayu-purple);
}

/* Grouped search result titles */
.__srgi-title a {
  color: var(--search-result-title);
  border-bottom: 1px solid var(--result-item-title-border);
  font-size: 1.5rem;
}

.__srgi-title a:visited {
  color: var(--ayu-purple);
}

.__srgi-title a:hover {
  color: var(--ayu-accent-text);
  border-bottom: 1px solid var(--ayu-accent-text);
}

/* Dropdowns */
.dropdown .dd-toggle-label:hover,
.k_ui_dropdown .k_ui_dropdown_first_item:hover {
  color: var(--ayu-accent-text);
}

/* Summary link */
._0_summarize_link a {
  color: var(--ayu-green);
}

._0_summarize_link a:hover {
  color: var(--ayu-accent-text);
}

/* All links on hover */
a:hover {
  color: var(--ayu-accent-text);
}

/* Active search modes */
._0_d_info_ranking.k_ui_btn_group .search_mode_box_s input:checked + a.k_ui_btn,
._0_sri-w-highlight .search_mode_box_s a.searchResultAnswer,
.search_mode_box_s ._0_d_info_ranking.k_ui_btn_group input:checked + a.k_ui_btn,
.search_mode_box_s ._0_sri-w-highlight a.searchResultAnswer,
.search_mode_box_s a.--active,
.search_mode_box_s a._0_sri-w-highlight.box,
.search_mode_box_s a.box:hover {
  background-color: var(--ayu-accent);
  border: var(--ayu-accent);
  color: var(--ayu-on-accent);
}

._0_results_summary_links ol a:hover {
  color: var(--ayu-accent-text) !important;
}

.k_ui_toggle_switch.--enabled .k_ui_toggle_switch_bar {
  background-color: var(--ayu-accent);
}