/*
 * Cadenza skin for degoog.
 *
 * The palette, the burgundy accents and the wine hero mirror the Cadenza
 * web app (src/index.css) and the Cadenza SearXNG theme
 * (search/searxng/static/themes/cadenza/css/cadenza.css).  It only needs
 * to override degoog's color variables (src/styles/style.scss) and add
 * Cadenza-specific styling; everything else inherits from the built-in
 * degoog theme.
 */

/* ---------- Fonts (same @fontsource files the app bundles) ---------- */

/* playfair-display-latin-500-normal */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('/themes/cadenza-theme/fonts/playfair-display-latin-500-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* playfair-display-latin-ext-500-normal */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('/themes/cadenza-theme/fonts/playfair-display-latin-ext-500-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* inter-latin-wght-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('/themes/cadenza-theme/fonts/inter-latin-wght-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* inter-latin-ext-wght-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('/themes/cadenza-theme/fonts/inter-latin-ext-wght-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ---------- Cadenza palette, degoog's variables ----------
 * Light: the warm paper of the app's main pages (--cz-* in src/index.css).
 * Dark: the near-black wine of the app's dark mode. */

:root {
  --primary: #6d1a28;
  --primary-hover: #55121e;
  --primary-rgb: 109, 26, 40;
  --brand-blue: #6d1a28;
  --brand-yellow: #d4b06a;
  --danger: #a4262c;
  --warning: #8a6d2f;
  --success: #2e7d4f;
  --bg: #f4eee4;
  --bg-light: #fbf8f2;
  --bg-hover: #ece4d7;
  --modal-footer: rgb(227 217 202);
  --border: #e3d9ca;
  --border-light: #e3d9ca;
  --text-primary: #221a17;
  --text-secondary: #6e6158;
  --text-link: #6d1a28;
  --text-link-visited: #55121e;
  --text-cite: #221a17;
  --text-snippet: #6e6158;
  --search-bar-bg: #fbf8f2;
  --search-bar-bg-hover: #ece4d7;
  --btn-bg: #6d1a28;
  --btn-text: #f8f1e6;
  --overlay-bg: rgba(34, 7, 12, 0.45);
  --white: #fbf8f2;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme='dark']) {
    --primary: #6d1a28;
    --primary-hover: #55121e;
    --primary-rgb: 109, 26, 40;
    --brand-blue: #6d1a28;
    --brand-yellow: #d4b06a;
    --danger: #a4262c;
    --warning: #8a6d2f;
    --success: #2e7d4f;
    --bg: #f4eee4;
    --bg-light: #fbf8f2;
    --bg-hover: #ece4d7;
    --modal-footer: rgb(227 217 202);
    --border: #e3d9ca;
    --border-light: #e3d9ca;
    --text-primary: #221a17;
    --text-secondary: #6e6158;
    --text-link: #6d1a28;
    --text-link-visited: #55121e;
    --text-cite: #221a17;
    --text-snippet: #6e6158;
    --search-bar-bg: #fbf8f2;
    --search-bar-bg-hover: #ece4d7;
    --btn-bg: #6d1a28;
    --btn-text: #f8f1e6;
    --overlay-bg: rgba(34, 7, 12, 0.45);
    --white: #fbf8f2;
  }
}

[data-theme='light'] {
  --primary: #6d1a28;
  --primary-hover: #55121e;
  --primary-rgb: 109, 26, 40;
  --brand-blue: #6d1a28;
  --brand-yellow: #d4b06a;
  --danger: #a4262c;
  --warning: #8a6d2f;
  --success: #2e7d4f;
  --bg: #f4eee4;
  --bg-light: #fbf8f2;
  --bg-hover: #ece4d7;
  --modal-footer: rgb(227 217 202);
  --border: #e3d9ca;
  --border-light: #e3d9ca;
  --text-primary: #221a17;
  --text-secondary: #6e6158;
  --text-link: #6d1a28;
  --text-link-visited: #55121e;
  --text-cite: #221a17;
  --text-snippet: #6e6158;
  --search-bar-bg: #fbf8f2;
  --search-bar-bg-hover: #ece4d7;
  --btn-bg: #6d1a28;
  --btn-text: #f8f1e6;
  --overlay-bg: rgba(34, 7, 12, 0.45);
  --white: #fbf8f2;
}

[data-theme='dark'] {
  --primary: #7a2531;
  --primary-hover: #8e2f3d;
  --primary-rgb: 122, 37, 49;
  --brand-blue: #7a2531;
  --brand-yellow: #d4b06a;
  --danger: #ff8f8f;
  --warning: #d4b06a;
  --success: #8fd4a0;
  --bg: #140c0d;
  --bg-light: #1e1416;
  --bg-hover: #2a1b1e;
  --modal-footer: rgb(42 27 30);
  --border: #3a272a;
  --border-light: #3a272a;
  --text-primary: #f3e9dc;
  --text-secondary: #b6a599;
  --text-link: #c96a78;
  --text-link-visited: #a56a75;
  --text-cite: #f3e9dc;
  --text-snippet: #b6a599;
  --search-bar-bg: #1e1416;
  --search-bar-bg-hover: #2a1b1e;
  --btn-bg: #7a2531;
  --btn-text: #f8f1e6;
  --overlay-bg: rgba(0, 0, 0, 0.65);
  --white: #1e1416;
}

/* ---------- Typography ---------- */

body {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}

/* ---------- Home page: the burgundy fade of the Cadenza sidebar ---------- */

#main-home {
  background:
    radial-gradient(140% 50% at 0% 0%, #7a1c2b 0%, transparent 70%),
    linear-gradient(180deg, #3f0e17 0%, #22070c 100%);
}

/* ---------- The Cadenza wordmark ----------
   Static copy of the app's lockup (src/index.css .wordmark): the alla-breve
   ¢ glyph built from three images, then "adenza" in Playfair Display.  The
   markup comes from this theme's templates (templates/*.html); the images
   and the geometry mirror the SearXNG cadenza theme. */

.cz-wordmark {
  --cz-wm-h: 44px; /* height of the ¢ glyph image, barline included */
  --cz-wm-xr: 0.52; /* Playfair x-height ratio */
  display: inline-flex;
  align-items: baseline;
  white-space: nowrap;
  color: #f7efde; /* matches the ivory in the glyph images */
  /* room for the barline that hangs below the baseline */
  padding-bottom: calc(var(--cz-wm-h) * 0.1692);
  margin: 0;
  font-weight: 500;
}

.cz-glyph {
  position: relative;
  flex: none;
  height: var(--cz-wm-h);
  aspect-ratio: 262 / 400;
  margin-bottom: calc(var(--cz-wm-h) * -0.1692);
  translate: 0 calc(var(--cz-wm-h) * (0.345 - var(--cz-wm-xr) * 0.4875));
}

.cz-glyph img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
}

.cz-word {
  margin-left: calc(var(--cz-wm-h) * 0.03);
  font-family: 'Playfair Display', 'Didot', 'Bodoni 72', Georgia, serif;
  font-weight: 500;
  font-size: calc(var(--cz-wm-h) * 0.975);
  line-height: 1;
  letter-spacing: 0.005em;
}

/* The landing lockup, centered like the SearXNG .index .title. */

#home-logo .cz-wordmark {
  --cz-wm-h: clamp(48px, 9vw, 84px);
}

#home-logo h1 {
  margin: 0 auto 3rem;
}

/* Results page: the compact lockup on a wine chip, as the header logo. */

.results-logo {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.75rem;
  margin: 0;
  border-radius: 10px;
  background:
    radial-gradient(140% 50% at 0% 0%, #7a1c2b 0%, transparent 70%),
    linear-gradient(180deg, #3f0e17 0%, #22070c 100%);
}

.results-logo:hover {
  background:
    radial-gradient(140% 50% at 0% 0%, #7a1c2b 0%, transparent 70%),
    linear-gradient(180deg, #7a1c2b 0%, #22070c 100%);
}

.results-logo .cz-wordmark {
  --cz-wm-h: 22px;
}

/* The footer strip under the hero stays on the paper background; keep it
   Cadenza-muted like the app's secondary text. */

/* The landing page stays pure Cadenza branding, like the SearXNG skin
   (body.index_endpoint footer { display: none }): no degoog version,
   repo or docs links. */

#home-footer {
  display: none;
}

/* No Search / Feeling-lucky button row under the home search bar; the
   form submits on Enter.  The buttons stay in the DOM for degoog's JS. */

#search-form-home .button-row {
  display: none;
}

/* Keep the search descriptor in the wordmark's serif, below its visual weight. */
#home-logo .cz-search {
  margin-left: 0.35em;
  font-family: 'Playfair Display', 'Didot', 'Bodoni 72', Georgia, serif;
  font-weight: 500;
  font-size: calc(var(--cz-wm-h) * 0.55);
  line-height: 1;
  letter-spacing: 0.005em;
}