/* extra.css - EPMware brand styling, shared by every guide */

/* Brand palette (palette primary/accent are "custom" in mkdocs.yml) */
:root > * {
  --md-primary-fg-color: #233044;
  --md-primary-fg-color--light: #3a4a62;
  --md-primary-fg-color--dark: #1a2433;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.7);
  --md-accent-fg-color: #0055a3;
  --md-accent-fg-color--transparent: rgba(0, 85, 163, 0.1);
  --md-accent-bg-color: #ffffff;
  --md-typeset-a-color: #0055a3;
  --md-footer-bg-color: #1a2433;
  --md-footer-bg-color--dark: #141c28;
  --epmware-navy: #233044;
  --epmware-blue: #0055a3;
  --epmware-gray: #6a747c;
}

/* Dark mode: lighter blue so links and accents keep contrast */
[data-md-color-scheme="slate"] {
  --md-accent-fg-color: #5aa5e8;
  --md-accent-fg-color--transparent: rgba(90, 165, 232, 0.1);
  --md-typeset-a-color: #5aa5e8;
  --epmware-blue: #5aa5e8;
}

/* Header logo: the wordmark is wide, keep it compact */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 1.1rem;
  width: auto;
}

/* Announcement bar */
.md-banner {
  background-color: var(--epmware-blue);
}
[data-md-color-scheme="slate"] .md-banner {
  background-color: #0b3b6b;
}

/* Guide cards on the home page */
.md-typeset .grid.cards > ul > li,
.md-typeset .grid > .card {
  border-radius: 8px;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}
.md-typeset .grid.cards > ul > li:hover,
.md-typeset .grid > .card:hover {
  border-color: var(--epmware-blue);
  box-shadow: 0 6px 16px rgba(0, 85, 163, 0.12);
  transform: translateY(-2px);
}
.md-typeset .grid.cards .lg {
  color: var(--epmware-blue);
}

/* Icons inside buttons stay at text size */
.md-typeset .md-button .twemoji {
  font-size: inherit;
}
[data-md-color-scheme="slate"] .md-typeset .md-button--primary {
  background-color: #0055a3;
  border-color: #0055a3;
}

/* Search result highlight */
.md-search-result mark {
  background-color: var(--md-accent-fg-color--transparent);
  color: inherit;
}

/* Guide label on search results (added by extra.js) */
.md-search-result .epm-guide-tag {
  display: inline-block;
  margin: 0.2rem 0 0.1rem;
  padding: 0 0.4rem;
  border-radius: 0.2rem;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--epmware-blue);
  background-color: var(--md-accent-fg-color--transparent);
}