/* Custom CSS for Onyx Ultrasonics Documentation */

/* Enhanced grid cards styling */
.md-typeset .grid.cards > * {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.md-typeset .grid.cards > *:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
}

/* Custom color accents */
:root {
  --md-primary-fg-color: #546e7a;
  --md-accent-fg-color: #ff6e40;
}

/* Enhanced buttons */
.md-button {
  transition: all 0.3s ease;
}

.md-button:hover {
  transform: scale(1.05);
}

/* Better spacing for content */
.md-typeset h1 {
  margin-top: 0;
  font-weight: 600;
}

/* Gradient effect for main heading - inspired by onyx stones */
.md-content h1:first-of-type {
  background: linear-gradient(90deg, #000000 0%, #3d2817 25%, #8b7355 40%, #f5f5f5 50%, #8b7355 60%, #3d2817 75%, #000000 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Dark mode adjustment for gradient */
[data-md-color-scheme="slate"] .md-content h1:first-of-type {
  background: linear-gradient(90deg, #ffffff 0%, #d4a574 25%, #8b7355 40%, #4a4a4a 50%, #8b7355 60%, #d4a574 75%, #ffffff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.md-typeset h2 {
  margin-top: 2rem;
  font-weight: 600;
}

/* Logo styling on homepage */
.md-typeset img[alt*="logo"] {
  max-width: 300px;
  margin: 2rem auto;
  display: block;
}

/* Logo with alpha channel looks great in both modes - no background needed! */

/* Header logo sizing - make it larger and more visible */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 2.5rem;
  width: auto;
}

.md-logo {
  padding: 0.2rem;
}

/* Improved admonition styling */
.md-typeset .admonition {
  border-left: 4px solid;
}

/* Enhanced code blocks */
.md-typeset code {
  font-size: 0.85em;
}

/* Better table styling */
.md-typeset table:not([class]) {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
}

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

/* Navigation enhancements */
.md-tabs {
  background-color: var(--md-primary-fg-color);
}

/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Print styles */
@media print {
  .md-header,
  .md-tabs,
  .md-footer {
    display: none;
  }
}