/* Neutral defaults. Inherit theme link color when available; expose paired button colors for theme overrides. */
.santtu-search {
  --santtu-ink: #242424; --santtu-muted: #626262; --santtu-line: #e3e3e3;
  --santtu-accent: var(--wp--style--color--link, #303030);
  --santtu-button: var(--santtu-theme-button, #303030); --santtu-button-text: var(--santtu-theme-button-text, #fff);
  --santtu-soft: #f5f5f5; --santtu-radius: 20px;
  box-sizing: border-box; color: var(--santtu-ink); font-family: inherit;
  font-size: 16px; line-height: 1.6; width: 100%; container: santtu / inline-size;
}
.santtu-search *, .santtu-search *::before, .santtu-search *::after { box-sizing: inherit; }
.santtu-search [hidden] { display: none !important; }
.santtu-search :is(button, input, textarea, select) { font: inherit; }
.santtu-search :is(button, input, textarea, select, summary, [tabindex]):not(a):focus-visible { outline: 3px solid var(--santtu-accent); outline-offset: 4px; }
.santtu-search button { cursor: pointer; }
.santtu-search button:disabled { cursor: default; opacity: .5; }
.santtu-search__form { margin: 0 0 32px; }
.santtu-search__label { display: block; font-size: 15px; font-weight: 600; margin-bottom: 10px; }
.santtu-search__controls { display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid #dadada; border-radius: 32px; padding: 8px; box-shadow: 0 8px 32px rgba(32, 33, 36, .08), 0 2px 6px rgba(32, 33, 36, .025); }
/* Focus keeps the soft gray border and lifts the field with a deeper shadow instead of a dark ring; the caret marks the active field. */
.santtu-search__controls:focus-within { border-color: #cdcdcd; box-shadow: 0 10px 36px rgba(32, 33, 36, .13), 0 2px 8px rgba(32, 33, 36, .05); }
.santtu-search__input { appearance: none; background: transparent; border: 0; border-radius: 22px; color: var(--santtu-ink); flex: 1; min-width: 0; min-height: 44px; padding: 10px 16px; width: 100%; box-shadow: none; font-size: 16px; line-height: 1.5; }
.santtu-search__input::placeholder { color: var(--santtu-muted); opacity: 1; }
/* The rounded wrapper owns the border and focus indicator, including under theme input rules. */
.santtu-search input.santtu-search__input,
.santtu-search input.santtu-search__input:focus,
.santtu-search input.santtu-search__input:focus-visible { border: 0 !important; outline: none !important; box-shadow: none !important; }
.santtu-search__button { flex: none; display: grid; place-items: center; width: 42px; height: 42px; margin: 0 0 1px; padding: 4px; background: var(--santtu-button); border: 0; border-radius: 50%; color: var(--santtu-button-text); }
.santtu-search__button svg { display: block; width: 22px; height: 22px; }
.santtu-search__button:hover { background: var(--santtu-button); color: var(--santtu-button-text); filter: brightness(.9); }
.santtu-search__loading { color: var(--santtu-muted); display: block; font-size: 13px; padding: 10px 0 0; }
.santtu-search__filters { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.santtu-search__filters label { display: grid; gap: 5px; color: var(--santtu-muted); font-size: 13px; }
.santtu-search__filters select { border: 1px solid var(--santtu-line); border-radius: 9px; padding: 8px 12px; background: #fff; color: var(--santtu-ink); max-width: 100%; }
.santtu-search__results { --santtu-column-gap: clamp(28px, 4cqw, 64px); display: grid; gap: var(--santtu-column-gap); grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr); align-items: start; }
.santtu-search__main, .santtu-search__ai { min-width: 0; grid-row: 1; }
.santtu-search[data-layout="ai_first"] .santtu-search__ai { grid-column: 1; }
.santtu-search[data-layout="ai_first"] .santtu-search__main { grid-column: 2; position: sticky; top: 24px; }
.santtu-search[data-layout="search_first"] .santtu-search__main { grid-column: 1; position: sticky; top: 24px; }
.santtu-search[data-layout="search_first"] .santtu-search__ai { grid-column: 2; }
.santtu-search[data-layout] .santtu-search__main:only-child, .santtu-search[data-layout] .santtu-search__ai:only-child { position: static; grid-column: 1 / -1; }
.santtu-search__main { scroll-margin-top: 40px; }
.santtu-search__results-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 7px 0 16px; border-bottom: 1px solid var(--santtu-line); position: sticky; top: 0; z-index: 1; background: #fff; }
.santtu-search__results-heading h2 { color: var(--santtu-ink); font-size: 17px; line-height: 1.4; font-weight: 650; letter-spacing: -.015em; margin: 0; }
.santtu-search__results-heading span { color: var(--santtu-muted); font-size: 12px; white-space: nowrap; }
.santtu-search__list { display: grid; }
.santtu-search__card { border-bottom: 1px solid var(--santtu-line); margin: 0; padding: 22px 0; }
.santtu-search__card h3 { font-size: 19px; font-weight: 550; line-height: 1.4; margin: 0 0 8px; letter-spacing: -.02em; overflow-wrap: anywhere; }
.santtu-search__card p { color: var(--santtu-muted); font-size: 14px; line-height: 1.7; margin: 0; overflow-wrap: anywhere; }
.santtu-search__card mark { background: #efefef; border-radius: 3px; color: var(--santtu-ink); font-weight: 650; padding: 0 2px; }
.santtu-search__message, .santtu-search__empty { background: var(--santtu-soft); border: 1px solid var(--santtu-line); border-radius: 12px; color: var(--santtu-muted); font-size: 14px; padding: 20px; margin: 18px 0; }
.santtu-search__pagination { display: flex; justify-content: center; gap: 4px; margin: 12px 0 0; }
.santtu-search .santtu-search__pagination :is(a, button) { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--santtu-muted); text-decoration: none; }
.santtu-search__pagination :is(a, button):hover:not(:disabled) { background: var(--santtu-soft); color: var(--santtu-ink); }
.santtu-search .santtu-search__pagination button:disabled { opacity: .3; }
.santtu-search__pagination a:focus-visible { outline: 3px solid var(--santtu-accent); outline-offset: 2px; }
.santtu-search__page-number { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 32px; color: var(--santtu-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.santtu-search__hidden-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.santtu-conversation, .santtu-search__summary { background: transparent; border: 0; border-radius: 0; box-shadow: none; margin: 0; }
.santtu-conversation__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 4px 0 20px; border-bottom: 1px solid var(--santtu-line); background: transparent; }
.santtu-conversation__header h2, .santtu-search__summary h2 { color: var(--santtu-ink); font-size: 20px; font-weight: 650; letter-spacing: -.03em; line-height: 1.3; margin: 0; }
.santtu-conversation__header h2 span, .santtu-search__sparkle { color: var(--santtu-muted); margin-right: 5px; }
.santtu-conversation button, .santtu-answer__details summary { background: #fff; color: var(--santtu-accent); border: 1px solid var(--santtu-line); border-radius: 9px; padding: 9px 13px; font-size: 13px; line-height: 1.4; text-align: start; }
.santtu-conversation button:hover:not(:disabled) { background: var(--santtu-soft); border-color: #bcbcbc; }
.santtu-conversation__scroll { padding: 0 0 20px; overflow: visible; }
.santtu-conversation__turn { scroll-margin-top: 32px; padding: 26px 0 4px; margin: 0; }
.santtu-conversation__turn + .santtu-conversation__turn { border-top: 1px solid var(--santtu-line); margin-top: 20px; }
.santtu-conversation .santtu-conversation__question { background: #f0f0f0; padding: 12px 20px; border-radius: 24px 6px 24px 24px; width: fit-content; max-width: 95%; margin: 0 0 17px auto; font-size: 14px; font-weight: 550; line-height: 1.5; color: var(--santtu-ink); overflow-wrap: anywhere; }

.santtu-markdown, .santtu-conversation__answer { overflow-wrap: anywhere; font-size: 16px; line-height: 1.85; }
.santtu-markdown > :first-child, .santtu-conversation__answer > :first-child { margin-top: 0; }
.santtu-markdown > :last-child, .santtu-conversation__answer > :last-child { margin-bottom: 0; }
.santtu-markdown p, .santtu-conversation__answer p { margin: 0 0 14px; }
.santtu-markdown :is(h3,h4,h5,h6), .santtu-conversation__answer :is(h3,h4,h5,h6) { color: var(--santtu-ink); font-size: 15px; line-height: 1.5; margin: 20px 0 8px; }
.santtu-markdown :is(ul,ol), .santtu-conversation__answer :is(ul,ol) { padding-left: 1.4em; margin: 12px 0; }
.santtu-markdown li, .santtu-conversation__answer li { padding-left: 3px; margin: 7px 0; }
.santtu-markdown pre, .santtu-conversation__answer pre { overflow-x: auto; border-radius: 8px; padding: 12px; background: var(--santtu-soft); font-size: 12px; }
.santtu-markdown table, .santtu-conversation__answer table { display: block; overflow-x: auto; border-collapse: collapse; font-size: 13px; max-width: 100%; }
.santtu-markdown :is(th,td), .santtu-conversation__answer :is(th,td) { border-bottom: 1px solid var(--santtu-line); padding: 8px; text-align: start; min-width: 100px; }
.santtu-answer__details { margin-top: 14px; }
.santtu-answer__details summary { display: list-item; width: fit-content; cursor: pointer; font-weight: 550; margin-bottom: 14px; list-style-position: inside; }
.santtu-answer__sources { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.santtu-answer__source { display: block; max-width: 100%; overflow-wrap: anywhere; background: #fafafa; border: 1px solid var(--santtu-line); border-radius: 9px; padding: 7px 11px; font-size: 12px; line-height: 1.5; text-decoration: none; }
.santtu-answer__source::before { content: '↗'; margin-right: 7px; }
.santtu-answer__source:hover { border-color: #bcbcbc; }
.santtu-conversation__related { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.santtu-conversation__related:empty { display: none; }
.santtu-conversation__related button { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 9px 14px; border-radius: 20px; }
.santtu-conversation__related button::after { content: '↗'; flex: none; }
.santtu-conversation__status { color: var(--santtu-muted); font-size: 13px; margin: 18px 0 0; }
.santtu-conversation__status:empty { display: none; }
.santtu-conversation__status[data-loading="1"] { display: flex; align-items: center; gap: 9px; }
.santtu-conversation__status[data-loading="1"]::before { animation: santtu-spin 1s linear infinite; border: 2px solid var(--santtu-line); border-top-color: var(--santtu-accent); border-radius: 50%; content: ''; flex: none; height: 15px; width: 15px; }
.santtu-conversation__retry, .santtu-conversation__reset { margin-top: 12px; }
.santtu-search[data-layout="ai_only"] .santtu-search__search-icon { display: none; }
.santtu-conversation__form { position: sticky; bottom: 18px; z-index: 2; display: flex; align-items: flex-end; gap: 10px; border: 1px solid #dadada; background: #fff; border-radius: 32px; box-shadow: 0 8px 32px rgba(32, 33, 36, .08), 0 2px 6px rgba(32, 33, 36, .025); margin: 12px 0 16px; padding: 8px; }
.santtu-conversation__form:focus-within { border-color: #cdcdcd; box-shadow: 0 10px 36px rgba(32, 33, 36, .13), 0 2px 8px rgba(32, 33, 36, .05); }
.santtu-conversation__form label { flex: 1; display: block; min-width: 0; }
.santtu-conversation__form label span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.santtu-conversation__form textarea { display: block; resize: none; width: 100%; min-height: 44px; max-height: 160px; border: 0; background: transparent; color: var(--santtu-ink); border-radius: 22px; padding: 10px 16px; font-size: 16px; line-height: 1.5; box-shadow: none; }
.santtu-search .santtu-conversation__form textarea:focus-visible { outline: none; }
.santtu-conversation__form textarea::placeholder { color: var(--santtu-muted); }
.santtu-conversation__form button { flex: none; width: 42px; height: 42px; border-radius: 50%; background: var(--santtu-button); border: none; color: var(--santtu-button-text); display: grid; place-items: center; padding: 4px; margin-bottom: 1px; }
.santtu-conversation__form button svg { display: block; width: 22px; height: 22px; }
.santtu-conversation .santtu-conversation__form button:hover:not(:disabled) { background: var(--santtu-button); color: var(--santtu-button-text); filter: brightness(.9); }
.santtu-search__summary { padding: 0; }
.santtu-search__summary-heading { display: flex; align-items: center; gap: 7px; margin-bottom: 8px; }
.santtu-search__summary .santtu-markdown { margin-top: 18px; }
@keyframes santtu-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .santtu-conversation__status[data-loading="1"]::before { animation: none; } }
/* The follow-up field belongs under the left column in every layout. Search first keeps it in
   the live conversation (pagination moves that node intact) and spans the page column to its
   left: 1.9fr is 190% of the conversation column. The transcript takes the spare height, so the
   field keeps the fixed top gap that experience.js uses to size the reading area. The page column stops above the field, and
   result fitting measures that space. */
@container santtu (min-width: 761px) {
  .santtu-search[data-layout="search_first"][data-experience-endpoint] .santtu-search__results:has(.santtu-conversation[data-follow-up="1"]) .santtu-search__ai { align-self: stretch; display: flex; flex-direction: column; }
  .santtu-search[data-layout="search_first"][data-experience-endpoint] .santtu-search__results:has(.santtu-conversation[data-follow-up="1"]) .santtu-conversation { flex: 1; display: flex; flex-direction: column; }
  .santtu-search[data-layout="search_first"][data-experience-endpoint] .santtu-search__results:has(.santtu-conversation[data-follow-up="1"]) .santtu-conversation__scroll { flex: 1 0 auto; }
  .santtu-search[data-layout="search_first"][data-experience-endpoint] .santtu-search__results:has(.santtu-conversation[data-follow-up="1"]) .santtu-conversation__form { margin-inline-start: calc(-190% - var(--santtu-column-gap)); width: 190%; }
  .santtu-search[data-layout="search_first"][data-experience-endpoint] .santtu-search__results:has(.santtu-conversation[data-follow-up="1"]) .santtu-search__main { padding-bottom: 96px; }
}
@container santtu (max-width: 760px) {
  .santtu-search__results { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .santtu-search[data-layout] .santtu-search__ai, .santtu-search[data-layout] .santtu-search__main { grid-column: 1; grid-row: auto; position: static; }
  .santtu-search[data-layout] .santtu-search__ai { grid-row: 1; }
  .santtu-conversation__scroll { max-height: none; overflow: visible; }
}
@media (max-width: 760px) {
  /* Keep the question field at the browser edge, independent of answer length.
     The reserved space lets the final answer lines scroll above it. */
  .santtu-conversation { padding-bottom: var(--santtu-composer-space, 0px); }
  .santtu-conversation__form { position: static; }
  .santtu-conversation[data-composer="fixed"] .santtu-conversation__form { position: fixed; left: var(--santtu-composer-left); width: var(--santtu-composer-width); bottom: calc(18px + env(safe-area-inset-bottom, 0px) + var(--santtu-composer-inset, 0px)); margin: 0; }
  .santtu-conversation[data-composer="sticky"] .santtu-conversation__form { position: sticky; }
}
@container santtu (max-width: 440px) {
  .santtu-search__controls { padding: 7px; }
  .santtu-conversation__header { padding: 0 0 16px; }
  .santtu-conversation__scroll { padding: 0 0 18px; }
  .santtu-conversation__form { padding: 7px; bottom: calc(12px + env(safe-area-inset-bottom, 0px) + var(--santtu-composer-inset, 0px)); }
  .santtu-conversation[data-composer="fixed"] .santtu-conversation__form { bottom: calc(12px + env(safe-area-inset-bottom, 0px) + var(--santtu-composer-inset, 0px)); }
  .santtu-conversation__form textarea { font-size: 16px; }
}
@media (forced-colors: active) { .santtu-search button, .santtu-conversation, .santtu-search__controls { border: 1px solid ButtonText; } }

.santtu-search__switch { display: none; }
@container santtu (max-width: 760px) {
  .santtu-search__switch[data-ready="1"] { display: flex; gap: 4px; padding: 4px; background: #f0f0f0; border-radius: 12px; grid-row: 1; width: fit-content; }
  .santtu-search__switch button { border: 0; background: transparent; color: var(--santtu-muted); border-radius: 9px; padding: 9px 18px; font-size: 14px; font-weight: 550; }
  .santtu-search__switch button[aria-pressed="true"] { background: #fff; color: var(--santtu-ink); box-shadow: 0 1px 5px #00000015; }
  .santtu-search__results-heading { display: none; }
  /* The working answer tab already names this panel in the narrow layout. */
  .santtu-search__results:has(.santtu-search__switch[data-ready="1"]) .santtu-conversation__header { display: none; }
  .santtu-search[data-layout] .santtu-search__results:has(.santtu-search__switch) .santtu-search__ai, .santtu-search[data-layout] .santtu-search__results:has(.santtu-search__switch) .santtu-search__main { grid-row: 2; }
  .santtu-search__results[data-view="answer"] .santtu-search__main, .santtu-search__results[data-view="pages"] .santtu-search__ai { display: none; }
  /* Keep the live question field in both views, preserving its draft and session. */
  .santtu-search[data-layout] .santtu-search__results[data-view="pages"] .santtu-search__ai:has(.santtu-conversation[data-ready="1"][data-follow-up="1"] .santtu-conversation__form:not([hidden])) { display: block; grid-row: 3; }
  .santtu-search__results[data-view="pages"] .santtu-conversation > :not(.santtu-conversation__form) { display: none; }
}

/* Provider citations stay beside their attributed passages, including spans across lists. */
.santtu-search .santtu-citation {
  display: inline-block;
  vertical-align: baseline;
  margin: 0 .25em;
  padding: .16em .65em;
  border: 0;
  border-radius: 999px;
  background: #eceef2;
  color: #484b53;
  font: 500 12px/1.5 system-ui, sans-serif;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
.santtu-search .santtu-citation:hover,
.santtu-search .santtu-citation[aria-expanded="true"] { background: #dfe3eb; color: #252933; }
.santtu-search .santtu-citation:focus-visible,
.santtu-citation-popup a:focus-visible { outline: 2px solid #3463bb; outline-offset: 3px; }
.santtu-search .santtu-citation-highlight { background: #e8ebf2; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.santtu-citation-popup {
  position: fixed;
  z-index: 2147483647;
  box-sizing: border-box;
  width: 380px;
  padding: 8px 18px;
  overflow: auto;
  overscroll-behavior: contain;
  background: #f8f9fb;
  color: #252933;
  border: 1px solid #e2e4e9;
  border-radius: 18px;
  box-shadow: 0 4px 18px #0003;
  font: 16px/1.5 system-ui, sans-serif;
}
.santtu-citation-popup a { display: block; padding: 16px 0; color: inherit; text-decoration: none; }
.santtu-citation-popup a + a { border-top: 1px solid #dfe2e8; }
.santtu-citation-popup small { display: block; color: #626773; font-size: 12px; margin-bottom: 5px; overflow-wrap: anywhere; }
.santtu-citation-popup strong { display: block; font-weight: 600; overflow-wrap: anywhere; }
.santtu-citation-popup a:hover strong { text-decoration: underline; }

/* Streaming keeps the answer's existing typography and never auto-scrolls. */
.santtu-conversation__header { justify-content: space-between; }

@media (forced-colors: active) { .santtu-search__controls:focus-within, .santtu-conversation__form:focus-within { border-color: Highlight; } }

/* Replace the initial query field only after a working follow-up composer exists.
   Filters remain available; without JavaScript the original search still works. */
.santtu-search:where(:has(.santtu-conversation[data-ready="1"][data-follow-up="1"] .santtu-conversation__form:not([hidden]))) > .santtu-search__form :is(.santtu-search__label, .santtu-search__controls) { display: none; }
.santtu-search:where(:has(.santtu-conversation[data-ready="1"][data-follow-up="1"] .santtu-conversation__form:not([hidden]))) > .santtu-search__form:not(:has(.santtu-search__filters)) { margin: 0; }
