@import "tailwindcss";

@theme {
  --color-cream: #f7f4ef;
  --color-cream-dark: #efe9df;
  --color-surface: #ffffff;
  --color-charcoal: #2d2926;
  --color-stone: #8a8279;
  --color-stone-light: #b5afa8;
  --color-border: #e6e0d8;
  --color-teal: #2a6b5a;
  --color-teal-light: #e8f0ed;
  --color-teal-dark: #1e4f42;
  --color-terracotta: #bf5a3c;
  --color-terracotta-light: #f5ebe7;
  --color-sage: #5a7a5e;
  --color-sage-light: #edf2ed;
  --color-amber: #c49a2a;
  --color-amber-light: #faf3e0;
  --color-rose: #9e4a5a;
  --color-nav: #2d2926;
  --font-display: "Fraunces", serif;
  --font-body: "Outfit", sans-serif;
}

/* Markdown rendered content */
.prose-memo {
  font-size: 0.875rem;
  line-height: 1.625;
  color: var(--color-stone);
}

.prose-memo p { margin-bottom: 0.5rem; }
.prose-memo p:last-child { margin-bottom: 0; }
.prose-memo strong { font-weight: 600; color: var(--color-charcoal); }
.prose-memo em { font-style: italic; }
.prose-memo a { color: var(--color-teal); text-decoration: underline; text-underline-offset: 2px; }
.prose-memo ul { list-style-type: disc; list-style-position: inside; margin-bottom: 0.5rem; }
.prose-memo ol { list-style-type: decimal; list-style-position: inside; margin-bottom: 0.5rem; }
.prose-memo h1,
.prose-memo h2,
.prose-memo h3 { font-family: var(--font-display); font-weight: 600; color: var(--color-charcoal); margin-bottom: 0.25rem; }
.prose-memo code { background: var(--color-cream-dark); border-radius: 0.25rem; padding: 0.125rem 0.25rem; font-size: 0.75rem; }
.prose-memo blockquote { border-left: 2px solid var(--color-border); padding-left: 0.75rem; font-style: italic; }