/* Custom styles for Parapet Security docs */

/* Brand colors - Cyan theme matching dashboard */
:root {
  --md-primary-fg-color: #0891b2;        /* Cyan-600 */
  --md-primary-fg-color--light: #22d3ee;  /* Cyan-400 */
  --md-primary-fg-color--dark: #0e7490;   /* Cyan-700 */
  --md-accent-fg-color: #0891b2;
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #22d3ee;        /* Cyan-400 for dark mode */
  --md-primary-fg-color--light: #67e8f9;  /* Cyan-300 */
  --md-primary-fg-color--dark: #0891b2;   /* Cyan-600 */
}

/* Custom admonition for security tips */
.md-typeset .admonition.security,
.md-typeset details.security {
  border-color: #059669;
}
.md-typeset .security > .admonition-title,
.md-typeset .security > summary {
  background-color: rgba(5, 150, 105, 0.1);
}
.md-typeset .security > .admonition-title::before,
.md-typeset .security > summary::before {
  background-color: #059669;
  -webkit-mask-image: var(--md-admonition-icon--tip);
  mask-image: var(--md-admonition-icon--tip);
}

/* Slightly larger body text for readability */
.md-typeset {
  font-size: 0.85rem;
  line-height: 1.7;
}

/* Code block styling */
.md-typeset code {
  font-size: 0.8rem;
}

/* Footer styling */
.md-footer-meta {
  background-color: var(--md-primary-fg-color--dark);
}

/* Card grid styling for home page */
.md-typeset .grid.cards > ul > li {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.5rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.md-typeset .grid.cards > ul > li:hover {
  border-color: var(--md-primary-fg-color);
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
}