/* Minimal custom styles - using Quarto defaults */

/* Fix inline code in dark mode - add green tint */
[data-bs-theme="dark"] code,
.quarto-dark code {
  color: #8fd19e !important;
  background-color: rgba(0, 166, 62, 0.15) !important;
}

/* Preserve syntax highlighting in code blocks */
[data-bs-theme="dark"] pre code,
.quarto-dark pre code {
  color: inherit !important;
  background-color: transparent !important;
}

/* Style callout notes in dark mode with green tint */
[data-bs-theme="dark"] .callout.callout-style-default > .callout-body,
.quarto-dark .callout.callout-style-default > .callout-body {
  background-color: rgba(0, 166, 62, 0.1) !important;
}

[data-bs-theme="dark"] .callout.callout-style-default,
.quarto-dark .callout.callout-style-default {
  border-left-color: #00a63e !important;
}

[data-bs-theme="dark"] .callout-note.callout-style-default > .callout-header {
  background-color: rgba(0, 166, 62, 0.15) !important;
  color: #8fd19e !important;
}

[data-bs-theme="dark"] .callout-note.callout-style-default > .callout-body {
  color: #e0e0e0 !important;
}

/* Navbar styling - slightly darker than background */
/* Light mode navbar */
.navbar {
  background-color: #f5f5f5 !important;
}

/* Light mode navbar buttons and icons - better contrast */
.navbar button,
.navbar a,
.navbar .navbar-toggler {
  color: #1a1a1a !important;
}

.navbar button:hover,
.navbar a:hover,
.navbar .navbar-toggler:hover {
  color: #00a63e !important;
}

/* Light mode navbar SVG icons */
.navbar svg {
  fill: #1a1a1a !important;
  stroke: #1a1a1a !important;
}

.navbar button:hover svg,
.navbar a:hover svg {
  fill: #00a63e !important;
  stroke: #00a63e !important;
}

/* Light mode search and toggle elements */
.navbar-search,
.navbar .quarto-search,
.navbar-nav .nav-link {
  color: #1a1a1a !important;
}

.navbar-search:hover,
.navbar .quarto-search:hover,
.navbar-nav .nav-link:hover {
  color: #00a63e !important;
}

/* Light mode theme toggle - force visibility */
.navbar .quarto-color-scheme-toggle,
.navbar .quarto-color-scheme-toggle button,
.navbar .quarto-color-scheme-toggle i,
.navbar .aa-DetachedSearchButton {
  color: #1a1a1a !important;
  opacity: 1 !important;
}

.navbar .quarto-color-scheme-toggle:hover,
.navbar .quarto-color-scheme-toggle button:hover {
  color: #00a63e !important;
}

.navbar .quarto-color-scheme-toggle svg,
.navbar .quarto-color-scheme-toggle i svg {
  fill: #1a1a1a !important;
  stroke: #1a1a1a !important;
  opacity: 1 !important;
}

.navbar .quarto-color-scheme-toggle:hover svg,
.navbar .quarto-color-scheme-toggle button:hover svg {
  fill: #00a63e !important;
  stroke: #00a63e !important;
}

/* Force all navbar icons to be visible in light mode */
.navbar .bi {
  color: #1a1a1a !important;
  opacity: 1 !important;
}

/* Dark mode navbar - slightly darker than dark background */
html[data-bs-theme="dark"] .navbar,
.quarto-dark .navbar {
  background-color: #1a1a1a !important;
  border-bottom: 1px solid #333 !important;
}

/* Dark mode navbar buttons and icons */
html[data-bs-theme="dark"] .navbar button,
html[data-bs-theme="dark"] .navbar a,
.quarto-dark .navbar button,
.quarto-dark .navbar a {
  color: #e0e0e0 !important;
}

html[data-bs-theme="dark"] .navbar button:hover,
html[data-bs-theme="dark"] .navbar a:hover,
.quarto-dark .navbar button:hover,
.quarto-dark .navbar a:hover {
  color: #00c848 !important;
}

/* Dark mode navbar SVG icons */
html[data-bs-theme="dark"] .navbar svg,
.quarto-dark .navbar svg {
  fill: #e0e0e0 !important;
  stroke: #e0e0e0 !important;
}

html[data-bs-theme="dark"] .navbar button:hover svg,
html[data-bs-theme="dark"] .navbar a:hover svg,
.quarto-dark .navbar button:hover svg,
.quarto-dark .navbar a:hover svg {
  fill: #00c848 !important;
  stroke: #00c848 !important;
}

/* Dark mode theme toggle - force visibility */
html[data-bs-theme="dark"] .navbar .quarto-color-scheme-toggle,
html[data-bs-theme="dark"] .navbar .quarto-color-scheme-toggle button,
html[data-bs-theme="dark"] .navbar .quarto-color-scheme-toggle i,
.quarto-dark .navbar .quarto-color-scheme-toggle,
.quarto-dark .navbar .quarto-color-scheme-toggle button {
  color: #e0e0e0 !important;
  opacity: 1 !important;
}

html[data-bs-theme="dark"] .navbar .quarto-color-scheme-toggle:hover,
html[data-bs-theme="dark"] .navbar .quarto-color-scheme-toggle button:hover,
.quarto-dark .navbar .quarto-color-scheme-toggle:hover,
.quarto-dark .navbar .quarto-color-scheme-toggle button:hover {
  color: #00c848 !important;
}

html[data-bs-theme="dark"] .navbar .quarto-color-scheme-toggle svg,
html[data-bs-theme="dark"] .navbar .quarto-color-scheme-toggle i svg,
.quarto-dark .navbar .quarto-color-scheme-toggle svg {
  fill: #e0e0e0 !important;
  stroke: #e0e0e0 !important;
  opacity: 1 !important;
}

html[data-bs-theme="dark"] .navbar .quarto-color-scheme-toggle:hover svg,
html[data-bs-theme="dark"] .navbar .quarto-color-scheme-toggle button:hover svg,
.quarto-dark .navbar .quarto-color-scheme-toggle:hover svg,
.quarto-dark .navbar .quarto-color-scheme-toggle button:hover svg {
  fill: #00c848 !important;
  stroke: #00c848 !important;
}

/* Force all navbar icons to be visible in dark mode */
html[data-bs-theme="dark"] .navbar .bi,
.quarto-dark .navbar .bi {
  color: #e0e0e0 !important;
  opacity: 1 !important;
}

/* Increase logo size */
.navbar-brand img {
  height: 50px !important;
  width: auto !important;
}

/* Logo switching for dark mode */
html[data-bs-theme="dark"] .navbar-brand img,
.quarto-dark .navbar-brand img {
  content: url("C-battery_H_negatief.png") !important;
}
