.fi-sidebar {
    z-index: 1002 !important;
}
.fi-topbar,
.fi-sidebar-close-overlay {
    z-index: 1001 !important;
}
.fi-no {
  z-index: 1021 !important;
}
.opt {
    font-style: normal;
}
select:required:invalid {
    color: gray;
    font-style: italic;
}
option[value=""][disabled] {
    display: none;
}
.info-icon {
    display: inline;
    vertical-align: bottom;
}
span:has(.info-icon) {
    margin-left: -10px;
    margin-right: 10px;
}


/* Multiswitch START HERE*/

.multiswitch input {
    position: absolute;
    left: -200vw;
  }
  
  .multiswitch .slide-container {
    position: relative;
    display: flex;
    max-width: 50em;
    line-height: 2em;
    /* don't allow highlighting the text inside the toggle */
    user-select: none; 
  }
  
  .multiswitch .slide-container label {
    /* Even though we're using "flex" to display, we have to assign widths so that we know exactly where to position the slide */
    width: 50%;
    text-align: center;
    padding-left: 1em;
    padding-right: 1em;
    z-index: 2;
  }
  
  .multiswitch .slide-container a {
    position: absolute;
    left: 50%;
    z-index: 1;
    height: 100%;
    width: 50%;
    transition: left 0.1s ease-out;
  }
  
  /*
    Auto adjusting widths
  */
  
  .multiswitch label:nth-last-child(8),
  .multiswitch label:nth-last-child(8) ~ label,
  .multiswitch label:nth-last-child(8) ~ a {
    width: 25%;
  }
  
  /*
   Slider
  */
  
  /* all options, first selected */
  .multiswitch input:checked ~ a {
    left: 0;
  }
  /* 4 options, 2nd selected */
  .multiswitch label:nth-last-child(8) ~ input:nth-child(3):checked ~ a {
    left: 25%;
  }
  /* 4 options, 3rd selected */
  .multiswitch label:nth-last-child(8) ~ input:nth-child(5):checked ~ a {
    left: 50%;
  }
  /* 4 options, 4th selected */
  .multiswitch label:nth-last-child(8) ~ input:nth-child(7):checked ~ a {
    left: 75%;
  }
  .multiswitch .slide-container label {
    cursor: pointer;
  }
  
  .multiswitch .slide-container a {
    background: #fafafa;
    border-color: #d4d4d4;
    border-style: solid;
    border-width: 1px;
  }
  
  .dark .multiswitch .slide-container a {
    background: #404040;
    border-color: #ffffff1a;
  }

 .mirror {
    --tw-scale-x: -1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}