.wp-block-responsive-block-editor-addons-table-of-contents {

	.responsive-block-editor-addons-toc__wrap {
		display: inline-block;
	}

	ul.responsive-block-editor-addons-toc__list {
		margin-top: 0;
		margin-left:2.2em;
		padding-left: 0px;
		margin-bottom:0;
		li {
			margin: 0;
			width: fit-content;
		}
	}

	ul li:empty {
		display: none;
	}

	.responsive-block-editor-addons_table-of-contents-placeholder {
		padding-left: 20px;
	}

	.responsive-block-editor-addons-toc__title-wrap {
		display: flex;
		align-items: center;
	}

	.responsive-block-editor-addons-toc__is-collapsible.responsive-block-editor-addons-toc__title-wrap {
		cursor: pointer;
	}

	.responsive-block-editor-addons-toc__collapsible-wrap svg {
		width: 20px;
		height: 20px;
	}

	.responsive-block-editor-addons-toc__collapsible-wrap {
		margin-left: 10px;
		display: flex;
		cursor: pointer;
	}

	&.responsive-block-editor-addons-toc__collapse .responsive-block-editor-addons-toc__list-wrap {
		display: none;
	}
}

.responsive-block-editor-addons-toc__list ul {
	list-style-type: circle;
}

.responsive-block-editor-addons-toc__scroll-top {

	&.dashicons {
		display: none;
		position: fixed;
		bottom: 50px;
		right: 50px;
		padding: 10px;
		background: #ccd0d4;
		cursor: pointer;
	}

	&.responsive-block-editor-addons-toc__show-scroll {
		display: inline-table;
	}
}

.responsive-block-editor-addons-toc__video-wrap {
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	position: absolute;
	overflow: hidden;
	z-index: -1;
	-webkit-transition: opacity 1s;
	-o-transition: opacity 1s;
	transition: opacity 1s;
  
	video {
	  width: 100%;
	  object-fit: cover;
	  height: 100%;
	}
}

.wp-block-responsive-block-editor-addons-table-of-contents {
	z-index: 1;
	position: relative;
}

ol.rbea-none {
	margin-top: 0;
	margin-bottom: 0!important;
    list-style: none!important; 
}

ol.rbea-lowercase {
	margin-top: 0;
	margin-bottom: 0!important;
    counter-reset: item;
    list-style-type: lower-alpha !important;
    > li {
      counter-increment: item;
      list-style-type: lower-alpha !important;
    }
    li{
      position: relative;
      &::before{
        content: counters(item,lower-alpha) ". ";
        position: absolute;
        right: calc(100% + 12px);
        word-break: initial;
	  }
	}
	ol.rbea-lowercase > li::before{
	  content: counters(item, lower-alpha) " ";
	  word-break: initial;
	}    
}

ol.rbea-uppercase {
	margin-top: 0;
	margin-bottom: 0!important;
    counter-reset: item;
    list-style-type: upper-alpha !important;
    > li {
      counter-increment: item;
      list-style-type: upper-alpha !important;
    }
    li{
      position: relative;
      &::before{
        content: counters(item, upper-alpha) ". ";
        position: absolute;
        right: calc(100% + 12px);
        word-break: initial;
	  }
	}
	ol.rbea-lowercase > li::before{
	  content: counters(item, upper-alpha) " ";
	  word-break: initial;
	}    
}

ol.rbea-number {
	margin-top: 0;
	margin-bottom: 0!important;
    counter-reset: item;
    list-style: none !important;
    > li {
      counter-increment: item;
      list-style-type: none;
    }
    li{
      position: relative;
      &::before{
        content: counters(item,'.') ". ";
        position: absolute;
        right: calc(100% + 12px);
        word-break: initial;
	  }
	}
	ol.rbea-number > li::before{
	  content: counters(item, '.') " ";
	  word-break: initial;
	}    
}

.responsive-block-editor-addons-toc__title-wrap {
	justify-content: space-between;
}

.responsive-block-editor-addons-toc__list-wrap .responsive-block-editor-addons-toc__list li {
	color: #10659C;
}

.responsive-block-editor-addons-toc__wrap p {
	margin-top: 0px;
	margin-bottom: 0px;
}

.responsive-block-editor-addons-alignment {
    max-height: 32px;
    height: 100%;
	margin-top: 8px;

    .components-toolbar {
      width: 100%;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      justify-items: center;
      min-height: 32px;
      max-height: 32px;
      height: 100%;
      border: 1px solid #C9C8C8;
      border-radius: 4px;
    
      > div {
        width: 100%;
        max-height: 32px;
        height: 100%;

        // First child styling
        &:first-child {
          border-right: 1px solid #C9C8C8;
        }
      
        // Last child styling
        &:last-child {
          border-left: 1px solid #C9C8C8;
        }
      
        .components-toolbar__control {
          width: 100%;
          max-height: 32px;
          height: 100%;
          &::before {
            width: 100%;
            left: 0px;
            right: 0px;
          }
        }
      
        .components-toolbar__control.is-pressed {
          &::before {
            background: #007CBA;
            width: 100%;
            left: 0px;
            right: 0px;
            max-height: 32px;
            height: 100%;
          }
        }
      }
    }
  }

.responsive-block-editor-addons-table-of-contents-select-heading-container {
	width: 100%;
	.components-base-control {
		width: 100%;
	}
}