/* ============================================================
   Obsidian Publish — Custom Theme
   Background : Display P3 (0.039, 0.063, 0.102)
   Accent     : Display P3 (0.380, 0.800, 0.969)
   ============================================================ */

/* ── Custom palette tokens ────────────────────────────────── */
:root {
  /* Background scale */
  --bg-base:     #090f19;
  --bg-base:     color(display-p3 0.039 0.063 0.102);
  --bg-raised:   #0e1824;
  --bg-raised:   color(display-p3 0.056 0.090 0.138);
  --bg-overlay:  #131f2c;
  --bg-overlay:  color(display-p3 0.073 0.118 0.170);

  /* Accent scale — blue (Display P3 0.380 0.800 0.969 ≈ hsl(197,91%,67%)) */
  --accent:           #61ccf7;
  --accent:           color(display-p3 0.380 0.800 0.969);
  --accent-bright:    #7ed8fa;
  --accent-bright:    color(display-p3 0.460 0.860 1.000);
  --accent-brighter:  #96e0fc;
  --accent-brighter:  color(display-p3 0.520 0.900 1.000);
  --accent-muted:     #3a9bbf;
  --accent-muted:     color(display-p3 0.240 0.600 0.745);
  --accent-faint:     #236070;
  --accent-faint:     color(display-p3 0.140 0.370 0.440);
  --accent-glow:      color(display-p3 0.380 0.800 0.969 / 0.15);
  --accent-glow-strong: color(display-p3 0.380 0.800 0.969 / 0.25);

  /* Text */
  --text-normal:    #d8e8f5;
  --text-muted:     #7fa8c0;
  --text-faint:     #4a6a80;
  --text-on-accent: #04111c;

  /* Borders */
  --border-subtle: color(display-p3 0.380 0.800 0.969 / 0.12);
  --border-strong: color(display-p3 0.380 0.800 0.969 / 0.28);
}

/* ── Nuclear override: every Obsidian accent/purple variable ─ */
/* Obsidian derives most of its accent UI from these HSL        */
/* component vars. Setting them here kills purple at the root.  */
:root {
  --accent-h:   197 !important;
  --accent-s:   91% !important;
  --accent-l:   67% !important;

  --color-accent:              var(--accent) !important;
  --color-accent-1:            var(--accent) !important;
  --color-accent-2:            var(--accent-muted) !important;
  --interactive-accent:        var(--accent) !important;
  --interactive-accent-hover:  var(--accent-bright) !important;
  --interactive-accent-rgb:    97, 204, 247 !important;
  --color-accent-rgb:          97, 204, 247 !important;

  --text-accent:               var(--accent) !important;
  --text-accent-hover:         var(--accent-brighter) !important;

  --link-color:                        var(--accent) !important;
  --link-color-hover:                  var(--accent-brighter) !important;
  --link-unresolved-color:             var(--accent-muted) !important;
  --link-unresolved-opacity:           1 !important;
  --link-unresolved-filter:            none !important;
  --link-unresolved-decoration-color:  var(--accent-muted) !important;
  --link-external-color:               var(--accent) !important;
  --link-external-color-hover:         var(--accent-brighter) !important;
  --link-external-decoration-color:    var(--border-strong) !important;

  --background-primary:           var(--bg-base) !important;
  --background-primary-alt:       var(--bg-raised) !important;
  --background-secondary:         var(--bg-raised) !important;
  --background-secondary-alt:     var(--bg-overlay) !important;
  --background-modifier-border:   var(--border-subtle) !important;
  --background-modifier-hover:    color(display-p3 0.380 0.800 0.969 / 0.08) !important;
  --background-modifier-active-hover: var(--accent-glow) !important;
  --background-modifier-cover:    color(display-p3 0.039 0.063 0.102 / 0.85) !important;

  --h1-color: var(--accent) !important;
  --h2-color: var(--accent) !important;
  --h3-color: color(display-p3 0.480 0.840 0.980) !important;
  --h4-color: var(--text-normal) !important;
  --h5-color: var(--text-muted) !important;
  --h6-color: var(--text-faint) !important;

  --text-normal:      #d8e8f5 !important;
  --text-muted:       #7fa8c0 !important;
  --text-faint:       #4a6a80 !important;
  --text-on-accent:   #04111c !important;
  --text-selection:   color(display-p3 0.380 0.800 0.969 / 0.28) !important;
  --text-highlight-bg: color(display-p3 0.380 0.800 0.969 / 0.22) !important;

  --bold-color:   #d8e8f5 !important;
  --italic-color: #7fa8c0 !important;

  --checkbox-color:              var(--accent) !important;
  --checkbox-color-hover:        var(--accent-bright) !important;
  --checkbox-border-color:       var(--border-strong) !important;
  --checkbox-border-color-hover: var(--accent) !important;
  --checklist-done-color:        var(--accent-muted) !important;

  --toggle-thumb-color:          var(--bg-base) !important;
  --toggle-border-color:         var(--border-strong) !important;
  --toggle-border-color-hover:   var(--accent) !important;

  --tag-color:              var(--accent) !important;
  --tag-background:         var(--accent-glow) !important;
  --tag-border-color:       var(--border-strong) !important;
  --tag-color-hover:        var(--accent-brighter) !important;
  --tag-background-hover:   var(--accent-glow-strong) !important;
  --tag-border-color-hover: var(--accent) !important;
  --tag-radius:             99px !important;

  /* Obsidian's semantic purple palette — used by [!question] [!help] [!faq] [!example] callouts */
  --color-purple:     #61ccf7 !important;
  --color-purple-rgb: 97, 204, 247 !important;

  /* --accent-d is the dark-mode lightness variant read by some Publish themes */
  --accent-d: 67% !important;

  --callout-default:  97, 204, 247 !important;
  --callout-info:     97, 204, 247 !important;
  --callout-question: 97, 204, 247 !important;
  --callout-help:     97, 204, 247 !important;
  --callout-faq:      97, 204, 247 !important;
  --callout-example:  97, 204, 247 !important;

  --code-background:  var(--bg-raised) !important;
  --code-normal:      color(display-p3 0.600 0.920 0.980) !important;
  --code-comment:     #4a6a80 !important;
  --code-tag:         var(--accent) !important;
  --code-keyword:     var(--accent) !important;
  --code-string:      color(display-p3 0.500 0.870 0.650) !important;
  --code-function:    var(--accent-brighter) !important;
  --code-operator:    var(--accent-muted) !important;
  --code-property:    var(--accent-bright) !important;

  --blockquote-border-color:  var(--accent) !important;
  --quote-opening-modifier:   var(--accent) !important;

  --table-border-color:        var(--border-subtle) !important;
  --table-header-background:   var(--bg-raised) !important;
  --table-row-alt-background:  var(--bg-raised) !important;

  --scrollbar-bg:              transparent !important;
  --scrollbar-thumb-bg:        var(--border-strong) !important;
  --scrollbar-active-thumb-bg: var(--accent-muted) !important;

  --graph-line:             var(--border-subtle) !important;
  --graph-node:             var(--accent) !important;
  --graph-node-focused:     var(--accent-bright) !important;
  --graph-node-unresolved:  var(--accent-muted) !important;
  --graph-node-tag:         var(--accent-faint) !important;
  --graph-node-attachment:  #4a6a80 !important;

  --nav-item-color:                    #7fa8c0 !important;
  --nav-item-color-hover:              #d8e8f5 !important;
  --nav-item-color-active:             var(--accent) !important;
  --nav-item-background-hover:         color(display-p3 0.380 0.800 0.969 / 0.08) !important;
  --nav-item-background-active:        var(--accent-glow) !important;
  --nav-indentation-guide-color:       var(--border-subtle) !important;
  --nav-collapse-icon-color:           #4a6a80 !important;
  --nav-collapse-icon-color-collapsed: var(--accent-muted) !important;

  --outline-color-active:  var(--accent) !important;
  --outline-color-hover:   #d8e8f5 !important;
  --outline-color-collapse: #4a6a80 !important;

  --focus-color:         var(--accent) !important;
  --prompt-border-color: var(--border-strong) !important;
}

/* ── Re-assert on all major container classes ─────────────── */
/* Catches anything Obsidian sets with higher specificity       */
.theme-dark,
.theme-dark body,
body.theme-dark,
.published-container,
.site-body,
.publish-article-page {
  --color-accent:           color(display-p3 0.380 0.800 0.969) !important;
  --color-accent-1:         color(display-p3 0.380 0.800 0.969) !important;
  --color-accent-2:         color(display-p3 0.240 0.600 0.745) !important;
  --interactive-accent:     color(display-p3 0.380 0.800 0.969) !important;
  --text-accent:            color(display-p3 0.380 0.800 0.969) !important;
  --link-color:             color(display-p3 0.380 0.800 0.969) !important;
  --link-unresolved-color:  color(display-p3 0.240 0.600 0.745) !important;
  --link-external-color:    color(display-p3 0.380 0.800 0.969) !important;
  --checkbox-color:         color(display-p3 0.380 0.800 0.969) !important;
  --tag-color:              color(display-p3 0.380 0.800 0.969) !important;
  --color-purple:           color(display-p3 0.380 0.800 0.969) !important;
  --color-purple-rgb:       97, 204, 247 !important;
  --accent-h: 197 !important;
  --accent-s: 91% !important;
  --accent-l: 67% !important;
  --accent-d: 67% !important;
}

/* ── Site shell ───────────────────────────────────────────── */
body,
.site-body,
.publish-article-page,
.published-container {
  background-color: #090f19;
  background-color: var(--bg-base);
  color: var(--text-normal);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ── Site header ──────────────────────────────────────────── */
.site-header,
.site-header-text,
.publish-site-title {
  background-color: var(--bg-raised) !important;
  color: var(--accent) !important;
  border-bottom: 1px solid var(--border-subtle) !important;
}

/* ── Navigation sidebar ───────────────────────────────────── */
.site-body-left-column {
  background-color: var(--bg-raised) !important;
  border-right: 1px solid var(--border-subtle) !important;
}

.nav-file-title,
.nav-folder-title,
.tree-item-self {
  color: var(--text-muted) !important;
  background-color: transparent !important;
}

.nav-file-title:hover,
.nav-folder-title:hover,
.tree-item-self.is-clickable:hover {
  background-color: color(display-p3 0.380 0.800 0.969 / 0.08) !important;
  color: var(--text-normal) !important;
}

/* Active / current page */
.nav-file-title.is-active,
.nav-file-title.is-active:hover,
.tree-item-self.is-active,
.tree-item-self.is-active:hover,
.tree-item-self[class*="active"],
.nav-file-title[class*="active"] {
  background-color: color(display-p3 0.380 0.800 0.969 / 0.15) !important;
  color: color(display-p3 0.380 0.800 0.969) !important;
  border-left: 2px solid color(display-p3 0.380 0.800 0.969) !important;
  --interactive-accent:    color(display-p3 0.380 0.800 0.969) !important;
  --color-accent:          color(display-p3 0.380 0.800 0.969) !important;
  --nav-item-color-active: color(display-p3 0.380 0.800 0.969) !important;
}

.nav-folder-collapse-indicator svg,
.collapse-icon svg {
  color: var(--text-faint) !important;
}

.tree-item-children {
  border-left: 1px solid var(--border-subtle) !important;
}

/* ── Table of contents / Outline ──────────────────────────── */
.outline-item.is-active,
.outline .is-active {
  color: var(--accent) !important;
}

/* ── Article / content area ───────────────────────────────── */
.publish-article,
.markdown-rendered,
.site-body-center-column {
  background-color: var(--bg-base) !important;
}

/* ── Headings ─────────────────────────────────────────────── */
.markdown-rendered h1 { color: color(display-p3 0.380 0.800 0.969) !important; }
.markdown-rendered h2 { color: color(display-p3 0.380 0.800 0.969) !important; }
.markdown-rendered h3 { color: color(display-p3 0.480 0.840 0.980) !important; }
.markdown-rendered h4 { color: #d8e8f5 !important; }
.markdown-rendered h5 { color: #7fa8c0 !important; }
.markdown-rendered h6 { color: #4a6a80 !important; }

.markdown-rendered h2 {
  border-bottom: 1px solid var(--border-subtle) !important;
  padding-bottom: 0.25em;
}

/* ── All links ────────────────────────────────────────────── */
a,
.markdown-rendered a,
.markdown-rendered a.internal-link,
.markdown-rendered a.external-link {
  color: color(display-p3 0.380 0.800 0.969) !important;
  text-decoration: none !important;
  border-bottom: 1px solid color(display-p3 0.380 0.800 0.969 / 0.28) !important;
  transition: color 0.15s, border-color 0.15s;
}

a:hover,
.markdown-rendered a:hover,
.markdown-rendered a.internal-link:hover,
.markdown-rendered a.external-link:hover {
  color: color(display-p3 0.520 0.900 1.000) !important;
  border-bottom-color: color(display-p3 0.380 0.800 0.969) !important;
}

/* Unresolved / not-yet-created notes */
a.is-unresolved,
.markdown-rendered a.is-unresolved,
.markdown-rendered a.is-unresolved:link,
.markdown-rendered a.is-unresolved:visited,
span.is-unresolved {
  color: color(display-p3 0.240 0.600 0.745) !important;
  border-bottom: 1px dashed color(display-p3 0.240 0.600 0.745) !important;
  opacity: 1 !important;
  filter: none !important;
  --link-unresolved-color:            color(display-p3 0.240 0.600 0.745) !important;
  --link-unresolved-decoration-color: color(display-p3 0.240 0.600 0.745) !important;
}

/* ── Text selection ───────────────────────────────────────── */
::selection {
  background-color: color(display-p3 0.380 0.800 0.969 / 0.28) !important;
}

/* ── Tags ─────────────────────────────────────────────────── */
a.tag,
.tag {
  color: color(display-p3 0.380 0.800 0.969) !important;
  background-color: color(display-p3 0.380 0.800 0.969 / 0.15) !important;
  border: 1px solid color(display-p3 0.380 0.800 0.969 / 0.28) !important;
  border-radius: 99px !important;
  padding: 1px 8px !important;
  font-size: 0.8em !important;
  text-decoration: none !important;
}

a.tag:hover,
.tag:hover {
  color: color(display-p3 0.520 0.900 1.000) !important;
  background-color: color(display-p3 0.380 0.800 0.969 / 0.25) !important;
  border-color: color(display-p3 0.380 0.800 0.969) !important;
}

/* ── Checkboxes ───────────────────────────────────────────── */
input[type="checkbox"] {
  border-color: var(--border-strong) !important;
  accent-color: color(display-p3 0.380 0.800 0.969) !important;
}

input[type="checkbox"]:checked {
  background-color: color(display-p3 0.380 0.800 0.969) !important;
  border-color: color(display-p3 0.380 0.800 0.969) !important;
}

/* ── Code blocks ──────────────────────────────────────────── */
.markdown-rendered pre,
.markdown-rendered code {
  background-color: var(--bg-raised) !important;
  color: color(display-p3 0.600 0.920 0.980) !important;
  border: 1px solid var(--border-subtle) !important;
  border-radius: 6px;
}

.markdown-rendered pre code {
  border: none !important;
  background: transparent !important;
}

.markdown-rendered p code,
.markdown-rendered li code {
  color: color(display-p3 0.380 0.800 0.969) !important;
  background-color: color(display-p3 0.380 0.800 0.969 / 0.15) !important;
  border: 1px solid var(--border-subtle) !important;
  border-radius: 3px;
  padding: 0.1em 0.35em;
}

/* ── Blockquotes ──────────────────────────────────────────── */
.markdown-rendered blockquote {
  border-left: 3px solid color(display-p3 0.380 0.800 0.969) !important;
  background-color: color(display-p3 0.380 0.800 0.969 / 0.15) !important;
  padding: 0.6em 1em;
  border-radius: 0 6px 6px 0;
  color: var(--text-muted) !important;
}

/* ── Callouts ─────────────────────────────────────────────── */
.callout {
  --callout-color: 97, 204, 247 !important;
  background-color: color(display-p3 0.380 0.800 0.969 / 0.15) !important;
  border-color: color(display-p3 0.380 0.800 0.969 / 0.28) !important;
}

.callout-title {
  color: color(display-p3 0.380 0.800 0.969) !important;
}

.callout-icon {
  color: color(display-p3 0.380 0.800 0.969) !important;
}

/* Callout types that Obsidian renders purple by default */
.callout[data-callout="question"],
.callout[data-callout="help"],
.callout[data-callout="faq"],
.callout[data-callout="example"],
.callout[data-callout="abstract"],
.callout[data-callout="summary"],
.callout[data-callout="tldr"] {
  --callout-color: 97, 204, 247 !important;
}

/* ── Tables ───────────────────────────────────────────────── */
.markdown-rendered table { border-collapse: collapse; width: 100%; }

.markdown-rendered th {
  background-color: var(--bg-raised) !important;
  color: color(display-p3 0.380 0.800 0.969) !important;
  border: 1px solid var(--border-subtle) !important;
  padding: 0.5em 0.75em;
}

.markdown-rendered td {
  border: 1px solid var(--border-subtle) !important;
  padding: 0.5em 0.75em;
}

.markdown-rendered tr:nth-child(even) td {
  background-color: var(--bg-raised) !important;
}

/* ── Horizontal rules ─────────────────────────────────────── */
.markdown-rendered hr {
  border-color: var(--border-subtle) !important;
}

/* ── Search ───────────────────────────────────────────────── */
.search-input-container input,
.search-input {
  background-color: var(--bg-raised) !important;
  border: 1px solid var(--border-subtle) !important;
  color: var(--text-normal) !important;
  border-radius: 6px !important;
}

.search-input-container input:focus,
.search-input:focus {
  border-color: color(display-p3 0.380 0.800 0.969) !important;
  outline: none !important;
  box-shadow: 0 0 0 2px color(display-p3 0.380 0.800 0.969 / 0.15) !important;
}

.search-result-file-title {
  color: color(display-p3 0.380 0.800 0.969) !important;
}

.search-result-file-match em {
  color: color(display-p3 0.380 0.800 0.969) !important;
  font-style: normal !important;
  background-color: color(display-p3 0.380 0.800 0.969 / 0.15) !important;
  border-radius: 2px;
}

.suggestion-item.is-selected,
.suggestion-item:focus {
  background-color: color(display-p3 0.380 0.800 0.969 / 0.15) !important;
  color: color(display-p3 0.380 0.800 0.969) !important;
}

/* ── Buttons ──────────────────────────────────────────────── */
button.mod-cta,
.mod-cta {
  background-color: color(display-p3 0.380 0.800 0.969) !important;
  color: #04111c !important;
  border: none !important;
}

button.mod-cta:hover,
.mod-cta:hover {
  background-color: color(display-p3 0.460 0.860 1.000) !important;
}

/* ── Toggles ──────────────────────────────────────────────── */
.checkbox-container.is-enabled {
  background-color: color(display-p3 0.380 0.800 0.969) !important;
}

/* ── Graph view ───────────────────────────────────────────── */
.graph-view.color-fill            { color: color(display-p3 0.380 0.800 0.969) !important; }
.graph-view.color-fill-unresolved { color: color(display-p3 0.240 0.600 0.745) !important; }
.graph-view.color-fill-attachment { color: #4a6a80 !important; }
.graph-view.color-fill-tag        { color: color(display-p3 0.140 0.370 0.440) !important; }
.graph-view.color-arrow           { color: color(display-p3 0.380 0.800 0.969 / 0.28) !important; }
.graph-view.color-circle          { color: color(display-p3 0.380 0.800 0.969) !important; }
.graph-view.color-line            { color: color(display-p3 0.380 0.800 0.969 / 0.12) !important; }
.graph-view.color-text            { color: #7fa8c0 !important; }

/* ── Scrollbars ───────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bg-base); }
::-webkit-scrollbar-thumb {
  background: color(display-p3 0.380 0.800 0.969 / 0.28);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: color(display-p3 0.240 0.600 0.745);
}

/* ── Focus rings (keyboard nav) ───────────────────────────── */
:focus-visible {
  outline: 2px solid color(display-p3 0.380 0.800 0.969) !important;
  outline-offset: 2px;
}