/* Nymbl Customer API Custom Colors - Direct Override */

/* Override Material theme colors with exact Nymbl colors */
:root {
  /* Primary: #07051f (Dark Navy/Purple - from nymblsystems.com header) */
  --md-primary-fg-color: #07051f;
  --md-primary-fg-color--light: #1a1640;
  --md-primary-fg-color--dark: #000000;

  /* Accent: #ff595a (Coral Red - from nymblsystems.com) */
  --md-accent-fg-color: #ff595a;
  --md-accent-fg-color--transparent: rgba(255, 89, 90, 0.1);

  /* Links - all variants of accent color */
  --md-typeset-a-color: #ff595a;

  /* Text on dark background */
  --md-typeset-color: rgba(255, 255, 255, 0.87);
  --md-default-fg-color: rgba(255, 255, 255, 0.87);
  --md-default-fg-color--light: rgba(255, 255, 255, 0.7);
  --md-default-fg-color--lighter: rgba(255, 255, 255, 0.5);
  --md-default-fg-color--lightest: rgba(255, 255, 255, 0.3);
}

/* Force purple background everywhere */
body,
html,
.md-container,
.md-main,
.md-main__inner,
.md-content,
.md-sidebar,
.md-nav {
  background-color: #220959 !important;
}

/* Content background */
.md-content__inner {
  background-color: #220959 !important;
}

/* Article/page background */
article.md-content__inner {
  background-color: #220959 !important;
}

/* Ensure header uses our color */
.md-header {
  background-color: #07051f !important;
}

/* Ensure tabs use our color */
.md-tabs {
  background-color: #07051f !important;
}

/* Footer */
.md-footer {
  background-color: #07051f !important;
}

/* Links - all use accent color */
.md-typeset a,
.md-nav__link,
a {
  color: #ff595a !important;
}

.md-typeset a:hover,
.md-nav__link:hover,
a:hover {
  color: #ff7b7c !important;
}

/* Active navigation items */
.md-nav__link--active {
  color: #ff7b7c !important;
  font-weight: 500;
}

/* Sidebar navigation links */
.md-nav__link {
  color: rgba(255, 255, 255, 0.7) !important;
}

.md-nav__link:hover {
  color: #ff595a !important;
}

/* Tables */
.md-typeset table:not([class]) th {
  background-color: #ff595a !important;
  color: white;
}

/* Buttons */
.md-button {
  background-color: #ff595a;
  border-color: #ff595a;
  color: white;
}

.md-button:hover {
  background-color: #ff7b7c;
}

/* Code blocks */
.md-typeset code {
  background-color: rgba(255, 89, 90, 0.1);
  color: #ff595a;
}

/* Admonitions */
.md-typeset .admonition.note {
  border-left-color: #ff595a;
}

.md-typeset .admonition {
  border-left: 0.4rem solid #ff595a;
}

/* Scrollbar */
::-webkit-scrollbar-thumb {
  background: #ff595a;
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background: #ff7b7c;
}

/* Logo - make white on colored background */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  max-height: 2rem;
  filter: brightness(0) invert(1);
}

/* Navigation tabs */
.md-tabs__link {
  color: rgba(255, 255, 255, 0.7);
}

.md-tabs__link--active {
  color: white;
  opacity: 1;
}

/* Search */
.md-search__input {
  background-color: rgba(255, 255, 255, 0.12);
}

.md-search__input:focus {
  background-color: white;
}
