/* Kagi - Catppuccin Mocha */

/* === PALETTE ===
   Edit colors here - variables are used everywhere below. */

:root {
  --ctp-base:     #1e1e2e;
  --ctp-surface0: #313244;
  --ctp-surface1: #45475a;
  --ctp-surface2: #585b70;

  --ctp-text:     #cdd6f4;
  --ctp-mauve:    #cba6f7;
  --ctp-lavender: #b4befe;
  --ctp-pink:     #f5c2e7;
  --ctp-green:    #a6e3a1;
  --ctp-sapphire: #74c7ec;
  --ctp-sky:      #89dceb;
  --ctp-rose:     #f5e0dc;
  --ctp-flamingo: #f2cdcd;
  --ctp-peach:    #fab387;
  --ctp-yellow:   #f9e2af;
  --ctp-teal:     #94e2d5;
  --ctp-blue:     #89b4fa;
  --ctp-maroon:   #eba0ac;
}

/* === FONT === */

body { font-family: sans-serif; }

/* === BASE === */

html, body {
  background: var(--ctp-base) !important;
  color: var(--ctp-text) !important;
}

/* === HEADER === */

.app-header.app-content-box {
  position: sticky;
  top: 0;
  z-index: 120;
  background: rgba(30,30,46,0.75);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--ctp-surface1);
}

/* === SEARCH BAR === */

.search-input-container {
  background: var(--ctp-surface0) !important;
  border: 1px solid var(--ctp-surface1) !important;
  border-radius: 2rem !important;
  transition: 0.2s ease;
}

.search-input-container:focus-within {
  border-color: var(--ctp-mauve) !important;
  box-shadow: 0 0 0 3px rgba(203,166,247,0.18);
}

.search-input-container input {
  color: var(--ctp-text) !important;
  background: transparent !important;
  caret-color: var(--ctp-mauve);
}

/* === LAYOUT === */

.search_results_container {
  padding-left: 2.2rem;
  padding-right: 2rem;
}

/* === RESULT CARDS === */

.sri-group,
.search-result,
.newsResultItem,
.scene {
  box-sizing: border-box;
  background: var(--ctp-surface0);
  border: 1px solid var(--ctp-surface1);
  border-radius: 16px;
  padding: 1.2rem 1.4rem;
  margin-bottom: 1rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.sri-group:hover,
.search-result:hover {
  border-color: var(--ctp-mauve);
  box-shadow:
    0 0 0 1px rgba(203,166,247,0.25),
    0 6px 28px rgba(203,166,247,0.12);
}

/* === BOOSTED / RAISED / PINNED === */

.search-result._0_RESULT_BOOSTED,
.search-result._0_RESULT_RAISED,
.search-result._0_RESULT_PINNED {
  box-shadow: inset 3px 0 0 var(--ctp-green);
}

/* === RESULT TITLES === */

.__sri-title a,
.__sri_title_link {
  color: var(--ctp-rose) !important;
  transition: color 0.2s ease;
}

.__sri_title_link:hover {
  color: var(--ctp-flamingo) !important;
}

a:visited.__sri_title_link {
  color: var(--ctp-mauve) !important;
}

/* === SUB-LINKS (sitelinks) === */

.__srgi-title a {
  color: var(--ctp-sapphire) !important;
}

.__srgi-title a:hover {
  color: var(--ctp-sky) !important;
}

/* === FAVICON FIX === */

.__sri-title {
  display: flex !important;
  align-items: flex-start;
  overflow: visible !important;
}

.__domain-favicon,
img.__domain-favicon {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  object-fit: contain;
  border-radius: 4px;
  margin-right: 8px;
  margin-top: 3px;
  display: inline-block !important;
  visibility: visible !important;
}

/* === URL PILL BOX === */

.__sri_url_path_box {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  background: var(--ctp-surface1);
  border: 1px solid var(--ctp-surface2);
  border-radius: 99px;
  padding: 1px 7px 1px;
  font-size: 0.85em;
  line-height: 1.6;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.__sri-url:hover .__sri_url_path_box {
  background: var(--ctp-surface2);
  border-color: var(--ctp-mauve);
}

/* === RESULT DATE === */

.__sri-time {
  color: var(--ctp-lavender) !important;
}

/* === WIKIPEDIA WIDGET === */

#wikipediaResults {
  background: var(--ctp-surface0);
  border-radius: 16px;
  border: 1px solid var(--ctp-mauve) !important;
  padding: 1rem;
}

#wikipediaResults .scene {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

#wikipediaResults a:not(:visited) {
  color: var(--ctp-flamingo) !important;
  transition: color 0.2s ease;
}

#wikipediaResults a:not(:visited):hover {
  color: var(--ctp-rose) !important;
}

/* === QUICK ANSWER / ASSISTANT BOX === */

.qa-container-box a:not(:visited),
._0_quick_answer_box a:not(:visited) {
  color: var(--ctp-flamingo) !important;
  transition: color 0.2s ease;
}

.qa-container-box a:not(:visited):hover,
._0_quick_answer_box a:not(:visited):hover {
  color: var(--ctp-rose) !important;
}

/* === NAV TABS hover (All / Images / Videos...) === */

.nav_item._0_query_link_item:not(.--active):hover {
  color: var(--ctp-peach) !important;
  transition: color 0.15s ease;
}

.nav_item._0_query_link_item.--active {
  color: var(--ctp-mauve) !important;
}

/* === FILTER BAR hover (Region / Order By / Time / Options) === */

.dd-toggle-label:hover,
.dd-toggle-label:hover .textContent {
  color: var(--ctp-yellow) !important;
  transition: color 0.15s ease;
}

.filter-item-inner > a:hover,
#menu-advanced-search-toggle:hover {
  color: var(--ctp-yellow) !important;
  transition: color 0.15s ease;
}

/* === DROPDOWN OVERFLOW FIX === */

.sri-group,
.search-result,
.newsResultItem,
.__sri_more_menu_box,
._0_k_ui_dropdown {
  overflow: visible !important;
}

/* === WOLFRAM ALPHA INSTANT ANSWER === */

._0_IA.instant-answer.wolfram-full-results {
  background: linear-gradient(135deg, var(--ctp-surface0) 0%, #252538 100%);
  border: 1.5px solid var(--ctp-peach) !important;
  border-radius: 18px;
  padding: 1.4rem 1.6rem;
  margin-bottom: 1.2rem;
  box-shadow:
    0 0 0 1px rgba(250,179,135,0.15),
    0 0 24px rgba(250,179,135,0.12),
    0 8px 32px rgba(0,0,0,0.35);
  position: relative;
  overflow: visible !important;
}

/* Gradient top-line – fade od průhledné, aby nevznikal zub v rozích */
._0_IA.instant-answer.wolfram-full-results::before {
  content: "";
  position: absolute;
  top: -1.5px;
  left: 0;
  width: 100%;
  height: 3px;
  border-radius: 99px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--ctp-mauve) 15%,
    var(--ctp-peach) 50%,
    var(--ctp-yellow) 85%,
    transparent 100%
  );
  opacity: 0.85;
}

/* Badge "Wolfram Alpha" */
._0_IA.instant-answer.wolfram-full-results::after {
  content: "Wolfram Alpha";
  position: absolute;
  top: -0.65rem;
  right: 1.2rem;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ctp-peach);
  background: var(--ctp-base);
  padding: 1px 8px;
  border-radius: 99px;
  border: 1px solid rgba(250,179,135,0.35);
}

/* Text uvnitř */
._0_IA.instant-answer.wolfram-full-results,
._0_IA.instant-answer.wolfram-full-results * {
  color: var(--ctp-text) !important;
}

/* Linky */
._0_IA.instant-answer.wolfram-full-results a:not(:visited) {
  color: var(--ctp-peach) !important;
  text-decoration: none;
  border-bottom: 1px dotted rgba(250,179,135,0.4);
  transition: color 0.2s ease, border-color 0.2s ease;
}

._0_IA.instant-answer.wolfram-full-results a:not(:visited):hover {
  color: var(--ctp-yellow) !important;
  border-color: var(--ctp-yellow);
}

/* Hover glow */
._0_IA.instant-answer.wolfram-full-results:hover {
  box-shadow:
    0 0 0 1px rgba(250,179,135,0.3),
    0 0 36px rgba(250,179,135,0.18),
    0 8px 40px rgba(0,0,0,0.4);
  border-color: var(--ctp-yellow) !important;
  transition: all 0.25s ease;
}

/* === KALKULAČKA (inline instant answer) === */

._0_IA.instant-answer.inline-content.clearfix {
  background: linear-gradient(135deg, var(--ctp-surface0) 0%, #202034 100%);
  border: 1.5px solid var(--ctp-teal) !important;
  border-radius: 18px;
  padding: 1.4rem 1.6rem;
  margin-bottom: 1.2rem;
  box-shadow:
    0 0 0 1px rgba(148,226,213,0.15),
    0 0 24px rgba(148,226,213,0.10),
    0 8px 32px rgba(0,0,0,0.35);
  position: relative;
  overflow: visible !important;
}

/* Gradient top-line */
._0_IA.instant-answer.inline-content.clearfix::before {
  content: "";
  position: absolute;
  top: -1.5px;
  left: 0;
  width: 100%;
  height: 3px;
  border-radius: 99px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--ctp-sapphire) 15%,
    var(--ctp-teal) 50%,
    var(--ctp-green) 85%,
    transparent 100%
  );
  opacity: 0.85;
}

/* Badge "Calculator" */
._0_IA.instant-answer.inline-content.clearfix::after {
  content: "Calculator";
  position: absolute;
  top: -0.65rem;
  right: 1.2rem;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ctp-teal);
  background: var(--ctp-base);
  padding: 1px 8px;
  border-radius: 99px;
  border: 1px solid rgba(148,226,213,0.35);
}

/* Text uvnitř */
._0_IA.instant-answer.inline-content.clearfix,
._0_IA.instant-answer.inline-content.clearfix * {
  color: var(--ctp-text) !important;
}

/* Linky */
._0_IA.instant-answer.inline-content.clearfix a:not(:visited) {
  color: var(--ctp-teal) !important;
  text-decoration: none;
  border-bottom: 1px dotted rgba(148,226,213,0.4);
  transition: color 0.2s ease, border-color 0.2s ease;
}

._0_IA.instant-answer.inline-content.clearfix a:not(:visited):hover {
  color: var(--ctp-sky) !important;
  border-color: var(--ctp-sky);
}

/* Hover glow */
._0_IA.instant-answer.inline-content.clearfix:hover {
  box-shadow:
    0 0 0 1px rgba(148,226,213,0.3),
    0 0 36px rgba(148,226,213,0.15),
    0 8px 40px rgba(0,0,0,0.4);
  border-color: var(--ctp-sky) !important;
  transition: all 0.25s ease;
}

/* === PŘEVODNÍK (#conversions) === */

#conversions {
  background: linear-gradient(135deg, var(--ctp-surface0) 0%, #1e2235 100%);
  border: 1.5px solid var(--ctp-blue) !important;
  border-radius: 18px;
  padding: 1.4rem 1.6rem;
  margin-bottom: 1.2rem;
  box-shadow:
    0 0 0 1px rgba(137,180,250,0.15),
    0 0 24px rgba(137,180,250,0.10),
    0 8px 32px rgba(0,0,0,0.35);
  position: relative;
  overflow: visible !important;
}

/* Gradient top-line */
#conversions::before {
  content: "";
  position: absolute;
  top: -1.5px;
  left: 0;
  width: 100%;
  height: 3px;
  border-radius: 99px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--ctp-lavender) 15%,
    var(--ctp-blue) 50%,
    var(--ctp-sapphire) 85%,
    transparent 100%
  );
  opacity: 0.85;
}

/* Badge "Conversions" */
#conversions::after {
  content: "Conversions";
  position: absolute;
  top: -0.65rem;
  right: 1.2rem;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ctp-blue);
  background: var(--ctp-base);
  padding: 1px 8px;
  border-radius: 99px;
  border: 1px solid rgba(137,180,250,0.35);
}

/* Text uvnitř */
#conversions,
#conversions * {
  color: var(--ctp-text) !important;
}

/* Tabulka */
#conversions table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 4px;
}

#conversions tr:hover td {
  background: rgba(137,180,250,0.07);
  transition: background 0.15s ease;
}

#conversions td,
#conversions th {
  padding: 0.35rem 0.6rem;
  border-bottom: 1px solid var(--ctp-surface1);
}

#conversions th {
  color: var(--ctp-lavender) !important;
  font-weight: 600;
  font-size: 0.85em;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Linky */
#conversions a:not(:visited) {
  color: var(--ctp-blue) !important;
  text-decoration: none;
  border-bottom: 1px dotted rgba(137,180,250,0.4);
  transition: color 0.2s ease, border-color 0.2s ease;
}

#conversions a:not(:visited):hover {
  color: var(--ctp-lavender) !important;
  border-color: var(--ctp-lavender);
}

/* Hover glow */
#conversions:hover {
  box-shadow:
    0 0 0 1px rgba(137,180,250,0.3),
    0 0 36px rgba(137,180,250,0.15),
    0 8px 40px rgba(0,0,0,0.4);
  border-color: var(--ctp-lavender) !important;
  transition: all 0.25s ease;
}

/* === MOBILE === */

@media (max-width: 768px) {
  .search-result,
  .sri-group {
    padding: 1rem;
    border-radius: 14px;
  }

  .search_results_container {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}