/* pytest-gremlins Custom Styles
 * Gremlin-themed documentation styling
 * https://github.com/mikelane/pytest-gremlins
 */

/* ============================================
   CSS Variables - Gremlin Theme
   ============================================ */
:root {
  --gremlin-green: #2e7d32;
  --gremlin-green-dark: #1b5e20;
}

/* ============================================
   Typography Enhancements
   ============================================ */

/* Improve code readability */
.md-typeset code {
  font-size: 0.85em;
  padding: 0.1em 0.3em;
  border-radius: 0.2em;
}

/* Inline code styling */
.md-typeset :not(pre) > code {
  background-color: var(--md-code-bg-color);
  border: 1px solid var(--md-default-fg-color--lightest);
}

/* Code block titles */
.md-typeset .highlight > .filename {
  background-color: var(--gremlin-green-dark);
  color: white;
  font-weight: 600;
}

/* ============================================
   Navigation Enhancements
   ============================================ */

/* Sticky tabs styling */
.md-tabs {
  background-color: var(--gremlin-green-dark);
}

.md-tabs__link {
  opacity: 0.8;
}

.md-tabs__link--active,
.md-tabs__link:hover {
  opacity: 1;
}

/* Navigation sections */
.md-nav__title {
  font-weight: 600;
}

/* Current page indicator */
.md-nav__link--active {
  font-weight: 600;
}

/* ============================================
   Code Annotations
   ============================================ */

/* Make annotations more visible */
.md-typeset .md-annotation__index {
  background-color: var(--gremlin-green);
}

.md-typeset .md-annotation__index:hover {
  background-color: var(--gremlin-green-dark);
}

/* Annotation tooltip */
.md-typeset .md-annotation__content {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* ============================================
   Tables
   ============================================ */

/* Sortable table header indicator */
.md-typeset table:not([class]) th[data-sort] {
  cursor: pointer;
}

.md-typeset table:not([class]) th[data-sort]:hover {
  background-color: var(--md-default-fg-color--lightest);
}

/* Striped table rows */
.md-typeset table:not([class]) tbody tr:nth-child(even) {
  background-color: var(--md-default-fg-color--lightest);
}

/* Table cell padding */
.md-typeset table:not([class]) td,
.md-typeset table:not([class]) th {
  padding: 0.75em 1em;
}

/* ============================================
   Mobile Responsiveness
   ============================================ */

@media screen and (max-width: 76.25em) {
  /* Adjust navigation for tablets */
  .md-nav__title {
    font-size: 0.9rem;
  }
}

@media screen and (max-width: 60em) {
  /* Mobile adjustments */
  .md-typeset table:not([class]) {
    font-size: 0.85rem;
  }

  .md-typeset table:not([class]) td,
  .md-typeset table:not([class]) th {
    padding: 0.5em;
  }
}

/* ============================================
   Print Styles
   ============================================ */

@media print {
  /* Hide navigation and search for print */
  .md-header,
  .md-tabs,
  .md-sidebar,
  .md-footer {
    display: none !important;
  }

  /* Full width content */
  .md-content {
    margin: 0 !important;
  }

  /* Ensure code blocks don't break poorly */
  .md-typeset pre {
    white-space: pre-wrap;
    word-wrap: break-word;
  }

  /* Page breaks */
  .md-typeset h1,
  .md-typeset h2 {
    page-break-after: avoid;
  }

  .md-typeset pre,
  .md-typeset table {
    page-break-inside: avoid;
  }
}

/* ============================================
   Accessibility Enhancements
   ============================================ */

/* Focus indicators */
.md-typeset a:focus,
.md-nav__link:focus,
.md-tabs__link:focus {
  outline: 2px solid var(--gremlin-green);
  outline-offset: 2px;
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  .md-typeset .admonition {
    border-width: 2px;
  }

  .md-typeset code {
    border-width: 2px;
  }
}