/* Add a custom transition when opening/closing. */
.wp-block-details {
	// transition: all 0.35s ease-in-out;
}

/* Add horizontal margin to nested blocks/elements. */
.wp-block-details > :where( :not( summary ) ),
.wp-block-details > :where( :not( summary ) ):last-child:last-child {
	margin: var(--wp--preset--spacing--40);
}


/* Base `summary` element styling. */
.wp-block-details summary {
	// transition: all 0.35s ease-in-out;
	box-sizing: border-box;
	padding: var(--wp--preset--spacing--40);
	font-weight: 500;
	background-color: var(--wp--preset--color--gray-3);
  transition: all .3s;
}

/* Change the background of the `summary` element based on state. */
.wp-block-details[open] summary,
.wp-block-details summary:hover,
.wp-block-details summary:focus {
	background-color: var(--wp--preset--color--gray-4);
}



.wp-block-details summary::marker {
	content: none;
}

// .wp-block-details summary::after {
// 	content: " +";
// 	float: right;
// 	text-align: right;
// }

// .wp-block-details[open] summary::after {
// 	content: " -"
// }

details summary {
  
  outline: none;
  display: block;

  padding-left: 2.2rem;
  position: relative;
  cursor: pointer;
}
details {
  
  box-sizing: border-box;
  margin-top: 5px;

}
details summary::-webkit-details-marker {
  display:none;
}
details[open] > summary:before {
  transform: rotate(-90deg);
}
summary:before {
  content: '';
  border-width: .4rem;
  border-style: solid;
  border-color: transparent transparent transparent rgb(33, 33, 33);
  position: absolute;
  top: 1.5rem;
  inset-inline-end: 1rem;
  transform: rotate(90deg);
  transform-origin: .2rem 50%;
  transition: .25s transform ease;
}



.content {
  border-top: none;
  border-top: none;
}