/* Accordion
----------------------------------------------------------------- */

.wp-block-acf-accordion {

  .block-accordion {
    cursor: pointer;
    padding: 1em 0em;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    transition: 0.15s;
    margin-top: 0.75em;
    position: relative;
    border-top: 1px solid var(--wp--preset--color--primary);


    h5 {
      margin: 0px;
      font-weight: 600;
      padding-right: 15%;
      font-family: var(--wp--preset--font-family--paragraph);
    }

    .block-accordion-indicator {
      width: 0.8em;
      height: 0.8em;
      border-width: 0;
      border-bottom-width: 0.2em;
      border-bottom-style: solid;
      border-left-width: 0.2em;
      border-left-style: solid;
      transform: rotate(-45deg);
      transition: 0.15s ease;
      position: absolute;
      top: 29%;
      right: 1.25em;
      border-color: var(--wp--preset--color--primary);
    }

    &.block-accordion-active .block-accordion-indicator {
      transform: rotate(135deg);
      top: 38%;
    }
  }

  .block-accordion-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.15s ease-out;
    margin-bottom: 0.5em;
    color: initial;
    background: none;
    width: 100%;

    .acf-innerblocks-container {
      padding: 0em;


      > :first-child {
        margin-top: 0em;
      }

      > :last-child {
        margin-bottom: 1em;
      }
    }
  }



    &.has-background .block-accordion {
      background: inherit;
    }

    &.has-text-color h5 {
      color: inherit;
    }

  }


  /* WP Editor Styles */
  .editor-styles-wrapper .block-accordion-panel {
    max-height: unset;
    position: relative;
  }

  .editor-styles-wrapper .block-accordion-panel .acf-innerblocks-container,
  .editor-styles-wrapper .block-accordion-panel .acf-innerblocks-container .wp-block-group.has-background {
    position: unset;
  }


  /* Next Block..
----------------------------------------------------------------- */

  /* WP Editor Styles */
  .editor-styles-wrapper {}


  /* MOBILE
--------------------------------------------- */

  @media only screen and (max-width: 1024px) {}

  @media only screen and (max-width: 768px) {}

  @media only screen and (max-width: 500px) {

    /* Accordion
----------------------------------------------------------------- */
    .block-accordion {
      padding: 0.5em 1em;
    }

  }