/* Base disclosure styles */
.disclosure {
  @apply relative;
}

.accordion__heading {
  @apply flex;
}

.disclosure__trigger {
  cursor: var(--cursor-interactive);
  @apply inline-block no-highlight;

  /* Focus state */
  &:focus-visible:not(:focus),
  &[data-focus-visible="true"] {
    @apply status-focused;
  }

  /* Disabled state */
  &:disabled,
  &[aria-disabled="true"] {
    @apply status-disabled;
  }
}

.disclosure__indicator {
  @apply ml-auto size-4 shrink-0 text-inherit;

  /**
   * Transitions
   */
  @apply transition duration-250 motion-reduce:transition-none;

  /* Expanded state for indicator rotation */
  &[data-expanded="true"] {
    @apply -rotate-180;
  }
}

.disclosure__content {
  opacity: 0;
  height: var(--disclosure-panel-height);
  overflow: clip;

  /**
   * Transitions
   * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
   */
  transition:
    height 200ms var(--ease-out-quad),
    opacity 200ms var(--ease-out);
  @apply motion-reduce:transition-none;

  &[data-expanded="true"] {
    will-change: height, opacity;
    opacity: 1;
  }
}

.disclosure__body {
  @apply p-2;
}