/* ==========================================================================
   Kriyasya — Religion / Faith Engine : CORE tokens + base.
   Consumes the per-world custom properties injected inline by views/partials/head.php
   (--faith-bg, --faith-accent, --faith-font-*, ...). This file provides the fallback
   :root scale (used by the hub), the reset, base typography, colour roles, and the
   shared primitives (buttons, badges, provenance chips) every world reuses.
   ========================================================================== */

:root {
  /* Fallback palette (hub / any world before its inline vars load). */
  --faith-bg: #0b0e1a;
  --faith-bg-deep: #070a14;
  --faith-surface: #141726;
  --faith-surface-elevated: #1b2036;
  --faith-reading-surface: #f6f2e8;
  --faith-reading-ink: #1e1a12;
  --faith-text: #eef1fb;
  --faith-text-muted: #a7afce;
  --faith-accent: #c9a86a;
  --faith-accent-secondary: #6d5efc;
  --faith-border: #262c44;
  --faith-glow: rgba(201,168,106,0.22);

  /* Typography */
  --faith-font-display: "Marcellus", "Cormorant Garamond", Georgia, serif;
  --faith-font-body: "Manrope", "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --faith-font-scripture: "Noto Serif", Georgia, serif;

  /* Type scale (fluid) */
  --fs-xs: 0.78rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: clamp(1.25rem, 1.05rem + 0.9vw, 1.6rem);
  --fs-xl: clamp(1.6rem, 1.2rem + 1.8vw, 2.4rem);
  --fs-2xl: clamp(2.1rem, 1.4rem + 3.4vw, 4rem);
  --fs-3xl: clamp(2.6rem, 1.6rem + 5vw, 5.2rem);

  /* Spacing scale */
  --sp-1: 0.25rem; --sp-2: 0.5rem; --sp-3: 0.75rem; --sp-4: 1rem;
  --sp-5: 1.5rem; --sp-6: 2rem; --sp-7: 3rem; --sp-8: 4rem; --sp-9: 6rem;

  /* Radius + shadow + blur */
  --radius-sm: 8px; --radius-md: 14px; --radius-lg: 22px; --radius-pill: 999px;
  --shadow-1: 0 1px 2px rgba(0,0,0,0.28);
  --shadow-2: 0 6px 24px rgba(0,0,0,0.32);
  --shadow-3: 0 20px 60px rgba(0,0,0,0.45);
  --blur-1: 8px; --blur-2: 18px;

  /* Layout widths */
  --container: 1180px;
  --reading-width: 42rem;

  /* Motion */
  --faith-motion-fast: 160ms;
  --faith-motion-medium: 320ms;
  --faith-motion-slow: 640ms;
  --faith-ease: cubic-bezier(0.22, 0.61, 0.36, 1);

  /* Z-index layers */
  --z-header: 100; --z-drawer: 200; --z-dialog: 300; --z-toast: 400;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body.faith-body {
  margin: 0;
  font-family: var(--faith-font-body);
  font-size: var(--fs-base);
  line-height: 1.6;
  color: var(--faith-text);
  background: var(--faith-bg-deep);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  min-height: 100vh;
  overflow-x: hidden;
}

h1, h2, h3, h4 { font-family: var(--faith-font-display); font-weight: 500; line-height: 1.15; margin: 0 0 var(--sp-3); letter-spacing: 0.01em; }
p { margin: 0 0 var(--sp-4); }
a { color: var(--faith-accent); text-decoration: none; }
a:hover { text-decoration: underline; }
img, svg { max-width: 100%; height: auto; display: block; }
:focus-visible { outline: 3px solid var(--faith-accent); outline-offset: 2px; border-radius: 4px; }

/* ---- Buttons ---- */
.faith-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
  font: inherit; font-weight: 600; cursor: pointer; border: 1px solid transparent;
  padding: 0.7em 1.3em; border-radius: var(--radius-pill); text-decoration: none;
  transition: transform var(--faith-motion-fast) var(--faith-ease),
              background var(--faith-motion-fast) var(--faith-ease),
              border-color var(--faith-motion-fast) var(--faith-ease);
  min-height: 44px;
}
.faith-btn:hover { text-decoration: none; transform: translateY(-1px); }
.faith-btn:active { transform: translateY(0); }
.faith-btn--lg { padding: 0.9em 1.7em; font-size: var(--fs-md); }
.faith-btn--solid {
  background: linear-gradient(135deg, var(--faith-accent), var(--faith-accent-secondary));
  color: #10121c; border-color: transparent;
}
.faith-btn--ghost {
  background: color-mix(in srgb, var(--faith-surface) 70%, transparent);
  color: var(--faith-text); border-color: var(--faith-border);
}
.faith-btn--ghost:hover { border-color: var(--faith-accent); }
.faith-linkbtn { background: none; border: 0; color: var(--faith-accent); font: inherit; cursor: pointer; padding: 0; text-decoration: underline; }

/* ---- Badges + provenance chips ---- */
.faith-badge { display: inline-block; padding: 0.15em 0.6em; border-radius: var(--radius-pill); font-size: var(--fs-xs); font-weight: 600; border: 1px solid var(--faith-border); color: var(--faith-text-muted); }
.faith-badge--approved { color: #7ee0b0; border-color: rgba(126,224,176,0.4); }
.faith-badge--proposed { color: #e9c46a; border-color: rgba(233,196,106,0.4); }
.faith-badge--restricted, .faith-badge--revoked, .faith-badge--expired, .faith-badge--quarantined { color: #f0a5a5; border-color: rgba(240,165,165,0.4); }

.faith-prov { display: inline-flex; align-items: center; gap: 0.4em; font-size: var(--fs-xs); color: var(--faith-text-muted); }
.faith-prov__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--faith-accent); }
.faith-prov--source .faith-prov__dot { background: #7ee0b0; }
.faith-prov--editorial .faith-prov__dot { background: #6cc5ff; }
.faith-prov--ai .faith-prov__dot { background: #c9a6ff; }
.faith-prov--pending .faith-prov__dot { background: #e9c46a; }

/* ---- Chips + toggles ---- */
.faith-chip { font: inherit; font-size: var(--fs-sm); padding: 0.35em 0.9em; border-radius: var(--radius-pill); border: 1px solid var(--faith-border); background: transparent; color: var(--faith-text-muted); cursor: pointer; }
.faith-chip.is-active, .faith-chip:hover { color: var(--faith-text); border-color: var(--faith-accent); }
.faith-toggle { display: inline-flex; align-items: center; gap: 0.4em; font-size: var(--fs-sm); color: var(--faith-text-muted); }

/* ---- Notes / small print ---- */
.faith-note { color: var(--faith-text-muted); font-size: var(--fs-sm); }
.faith-sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
