/* Ceera — shared document CONTENT theme.
   Single source of truth for how a document's content looks. Consumed by BOTH:
   - the server renderer (server/render.mjs inlines this into the exported HTML), and
   - the client WYSIWYG editor/viewer (index.html links it).
   So "what you edit" == "what renders" by construction. Themeable via CSS vars;
   template variants are .doc.t-<name>. The page shell/pagination lives in render.mjs. */

.doc {
  --doc-ink: #1a1a1a;
  --doc-ink-strong: #0a0a0a;
  --doc-accent: #0a0a0a;          /* section headings + name */
  --doc-muted: #555;
  --doc-meta: #666;
  --doc-rule: #1a1a1a;            /* the divider under the header */
  --doc-h2-rule: #c8c8c8;         /* underline beneath section headings */
  --doc-h2-transform: uppercase;
  --doc-h2-spacing: 1.5px;
  --doc-name-size: 21pt;
  --doc-name-spacing: 1.2px;
  --doc-font: -apple-system, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  color: var(--doc-ink);
  font-family: var(--doc-font);
  font-size: 9.5pt;
  line-height: 1.30;
}
.doc .name { font-size: var(--doc-name-size); font-weight: 700; letter-spacing: var(--doc-name-spacing); margin: 0 0 3px; color: var(--doc-name-color, var(--doc-ink-strong)); }
.doc .title { font-size: 11pt; font-weight: 500; color: #2a2a2a; margin: 0 0 5px; }
.doc .contact { font-size: 9pt; color: var(--doc-muted); margin: 0 0 7px; }
.doc .divider { height: 1px; background: var(--doc-rule); margin: 0 0 7px; }
.doc h2 { font-size: 9pt; font-weight: 700; text-transform: var(--doc-h2-transform); letter-spacing: var(--doc-h2-spacing); color: var(--doc-accent); margin: 9px 0 3px; padding-bottom: 3px; border-bottom: 1px solid var(--doc-h2-rule); }
.doc h3 { font-size: 10.5pt; font-weight: 700; color: var(--doc-ink-strong); margin: 5px 0 1px; }
.doc .meta { font-size: 9pt; color: var(--doc-meta); margin: 0 0 3px; font-style: italic; }
.doc p { margin: 2.5px 0; }
.doc ul { margin: 1px 0; padding-inline-start: 16px; }
.doc li { margin: .5px 0; }
.doc .cap-group { margin-bottom: 3px; }
.doc .cap-group strong { display: block; font-size: 9.5pt; margin-bottom: 1px; color: var(--doc-ink-strong); }
.doc .cap-group span { display: block; color: #2a2a2a; font-size: 9.5pt; }
/* RTL: drop the Latin-style letter-spacing / uppercase / italic. */
.doc[dir="rtl"] .name { letter-spacing: 0; }
.doc[dir="rtl"] h2 { letter-spacing: 0; text-transform: none; }
.doc[dir="rtl"] .meta { font-style: normal; }

/* ---- Templates ---- */
/* Pro — the classic look (defaults already match). */
.doc.t-pro { }
/* Minimal — violet accent, sentence-case headings, lighter rules, tighter tracking. */
.doc.t-minimal {
  --doc-accent: #5E3BEE;
  --doc-rule: #5E3BEE;
  --doc-h2-rule: #e6e3fb;
  --doc-h2-transform: none;
  --doc-h2-spacing: .2px;
  --doc-name-spacing: .3px;
}
.doc.t-minimal h2 { font-size: 10pt; }
.doc.t-minimal .meta { font-style: normal; }

/* Creative — teal accent, accent-colored name, bolder accent underline; sentence-case. */
.doc.t-creative {
  --doc-accent: #0F766E;
  --doc-name-color: #0F766E;
  --doc-rule: #0F766E;
  --doc-h2-rule: #99f6e4;
  --doc-h2-transform: none;
  --doc-h2-spacing: .2px;
  --doc-name-spacing: .2px;
}
.doc.t-creative h2 { border-bottom-width: 2px; padding-bottom: 2px; }
.doc.t-creative .meta { font-style: normal; }
.doc.t-creative .cap-group strong { color: #0F766E; }

/* Executive — serif, charcoal palette, wide uppercase headings, larger name. */
.doc.t-exec {
  --doc-font: Georgia, 'Times New Roman', 'Noto Serif', serif;
  --doc-ink-strong: #1e293b;
  --doc-accent: #1e293b;
  --doc-name-color: #1e293b;
  --doc-rule: #1e293b;
  --doc-h2-rule: #cbd5e1;
  --doc-h2-transform: uppercase;
  --doc-h2-spacing: 2px;
  --doc-name-size: 22pt;
  --doc-name-spacing: .5px;
}
.doc.t-exec h3 { font-style: normal; }
