/* =========================================================================
   WinLogKit docs — spydi theme (steel blue + signal teal)
   Structure adapted from Yamato Security's WELA docs stylesheet (MIT).
   ========================================================================= */

/* ---- Custom primary / accent palette (theme.palette primary: custom) ---- */
[data-md-color-primary="custom"] {
  --md-primary-fg-color:        #1b3a4b;
  --md-primary-fg-color--light: #2c5a73;
  --md-primary-fg-color--dark:  #102530;
  --md-primary-bg-color:        #ffffff;
  --md-primary-bg-color--light: #ffffffb3;
}

[data-md-color-accent="custom"] {
  /* #0f766e keeps >= 4.5:1 contrast with white button text on hover/focus */
  --md-accent-fg-color:             #0f766e;
  --md-accent-fg-color--transparent:#0f766e1a;
  --md-accent-bg-color:             #ffffff;
  --md-accent-bg-color--light:      #ffffffb3;
}

/* Light scheme: calm blue links */
[data-md-color-scheme="default"] {
  --md-typeset-a-color: #16688f;
}

/* Dark scheme: lift header and links for contrast */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #132b38;
  --md-typeset-a-color:  #5ec8e5;
  --md-accent-fg-color:  #2dd4bf;
}

/* ---- Top tabs: main topics read as primary navigation ---- */
.md-tabs__link {
  font-weight: 600;
  opacity: 0.92;
}
.md-tabs__link--active {
  opacity: 1;
}

/* Subtle header gradient */
.md-header {
  background: linear-gradient(90deg, var(--md-primary-fg-color--dark), var(--md-primary-fg-color));
}
.md-tabs {
  background: var(--md-primary-fg-color);
}

/* Wider content column for the dense baseline/coverage tables */
.md-grid {
  max-width: 68rem;
}

/* =========================================================================
   Landing-page hero
   ========================================================================= */
.sp-hero {
  text-align: center;
  padding: 2.2rem 0 1rem;
}
.sp-hero h1 {
  margin-bottom: 0.6rem;
}
.sp-hero .sp-tagline {
  font-size: 1.12rem;
  line-height: 1.6;
  max-width: 44rem;
  margin: 0 auto 1.3rem;
  color: var(--md-default-fg-color--light);
}
.sp-badges {
  margin: 0.3rem 0 1.3rem;
}
.sp-badges img {
  margin: 2px;
  vertical-align: middle;
}
.sp-cta {
  display: flex;
  gap: 0.6rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.sp-cta .md-button {
  margin: 0.2rem;
}
.sp-hook {
  max-width: 44rem;
  margin: 0 auto;
  color: var(--md-default-fg-color--light);
  font-size: 0.95rem;
}

/* =========================================================================
   Grid cards (feature highlights)
   ========================================================================= */
.md-typeset .grid.cards > ul > li {
  border-radius: 0.5rem;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}
.md-typeset .grid.cards > ul > li:hover {
  border-color: var(--md-accent-fg-color);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10);
  transform: translateY(-2px);
}
.md-typeset .grid.cards .lg.middle {
  color: var(--md-accent-fg-color);
}

/* =========================================================================
   Misc readability
   ========================================================================= */
/* Diagrams and screenshots sit calmly on both grounds */
.md-typeset figure {
  margin: 1.2rem auto;
}
.md-typeset figcaption {
  color: var(--md-default-fg-color--light);
  font-size: 0.8rem;
}

/* Wide tables use the full column instead of overflowing oddly */
.md-typeset table:not([class]) {
  display: table;
  width: 100%;
}

.md-typeset code {
  border-radius: 4px;
}