:root {
  --md-primary-fg-color: #01a93d;
  --md-primary-fg-color--light: #02c547;
  --md-primary-fg-color--dark: #018931;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: #ffffffb3;

  --md-accent-fg-color: #ff6b35;
  --md-accent-fg-color--transparent: #ff6b3520;

  --md-default-fg-color: #000000;
  --md-default-fg-color--light: #212529;
  --md-default-fg-color--lighter: #495057;
  --md-default-fg-color--lightest: #6c757d;
  --md-default-bg-color: #ffffff;
  --md-default-bg-color--light: #f8f9fa;
  --md-default-bg-color--lighter: #e9ecef;
  --md-default-bg-color--lightest: #dee2e6;

  --md-code-fg-color: #e83e8c;
  --md-code-bg-color: #f8f9fa;

  --md-footer-bg-color: #018931;
  --md-footer-bg-color--dark: #016827;
  --md-footer-fg-color: #ffffff;
  --md-footer-fg-color--light: #ffffffb3;
  --md-footer-fg-color--lighter: #ffffff73;
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #01a93d;
  --md-primary-fg-color--light: #02c547;
  --md-primary-fg-color--dark: #018931;
  --md-primary-bg-color: #1e1e1e;
  --md-primary-bg-color--light: #2d2d2d;

  --md-typeset-a-color:         #01a93d !important;
  --md-accent-fg-color:         #018931;
  --md-accent-fg-color--transparent: #ff8c6120;

  --md-default-fg-color: #ffffff;
  --md-default-fg-color--light: #f5f5f5;
  --md-default-fg-color--lighter: #e0e0e0;
  --md-default-fg-color--lightest: #bdbdbd;
  --md-default-bg-color: #121212;
  --md-default-bg-color--light: #1e1e1e;
  --md-default-bg-color--lighter: #2d2d2d;
  --md-default-bg-color--lightest: #3a3a3a;

  --md-code-fg-color: #ff79c6;
  --md-code-bg-color: #1e1e1e;

  --md-footer-bg-color: #0d0d0d;
  --md-footer-bg-color--dark: #000000;
  --md-footer-fg-color: #ffffff;
  --md-footer-fg-color--light: #ffffffb3;
  --md-footer-fg-color--lighter: #ffffff73;

  --md-hue: 140;
}

[data-md-color-primary="terna"] {
  --md-primary-fg-color: #01a93d;
  --md-primary-fg-color--light: #02c547;
  --md-primary-fg-color--dark: #018931;
}

[data-md-color-scheme="terna-light"] {
    --md-typeset-a-color:         #01a93d;
    --md-accent-fg-color:         #018931;
    --md-primary-fg-color:        #01a93d;
    --md-primary-fg-color--light: #ECB7B7;
    --md-primary-fg-color--dark:  #561a1a;
  }

[data-md-color-scheme="terna-dark"] {
    --md-primary-fg-color:        #29313B;
    --md-primary-fg-color--light: #29313B;
    --md-primary-fg-color--dark:  #561a1a;
  }

.md-header {
  background: linear-gradient(135deg, #01a93d 0%, #018931 100%);
}

.md-header__title {
  color: #ffffff !important;
}

.md-header__topic {
  color: #ffffff !important;
}

.md-nav--primary .md-nav__title .md-tabs__link {
  color: #ffffff !important;
}

[data-md-color-scheme="slate"] .md-header {
  background: linear-gradient(135deg, #018931 0%, #016827 100%);
}

.md-nav__link--active,
.md-nav__link:active {
  color: var(--md-primary-fg-color);
  font-weight: 600;
}

.md-typeset a {
  color: var(--md-primary-fg-color);
  text-decoration: none;
  transition: color 0.2s;
}

.md-typeset a:hover {
  color: var(--md-primary-fg-color--light);
  text-decoration: underline;
}

.md-typeset h1,
.md-typeset h2 {
  color: var(--md-primary-fg-color);
}

[data-md-color-scheme="slate"] .md-typeset h1,
[data-md-color-scheme="slate"] .md-typeset h2 {
  color: #ffffff;
}

[data-md-color-scheme="slate"] .md-typeset {
  color: #f5f5f5;
}

.md-typeset .admonition,
.md-typeset details {
  border-left: 4px solid var(--md-primary-fg-color);
}

.md-typeset .admonition.note,
.md-typeset details.note {
  border-left-color: var(--md-primary-fg-color);
}

.md-typeset .admonition.warning,
.md-typeset details.warning {
  border-left-color: var(--md-accent-fg-color);
}

.md-typeset table:not([class]) th {
  background-color: var(--md-primary-fg-color);
  color: white;
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background-color: var(--md-primary-fg-color--dark);
}

.md-typeset code {
  color: var(--md-primary-fg-color);
  background-color: var(--md-code-bg-color);
  padding: 0.125em 0.25em;
  border-radius: 0.25em;
}

.md-typeset .highlight code {
  background-color: transparent;
  padding: 0;
}

.md-footer-meta {
  background: linear-gradient(135deg, #018931 0%, #016827 100%);
}

[data-md-color-scheme="slate"] .md-footer-meta {
  background: linear-gradient(135deg, #016827 0%, #014d1d 100%);
}

/* Reading time badge */
.reading-time-badge {
  display: inline-block;
  background: var(--md-primary-fg-color);
  color: white;
  padding: 0.25rem 0.5rem;
  border-radius: 0.75rem;
  font-size: 0.75rem;
  font-weight: 500;
  font-family: var(--md-text-font-family);
  margin-left: 1rem;
  vertical-align: middle;
  opacity: 0.9;
  transition: opacity 0.2s ease;
  white-space: nowrap;
}

.reading-time-badge:hover {
  opacity: 1;
}

[data-md-color-scheme="slate"] .reading-time-badge {
  background: var(--md-primary-fg-color--light);
  color: #000;
}

/* Mobile responsiveness */
@media screen and (max-width: 768px) {
  .reading-time-badge {
    display: block;
    margin: 0.5rem 0 0 0;
    width: fit-content;
    font-size: 0.7rem;
    padding: 0.2rem 0.4rem;
  }
}

/* Ensure proper spacing on title line */
h1 .reading-time-badge {
  margin-left: 1rem;
  vertical-align: middle;
}

@media screen and (max-width: 768px) {
  h1 .reading-time-badge {
    margin-left: 0;
    margin-top: 0.5rem;
  }
}

/* Language selector styles */
.language-selector {
  display: flex;
  align-items: center;
}

.language-button {
  font-family: var(--md-text-font-family);
}

.language-button:hover {
  transform: translateY(-1px);
}

.language-dropdown {
  animation: dropdownFadeIn 0.2s ease;
}

@keyframes dropdownFadeIn {
  from {
    opacity: 0;
    transform: translateY(-5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

[data-md-color-scheme="slate"] .language-dropdown {
  background: var(--md-default-bg-color--light);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}

.language-dropdown a {
  border-bottom: 1px solid var(--md-default-bg-color--lighter);
}

.language-dropdown a:last-child {
  border-bottom: none;
}

[data-md-color-scheme="slate"] .language-dropdown a {
  border-bottom-color: var(--md-default-bg-color--lightest);
}

/* Ensure proper alignment in header */
.md-header__option {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* Mobile adjustments */
@media screen and (max-width: 768px) {
  .language-selector {
    margin-right: 0.5rem;
  }

  .language-button {
    min-width: auto;
    padding: 0.3rem;
  }

  .language-dropdown {
    right: -0.5rem;
  }
}