/* Common variables for both light and dark modes */
:root {
  /* Accent brand colors - used in both modes */
  --md-accent-fg-color: #DAD0AF;
  --md-accent-fg-color--transparent: #DAD0AF;
}

/* Light mode (default) */
[data-md-color-scheme="default"] {
  /* Primary brand colors */
  --md-primary-fg-color: #024645;
  --md-primary-fg-color--light: #035a59;
  --md-primary-fg-color--dark: #013433;

  /* Custom button colors */
  --md-button-bg-color: var(--md-primary-fg-color);
  --md-button-text-color: var(--md-accent-fg-color);
  --md-mermaid-edge-color: #024645;
  --md-mermaid-label-fg-color: #DAD0AF;

  /* Footer colors */
  --md-footer-bg-color: var(--md-primary-fg-color);
  --md-footer-bg-color--dark: var(--md-primary-fg-color);
  --md-footer-fg-color: var(--md-accent-fg-color);
  --md-footer-fg-color--light: var(--md-accent-fg-color);
}

/* Dark mode adjustments */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #024645;
  --md-primary-fg-color--light: #024645;
  --md-primary-fg-color--dark: #013433;
  --md-default-bg-color: #121212;
  --md-default-bg-color--light: #1e1e1e;
  --md-typeset-a-color: var(--md-accent-fg-color);
  --md-mermaid-edge-color: var(--md-accent-fg-color);
  --md-mermaid-label-fg-color: #DAD0AF;

  /* Footer dark mode */
  --md-footer-bg-color: var(--md-primary-fg-color--light);
  --md-footer-bg-color--dark: var(--md-primary-fg-color--light);
  --md-footer-fg-color: var(--md-accent-fg-color);
  --md-footer-fg-color--light: var(--md-accent-fg-color);
}

/* Header and navigation text color */
.md-header,
.md-header__title,
.md-header__topic,
.md-header__ellipsis,
.md-header__button,
.md-search__input::placeholder {
  color: var(--md-accent-fg-color) !important;
}

/* SVG icons in header */
.md-header__button.md-logo img,
.md-header__button.md-logo svg,
.md-nav__button svg,
.md-header__button:not(.md-logo) svg {
  fill: var(--md-accent-fg-color);
}

/* Tab navigation */
.md-tabs__link {
  color: var(--md-accent-fg-color) !important;
}

/* Make active navigation link more visible */
.md-tabs__link--active,
.md-tabs__link:hover {
  color: var(--md-accent-fg-color) !important;
  opacity: 1;
}

/* Dark mode keeps the accent color */
[data-md-color-scheme="slate"] .md-nav__title,
[data-md-color-scheme="slate"] .md-nav__link,
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__link,
[data-md-color-scheme="slate"] .md-nav--secondary .md-nav__link,
[data-md-color-scheme="slate"] .md-sidebar .md-nav__link {
  color: var(--md-accent-fg-color);
}

/* Light mode uses darker color for better contrast */
[data-md-color-scheme="default"] .md-nav__title,
[data-md-color-scheme="default"] .md-nav__link,
[data-md-color-scheme="default"] .md-nav--primary .md-nav__link,
[data-md-color-scheme="default"] .md-nav--secondary .md-nav__link,
[data-md-color-scheme="default"] .md-sidebar .md-nav__link {
  color: var(--md-primary-fg-color);
}

/* Search results */
.md-search-result__link {
  color: var(--md-accent-fg-color);
}

/* Button styling - standard buttons */
.md-button {
  background-color: var(--md-primary-fg-color) !important;
  color: var(--md-accent-fg-color) !important;
  border-color: var(--md-primary-fg-color) !important;
}

.md-button:hover {
  background-color: var(--md-primary-fg-color--light) !important;
  color: var(--md-accent-fg-color) !important;
  border-color: var(--md-primary-fg-color--light) !important;
  text-decoration: underline;
}

/* Primary button styling - reversed for emphasis */
.md-button--primary {
  background-color: var(--md-primary-fg-color) !important;
  color: var(--md-accent-fg-color) !important;
  border-color: var(--md-accent-fg-color) !important;
}

.md-button--primary:hover {
  background-color: var(--md-primary-fg-color--light) !important;
  color: var(--md-accent-fg-color) !important;
}

/* Card enhancements */
.md-typeset .grid.cards > :is(ul, ol) > li {
  border-color: var(--md-accent-fg-color--transparent);
}

.md-typeset .grid.cards > :is(ul, ol) > li:hover {
  box-shadow: 0 0 0.2rem rgba(218, 208, 175, 0.3);
  border-color: var(--md-accent-fg-color);
}

/* Admonition styling */
.md-typeset .admonition {
  border-left-color: var(--md-accent-fg-color);
}

/* Table styling */
.md-typeset table:not([class]) th {
  background-color: var(--md-primary-fg-color);
  color: var(--md-accent-fg-color);
}

.nodeLabel {
  color: var(--md-accent-fg-color) !important;
}

.grid.cards > ul {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
}

.cards > ul > li {
  display: flex !important;
  flex-direction: column;
  max-width: 400px;
  justify-content: space-between;
}

.nodeLabel p {
  color: unset !important;
}

.cluster span {
  color: var(--md-primary-fg-color) !important;
  border-color: var(--md-primary-fg-color) !important;
  background-color: black !important;
}

html {
  background-color: #024645;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}
