/* ============================================================
   ALGOVESTA — LEGAL PAGES STYLESHEET (shared)
   Direction B: single-accent, minimal colour, serious + readable.
   Replaces the duplicated per-page inline <style> blocks.

   NOTE: the global token system is inconsistent across stylesheets
   (theme-tokens.css uses HSL triples; index-shell.css redefines
   --primary/--card/--border as hex in light). So this file uses its
   OWN self-contained --legal-* variables with full colour values —
   correct in BOTH themes regardless of the global token mess.
   All colour rules are scoped under .legal-body so the global
   header/footer are never affected.
   ============================================================ */

/* ---- Self-contained palette (light defaults) ---- */
:root {
  --legal-fg:        #0f172a;            /* body text            */
  --legal-muted-fg:  #5b6675;            /* secondary text       */
  --legal-surface:   #ffffff;            /* card surface         */
  --legal-surface-2: #f6f8fb;            /* subtle fill          */
  --legal-border:    rgba(15,23,42,0.10);/* hairline border      */
  --legal-accent:    #4f46e5;            /* single accent (links)*/
  --legal-warn:      #b45309;            /* genuine warnings     */
  --legal-danger:    #dc2626;            /* ✕ "NOT a ..." marks  */
}
html.dark {
  --legal-fg:        #fafafa;
  --legal-muted-fg:  #a1a1aa;
  --legal-surface:   #0d0d12;
  --legal-surface-2: #16161c;
  --legal-border:    rgba(255,255,255,0.10);
  --legal-accent:    #8b7cf6;
  --legal-warn:      #d6a23c;
  --legal-danger:    #f06464;
}

/* ---- Nav logo + nav blur (layout — carried verbatim, unchanged) ---- */
@keyframes logoSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.logo-container { position: relative; aspect-ratio: 1 / 1; flex-shrink: 0; }
.logo-ring { position: absolute; inset: 0; border-radius: 50%; border: 2px solid transparent; animation: logoSpin 10s linear infinite; transform-origin: center center; will-change: transform; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.logo-core { position: absolute; inset: 4px; background: var(--bg-dark, #0a0e17); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
html:not(.dark) .logo-core { background: #e2e8f0 !important; }
html.dark .logo-core { background: #0a0e17 !important; }
.nav-blur { backdrop-filter: blur(12px); }
html:not(.dark) .nav-blur { background: rgba(255, 255, 255, 0.9); border: 1px solid rgba(0, 0, 0, 0.1); }
html.dark .nav-blur { background: rgba(2, 6, 23, 0.8); border: 1px solid rgba(255, 255, 255, 0.05); }

body { font-family: 'Inter', system-ui, sans-serif; }
html, body { overflow-x: hidden; max-width: 100vw; }

/* ---- Readability ---- */
.legal-body { line-height: 1.7; }
.legal-body p { line-height: 1.75; max-width: 75ch; }
.legal-body li { line-height: 1.7; }

/* ============================================================
   SIMPLIFIED STRUCTURE — neutral, no gradients (scoped to .legal-body)
   ============================================================ */

/* Headings: solid foreground; hierarchy via size/weight, not colour. */
.legal-body .gradient-text,
.legal-body .gradient-text-amber {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  color: var(--legal-fg) !important;
}

/* Section cards: neutral surface, thin border, no gradient/blue/glow. */
.legal-body .section-card,
.legal-body .section-card-amber,
.legal-body nav.section-card {
  background: var(--legal-surface) !important;
  border: 1px solid var(--legal-border) !important;
  border-radius: 14px;
  padding: 2rem;
  margin-bottom: 1.5rem;
  box-shadow: none !important;
  transition: border-color 0.2s ease;
}
.legal-body .section-card:hover,
.legal-body .section-card-amber:hover { border-color: var(--legal-muted-fg) !important; box-shadow: none !important; }

/* Info box: quiet neutral fill. */
.legal-body .info-box {
  background: var(--legal-surface-2) !important;
  border: 1px solid var(--legal-border) !important;
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  margin: 1.25rem 0;
}

/* Warnings / genuine risk callouts: single restrained accent via a thin
   left border. No fill gradient — the only place warn colour appears. */
.legal-body .warning-box,
.legal-body .warning-box-amber,
.legal-body .ack-box {
  background: var(--legal-surface-2) !important;
  border: 1px solid var(--legal-border) !important;
  border-left: 3px solid var(--legal-warn) !important;
  border-radius: 10px;
  padding: 1.25rem 1.5rem;
  margin: 1.25rem 0;
}

/* Table of contents links: neutral; accent only on hover. */
.legal-body .toc-link { color: var(--legal-fg) !important; transition: all 0.2s; padding: 0.5rem 1rem; border-radius: 8px; display: block; }
.legal-body .toc-link:hover { background: var(--legal-surface-2) !important; color: var(--legal-accent) !important; }

/* Cookie table: neutral, no blue tints. */
.legal-body .cookie-table-wrapper { overflow-x: auto; border-radius: 12px; border: 1px solid var(--legal-border); margin: 1.5rem 0; }
.legal-body .cookie-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.legal-body .cookie-table thead th { background: var(--legal-surface-2); padding: 0.875rem 1rem; text-align: left; font-weight: 600; color: var(--legal-fg); border-bottom: 1px solid var(--legal-border); white-space: nowrap; }
.legal-body .cookie-table tbody td { padding: 0.75rem 1rem; border-bottom: 1px solid var(--legal-border); color: var(--legal-muted-fg); }
.legal-body .cookie-table tbody tr:nth-child(even) { background: var(--legal-surface-2); }
.legal-body .cookie-table tbody tr:hover { background: var(--legal-surface-2); }
.legal-body .cookie-table tbody tr:last-child td { border-bottom: none; }

/* Cookie category badges: one neutral chip (kills green/blue/amber/purple).
   span qualifier beats global `[data-theme=light] [class*=badge]` rule. */
.legal-body span.cookie-type-badge,
.legal-body span.badge-essential,
.legal-body span.badge-functional,
.legal-body span.badge-analytics,
.legal-body span.badge-third-party {
  display: inline-block; padding: 2px 8px; border-radius: 6px; font-size: 0.75rem; font-weight: 500;
  background: var(--legal-surface-2) !important;
  color: var(--legal-muted-fg) !important;
  border: 1px solid var(--legal-border) !important;
  -webkit-text-fill-color: var(--legal-muted-fg) !important;
}

/* ============================================================
   SCOPED UTILITY / INLINE NEUTRALIZATION (.legal-body only)
   ============================================================ */

/* Blue text utilities -> single accent */
.legal-body [class*="text-blue-"] { color: var(--legal-accent) !important; -webkit-text-fill-color: var(--legal-accent) !important; }

/* Blue tint backgrounds + ALL gradient squares/boxes -> neutral surface */
.legal-body [class*="bg-blue-"],
.legal-body [class*="bg-gradient-to-"] { background-image: none !important; background-color: var(--legal-surface-2) !important; }
/* Icons/text that were white-on-blue -> readable muted on the muted square */
.legal-body [class*="bg-gradient-to-"] svg,
.legal-body [class*="bg-gradient-to-"] .text-white { color: var(--legal-muted-fg) !important; }

/* Blue borders -> token border */
.legal-body [class*="border-blue-"] { border-color: var(--legal-border) !important; }

/* Amber utilities -> single restrained warn tone; fills removed */
.legal-body [class*="text-amber-"] { color: var(--legal-warn) !important; -webkit-text-fill-color: var(--legal-warn) !important; }
.legal-body [class*="bg-amber-"] { background-image: none !important; background-color: var(--legal-surface-2) !important; }
.legal-body [class*="border-amber-"] { border-color: var(--legal-warn) !important; }

/* Greens (cookie dots / checks) -> muted neutral */
.legal-body [class*="text-green-"] { color: var(--legal-muted-fg) !important; -webkit-text-fill-color: var(--legal-muted-fg) !important; }
.legal-body [class*="bg-green-"] { background-color: var(--legal-muted-fg) !important; }

/* Reds: keep ONLY as restrained semantic (✕ marks) */
.legal-body [class*="text-red-"] { color: var(--legal-danger) !important; -webkit-text-fill-color: var(--legal-danger) !important; }
.legal-body [class*="bg-red-"] { background-image: none !important; background-color: var(--legal-surface-2) !important; }

/* ---- Inline-style overrides (risk page hardcodes amber/red) ---- */
.legal-body [style*="#f59e0b"],
.legal-body [style*="#d97706"],
.legal-body [style*="245,158,11"],
.legal-body [style*="245, 158, 11"] { color: var(--legal-warn) !important; -webkit-text-fill-color: var(--legal-warn) !important; }

.legal-body [style*="#ef4444"],
.legal-body [style*="239,68,68"],
.legal-body [style*="239, 68, 68"] { color: var(--legal-danger) !important; -webkit-text-fill-color: var(--legal-danger) !important; }

/* Inline amber/red gradient icon squares + amber chip fills -> neutral surface */
.legal-body [style*="linear-gradient"][style*="f59e0b"],
.legal-body [style*="rgba(245,158,11"],
.legal-body [style*="rgba(245, 158, 11"] {
  background: var(--legal-surface-2) !important;
  border-color: var(--legal-border) !important;
}

/* ============================================================
   MOBILE (layout rules carried verbatim; nav hide preserved)
   ============================================================ */
@media (max-width: 768px) {
  .logo-container { width: 36px !important; height: 36px !important; }
  .logo-container .w-7 { width: 20px !important; height: 20px !important; }
  .logo-container + div.hidden.sm\:flex { display: none !important; }
  header.nav-blur { margin: 8px !important; top: 8px !important; display: none !important; }
  .hidden.md\:flex.absolute.left-1\/2 { display: none !important; }
  .text-4xl, .text-5xl { font-size: 1.75rem !important; line-height: 1.2 !important; }
  .text-3xl { font-size: 1.25rem !important; }
  .legal-body .section-card, .legal-body .section-card-amber, .legal-body nav.section-card { padding: 1rem !important; border-radius: 12px !important; }
  .legal-body .warning-box, .legal-body .warning-box-amber, .legal-body .info-box, .legal-body .ack-box { padding: 1rem !important; border-radius: 10px !important; }
  .legal-body .toc-link { padding: 0.375rem 0.75rem !important; font-size: 0.875rem !important; }
  .legal-body .cookie-table thead th, .legal-body .cookie-table tbody td { padding: 0.5rem 0.625rem; font-size: 0.8rem; }
}
@media (max-width: 480px) {
  .logo-container { width: 32px !important; height: 32px !important; }
  .logo-container .w-7 { width: 18px !important; height: 18px !important; }
  .text-4xl, .text-5xl { font-size: 1.5rem !important; }
  .legal-body .section-card, .legal-body .section-card-amber { padding: 0.85rem !important; }
  .legal-body .warning-box, .legal-body .warning-box-amber, .legal-body .info-box, .legal-body .ack-box { padding: 0.85rem !important; }
}