/* td-gcp Documentation — Custom Theme
 * Matched to the Firebase Console dark UI
 *
 * Key Firebase/GCP brand colors:
 *   Firebase amber:  #FFCA28
 *   Firebase orange: #FF9100
 *   Google Blue:     #4285F4 / #669DF6 (lighter for dark bg)
 *   Console bg:      #1e1e2e (deep navy-purple)
 *   Console sidebar: #292a3e
 *   Console surface: #27283b
 */

/* ============================================
 * Light scheme overrides
 * ============================================ */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #1b1b2f;
  --md-primary-fg-color--light: #2d2d4a;
  --md-primary-fg-color--dark: #141425;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: #f5f5f8;
  --md-accent-fg-color: #ff9100;
  --md-accent-fg-color--transparent: #ff91001a;
  --md-typeset-a-color: #4285f4;
}

/* ============================================
 * Dark scheme — Firebase Console palette
 * ============================================ */
[data-md-color-scheme="slate"] {
  /* Background: Console's deep navy-purple */
  --md-default-bg-color: #1e1e2e;
  --md-default-bg-color--light: #25253a;
  --md-default-bg-color--lighter: #2d2d4a;
  --md-default-bg-color--lightest: #3a3a55;

  /* Text: Console's warm gray-white */
  --md-default-fg-color: #e0e0e6;
  --md-default-fg-color--light: #a8a8b8;
  --md-default-fg-color--lighter: #70708a;
  --md-default-fg-color--lightest: #45455e;

  /* Header/nav: darker than content */
  --md-primary-fg-color: #1b1b2f;
  --md-primary-fg-color--light: #292a3e;
  --md-primary-fg-color--dark: #141425;
  --md-primary-bg-color: #e0e0e6;
  --md-primary-bg-color--light: #c0c0d0;

  /* Accent: Firebase amber/orange */
  --md-accent-fg-color: #ffca28;
  --md-accent-fg-color--transparent: #ffca281a;

  /* Links: Google blue (lighter variant for readability) */
  --md-typeset-a-color: #669df6;

  /* Code blocks: slightly darker than content bg */
  --md-code-bg-color: #181828;
  --md-code-fg-color: #e0e0e6;

  /* Footer */
  --md-footer-bg-color: #181828;
  --md-footer-bg-color--dark: #141425;
}

/* ============================================
 * Header & navigation
 * ============================================ */

/* Header bar — deep console nav color */
.md-header {
  background-color: var(--md-primary-fg-color);
}

/* Navigation tabs — console sidebar tone */
.md-tabs {
  background-color: var(--md-primary-fg-color--light);
}

/* Active tab indicator — Firebase orange underline */
[data-md-color-scheme="slate"] .md-tabs__link--active,
[data-md-color-scheme="slate"] .md-tabs__link:hover {
  color: #ffca28;
}

/* Tags */
[data-md-color-scheme="slate"] .md-tag {
  background-color: #2d2d4a;
}

/* ============================================
 * Links
 * ============================================ */

/* Content links — Google blue */
[data-md-color-scheme="slate"] .md-typeset a {
  color: #669df6;
}

[data-md-color-scheme="slate"] .md-typeset a:hover {
  color: #8ab4f8;
}

/* Nav/sidebar links */
[data-md-color-scheme="slate"] .md-nav__link {
  color: var(--md-default-fg-color--light);
}

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

/* ============================================
 * Search
 * ============================================ */
[data-md-color-scheme="slate"] .md-search__input {
  background-color: #292a3e;
}

/* ============================================
 * Icon alignment
 * ============================================ */
.md-typeset .twemoji svg,
.md-typeset .emojione svg {
  vertical-align: -0.15em;
}

/* ============================================
 * Admonitions — Google brand colors
 * ============================================ */
[data-md-color-scheme="slate"] .md-typeset .admonition.note,
[data-md-color-scheme="slate"] .md-typeset details.note {
  border-color: #4285f4;
}

[data-md-color-scheme="slate"] .md-typeset .admonition.tip,
[data-md-color-scheme="slate"] .md-typeset details.tip {
  border-color: #34a853;
}

[data-md-color-scheme="slate"] .md-typeset .admonition.warning,
[data-md-color-scheme="slate"] .md-typeset details.warning {
  border-color: #fbbc04;
}

[data-md-color-scheme="slate"] .md-typeset .admonition.danger,
[data-md-color-scheme="slate"] .md-typeset details.danger {
  border-color: #ea4335;
}

/* ============================================
 * Tables — subtle console styling
 * ============================================ */
[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background-color: #292a3e;
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) tr:hover td {
  background-color: #25253a;
}