/**
 * Marked Extended Accordion - Structural Styles
 * Minimal CSS required for accordion functionality
 *
 * Import this file if you want the basic accordion structure:
 * @import '@fsegurai/marked-extended-accordion/styles/accordion.css';
 */

:root {
  --marked-extended-accordion-animation-duration: 0.3s;
  --marked-extended-accordion-transition-timing: ease-in-out;
  --marked-extended-accordion-animation-easing: ease;
  --marked-extended-accordion-fade-distance: -10px;
}

.marked-extended-accordion {
  overflow: hidden;
}

.marked-extended-accordion .marked-extended-accordion-content {
  transition: opacity var(--marked-extended-accordion-animation-duration, 0.3s)
    var(--marked-extended-accordion-transition-timing, ease-in-out);
  width: 100%;
  box-sizing: border-box;
  animation: accordion-fade var(--marked-extended-accordion-animation-duration, 0.3s)
    var(--marked-extended-accordion-animation-easing, ease);
  overflow: visible;
}

@keyframes accordion-fade {
  from {
    opacity: 0;
    transform: translateY(var(--marked-extended-accordion-fade-distance, -10px));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .marked-extended-accordion .marked-extended-accordion-content {
    transition: none;
    animation: none;
  }
}