/* Style the summary element */
details summary {
    cursor: pointer;
    font-weight: bold;
    background-color: #F6F8FA;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    margin: 10px 0;
    list-style: none;
    position: relative;
  }
  
  /* Style the content inside the details element */
  
  details summary::after {
    content: '+';
    font-weight: 700;
    display: inline-block;
    position: absolute;
    right: 10px;
    margin-top: -7.5px;
    font-size: 1.5rem;
  
  }
  
  details[open] summary::after {
    rotate: 45deg;
    right: 7.5px;
  }