.xlib-module-mask_documentation .level1 > li{
  border: 2px solid #cecece;
  margin-top: -2px;

}

.xlib-module-mask_documentation .level1 > li h3{
  font-size: 1.25rem;
  font-size: clamp(1.25rem, 1.1875rem + 0.3125vw, 1.5625rem);
  color: var(--bleu);
  font-weight: 700;
  padding: 15px;
  marign: 0;
  display: flex;
  align-items: center;
  gap: 15px;
  cursor: pointer;
}

.xlib-module-mask_documentation .level1 > li h3:hover{
  color: var(--rouge);
  background: #fafafa;
}

.xlib-module-mask_documentation .level1 > li h3 .toggle{
  position: relative;
}

.xlib-module-mask_documentation .level1 > li h3 .toggle::after,
.xlib-module-mask_documentation .level1 > li h3 .toggle::before{
  height: 3px;
  display: block;
  width: 24px;
  background: var(--bleu);
  content: '';
}

.xlib-module-mask_documentation .level1 > li h3:hover .toggle::after,
.xlib-module-mask_documentation .level1 > li h3:hover .toggle::before{
  background: var(--rouge);
}

.xlib-module-mask_documentation .level1 > li h3 .toggle::after{
  position: absolute;
  transform: rotate(90deg) translateX(-2px);
  transition: all .2s ease;
}

.xlib-module-mask_documentation .level1 > li.active h3 .toggle::after{
  opacity: 0;
  transform: rotate(0) translateX(0);
}


.xlib-module-mask_documentation .level2{
  border-top: 2px solid #cecece;
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  display: none;
}

.xlib-module-mask_documentation .active .level2{
  display: flex;
}

.xlib-module-mask_documentation .level2 li{
  list-style: disc inside none;
}

.xlib-module-mask_documentation .level2 a{
  color: var(--rouge);
  font-size: 1rem;
  font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
}
