/* ClearDay theme v3.
   The first overlay was too close to the old forest clinic.
   This one is meant to be seen: blush paper, pale sage actions, a real bloom. */

:root {
  --background: 340 36% 92%;
  --foreground: 165 18% 16%;
  --card: 0 0% 100%;
  --card-foreground: 165 18% 16%;
  --popover: 0 0% 100%;
  --popover-foreground: 165 18% 16%;
  --primary: 156 28% 28%;
  --primary-foreground: 156 32% 18%;
  --secondary: 348 32% 94%;
  --secondary-foreground: 348 28% 28%;
  --muted: 340 24% 90%;
  --muted-foreground: 160 12% 32%;
  --accent: 348 30% 92%;
  --accent-foreground: 348 30% 30%;
  --border: 340 16% 84%;
  --input: 340 16% 86%;
  --ring: 156 28% 28%;
  --rose: 348 34% 40%;
  --rose-foreground: 0 0% 100%;
  --font-sans: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-display: "Gwendolyn", "Segoe Script", "Palatino Linotype", cursive;
}

html,
body,
#root,
button,
input,
textarea,
select {
  color: #21302c;
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif !important;
}

html,
body,
#root {
  background-color: #f2e3e8 !important;
  font-size: 1.35rem;
}

button,
input,
textarea,
select,
.language-switch {
  font-size: 1.2rem !important;
}

.text-xs {
  font-size: 1.05rem !important;
  line-height: 1.45 !important;
}

.text-sm {
  font-size: 1.2rem !important;
  line-height: 1.5 !important;
}

.text-base {
  font-size: 1.3rem !important;
  line-height: 1.55 !important;
}

.text-lg {
  font-size: 1.5rem !important;
}

h1,
h2,
h3,
.section-header,
.text-2xl,
.text-4xl,
aside .font-semibold.text-sm,
header .font-semibold.text-sm {
  font-family: "Gwendolyn", "Segoe Script", "Palatino Linotype", cursive !important;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1.35;
  padding-bottom: 0.18em;
}

h1,
.text-2xl,
.text-4xl {
  font-size: 3rem !important;
}

h2,
.section-header {
  font-size: 2.35rem !important;
}

h3 {
  font-size: 2rem !important;
}

aside .font-semibold.text-sm,
header .font-semibold.text-sm {
  font-size: 2.15rem !important;
  color: #6b3a46;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 80% 50% at 100% 0%, rgb(201 122 136 / 0.28), transparent 55%),
    radial-gradient(ellipse 70% 45% at 0% 100%, rgb(186 214 201 / 0.45), transparent 50%);
}

#root {
  position: relative;
  z-index: 1;
}

.language-switch {
  position: fixed !important;
  z-index: 80 !important;
}

#root > div.min-h-screen,
.min-h-screen.bg-background {
  background-color: #f2e3e8 !important;
}

aside,
header.sticky,
header.bg-card {
  background-color: #f6eaee !important;
}

.bg-primary,
.hover\:bg-primary:hover,
[data-state="checked"].bg-primary,
[data-state="on"].bg-primary {
  background-color: #cae2d9 !important;
  color: #234336 !important;
}

.text-primary-foreground {
  color: #234336 !important;
}

.bloom-mark {
  position: fixed;
  inset-block-start: -0.35rem;
  inset-inline-start: -0.35rem;
  width: 8.5rem;
  height: 8.5rem;
  z-index: 40;
  opacity: 0.88;
  pointer-events: none;
}

@media (min-width: 768px) {
  .bloom-mark {
    width: 10.5rem;
    height: 10.5rem;
    opacity: 0.8;
  }
}

.seo-home {
  max-width: 42rem;
  margin: 0 auto;
  padding: 4.6rem 1.25rem 0.25rem;
  position: relative;
  z-index: 2;
}
.seo-home h1 {
  font-size: 2rem !important;
  margin: 0 0 0.35rem;
}
.seo-home p {
  font-size: 1.15rem;
  margin: 0.3rem 0;
  max-width: 36rem;
}
.seo-home a { color: #234336; }
html[data-clearday-authed] .seo-home {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  body::before {
    background: #f2e3e8;
  }
}
