/* ──────────────────────────────────────────────────────────────────────────
   Crowd Editor — visual themes.

   Each theme overrides CSS custom properties on `.ce-paper[data-theme="…"]`.
   The defaults in editor.css consume those vars (background, ink, accents,
   sticky-note label content) so a theme only has to redeclare what differs.

   Slugs MUST match ThemeCatalog.cs. Add a new theme here AND there.
   ────────────────────────────────────────────────────────────────────────── */

/* Default: just resolves to the existing palette. Listed for clarity. */
.ce-paper[data-theme="default"] {
    --label-volume:    "Volume";
    --label-chapter:   "Chapter";
    --label-section:   "Section";
    --label-page-break:"Page Break";
    --label-title:     "Title";
}

/* ───────────────────────── Manuscript ───────────────────────── */
.ce-paper[data-theme="manuscript"] {
    --ce-paper: #fbf6e6;
    --ce-ink: #2a2218;
    --ce-ink-soft: #5a4a32;
    --ce-rule: #c9b88a;
    --ce-accent: #6e4f1d;
    --ce-accent-bold: #4a340e;
    --label-volume:    "Book";
    --label-chapter:   "Chapter";
    --label-section:   "Scene";
    font-family: "Courier Prime", "Courier New", ui-monospace, monospace;
    line-height: 2;
}
.ce-paper[data-theme="manuscript"] h1,
.ce-paper[data-theme="manuscript"] h2,
.ce-paper[data-theme="manuscript"] h3,
.ce-paper[data-theme="manuscript"] h4 {
    font-family: "Courier Prime", "Courier New", ui-monospace, monospace;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ───────────────────────── Biblical ───────────────────────── */
.ce-paper[data-theme="biblical"] {
    --ce-paper: #f5ecd6;
    --ce-ink: #1a1108;
    --ce-ink-soft: #4a352a;
    --ce-rule: #c9a96a;
    --ce-accent: #8a1f1f;
    --ce-accent-bold: #5a1010;
    --label-volume:    "Testament";
    --label-chapter:   "Book";
    --label-section:   "Chapter";
    font-family: "EB Garamond", "Goudy Old Style", Garamond, serif;
    line-height: 1.7;
}
.ce-paper[data-theme="biblical"] h1,
.ce-paper[data-theme="biblical"] h2,
.ce-paper[data-theme="biblical"] h3 {
    font-family: "UnifrakturCook", "Cinzel", "Trajan Pro", serif;
    color: #8a1f1f;
    font-weight: 700;
    text-align: center;
}
.ce-paper[data-theme="biblical"] h4 {
    font-family: "EB Garamond", "Goudy Old Style", Garamond, serif;
    font-variant: small-caps;
    color: #8a1f1f;
}

/* ───────────────────────── Console ───────────────────────── */
.ce-paper[data-theme="console"] {
    --ce-paper: #0d130c;
    --ce-ink: #b4f0a3;
    --ce-ink-soft: #6a9a5d;
    --ce-rule: #2a4220;
    --ce-accent: #6effc3;
    --ce-accent-bold: #b4ffd9;
    --label-volume:    "Module";
    --label-chapter:   "File";
    --label-section:   "Function";
    --label-page-break:"// ── ──";
    --label-title:     "# Module";
    font-family: ui-monospace, "JetBrains Mono", "SF Mono", Menlo, monospace;
    line-height: 1.55;
    background: #0d130c;
    color: #b4f0a3;
}
.ce-paper[data-theme="console"] h1::before { content: "# " var(--label-title); }
.ce-paper[data-theme="console"] h1,
.ce-paper[data-theme="console"] h2,
.ce-paper[data-theme="console"] h3,
.ce-paper[data-theme="console"] h4 {
    font-family: inherit;
    color: #8aff8a;
    font-weight: 600;
    text-transform: none;
}
.ce-paper[data-theme="console"] h1 { border-color: #2a4220; }
.ce-paper[data-theme="console"] section[data-block-type="chapter"] { border-top-color: #2a4220; }

/* ───────────────────────── Festive ───────────────────────── */
.ce-paper[data-theme="festive"] {
    --ce-paper: #fff5ec;
    --ce-ink: #3a1a08;
    --ce-ink-soft: #7a4a28;
    --ce-rule: #f1c280;
    --ce-accent: #c74413;
    --ce-accent-bold: #8a2a0a;
    font-family: "Playfair Display", "Georgia", serif;
}
.ce-paper[data-theme="festive"] h1,
.ce-paper[data-theme="festive"] h2 { color: #d44814; }
.ce-paper[data-theme="festive"] h3 { color: #8a2a0a; }

/* ───────────────────────── Newsprint ───────────────────────── */
.ce-paper[data-theme="newsprint"] {
    --ce-paper: #f4f1ea;
    --ce-ink: #1a1a1a;
    --ce-ink-soft: #5a5a5a;
    --ce-rule: #a8a8a8;
    --ce-accent: #2a2a2a;
    --label-volume:  "Section";
    --label-chapter: "Article";
    --label-section: "Column";
    font-family: "Roboto Slab", "Bitstream Charter", "Georgia", serif;
    text-align: justify;
    hyphens: auto;
}
.ce-paper[data-theme="newsprint"] h1 { font-family: "Oswald", "Impact", sans-serif; font-weight: 700; }
.ce-paper[data-theme="newsprint"] h2 { font-family: "Oswald", "Impact", sans-serif; text-transform: uppercase; }
.ce-paper[data-theme="newsprint"] h3 { font-style: italic; }

/* ───────────────────────── Vellum ───────────────────────── */
.ce-paper[data-theme="vellum"] {
    --ce-paper: #f8efd7;
    --ce-ink: #3a2a14;
    --ce-ink-soft: #7a5a32;
    --ce-rule: #c8a86a;
    --ce-accent: #876814;
    --ce-accent-bold: #5a4408;
    --label-section: "Folio";
    font-family: "Cormorant Garamond", "Cormorant", "Garamond", serif;
}
.ce-paper[data-theme="vellum"] h1,
.ce-paper[data-theme="vellum"] h2,
.ce-paper[data-theme="vellum"] h3 { font-family: "Cinzel", "Trajan Pro", serif; color: #8a6a14; letter-spacing: 0.04em; }

/* ───────────────────────── Noir ───────────────────────── */
.ce-paper[data-theme="noir"] {
    --ce-paper: #ebe5d8;
    --ce-ink: #000000;
    --ce-ink-soft: #3a3a3a;
    --ce-rule: #555555;
    --ce-accent: #c41818;
    --ce-accent-bold: #800000;
    --label-volume:  "Case";
    --label-chapter: "Chapter";
    --label-section: "Scene";
    font-family: "Special Elite", "Courier Prime", "Courier New", monospace;
    line-height: 1.8;
}
.ce-paper[data-theme="noir"] h1,
.ce-paper[data-theme="noir"] h2 {
    font-family: "Oswald", "Impact", sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #000000;
}
.ce-paper[data-theme="noir"] h3 { color: #c41818; font-style: italic; }

/* ───────────────────────── Botanical ───────────────────────── */
.ce-paper[data-theme="botanical"] {
    --ce-paper: #f1f5ec;
    --ce-ink: #1f3a1a;
    --ce-ink-soft: #4a6a3a;
    --ce-rule: #a8c898;
    --ce-accent: #437c34;
    --ce-accent-bold: #2a5a1a;
    --label-volume:  "Garden";
    --label-chapter: "Plot";
    --label-section: "Specimen";
    font-family: "Lora", "Georgia", serif;
}
.ce-paper[data-theme="botanical"] h1,
.ce-paper[data-theme="botanical"] h2,
.ce-paper[data-theme="botanical"] h3 { color: #2a5a1a; font-style: italic; }

/* ───────────────────────── Cyberpunk ───────────────────────── */
.ce-paper[data-theme="cyberpunk"] {
    --ce-paper: #0a0a1f;
    --ce-ink: #e8e8ff;
    --ce-ink-soft: #8a8acc;
    --ce-rule: #2a2a5a;
    --ce-accent: #ff00aa;
    --ce-accent-bold: #ff4dc4;
    --label-volume:  "Stack";
    --label-chapter: "Layer";
    --label-section: "Routine";
    font-family: "Inter", "Roboto", sans-serif;
    background: #0a0a1f;
    color: #e8e8ff;
}
.ce-paper[data-theme="cyberpunk"] h1,
.ce-paper[data-theme="cyberpunk"] h2,
.ce-paper[data-theme="cyberpunk"] h3 {
    font-family: "Orbitron", "Inter", sans-serif;
    color: #00f0ff;
    text-shadow: 0 0 8px rgba(0, 240, 255, 0.45);
    letter-spacing: 0.06em;
}
.ce-paper[data-theme="cyberpunk"] h4 { color: #ff00aa; }
.ce-paper[data-theme="cyberpunk"] section[data-block-type="chapter"] { border-top-color: #2a2a5a; }

/* ───────────────────────── Storybook ───────────────────────── */
.ce-paper[data-theme="storybook"] {
    --ce-paper: #fff8e7;
    --ce-ink: #3a2814;
    --ce-ink-soft: #7a5a3a;
    --ce-rule: #f0c878;
    --ce-accent: #a85f2e;
    --ce-accent-bold: #8a4a14;
    --label-volume:  "Tale";
    --label-chapter: "Chapter";
    --label-section: "Scene";
    font-family: "Nunito", "Quicksand", "Verdana", sans-serif;
    line-height: 1.85;
}
.ce-paper[data-theme="storybook"] h1,
.ce-paper[data-theme="storybook"] h2,
.ce-paper[data-theme="storybook"] h3,
.ce-paper[data-theme="storybook"] h4 {
    font-family: "Comic Neue", "Patrick Hand", "Marker Felt", sans-serif;
    /* The palette's accent, rather than a second shade of it. This rule covers h4, which is 1.15rem
       bold — 18.4px, a quarter of a pixel under WCAG's 18.66px threshold for large bold text — so it
       answers to 4.5:1 like body text, and #d4783a gave it 3.03:1. See ThemeElementContrastTests. */
    color: var(--ce-accent);
    font-weight: 700;
}

/* ───────────────────────── Academic ───────────────────────── */
.ce-paper[data-theme="academic"] {
    --ce-paper: #ffffff;
    --ce-ink: #000000;
    --ce-ink-soft: #444444;
    --ce-rule: #888888;
    --ce-accent: #000080;
    --ce-accent-bold: #000040;
    --label-volume: "Part";
    font-family: "Computer Modern Serif", "Latin Modern Roman", "Times New Roman", serif;
    text-align: justify;
    hyphens: auto;
    line-height: 1.5;
}
.ce-paper[data-theme="academic"] h1,
.ce-paper[data-theme="academic"] h2,
.ce-paper[data-theme="academic"] h3,
.ce-paper[data-theme="academic"] h4 {
    font-family: inherit;
    font-weight: 700;
    text-align: left;
}

/* ───────────────────────── Midnight (dark reading) ───────────────────────── */
.ce-paper[data-theme="midnight"] {
    --ce-paper: #1a1a22;
    --ce-ink: #e8e4d8;
    --ce-ink-soft: #a09c8c;
    --ce-rule: #3a3a44;
    --ce-accent: #d4a86a;
    --ce-accent-bold: #f0c87a;
    font-family: "Iowan Old Style", "Palatino Linotype", "Palatino", serif;
    background: #1a1a22;
    color: #e8e4d8;
}
.ce-paper[data-theme="midnight"] h1 { border-color: #3a3a44; }
.ce-paper[data-theme="midnight"] h2,
.ce-paper[data-theme="midnight"] h3,
.ce-paper[data-theme="midnight"] h4 { color: #d4a86a; }
.ce-paper[data-theme="midnight"] section[data-block-type="chapter"] { border-top-color: #3a3a44; }

/* ───────────────────────── Typewriter ───────────────────────── */
.ce-paper[data-theme="typewriter"] {
    --ce-paper: #f4ede0;
    --ce-ink: #1a1a14;
    --ce-ink-soft: #555044;
    --ce-rule: #b8a888;
    --ce-accent: #2a2418;
    --ce-accent-bold: #000000;
    --label-volume:  "Reel";
    --label-chapter: "Sheet";
    --label-section: "Block";
    font-family: "Courier Prime", "Courier New", ui-monospace, monospace;
    line-height: 2;
}
.ce-paper[data-theme="typewriter"] h1,
.ce-paper[data-theme="typewriter"] h2,
.ce-paper[data-theme="typewriter"] h3,
.ce-paper[data-theme="typewriter"] h4 {
    font-family: inherit;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
}

/* ───────────────────────── Zen ───────────────────────── */
.ce-paper[data-theme="zen"] {
    --ce-paper: #fafaf7;
    --ce-ink: #2a2a2a;
    --ce-ink-soft: #727272;
    --ce-rule: #d8d8d8;
    --ce-accent: #555555;
    --ce-accent-bold: #1a1a1a;
    --label-volume:  "Cycle";
    --label-chapter: "Verse";
    --label-section: "Breath";
    font-family: "Source Serif Pro", "Iowan Old Style", "Georgia", serif;
    line-height: 2.1;
}
.ce-paper[data-theme="zen"] h1,
.ce-paper[data-theme="zen"] h2,
.ce-paper[data-theme="zen"] h3,
.ce-paper[data-theme="zen"] h4 { font-weight: 400; color: #555555; letter-spacing: 0.04em; }

/* ─────────────────── Pull-quote per-theme styling ───────────────────
   Each rule starts by neutralising the default border/ornament with
   .ce-pull-quote so theme-specific looks aren't fighting it. */

.ce-paper[data-theme="manuscript"] .ce-pull-quote {
    border-top: none; border-bottom: none; background: none;
    border-left: 4px double var(--ce-accent);
    text-align: left; padding-left: 1.5rem; max-width: 88%;
}
.ce-paper[data-theme="manuscript"] .ce-pull-quote::before { content: none; }

.ce-paper[data-theme="biblical"] .ce-pull-quote {
    border-top: 2px solid #8a1f1f; border-bottom: 2px solid #8a1f1f;
    background: rgba(138, 31, 31, 0.04);
    font-family: "EB Garamond", "Goudy Old Style", Garamond, serif;
    font-style: italic; color: #4a352a; max-width: 80%;
}
.ce-paper[data-theme="biblical"] .ce-pull-quote::before { content: "❦"; color: #8a1f1f; font-size: 1.5rem; top: -1rem; left: 50%; transform: translateX(-50%); background: var(--ce-paper); padding: 0 0.5rem; opacity: 1; }

.ce-paper[data-theme="console"] .ce-pull-quote {
    border: none; background: rgba(110, 255, 195, 0.06);
    border-left: 3px solid #6effc3;
    font-family: inherit; font-style: normal; text-align: left;
    padding: 0.5rem 1rem; max-width: 92%;
}
.ce-paper[data-theme="console"] .ce-pull-quote::before { content: "//"; color: #6effc3; font-size: 1rem; opacity: 1; top: 0.5rem; left: -1.4rem; }

.ce-paper[data-theme="festive"] .ce-pull-quote {
    border: 2px dashed #d44814; background: rgba(212, 72, 20, 0.06);
    border-radius: 12px;
    color: #8a2a0a;
}
.ce-paper[data-theme="festive"] .ce-pull-quote::before { color: #d44814; opacity: 0.6; }

.ce-paper[data-theme="newsprint"] .ce-pull-quote {
    border-top: 1px solid #1a1a1a; border-bottom: 1px solid #1a1a1a;
    background: none; max-width: 60%;
    font-family: "Oswald", "Impact", sans-serif; font-style: normal;
    text-transform: uppercase; letter-spacing: 0.04em; font-size: 1.2em;
    line-height: 1.3;
}
.ce-paper[data-theme="newsprint"] .ce-pull-quote::before { content: none; }

.ce-paper[data-theme="vellum"] .ce-pull-quote {
    border-top: 1px solid #c8a86a; border-bottom: 1px solid #c8a86a;
    background: rgba(200, 168, 106, 0.08);
    font-family: "Cormorant Garamond", "Cormorant", "Garamond", serif;
    color: #5a4408;
}
.ce-paper[data-theme="vellum"] .ce-pull-quote::before { color: #8a6a14; }

.ce-paper[data-theme="noir"] .ce-pull-quote {
    border: 1px solid #000; box-shadow: 4px 4px 0 #c41818;
    background: #fff; color: #000;
    font-family: "Special Elite", "Courier Prime", monospace;
    text-align: left; max-width: 78%;
}
.ce-paper[data-theme="noir"] .ce-pull-quote::before { content: none; }

.ce-paper[data-theme="botanical"] .ce-pull-quote {
    border-top: none; border-bottom: none; background: none;
    border-left: 6px solid #4a8a3a;
    text-align: left; max-width: 88%; padding-left: 1.5rem;
    color: #1f3a1a; font-style: italic;
}
.ce-paper[data-theme="botanical"] .ce-pull-quote::before { content: "❧"; color: #4a8a3a; top: 0; left: -1.4rem; font-size: 1.4rem; opacity: 0.8; }

.ce-paper[data-theme="cyberpunk"] .ce-pull-quote {
    border-top: 1px solid #ff00aa; border-bottom: 1px solid #ff00aa;
    background: rgba(255, 0, 170, 0.06);
    box-shadow: 0 0 16px rgba(255, 0, 170, 0.35);
    color: #e8e8ff; font-family: "Orbitron", "Inter", sans-serif;
    text-shadow: 0 0 6px rgba(255, 0, 170, 0.5);
}
.ce-paper[data-theme="cyberpunk"] .ce-pull-quote::before { color: #00f0ff; text-shadow: 0 0 8px rgba(0, 240, 255, 0.6); opacity: 0.9; }

.ce-paper[data-theme="storybook"] .ce-pull-quote {
    border: 2px solid #d4783a; border-radius: 16px;
    background: rgba(240, 200, 120, 0.20);
    font-family: "Comic Neue", "Patrick Hand", sans-serif;
    color: #3a2814;
}
.ce-paper[data-theme="storybook"] .ce-pull-quote::before { color: #d4783a; opacity: 0.7; }

.ce-paper[data-theme="academic"] .ce-pull-quote {
    border: none; background: none; max-width: 70%;
    padding: 0.5rem 2rem; font-size: 0.95em; font-style: normal;
    text-align: justify;
}
.ce-paper[data-theme="academic"] .ce-pull-quote::before { content: none; }

.ce-paper[data-theme="midnight"] .ce-pull-quote {
    border-top: 1px solid #d4a86a; border-bottom: 1px solid #d4a86a;
    background: rgba(212, 168, 106, 0.06);
    color: #e8e4d8;
}
.ce-paper[data-theme="midnight"] .ce-pull-quote::before { color: #d4a86a; opacity: 0.7; }

.ce-paper[data-theme="typewriter"] .ce-pull-quote {
    border: 2px dashed #1a1a14; background: none;
    font-family: inherit; text-align: left; padding: 1rem 1.5rem;
}
.ce-paper[data-theme="typewriter"] .ce-pull-quote::before { content: "—"; color: #1a1a14; opacity: 0.7; }

.ce-paper[data-theme="zen"] .ce-pull-quote {
    border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8;
    background: none; max-width: 70%; color: #555555;
    font-style: normal; letter-spacing: 0.04em;
}
.ce-paper[data-theme="zen"] .ce-pull-quote::before { content: none; }