/* ══════════════════════════════════════════
   sanvault — Obsidian Publish stylesheet
   Palette: ivory / charcoal / gold / forest green
   ══════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Cormorant+SC:wght@400;500;600&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Lora:ital,wght@0,400;0,500;1,400;1,500&display=swap');

/* ── Variables ── */
:root {
  --bg:           #f5f1e8;
  --bg-sidebar:   #ede9df;
  --ink:          #1c1c1c;
  --ink-muted:    #5a5147;
  --ink-faint:    #9a9088;
  --gold:         #9a7c3a;
  --gold-light:   #c4a45a;
  --green:        #2a3d2e;
  --rule:         #d4cfc5;
  --code-bg:      #e8e3d8;

  --font-body:    'EB Garamond', Georgia, serif;
  --font-sc:      'Cormorant SC', serif;
  --font-pro:     'Libre Baskerville', Georgia, serif;
  --font-warm:    'Lora', 'EB Garamond', Georgia, serif;
}

/* ── Page background ── */
body,
.publish-renderer,
.site-body {
  background: var(--bg) !important;
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
}

/* ── Left navigation sidebar ── */
.nav-view-outer,
.site-body-left-column {
  background: var(--bg-sidebar) !important;
  border-right: 1px solid var(--rule) !important;
}

/* Site title */
.site-header,
.site-header-text {
  font-family: var(--font-sc) !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.12em !important;
  text-transform: lowercase !important;
  color: var(--ink) !important;
  background: var(--bg-sidebar) !important;
  border-bottom: 1px solid var(--rule) !important;
}

/* Nav tree items */
.tree-item-self {
  font-family: var(--font-body) !important;
  font-size: 0.88rem !important;
  color: var(--ink-muted) !important;
}

.tree-item-self:hover {
  color: var(--ink) !important;
  background: transparent !important;
}

.tree-item-self.is-active {
  color: var(--gold) !important;
  background: transparent !important;
  font-weight: 400 !important;
}

.tree-item-children .tree-item-self {
  font-size: 0.82rem !important;
  color: var(--ink-faint) !important;
}

/* ── Article content area ── */
.publish-article,
.markdown-preview-view,
.markdown-preview-section {
  font-family: var(--font-body) !important;
  font-size: 1rem !important;
  line-height: 1.78 !important;
  color: var(--ink) !important;
  max-width: 680px !important;
  margin: 0 auto !important;
  padding: 3.5rem 2.5rem 5rem !important;
}

/* ── Headings ── */
.markdown-preview-view h1 {
  font-family: var(--font-body) !important;
  font-size: 2rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  color: var(--ink) !important;
  margin-bottom: 0.5rem !important;
  border-bottom: none !important;
}

.markdown-preview-view h2 {
  font-family: var(--font-sc) !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: var(--ink-muted) !important;
  margin-top: 2.75rem !important;
  margin-bottom: 0.85rem !important;
  border-bottom: none !important;
}

.markdown-preview-view h3 {
  font-family: var(--font-body) !important;
  font-size: 1.05rem !important;
  font-weight: 500 !important;
  font-style: italic !important;
  color: var(--ink) !important;
  margin-top: 1.75rem !important;
  margin-bottom: 0.5rem !important;
}

/* ── Paragraphs ── */
.markdown-preview-view p {
  font-size: 1rem !important;
  line-height: 1.78 !important;
  margin-bottom: 1.1rem !important;
  color: var(--ink) !important;
}

/* ── Horizontal rule ── */
.markdown-preview-view hr {
  border: none !important;
  border-top: 1px solid var(--rule) !important;
  margin: 2.25rem 0 !important;
}

/* ── Links ── */
.markdown-preview-view a {
  color: var(--green) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--rule) !important;
  text-underline-offset: 3px !important;
}

.markdown-preview-view a:hover {
  color: var(--ink) !important;
  text-decoration-color: var(--ink-muted) !important;
}

.markdown-preview-view em  { font-style: italic !important; }
.markdown-preview-view strong { font-weight: 600 !important; }

/* ── Code ── */
.markdown-preview-view code {
  font-family: 'Courier New', monospace !important;
  font-size: 0.82rem !important;
  background: var(--code-bg) !important;
  padding: 0.1em 0.35em !important;
  border-radius: 2px !important;
  color: var(--ink) !important;
}

.markdown-preview-view pre {
  background: var(--code-bg) !important;
  border: 1px solid var(--rule) !important;
  border-radius: 3px !important;
  padding: 1.25rem 1.5rem !important;
}

.markdown-preview-view pre code {
  background: none !important;
  padding: 0 !important;
  font-size: 0.82rem !important;
  line-height: 1.65 !important;
}

/* ── Blockquote ── */
.markdown-preview-view blockquote {
  border-left: 2px solid var(--gold-light) !important;
  margin: 1.5rem 0 !important;
  padding: 0.25rem 0 0.25rem 1.5rem !important;
  color: var(--ink-muted) !important;
  font-style: italic !important;
  background: none !important;
}

/* ── Lists ── */
.markdown-preview-view ul,
.markdown-preview-view ol {
  margin: 0.75rem 0 1rem 1.5rem !important;
}

.markdown-preview-view li {
  margin-bottom: 0.4rem !important;
  font-size: 1rem !important;
  line-height: 1.78 !important;
}

/* ── Tables ── */
.markdown-preview-view table {
  border-collapse: collapse !important;
  width: 100% !important;
  margin: 1.5rem 0 !important;
  font-size: 0.88rem !important;
}

.markdown-preview-view th {
  font-family: var(--font-sc) !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--ink-muted) !important;
  border-bottom: 1px solid var(--rule) !important;
  padding: 0.5rem 0.75rem !important;
  text-align: left !important;
  font-weight: 500 !important;
  background: none !important;
}

.markdown-preview-view td {
  padding: 0.5rem 0.75rem !important;
  border-bottom: 1px solid var(--rule) !important;
  color: var(--ink) !important;
  vertical-align: top !important;
  background: none !important;
}

.markdown-preview-view tr:last-child td {
  border-bottom: none !important;
}

/* ── Tags ── */
.tag {
  font-family: var(--font-sc) !important;
  font-size: 0.63rem !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--ink-faint) !important;
  border: 1px solid var(--rule) !important;
  padding: 0.2rem 0.6rem !important;
  border-radius: 1px !important;
  background: none !important;
  text-decoration: none !important;
}

.tag:hover {
  color: var(--gold) !important;
  border-color: var(--gold-light) !important;
}

/* ── Hide right column graph ── */
.site-body-right-column {
  display: none !important;
}

/* ── Search ── */
.search-input-container input {
  background: var(--bg) !important;
  border: 1px solid var(--rule) !important;
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
  border-radius: 2px !important;
}

/* ── Thoughts stream ── */
.thought .markdown-preview-view {
  max-width: 520px !important;
}

.thought .markdown-preview-view p {
  font-family: var(--font-warm) !important;
  font-size: 1.25rem !important;
  font-style: italic !important;
  line-height: 1.72 !important;
}

/* ── Thoughts polaroid image ── */
.thought .markdown-preview-view img {
  width: 100% !important;
  height: 380px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border: 1px solid var(--rule) !important;
  padding: 0.75rem 0.75rem 2.5rem !important;
  background: #faf8f3 !important;
  box-shadow: 0 2px 8px rgba(28,28,28,0.07) !important;
  margin-bottom: 1.5rem !important;
  filter: sepia(6%) contrast(1.02) !important;
}

/* ── Mobile ── */
@media (max-width: 768px) {
  .publish-article,
  .markdown-preview-view {
    padding: 2rem 1.25rem 4rem !important;
  }

  .markdown-preview-view h1 {
    font-size: 1.65rem !important;
  }

  .markdown-preview-view p,
  .markdown-preview-view li {
    font-size: 1.02rem !important;
  }

  .thought .markdown-preview-view p {
    font-size: 1.1rem !important;
  }
}