.accordion-header-wrapper {
  display: flex;
  flex: 1;
  min-width: 0;
}

.accordion-header-wrapper[data-header-direction='row'] {
  flex-direction: row;
  align-items: center;
  gap: var(--spacing-8);
}

.accordion-header-wrapper[data-header-direction='column'] {
  flex-direction: column;
  gap: var(--spacing-4);
}

.accordion-header-wrapper .accordion-title {
  font-family: var(--typography-font-sans);
  line-height: var(--line-height-small-22);
  color: var(--color-base);
  margin: 0;
  word-wrap: break-word;
  user-select: text;
}

.accordion-header-wrapper[data-title-font-size='var(--font-size-medium-16)'] .accordion-title {
  font-size: var(--font-size-medium-16);
}

.accordion-header-wrapper[data-title-font-weight='var(--font-weight-semi-bold)'] .accordion-title {
  font-weight: var(--font-weight-semi-bold);
}

.accordion-header-wrapper .accordion-description {
  font-size: var(--font-size-medium-16);
  line-height: var(--line-height-small-22);
  color: var(--color-subtle);
  font-weight: var(--font-weight-normal);
  user-select: text;
}

.accordion-expand-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--color-subtle);
}

.accordion-summary {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);
  cursor: var(--cursor-base-hover);
  list-style: none;
  user-select: none;
  position: relative;
  z-index: 1;
  outline: none !important;
  box-shadow: none !important;
}

.accordion-summary[data-separation='minimal'] {
  min-height: var(--min-size-interactive-pointer);
  padding: var(--spacing-4) var(--spacing-0);
}

.accordion-summary:not([data-separation='minimal']) {
  padding: var(--spacing-16);
}

.accordion-summary[data-separation='outline'] {
  border-radius: calc(var(--border-radius-base) - var(--border-width-base));
}

.accordion-summary::marker {
  display: none !important;
}

.accordion-summary::-webkit-details-marker {
  display: none !important;
}

.accordion-summary:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.accordion-summary:focus {
  outline: none !important;
  box-shadow: none !important;
}

.accordion-content {
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-medium-16);
  line-height: var(--line-height-small-22);
  color: var(--color-base);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-16);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  opacity: 1;
  transition: opacity var(--transition-duration-base) var(--transition-timing-function-system);
}

.accordion-content[data-separation='minimal'] {
  padding: var(--spacing-12) var(--spacing-0);
}

.accordion-content:not([data-separation='minimal']) {
  padding: var(--spacing-0) var(--spacing-16) var(--spacing-16);
}

.accordion-content-clip {
  display: block;
  min-width: 0;
  height: 0px;
  overflow: hidden;
  transition: height var(--transition-duration-medium) var(--transition-timing-function-system);
}

.accordion-content-clip > * {
  min-width: 0;
  min-height: 0;
}

.accordion-details[data-motion='enter-from'] > .accordion-content-clip {
  transition: none;
  height: 0px;
}

.accordion-details[data-motion='closing'] > .accordion-content-clip {
  height: 0px;
}

.accordion-details[data-open-finished='true'][data-motion='idle'] > .accordion-content-clip {
  height: auto;
}

.accordion-details[data-open-finished='true'][data-motion='idle'] > .accordion-content-clip {
  overflow: visible;
}

.accordion-details[data-open-finished='true'][data-motion='idle'] > .accordion-content-clip > .accordion-content {
  overflow: visible;
}

.accordion-details[data-motion='closing'] > .accordion-content-clip > .accordion-content, .accordion-details[data-motion='enter-from'] > .accordion-content-clip > .accordion-content {
  opacity: 0;
  pointer-events: none;
}

.accordion-view {
  display: block;
  position: relative;
}

.accordion-view[data-separation='outline'] {
  border: var(--border-width-base) solid var(--border-color-subtle);
  border-radius: var(--border-radius-base);
  padding: 0;
}

.accordion-view[data-separation='grouped'] {
  border: var(--border-width-base) solid var(--border-color-subtle);
  border-radius: 0;
  padding: 0;
}

.accordion-view[data-separation='grouped']:not(:first-child) {
  border-block-start: none;
}

.accordion-view[data-separation='grouped']:first-child {
  border-start-start-radius: var(--border-radius-base);
  border-start-end-radius: var(--border-radius-base);
}

.accordion-view[data-separation='grouped']:last-child {
  border-end-start-radius: var(--border-radius-base);
  border-end-end-radius: var(--border-radius-base);
}

.accordion-view[data-separation='grouped']:first-child > .accordion-details > .accordion-summary {
  border-start-start-radius: calc(var(--border-radius-base) - var(--border-width-base));
  border-start-end-radius: calc(var(--border-radius-base) - var(--border-width-base));
}

.accordion-view[data-separation='grouped']:last-child > .accordion-details:not([open]) > .accordion-summary {
  border-end-start-radius: calc(var(--border-radius-base) - var(--border-width-base));
  border-end-end-radius: calc(var(--border-radius-base) - var(--border-width-base));
}

.accordion-view[data-separation='grouped']:has(> .accordion-details > .accordion-summary:focus-visible)::after {
  content: "";
  position: absolute;
  inset: calc(-1 * var(--border-width-base));
  border: var(--border-width-base) solid var(--border-color-blue-focus);
  border-radius: var(--border-radius-base);
  outline: var(--border-width-base) solid var(--border-color-blue-focus);
  outline-offset: 0px;
  pointer-events: none;
}

.accordion-view:hover {
  z-index: var(--z-index-toolbar) !important;
}

.accordion-view:focus-within {
  z-index: var(--z-index-toolbar) !important;
}

.accordion-header-wrapper[data-title-font-weight='var(--font-weight-normal)'] .accordion-title {
  font-weight: var(--font-weight-normal);
}
