.cc-acdc {
  display: grid;
  grid-template-rows: 0fr;
  transition:
    grid-template-rows var(--cc-accordion-transition, 0.5s) ease,
    opacity calc(var(--cc-accordion-transition, 0.5s) * 0.7) ease,
    transform var(--cc-accordion-transition, 0.5s) ease,
    padding calc(var(--cc-accordion-transition, 0.5s) * 0.7) ease,
    margin calc(var(--cc-accordion-transition, 0.5s) * 0.7) ease;
  opacity: 0;
  transform: translateY(8px);
  transform-origin: bottom center;
  padding-block: 0;
  margin-block: 0;
  border-top: 0;
  border-bottom: 0;
}

.cc-acdc > * {
  overflow: hidden;
}

.cc-acdc.showing {
  grid-template-rows: 1fr;
  opacity: 1;
  transform: translateY(0);
  padding-block: 12px;
  display: grid !important;
}

.cc-accordion-hidden .cc-acdc.showing {
  display: grid !important;
  grid-template-rows: 1fr !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
  padding-block: 12px !important;
}

[data-cc-accordion-header="true"] {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
  width: 100%;
}

[data-cc-accordion-header="true"] .cc-icn {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  transition:
    opacity 0.25s ease,
    transform 0.25s ease;
  position: static;
}

[data-cc-accordion-header="true"] .cc-icn svg {
  width: 100%;
  height: 100%;
  display: block;
}

[data-cc-accordion-header="true"] h3,
[data-cc-accordion-header="true"] h4 {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
}

[data-cc-accordion-header="true"] .cc-icn.positive-line svg {
  transform: rotate(90deg);
  transform-origin: center;
}

@supports (selector(:has(*))) {
  [data-cc-accordion-header="true"]:has(.positive-line) {
    position: relative;
    padding-inline-start: 28px;
  }
  [data-cc-accordion-header="true"]:has(.positive-line) .cc-icn {
    position: absolute;
    inset-inline-start: 0;
    top: 50%;
    transform: translateY(-50%);
  }
  [data-cc-accordion-header="true"]:has(.positive-line)
    .cc-icn.positive-line
    svg {
    transform: rotate(90deg);
  }
}

[data-cc-accordion-header="true"][aria-expanded="false"] .cc-icn:first-of-type {
  opacity: 1;
  transform: none;
}
[data-cc-accordion-header="true"][aria-expanded="false"] .cc-icn.positive-line {
  opacity: 1;
  transform: none;
}
[data-cc-accordion-header="true"][aria-expanded="true"] .cc-icn:first-of-type {
  opacity: 1;
  transform: none;
}
[data-cc-accordion-header="true"][aria-expanded="true"] .cc-icn.positive-line {
  opacity: 0;
  transform: scaleY(0.6);
}

[data-cc-accordion-header="true"] .cc-icn.plus {
  display: inline-flex;
  position: static !important;
}
[data-cc-accordion-header="true"] .cc-icn.minus {
  display: none;
  position: static !important;
}
[data-cc-accordion-header="true"][aria-expanded="true"] .cc-icn.plus {
  display: none;
}
[data-cc-accordion-header="true"][aria-expanded="true"] .cc-icn.minus {
  display: inline-flex;
}

@media (prefers-reduced-motion: reduce) {
  .cc-acdc {
    transition: none !important;
    transform: none !important;
  }
  [data-cc-accordion-header="true"] .cc-icn {
    transition: none !important;
  }
}

@supports (selector(:has(*))) {
  [data-cc-accordion-header="true"]:has(.positive-line) {
    display: flex;
    align-items: center;
    padding-inline-start: 32px;
    min-block-size: 32px;
  }

  [data-cc-accordion-header="true"]:has(.positive-line) .cc-icn {
    position: absolute;
    inset-inline-start: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
  }

  [data-cc-accordion-header="true"]:has(.positive-line) h3,
  [data-cc-accordion-header="true"]:has(.positive-line) h4 {
    margin: 0;
    line-height: 1.2;
    flex: 1 1 auto;
    min-width: 0;
    transform: translateY(12px);
  }

  [data-cc-accordion-header="true"]:has(.positive-line)
    .cc-icn.positive-line
    svg {
    transform: rotate(90deg) translateY(1px);
    transform-origin: center;
  }
}