"""Gradio theme + global CSS for the recipe-card look."""
from __future__ import annotations

import gradio as gr

theme = gr.themes.Soft(
    primary_hue="orange",
    neutral_hue="stone",
    font=[gr.themes.GoogleFont("Inter"), "sans-serif"],
    font_mono=[gr.themes.GoogleFont("JetBrains Mono"), "monospace"],
)


CSS = """
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;700&display=swap');
.gradio-container { background: #f5ecd9 !important; }
.gradio-container .prose h1,
.gradio-container .prose h2,
.gradio-container .prose h3 { font-family: 'Lora', serif !important; color: #6b4a2a; }
/* Generic container shared by every HTMLComponent */
.cwm-card {
  border: 1px solid #d8c9ad;
  border-radius: 14px;
  padding: 22px 26px;
  box-shadow: 0 8px 24px rgba(107, 74, 42, 0.08);
}
button.primary, .gr-button-primary {
  background: #a85c2a !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  padding: 12px 22px !important;
}
"""