@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Jost:wght@300;400;500&display=swap");

/**
 * Site-wide design tokens — loaded on every page so LearnDash, blocks, and templates match the Lovable app.
 */
:root {
  --cream: 0 0% 96.1%;
  --deep: 108 12% 16%;
  --warm: 174 31% 42%;
  --gold: 178 82% 64%;
  --gold-dark: 174 31% 42%;
  --gold-light: 176 82% 84%;
  --rust: 174 20% 59%;
  --muted-text: 174 15% 41%;
  --turquoise: 174 72% 56%;

  --background: 0 0% 96.1%;
  --foreground: 108 12% 16%;
  --card: 0 0% 96.1%;
  --card-foreground: 108 12% 16%;
  --popover: 0 0% 96.1%;
  --popover-foreground: 108 12% 16%;
  --primary: 178 82% 64%;
  --primary-foreground: 108 12% 16%;
  --secondary: 174 20% 59%;
  --secondary-foreground: 108 12% 16%;
  --muted: 30 14% 91%;
  --muted-foreground: 174 15% 41%;
  --accent: 174 31% 42%;
  --accent-foreground: 0 0% 100%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 210 40% 98%;
  --border: 174 31% 42% / 0.25;
  --input: 174 31% 42% / 0.25;
  --ring: 178 82% 64%;
  --radius: 0rem;

  --sidebar-background: 0 0% 98%;
  --sidebar-foreground: 240 5.3% 26.1%;
  --sidebar-primary: 240 5.9% 10%;
  --sidebar-primary-foreground: 0 0% 98%;
  --sidebar-accent: 240 4.8% 95.9%;
  --sidebar-accent-foreground: 240 5.9% 10%;
  --sidebar-border: 220 13% 91%;
  --sidebar-ring: 217.2 91.2% 59.8%;

  /* WordPress / LearnDash convenience aliases */
  --rtl-body-bg: hsl(var(--background));
  --rtl-body-color: hsl(var(--foreground));
  --rtl-link: hsl(var(--warm));
  --rtl-link-hover: hsl(var(--gold-dark));
  --rtl-button-bg: hsl(var(--primary));
  --rtl-button-color: hsl(var(--primary-foreground));
  --rtl-button-hover-bg: hsl(var(--gold-dark));
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Jost", sans-serif;
  font-weight: 300;
  line-height: 1.7;
  color: hsl(var(--foreground));
  background-color: hsl(var(--background));
  -webkit-font-smoothing: antialiased;
}

/*
 * Landing (React) uses a fixed header. WP only offsets in-flow content via html margin;
 * position:fixed stays at the viewport top and sits under #wpadminbar.
 */
body.admin-bar.resettolive-landing nav.fixed {
  top: 32px;
}

@media screen and (max-width: 782px) {
  body.admin-bar.resettolive-landing nav.fixed {
    top: 46px;
  }
}

h1,
h2,
h3,
h4,
.wp-block-heading h1,
.wp-block-heading h2,
.wp-block-heading h3,
.wp-block-heading h4 {
  font-family: "Cormorant Garamond", serif;
  font-weight: 300;
  line-height: 1.15;
  color: hsl(var(--foreground));
}

a {
  color: hsl(var(--warm));
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

a:hover,
a:focus-visible {
  color: hsl(var(--gold-dark));
}

/* Block editor / entry content */
.entry-content,
.wp-block-post-content {
  font-size: clamp(0.95rem, 1.5vw, 1.05rem);
}

.entry-content p,
.wp-block-post-content p {
  color: hsl(var(--foreground));
}

.entry-content em,
.wp-block-post-content em {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-weight: 400;
  color: hsl(var(--warm));
}

/* Optional subtle grain (lighter than React app so WP admin pages stay readable) */
body.resettolive-grain:not(.resettolive-landing)::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 9999;
  opacity: 0.25;
}
