/* DocuBIM App Official "Industry" Palette for MkDocs Material */

:root {
  /* Exact App Tokens from services/frontend/src/index.css */
  --color-bg: #f2f2f3;
  --color-surface: #ffffff;
  --color-inset: #e9e9ea;
  --color-text: #1d1f20;

  --color-neutral-100: #f5f5f8;
  --color-neutral-200: #e7e7ea;
  --color-neutral-300: #d4d4d7;
  --color-neutral-400: #b7b7ba;
  --color-neutral-500: #98989b;
  --color-neutral-600: #7a7a7d;
  --color-neutral-700: #5d5d60;
  --color-neutral-800: #424244;
  --color-neutral-900: #2b2b2d;

  --color-accent-100: #eef6ff;
  --color-accent-600: #597ea3;
  --color-accent-700: #416180;
  --color-accent-800: #2c455d;

  --text-strong: #1d1f20;
  --text-muted: #424244;
  --text-faint: #5d5d60;
  --text-accent: #2c455d;

  /* MkDocs Material Variable Overrides - Light Theme */
  --md-primary-fg-color: #ffffff;               /* Pure white header like AppShell */
  --md-primary-fg-color--dark: #2b2b2d;
  --md-primary-bg-color: #1d1f20;
  --md-accent-fg-color: #2c455d;

  --md-typeset-color: #1d1f20;
  --md-typeset-a-color: #2c455d;

  --md-default-fg-color: #1d1f20;
  --md-default-fg-color--light: #424244;
  --md-default-fg-color--lighter: #5d5d60;
  --md-default-fg-color--lightest: #7a7a7d;

  --md-default-bg-color: #f2f2f3;
  --md-default-bg-color--light: #ffffff;
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #2b2b2d;
  --md-primary-fg-color--dark: #1d1f20;
  --md-primary-bg-color: #ffffff;
  --md-accent-fg-color: #94bce3;

  --md-typeset-color: #f5f5f8;
  --md-typeset-a-color: #94bce3;

  --md-default-fg-color: #f5f5f8;
  --md-default-fg-color--light: #d4d4d7;
  --md-default-fg-color--lighter: #b7b7ba;
  --md-default-fg-color--lightest: #7a7a7d;

  --md-default-bg-color: #1d1f20;
  --md-default-bg-color--light: #2b2b2d;
}

/* Header & Navbar - Replicating AppShell.tsx */
.md-header {
  background-color: #ffffff !important;
  color: #1d1f20 !important;
  border-bottom: 1px solid #d4d4d7 !important;
  box-shadow: none !important;
}

.md-header__title, .md-header__button {
  color: #1d1f20 !important;
  font-weight: 600 !important;
}

.md-header__button svg {
  fill: #1d1f20 !important;
}

/* Search Box in White Header */
.md-search__input {
  background-color: #f2f2f3 !important;
  color: #1d1f20 !important;
  border: 1px solid #d4d4d7 !important;
  border-radius: 0px !important;
}

.md-search__input::placeholder {
  color: #7a7a7d !important;
}

/* Navigation Tabs Bar (under header) */
.md-tabs {
  background-color: #f5f5f8 !important;
  border-bottom: 1px solid #d4d4d7 !important;
}

.md-tabs__link {
  color: #424244 !important;
  font-weight: 600 !important;
}

.md-tabs__link--active, .md-tabs__link:hover {
  color: #2c455d !important;
  border-bottom: 2px solid #2c455d !important;
}

/* Dark Mode Header Overrides */
[data-md-color-scheme="slate"] .md-header {
  background-color: #2b2b2d !important;
  color: #f5f5f8 !important;
  border-bottom: 1px solid #424244 !important;
}

[data-md-color-scheme="slate"] .md-header__title, 
[data-md-color-scheme="slate"] .md-header__button {
  color: #f5f5f8 !important;
}

[data-md-color-scheme="slate"] .md-header__button svg {
  fill: #f5f5f8 !important;
}

[data-md-color-scheme="slate"] .md-search__input {
  background-color: #1d1f20 !important;
  color: #f5f5f8 !important;
  border-color: #424244 !important;
}

[data-md-color-scheme="slate"] .md-tabs {
  background-color: #1d1f20 !important;
  border-bottom: 1px solid #424244 !important;
}

[data-md-color-scheme="slate"] .md-tabs__link {
  color: #d4d4d7 !important;
}

[data-md-color-scheme="slate"] .md-tabs__link--active, 
[data-md-color-scheme="slate"] .md-tabs__link:hover {
  color: #94bce3 !important;
  border-bottom: 2px solid #94bce3 !important;
}

/* Sidebar Navigation Text Legibility */
.md-nav__link {
  color: #424244 !important;
  font-weight: 500 !important;
}

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

.md-nav__link--active {
  color: #2c455d !important;
  font-weight: 700 !important;
}

[data-md-color-scheme="slate"] .md-nav__link {
  color: #d4d4d7 !important;
}

[data-md-color-scheme="slate"] .md-nav__link:hover,
[data-md-color-scheme="slate"] .md-nav__link--active {
  color: #94bce3 !important;
}

/* App-styled cards */
.md-typeset .grid.cards > ol > li, .md-typeset .grid.cards > ul > li {
  border-radius: 0px !important;
  border: 1px solid #d4d4d7 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  padding: 1.25rem !important;
}

[data-md-color-scheme="slate"] .md-typeset .grid.cards > ol > li,
[data-md-color-scheme="slate"] .md-typeset .grid.cards > ul > li {
  border-color: #424244 !important;
  background: #2b2b2d !important;
}

.md-typeset .grid.cards > ol > li:hover, .md-typeset .grid.cards > ul > li:hover {
  border-color: #2c455d !important;
}

[data-md-color-scheme="slate"] .md-typeset .grid.cards > ol > li:hover,
[data-md-color-scheme="slate"] .md-typeset .grid.cards > ul > li:hover {
  border-color: #94bce3 !important;
}
