@charset "UTF-8";

@font-face {
  font-family: 'Poppins';

  font-style: normal;

  font-weight: 100;

  src: url('../fonts/Poppins/Poppins-Thin.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: normal;

  font-weight: 200;

  src: url('../fonts/Poppins/Poppins-ExtraLight.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: normal;

  font-weight: 300;

  src: url('../fonts/Poppins/Poppins-Light.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: normal;

  font-weight: 400;

  src: url('../fonts/Poppins/Poppins-Regular.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: normal;

  font-weight: 500;

  src: url('../fonts/Poppins/Poppins-Medium.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: normal;

  font-weight: 600;

  src: url('../fonts/Poppins/Poppins-SemiBold.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: normal;

  font-weight: 700;

  src: url('../fonts/Poppins/Poppins-Bold.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: normal;

  font-weight: 800;

  src: url('../fonts/Poppins/Poppins-ExtraBold.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: normal;

  font-weight: 900;

  src: url('../fonts/Poppins/Poppins-Black.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: italic;

  font-weight: 100;

  src: url('../fonts/Poppins/Poppins-ThinItalic.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: italic;

  font-weight: 200;

  src: url('../fonts/Poppins/Poppins-ExtraLightItalic.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: italic;

  font-weight: 300;

  src: url('../fonts/Poppins/Poppins-LightItalic.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: italic;

  font-weight: 400;

  src: url('../fonts/Poppins/Poppins-Italic.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: italic;

  font-weight: 500;

  src: url('../fonts/Poppins/Poppins-MediumItalic.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: italic;

  font-weight: 600;

  src: url('../fonts/Poppins/Poppins-SemiBoldItalic.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: italic;

  font-weight: 700;

  src: url('../fonts/Poppins/Poppins-BoldItalic.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: italic;

  font-weight: 800;

  src: url('../fonts/Poppins/Poppins-ExtraBoldItalic.woff') format('woff');
}

@font-face {
  font-family: 'Poppins';

  font-style: italic;

  font-weight: 900;

  src: url('../fonts/Poppins/Poppins-BlackItalic.woff') format('woff');
}

:root {
  /* Base colors */
  --bg: #f5f6ff;
  --bg-user: #f2f2f2;
  --bg-user-light: #f7f7f7;
  --primary: hwb(206 13% 24%);
  --secondary: #5bc5ec;
  --nice-blue: #2563eb;
  --primary-color: #2563eb;
  --primary-rgb: 37, 99, 235;
  --nice-blue-hover: #1d4ed8;
  --input-inside: #f9faff;
  --normal-input-inside: #f0f0f0;
  --notification-background: #313e2c;
  --notification-primary: #aaec8a;
  --background: #faf9ff;
  --white: #ffffff;
  --red: #ff3b38;
  --bg-red: #fee5ee;
  --bg-blue: #e9effc;
  --gradient-primary: linear-gradient(135deg, #3b82f6 0%, var(--nice-blue-hover) 100%);
  --gradient-primary-hover: linear-gradient(135deg, #3b82f6 0%, var(--nice-blue) 100%);
  /* Text Colors */
  --text-small: #878a97;
  --cell-content: #303651;
  --text-normal: #0f1827;
  --text-menu: #687084;
  --icons: #687084;
  --label-color: #babed1;
  /* Strokes */
  --stroke: #d0d4e1;
  --stroke2: #dee7ec;
  /* Specials */
  --special-badge-color: #27af7f;
  --special-badge-bg: #e7f8f2;
  /* Action colors */
  --active: #f4f6ff;
  /*-------Spacing System-------*/
  --paddingZero: 0px;
  --paddingXS: 5px;
  --paddingMS : 7px;
  --paddingS: 10px;
  --paddingM: 12px;
  --paddingL: 20px;
  --paddingXL: 30px;
  --paddingXXL: 40px;
  /*-------Border Radius-------*/
  --borderZero: 0px;
  --borderXS: 5px;
  --borderS: 7px;
  --borderM: 12px;
  --borderL: 50px;
  /*-------Type Size-------*/
  --supersmall: 0.563rem;
  --body-small: 0.75rem;
  --body: 0.875rem;
  --body-large: 1rem;
  --bodyXL: 1.125rem;
  --label: 0.813rem;
  --h5: clamp(1.125rem, 1.036rem + 0.238vw, 1.25rem);
  --h4: 1.125rem;
  --h3: clamp(1.6rem, 1.5308rem + 0.3077vw, 1.75rem);
  /* --h3: clamp(2.1rem, 1.9154rem + 0.8205vw, 2.5rem); */
  --h2: clamp(2.4rem, 2.1231rem + 1.2308vw, 3rem);
  --h1: clamp(3rem, 2.5385rem + 2.0513vw, 4rem);
  --menuWidth: 250px;
}

.margin-bottomXXL{
  margin-bottom: var(--paddingXXL);
}

.margin-bottomL{
  margin-bottom: var(--paddingL);
}

.margin-bottomXL{
  margin-bottom: var(--paddingXL);
}

.margin-bottomS{
  margin-bottom: var(--paddingS);
}

@media (max-width: 1366px) {
  :root {
    --supersmall: 0.5rem;
    --body-small: 0.625rem;
    --body: 0.75rem;
    --body-large: 0.875rem;
    --bodyXL: 1rem;
    --label: 0.75rem;
    --h5: clamp(1.4rem, 1.3538rem + 0.2692vw, 1.5rem);
    --h4: clamp(1.6rem, 1.5308rem + 0.3077vw, 1.75rem);
    --h3: 20px;
    --h2: clamp(2rem, 1.7692rem + 1.0385vw, 2.5rem);
    --h1: clamp(2.5rem, 2.1154rem + 1.7051vw, 3.5rem);
    /*-------Spacing System-------*/
    --paddingZero: 0px;
    --paddingXS: 2px;
    --paddingS: 5px;
    --paddingM: 8px;
    --paddingL: 12px;
    --paddingXL: 20px;
    --paddingXXL: 30px;
  }
}

@media (max-width: 768px) {
  :root {
    --supersmall: 0.5rem;
    --body-small: 0.625rem;
    --body: 0.75rem;
    --body-large: 0.875rem;
    --bodyXL: 1rem;
    --label: 0.75rem;
    --h5: clamp(1.4rem, 1.3538rem + 0.2692vw, 1.5rem);
    --h4: clamp(1.6rem, 1.5308rem + 0.3077vw, 1.75rem);
    --h3: 16px;
    --h2: clamp(2rem, 1.7692rem + 1.0385vw, 2.5rem);
    --h1: clamp(2.5rem, 2.1154rem + 1.7051vw, 3.5rem);
    /*-------Spacing System-------*/
    --paddingZero: 0px;
    --paddingXS: 2px;
    --paddingS: 5px;
    --paddingM: 8px;
    --paddingL: 12px;
    --paddingXL: 20px;
    --paddingXXL: 30px;
  }
}

.checklist-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
  counter-reset: quest-counter;
}

.checklist-wrapper.builder {
  /* ff */
}

#action-buttons{
  position: fixed;
  bottom: 0px;
  right: 0px;
  z-index: 999;
  padding: 20px;
  background-color: var(--white);
  border-radius: 10px 10px 0px 0px;
  border: 1px solid var(--stroke);
  width: calc(100% - var(--menuWidth));
}

.checklist-wrapper.builder button {
  font-size: 16px;
  margin-top: 10px;
  margin-bottom: 10px;
}

/* .button-cover {
  display: none;
} */

.checklist-wrapper.builder button.outlined-button-blue a > img {
  width: 18px;
  height: 18px;
}

.hide {
  display: none !important;
}

.show {
  display: block !important;
}

.checklist-container {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  cursor: pointer;
  background-color: var(--bg-user);
  border-radius: 7px;
  padding: 7px 20px 7px 20px;
  transition: all 0.2s;
}

.d-none {
  display: none;
}

.d-flex {
  display: flex;
}

.align-items {
  align-items: center;
}

.gap-10 {
  gap: 10px;
}

.margintop-10 {
  margin-top: 10px;
}

.marginbottom-10 {
  margin-bottom: 10px;
}

.checklist-container:hover {
  opacity: 0.8;
  transition: all 0.2s;
}

.hidden-div {
  width: 100%;
  display: none;
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
  border-radius: 7px;
}

.checklist-container:hover .hidden-div {
  display: block;
}

.checklist-container.title {
  background-color: #217dc2;
  margin-bottom: 10px;
}

.checklist-container.title h6,
  .checklist-container.title img {
  color: white !important;
}

.checklist-icon {
  width: 25px;
  height: 25px;
  transition: all 0.2s ease;
}

.checklist-title,
  .checklist-category-title {
  font-weight: 500;
  font-size: var(--bodyXL);
}

.checklist-category-title {
  background-color: var(--bg-user);
  border-radius: var(--borderS);
  padding: var(--paddingS);
}

.opt-risposta-text {
  color: var(--cell-content);
}

.checklist-item,
  .checklist-question-wrapper {
  padding: 20px;
  border: 1px solid var(--stroke);
  border-radius: 7px;
}

.checklist-question-wrapper {
  margin: 0px 0px 30px 0px;
}

.question-data {
  height: 100%;
}

.checklist-question-wrapper .question-data {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.checklist-column {
  display: flex;
  flex-direction: column;
  /* gap: 20px; */
  padding: 10px;
}

.checklist-column .checklist-category-title{
  margin-bottom: 20px;
  padding: 7px 20px;
}

.checklist-column .reviewed-by{
  margin-bottom: 10px;
}

.admin-validator .hidden-div{
  padding: 20px 20px 0px 20px;
}

.checklist-column.admin-revision {
  border-radius: 10px;
  padding: 10px;
  border: 1px solid #ff9900 !important;
}

.checklist-column.admin-revision .checklist-name-author .note-text::before,
  tr:has(.admin-revision)::before {
  display: block;
  content: "Revisione Admin";
  /* width: 100%; */
  white-space: nowrap;
  text-align: center;
  background: #ffecc3 !important;
  color: #ff9900;
  font-size: 0.75rem;
  border-radius: 8px;
  padding: 4px 12px;
  border: 1px solid #ff9900 !important;
}

.admin-revision .reviewed-by .note-text{
  font-size: 0.75rem;
  white-space: nowrap;
}

.checklist-name-author .note-text{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 20px;
}

.show-questions {
  font-size: var(--body);
  color: var(--text-normal);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: var(--paddingL);
  gap: var(--paddingS);
  /* margin: var(--paddingXL) 0px 0px 0px; */
  border-radius: 5px;
  text-align: left;
}

.checklist-item.quest {
  border: 1px solid var(--primary);
}

.checklist-item-wrapper {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.checklist-item-title,
  .checklist-question-title {
  font-weight: 500;
  font-size: var(--bodyXL);
  color: var(--text-normal);
  text-align: left;
}

.checklist-question-title {
  width: 100%;
}

.splitter {
  width: 100%;
  flex-wrap: wrap;
}

.checklist-item-body,
  .left {
  min-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 30px;
  counter-reset: section;
}

.checklist-item-body.horizontal {
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: start;
  margin: 0px 0px 0px 50px;
  gap: 50px;
}

.checklist-item-body > div,
  .left > div {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  justify-items: center;
  gap: 10px;
}

.container-chk-specifications{
  flex-wrap: wrap;
}

.checklist-item-option {
  margin-left: 0px;
}

.checklist-item-body .right {
  display: flex;
  width: 50%;
  height: auto;
  border-left: 1px solid var(--stroke);
  padding: 40px;
  margin-left: 20px;
  flex-direction: column;
  align-content: flex-start;
  align-items: flex-start;
}

.checklist-item-body .right > p {
  color: var(--cell-content);
  font-size: 14px;
  text-align: left;
}

.checklist-item-option {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-items: center;
  /* background-color: var(--bg-user); */
  padding: 10px;
  border-radius: 10px;
}

.checklist-item-option > label {
  margin-right: 20px;
}

.checklist-item-body ul {
  display: flex;
  align-items: center !important;
}

span.checklist-item-hint {
  color: var(--text-small);
}

span.checklist-item-hint::before {
  counter-increment: section;
  content: counter(section) ". ";
}

.checklist-item-option {
  color: var(--text-small);
}

.checklist-container.builder {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  border: 2px solid var(--stroke);
}

.checklist-container.builder input {
  padding-left: 10px;
}

.checklist-container.added {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
}

input.checklist-title {
  font-size: 22px;
  height: 50px;
  min-width: 300px;
}

.knobs,
  .layer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.button {
  position: relative;
  top: 50%;
  width: 74px;
  height: 38px;
  margin: -20px auto 0 auto;
  overflow: hidden;
}

.button.r.switch-pericolo,
  .button.r.switch-pericolo .layer {
  border-radius: 7px;
}

.button.r,
  .button.r .layer {
  border-radius: 100px;
}

.button.b2 {
  border-radius: 2px;
}

.checkbox {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}

.checkbox-pelicoro {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}

.knobs {
  z-index: 2;
}

.layer {
  width: 100%;
  background-color: var(--stroke2);
  transition: 0.3s ease all;
  z-index: 1;
}

/* Button 3 */

#button-3 .knobs:before {
  content: "No";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 30px;
  height: 30px;
  color: var(--text-normal);
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  line-height: 1;
  padding: 9px 5px;
  background-color: var(--white);
  border-radius: 50%;
  transition: 0.3s ease all, left 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15);
}

#button-3{
  zoom: 0.8;
  -webkit-zoom: 0.8;
  -moz-transform: scale(0.8);
}

#button-3 .checkbox:active + .knobs:before {
  width: 46px;
  border-radius: 100px;
}

#button-3 .checkbox:checked:active + .knobs:before {
  margin-left: -26px;
}

#button-3 .checkbox:checked + .knobs:before {
  content: "Si";
  left: 40px;
  color: var(--text-normal);
  background-color: var(--white);
}

#button-3 .checkbox:checked ~ .layer {
  background-color: var(--primary);
}

#button-pelicoro .checkbox-pelicoro:checked ~ .layer {
  background-color: var(--primary);
}

#button-pelicoro .checkbox-pelicoro:active + .knobs:before {
  width: 46px;
  border-radius: 100px;
}

#button-pelicoro .checkbox-pelicoro:checked:active + .knobs:before {
  margin-left: -26px;
}

#button-pelicoro .checkbox-pelicoro:checked + .knobs:before {
  left: 40px;
  color: var(--text-normal);
  background-color: var(--white);
  border-radius: 5px;
}

#button-pelicoro .checkbox-pelicoro:checked ~ .layer {
  background-color: var(--red);
}

#button-pelicoro .knobs:before {
  content: "Pericolo";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 57px;
  height: 30px;
  color: var(--text-normal);
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  line-height: 1;
  padding: 9px 5px;
  background-color: var(--white);
  border-radius: 7px;
  transition: 0.3s ease all, left 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15);
}

#button-pelicoro .checkbox:active + .knobs:before {
  width: 46px;
  border-radius: 100px;
}

#button-pelicoro .checkbox:checked:active + .knobs:before {
  margin-left: -26px;
}

#button-pelicoro .checkbox:checked + .knobs:before {
  content: "Pericolo";
  left: 43px;
  color: var(--text-normal);
  background-color: var(--white);
}

#button-pelicoro .checkbox:checked ~ .layer {
  background-color: var(--special-badge-color);
}

.switch-pericolo {
  width: 105px !important;
}

.tabcontent {
  display: none;
  width: 100%;
}

.tabs-checklist {
  overflow: hidden;
  display: flex;
  gap: 10px;
}

.tablink {
  outline: none;
  cursor: pointer;
  display: flex;
  padding: 15px 25px;
  align-items: center;
  gap: 10px;
  transition: all 0.3s ease;
  flex-grow: 1;
  color: var(--white);
  border-radius: 12px 12px 0px 0px;
  background: var(--bg-user);
  border-bottom: 2px solid var(--white);
}

.tablink:hover {
  background-color: #ebf2f7;
  border-bottom: 2px solid var(--primary);
}

.tablink:active {
  background-color: #ebf2f7;
}

.tablink.active {
  background-color: #ebf2f7;
  border-bottom: 2px solid var(--primary);
  border-right: 0px !important;
}

/* CHECKS */

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
  .checklist-item-check,
    input[type="radio"] {
    --active: #205fdc;
    --active-inner: #fff;
    --focus: 2px rgba(39, 94, 254, 0.3);
    --border: #bbc1e1;
    --border-hover: #275efe;
    --background: #fff;
    --disabled: #e7e7e711;
    --disabled-inner: #e1e6f91a;
    -webkit-appearance: none;
    -moz-appearance: none;
    height: 21px;
    width: 21px;
    min-width: 21px;
    outline: none;
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin: 0;
    cursor: pointer;
    border: 1px solid var(--bc, var(--border));
    background: var(--b, var(--background));
    transition: background 0.3s, border-color 0.3s, box-shadow 0.2s;
    &:after {
      content: "";
      display: block;
      left: 0;
      top: 0;
      position: absolute;
      transition: transform var(--d-t, 0.3s) var(--d-t-e, ease),
          opacity var(--d-o, 0.2s);
    }
    &:checked {
      --b: var(--active);
      --bc: var(--active);
      --d-o: 0.3s;
      --d-t: 0.6s;
      --d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2);
    }
    &:disabled {
      --b: var(--disabled);
      cursor: not-allowed;
      opacity: 0.9;
      &:checked {
        --b: var(--disabled-inner);
        --bc: var(--border);
      }
      & + label {
        cursor: not-allowed;
      }
    }
    &:hover {
      &:not(:checked) {
        &:not(:disabled) {
          --bc: var(--border-hover);
        }
      }
    }
    &:focus {
      box-shadow: 0 0 0 var(--focus);
    }
    &:not(.switch) {
      width: 21px;
      &:after {
        opacity: var(--o, 0);
      }
      &:checked {
        --o: 1;
      }
    }
    & + label {
      font-size: 16px;
      line-height: 21px;
      /* display: inline-block; */
      vertical-align: top;
      cursor: pointer;
      margin-left: 10px;
    }
  }

  .checklist-item-check {
    &:not(.switch) {
      border-radius: 5px;
      &:after {
        width: 5px;
        height: 9px;
        border: 2px solid var(--active-inner);
        border-top: 0;
        border-left: 0;
        left: 7px;
        top: 4px;
        transform: rotate(var(--r, 20deg));
      }
      &:checked {
        --r: 43deg;
      }
    }
  }

  .checklist-item-check-label,
    .checklist-item-hint {
    display: block;
    /* Assicurati che l'elemento sia block per consentire il wrapping */
    white-space: normal;
    /* Permette al testo di andare a capo */
    overflow-wrap: break-word;
    /* Permette di spezzare le parole per prevenire overflow */
    text-wrap: wrap;
  }

  .vertical-toggle .checklist-item-check-label,
    .toggle-description .checklist-item-check-label {
    max-width: 90%;
    /* Imposta una larghezza massima per assicurarti che ci sia spazio per il wrapping */
  }

  .toggle-hints .checklist-item-hint,
    .toggle-hints .checklist-item-check-label {
    max-width: 45%;
    /* Imposta una larghezza massima per assicurarti che ci sia spazio per il wrapping */
  }

  .toggle-hints .checklist-item-body > div,
    .toggle-description .left > div {
    width: 100%;
  }

  input.checklist-item-check:disabled,
    .checklist-item-check:disabled + label {
    opacity: 0.5;
  }

  .sub-domanda > ul {
    counter-reset: section;
  }

  .sub-domanda > ul > li > span::before {
    color: var(--text-small);
    counter-increment: section;
    content: counter(section, lower-alpha) ". ";
  }

  .sub-domanda > ul > li {
    height: 70px;
    display: flex;
    width: 100%;
    align-items: center;
    transition: all ease-in-out 0.2s;
  }

  .sub-domanda > ul > li > span {
    flex-direction: row;
    margin-left: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
  }

  .sub-domanda > ul > li > span > input {
    flex: 1;
  }

  .line-vertical {
    display: block;
    background-color: #dee7ec;
    width: 2px;
    height: 70px;
    transition: all 0.2s linear;
    animation-fill-mode: forwards;
  }

  .line-horizontal {
    display: block;
    background-color: #dee7ec;
    height: 2px;
    min-width: 12px;
  }

  .sub-domanda > ul > li:last-child > .line-vertical {
    height: 35px;
    align-self: flex-start;
  }

  .quest-counter {
    border: 1px solid var(--stroke);
    border-radius: 10px;
    width: 50px;
    background-color: #fefeff;
  }

  .quest-counter::before {
    width: 50px;
    background-color: #fefeff;
    color: var(--cell-content);
    counter-increment: quest-counter;
    content: counter(quest-counter) ". ";
  }

  .checklist-title.input {
    min-height: 45px;
    font-size: 18px;
    border-radius: var(--borderS);
    background: #F0F0F0;
    border: 2px solid var(--primary);
    color: #303651;
  }

  .add-note,
    .remove-note {
    margin-top: 20px;
  }
}

.specifitions-text-area {
  border: 1px solid #e1e1e1;
}

.response-free-text-area {
  border: 1px solid #e1e1e1;
}

.text-block-text-area,
  .note-input {
  width: 100% !important;
  border-radius: 7px;
  border: 2px solid var(--stroke);
  padding: 7px var(--paddingL) 7px var(--paddingL);
  font-weight: 500;
  /* width: auto !important; */
}

.text-block-text-area:active,
  .note-input:active,
  .text-block-text-area:focus,
  .note-input:focus,
  .text-block-text-area:hover,
  .note-input:hover {
  border: 2px solid var(--secondary);
}

.box-answers {
  display: flex;
  align-items: flex-start;
  border: 1px solid #217dc2;
  padding: 10px;
  border-radius: 10px;
}

.box-answers .user {
  background: #ffebc6;
  border-radius: 8px;
  padding: 5px;
  margin-left: 10px;
  font-size: 10px;
  font-weight: bold;
  color: #7a5c23;
}

.answer-admin .admin {
  background: #ebf2f7;
  border-radius: 8px;
  padding: 5px;
  margin-left: 10px;
  font-size: 10px;
  font-weight: bold;
  color: #005cc1;
}

.box-answers.vertical {
  display: flex;
  align-items: center;
}

.box-answers.vertical .user {
  background: #ffd890;
  border-radius: 8px;
  padding: 5px;
  margin-left: 10px;
  font-size: 10px;
  font-weight: bold;
}

.question {
  display: flex;
  flex-direction: column;
  gap: 5px;
  border: solid 1px #217dc2;
  border-radius: 10px;
  padding: 10px;
}

.answer-admin {
  display: flex;
  align-items: flex-start;
  border: 1px solid #217dc2;
  padding: 10px;
  border-radius: 10px;
  background: #dbe7ff;
}

.category {
  gap: 10px;
  display: flex;
  flex-direction: column;
}

.category-title {
  border-radius: 10px;
  background: #217dc2;
  display: flex;
  padding: 10px;
  font-weight: bold;
  margin-top: 10px;
  cursor: pointer;
  color: #ebf2f7;
  border: 1px solid #217dc2;
}

.category-title img {
  margin-left: 30px;
}

.marginright-10 {
  margin-right: 10px;
}

.marginleft-5 {
  margin-left: 5px;
}

.marginleft-10 {
  margin-left: 10px;
}

.answer-admin.vertical {
  flex-direction: column;
}

@media (max-width: 1366px) {
  .checklist-item-body {
    min-width: 200px !important;
  }

  .checklist-item-body.horizontal {
    flex-direction: column !important;
    margin: 20px 0px 0px 0px !important;
    gap: 10px !important;
  }

  #action-buttons{
    width: 100% !important;
  }

  .horizontal-toggle .checklist-item-container {
    flex-direction: column !important;
  }

  .checklist-item-check-label,
    .checklist-item-hint,
    .checklist-item-option label,
    .checklist-item-title {
    text-align: left;
  }

  .checklist-item-body .right {
    border: 0px !important;
    margin-left: 0px !important;
    padding: 10px !important;
  }

  .checklist-item-container label,
    span.checklist-item-hint {
    /* font-size: 12px !important; */
  }

  .checklist-item-body > div,
    .left > div,
    .checklist-item-option {
    flex-wrap: wrap;
  }

  .checklist-item-option {
    row-gap: 10px;
  }
}

.box-questions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-start;
}

.modal-checklist-history {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}

.container-answer,
  .container-answer-admin {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.container-answer .answers {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.question-title {
  width: auto;
  background: #ebf2f7;
  display: flex;
  border-radius: 10px;
  justify-content: center;
  color: #217dc2;
  border: solid 1px #217dc2;
}

.box-answer-options {
  display: flex;
  align-items: center;
}

.container-rigth-questions {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.container-rigth-questions div {
  display: flex;
  justify-content: flex-end;
}

.container-rigth-questions div img {
  cursor: pointer;
}

.container-btn-return-table {
  display: flex;
  justify-content: space-between;
}

.container-btn-return-table button {
  background: white;
  border: 1px solid #217dc2;
  padding: 5px;
  border-radius: 10px;
  color: #217dc2;
}

.container-btn-return-table img {
  cursor: pointer;
  color: #217dc2;
}

.btn-validate-checklist {
  background: #ffecc3 !important;
  color: #ff9900;
  border-radius: 10px;
  padding: 5px 10px;
  border: 1px solid #ff9900 !important;
}

.btn-validate-checklist:hover {
  background: #ffe2a4 !important;
  border-radius: 10px;
  padding: 5px 10px;
}

.btn-validate-checklist.still > a:hover {
  color: #ff9900 !important;
}

.btn-validate-checklist.still a {
  color: #ff9900 !important;
}

.btn-review-checklist {
  background: var(--bg-blue) !important;
  color: var(--primary);
  border-radius: 10px;
  padding: 5px 10px;
  border: 1px solid var(--primary) !important;
}

.btn-review-checklist:hover {
  background: #dbe6ff !important;
  border-radius: 10px;
  padding: 5px 10px;
}

.btn-review-checklist a {
  padding: 0px !important;
}

.label-average {
  background: rgb(241, 241, 241);
  padding: 5px;
  font-size: 10px;
  display: flex;
  align-items: center;
  color: grey;
  border-radius: 40px;
  margin-left: 10px;
  font-weight: bold;
  min-width: 30px;
  margin-bottom: 2px;
  justify-content: center;
}

/* .header-table-matrix {
    background-color: #ffdcca;
    color: #333;
    font-weight: 500;
  }

  .data-cell-matrix {
    background-color: #f9f9f9;
    font-weight: bold;
  }

  #risk-matrix {
    border-collapse: collapse;
  }

  #risk-matrix th,
  #risk-matrix td {
    border: 1px solid #000 !important;
  }

  #risk-matrix th,
  #risk-matrix td {
    padding: 8px;
    text-align: left;
  }

  #risk-matrix .title-identification {
    background: #f0f0f0;
    font-weight: bold;
  }
  .text-vertical-matrix {
    writing-mode: vertical-rl;
    transform: rotate(360deg);
    transform-origin: center;
    height: 270px; 
  } */

.response-group {
  display: flex;
  flex-direction: column;
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23D0D4E1FF' stroke-width='2' stroke-dasharray='10%2c20' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
  /* border: 1px dashed var(--stroke); */
  padding: var(--paddingS);
  border-radius: var(--borderS);
  margin: 10px 0px 10px 0px;
}

.add-quest-hints-multiple,
  .delete-quest {
  margin-left: 10px;
}

.min-width-350 {
  min-width: 350px;
}

.response-options {
  display: flex;
  flex-direction: column;
  /* gap: 10px; */
}

.response-item {
  display: flex;
  gap: 10px;
  align-items: center;
}

.response-item input,
  .response-item button {
  flex: 1 1 auto;
}

.response-item > button {
  flex-grow: initial;
  margin-right: 10px;
}

.response-item button img {
  width: 20px;
  height: 20px;
}

.height-auto {
  height: auto !important;
}

.minwidth-160 {
  min-width: 160px;
}

.container-parameters {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-left: 10px;
  margin-right: 10px;
  gap: 10px;
}

.checklist-item-option:has(.container-spec-parameters) {
  display: flex;
  flex-direction: row !important;
  gap: 10px;
}

.question-parameters {
  align-items: flex-end !important;
}

.options-specifications {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
}

.options-specifications div {
  display: flex;
  align-items: center;
}

.container-options-specifications {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-left: 10px;
}

.add-danger {
  cursor: pointer;
}

.container-select-danger {
  width: 25px;
  margin-left: 10px;
}

.checklist-title {
  cursor: pointer;
}

.editable-input {
  width: 100%;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .tablink {
    padding: 10px 10px;
  }

  .tablink p {
    font-size: 10px;
  }
}

.btn-remove-checklist {
  background: var(--bg-red) !important;
  color: var(--red);
  border-radius: 10px;
  padding: 5px 10px;
  border: 1px solid var(--red) !important;
  text-wrap: nowrap;
}

.btn-remove-checklist:hover {
  background: #ffd7e6 !important;
  border-radius: 10px;
  padding: 5px 10px;
}

.btn-compile-checklist {
  background: var(--special-badge-bg) !important;
  color: var(--special-badge-color);
  border-radius: 10px;
  padding: 5px 10px;
  border: 1px solid var(--special-badge-color) !important;
  text-wrap: nowrap;
}

.btn-compile-checklist:hover {
  background: #c7e7db !important;
  border-radius: 10px;
  padding: 5px 10px;
}

.checklist-item-option:has(.container-spec-parameters) {
  display: flex;
  flex-direction: row-reverse;
}

.container-spec-parameters {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-items: center;
  gap: 10px;
  background-color: var(--bg-user);
  padding: 10px 20px;
  border-radius: 10px;
}

.container-options-specifications {
  display: flex;
  align-items: flex-start !important;
}

.container-options-specifications label {
  white-space: nowrap;
}

.container-free-specification > div {
  margin-left: 20px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  background-color: var(--bg-user);
  border-radius: 10px;
  padding: 20px;
}

.container-free-specification div textarea {
  border: 2px solid var(--stroke);
  min-width: 200px;
}

.container-free-specification div textarea:focus,
  .container-free-specification div textarea:hover,
  .container-free-specification div textarea:active {
  border: 2px solid var(--secondary);
}

.checklist-item-check-label {
  margin-right: 10px;
}

.compila-checklist {
  gap: 200px;
  margin: 20px 0px 0px 0px;
}

.compila-checklist > .info-box {
  border: 2px dashed var(--stroke);
  min-height: 0px !important;
}

.checklist-item-option.options-specifications:has(label) {
  border: 1px dashed var(--stroke) !important;
}

.checklist-item:not(.quest) .checklist-item-container > div:first-child,
  .checklist-question-title {
  padding: 7px;
  background-color: var(--bg);
  border-radius: 5px;
}

.question-desc::before, .question-note::before {
  content: "Descrizione Domanda";
  font-size: var(--label);
  color: var(--text-small);
  letter-spacing: 2px;
  text-transform: uppercase;
}

.question-note::before{
  content: "Dettaglio Note";
}

.question-desc, .question-note {
  font-size: var(--body);
  color: var(--text-normal);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background-color: var(--bg-user-light);
  padding: var(--paddingL);
  gap: var(--paddingS);
  margin: var(--paddingXL) 0px 0px 0px;
  border-radius: 5px;
  text-align: left;
}

.question-divider {
  margin: var(--paddingXL) 0px 0px 0px;
  width: 100%;
  height: 1px;
}

.note-desc::before {
  content: "Note";
  width: 100% !important;
  font-size: var(--label);
  color: var(--text-small);
  letter-spacing: 2px;
  text-transform: uppercase;
}

.note-desc {
  font-size: var(--body);
  color: var(--text-normal);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  border: 1px solid var(--stroke);
  background-color: var(--bg);
  padding: var(--paddingL);
  gap: var(--paddingS);
  margin: var(--paddingXL) 0px 0px 0px;
  border-radius: 5px;
  text-align: left;
  gap: 10px;
}

.note-desc > .note-single-wrapper {
  background-color: var(--bg-user-light);
  padding: var(--paddingS);
  border-radius: 5px;
  border: 1px solid var(--stroke);
}

.note-desc > .note-single-wrapper > .propic-box {
  padding: var(--paddingXS);
  margin-top: var(--paddingXS);
  border-top: 1px solid var(--stroke2);
}

.user-checklists .propic {
  width: 50px;
  height: 50px;
}

.add-note::before {
  content: "Aggiungi Revisione";
  font-size: var(--label);
  color: var(--text-small);
  letter-spacing: 2px;
  text-transform: uppercase;
}

.add-note {
  font-size: var(--body);
  color: var(--text-normal);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background-color: var(--bg-user-light);
  padding: var(--paddingL);
  gap: var(--paddingS);
  margin: var(--paddingXL) 0px 0px 0px;
  border-radius: 5px;
  text-align: left;
}

.checklist-wrapper.builder.checklist-validator-wrapper.flex.flex-row {
  max-width: calc(100vw - 250px - 30px - 30px - 20px);
}

.admin-validator-wrapper:has(.user-checklists-wrapper){
  width: 50%;
}

.admin-validator-wrapper:has(.admin-validator){
  width: 50%;
}

.reviewed-by {
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: 20px;
  align-items: center;
  align-content: center;
  justify-content: space-between;
  border-radius: 10px;
  background-color: var(--bg);
  border: 1px solid var(--stroke);
  padding: 10px 25px 10px 25px;
}

.checklist-name-author {
  width: 100%;
}

.reviewed-by .note-text {
  font-size: var(--body-large);
  font-weight: 500;
}

.current-validation-title {
  padding: var(--paddingL);
  border-radius: 10px 10px 0px 0px;
  background-color: var(--bg-user-light);
  border-width: 1px 1px 0px 1px;
  border-color: var(--stroke);
}

.admin-validator,
  .checklist-validated-wrapper {
  box-shadow: 0px -5px 30px rgba(0, 0, 0, 0.08);
}

.user-checklists-wrapper {
  border: 2px dashed var(--stroke);
}

.checklist-item-body-answer {
  display: flex;
  flex-direction: row;
  gap: 10px;
}

.question-note-button{
  margin-top: var(--paddingL);
  display: flex;
  width: 100%;
  justify-content: flex-start;
}

/* #risk-matrix {
    table-layout: fixed;
  }

  #risk-matrix td {
    overflow: hidden;
    height: 4em;
  } */

/* Estilos CSS personalizados */

.answer {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  /* Espacio entre cada respuesta */
}

.option {
  display: flex;
  align-items: center;
  margin-left: 20px;
  /* Indentación de las opciones */
}

html{
  overflow-x: hidden;
}

body.login {
  overflow: hidden;
  background-color: #f5f7fa;
  margin: 0;
  padding: 0;
}

h1 {
  font-size: 24px !important;
  font-weight: 500;
  color: var(--primary);
}

.login-content {
  display: flex;
  align-items: flex-start;
  height: 100vh;
}

.left-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1 0 0;
  height: 100%;
  position: relative;
  z-index: 1;
  justify-content: space-between;
  padding-bottom: 50px;
}

.login-wrapper {
  justify-content: center;
  align-items: left;
  min-width: 400px;
  padding: var(--paddingXL, --paddingXL);
  background-color: white;
  border-radius: var(--borderM, 12px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.login-wrapper:hover {
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}

.login-wrapper.logo {
  background-color: transparent;
  box-shadow: none;
  display: flex;
  justify-content: center;
}

.right-container {
  flex: 1 0 0;
  height: 100%;
  transition: transform 0.5s ease;
  padding: var(--paddingL, 20px);
}

.right-content{
  width: 100%;
  height: 100%;
  background-image: url("../img/login.webp");
  /* background: hsla(198, 100%, 45%, 1);
  background: linear-gradient(0deg, hsla(198, 100%, 45%, 1) 0%, hsla(186, 100%, 98%, 1) 100%); */
  background-size: cover;
  border-radius: var(--borderM, 12px);
  background-color: var(--bg-blue);
}

.login-logo {
  position: absolute;
  left: 20px;
  top: 20px;
  z-index: 10;
  transition: transform 0.3s ease;
}

.login-logo:hover {
  transform: scale(1.05);
}

.form-container-login form {
  display: flex;
  flex-direction: column;
  gap: var(--paddingL, 20px);
}

.form-fields-login {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.login-input, .normal-input {
  padding: 14px 16px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  font-size: 1rem;
  width: 100%;
  transition: all 0.2s ease;
  background-color: #f9fafc;
}

.login-input:focus, .normal-input:focus {
  outline: none;
  border-color: var(--primary, #217DC2);
  box-shadow: 0 0 0 3px rgba(33, 125, 194, 0.15);
  background-color: white;
}

.login-input-error, .normal-input-error {
  padding: 14px 16px;
  border: 1px solid #e53e3e;
  border-radius: 8px;
  font-size: 1rem;
  width: 100%;
  background-color: #fff5f5;
}

.login-input-error:focus, .normal-input-error:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(229, 62, 62, 0.15);
}

.password-wrap {
  position: relative;
  width: 100%;
}

.password-toggle {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s ease;
}

.password-toggle:hover {
  opacity: 1;
}

.login-btn {
  background-color: var(--primary, #217DC2);
  color: white;
  padding: 14px;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 4px 6px rgba(33, 125, 194, 0.2);
}

.login-btn:hover {
  background-color: var(--primary-dark, #1a63a0);
  transform: translateY(-2px);
  box-shadow: 0 6px 12px rgba(33, 125, 194, 0.25);
}

.login-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(33, 125, 194, 0.2);
}

.google-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background-color: white;
  color: #333;
  border: 1px solid #e0e0e0;
  padding: 12px;
  border-radius: 8px;
  font-weight: 500;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.google-btn:hover {
  background-color: #f5f5f5;
  border-color: #d0d0d0;
}

.forgotpass {
  text-align: right;
  font-size: 0.9rem;
  color: var(--primary, #217DC2);
  margin-top: -5px;
  transition: all 0.2s ease;
}

.forgotpass:hover {
  color: var(--primary-dark, #1a63a0);
}

@keyframes progress {
  0% {
    width: 100%;
  }

  100% {
    width: 0%;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.login-wrapper {
  animation: fadeIn 0.6s ease-out forwards;
}

.login-wrapper.logo {
  animation: fadeIn 0.4s ease-out forwards;
}

.alert {
  padding: 16px;
  border-radius: 8px;
  margin-bottom: 16px;
}

.alert-error {
  background-color: #fff5f5;
  border-left: 4px solid #e53e3e;
}

.mask {
  flex: 1 0 0;
  height: 100%;
  background-color: white;
  mask-repeat: no-repeat;
  mask-size: cover;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  position: relative;
}

/* Animation for form elements */

.form-fields-login > * {
  opacity: 0;
  transform: translateY(10px);
  animation: fadeIn 0.3s ease-out forwards;
}

.form-fields-login > *:nth-child(1) {
  animation-delay: 0.1s;
}

.form-fields-login > *:nth-child(2) {
  animation-delay: 0.2s;
}

.form-fields-login > *:nth-child(3) {
  animation-delay: 0.3s;
}

.form-fields-login > *:nth-child(4) {
  animation-delay: 0.4s;
}

@media (max-width: 1440px) {
  .login-wrapper {
    padding: 20px !important;
  }

  .form-container-login form {
    gap: 10px !important;
  }

  .alert {
    font-size: 0.825rem;
  }

  .login-input, .normal-input {
    font-size: 0.875rem;
  }
}

@media (max-width: 1366px) {
  .login-logo {
    display: none !important;
  }

  .right-container,
  .mask {
    display: none;
  }

  .left-container {
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
  }

  /* .login-wrapper {
    background-color: rgba(255, 255, 255, 0.95) !important;
  } */
}

/* Miglioramento responsive per laptop e schermi piccoli */

@media (max-width: 1024px) {
  .left-container {
    padding-bottom: 20px;
  }

  .login-wrapper {
    min-width: 320px;
    padding: 18px;
  }

  .login-wrapper.logo {
    padding: 8px;
  }

  .form-fields-login {
    gap: 4px;
  }

  .form-container-login form {
    gap: 12px;
  }

  h2 {
    font-size: 44px !important;
  }

  .text-bodyXL {
    font-size: 1rem !important;
  }

  .forgotpass {
    font-size: 0.85rem;
  }
}

@media (max-width: 768px) {
  .left-container > div{
    width: 100%;
  }

  .left-container {
    padding: 10px;
    padding-bottom: 10px;
  }

  .login-wrapper {
    min-width: 220px;
    max-width: 98vw;
    padding: 10px;
  }

  .form-container-login form {
    gap: 8px;
  }

  .text-bodyXL {
    font-size: 0.95rem !important;
  }

  .forgotpass {
    font-size: 0.8rem;
  }

  .left-container {
    width: 100%;
    padding: 20px;
  }

  .login-wrapper {
    /* background-color: rgba(255, 255, 255, 0.95) !important; */
    width: 100%;
    max-width: 450px;
    padding: 24px;
  }

  .login-wrapper.logo {
    padding: 15px;
  }

  .login-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .login-content h1 {
    text-align: center;
    font-size: 1.5rem !important;
  }

  .form-container-login form {
    gap: 20px;
  }

  .login-logo {
    position: relative;
    left: auto;
    top: auto;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    width: 100%;
  }
}

/* Dark mode support */

@media (prefers-color-scheme: dark) {
  body.login.dark-mode-enabled {
    background-color: #121212;
  }

  .dark-mode-enabled .login-wrapper {
    background-color: #1e1e1e;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  }

  .dark-mode-enabled h1 {
    color: #f0f0f0;
  }

  .dark-mode-enabled .label {
    color: #b0b0b0;
  }

  .dark-mode-enabled .login-input,
  .dark-mode-enabled .normal-input {
    background-color: #2d2d2d;
    border-color: #3d3d3d;
    color: #f0f0f0;
  }

  .dark-mode-enabled .login-input:focus,
  .dark-mode-enabled .normal-input:focus {
    background-color: #333;
    border-color: var(--primary, #217DC2);
  }
}

.info-section {
  display: flex;
  align-items: flex-start;
  gap: 50px;
  align-self: stretch;
}

.info-box {
  display: flex;
  width: 100%;
  padding: 20px 30px;
  flex-direction: column;
  gap: 20px;
  border-radius: 7px;
  background: var(--colors-base-colors-white, #fff);
  min-height: 220px;
}

.info-body > .info-labels > .label, .info-body > .info-labels .label {
  color: var(--label-color);
}

.info-body > .info-labels div{
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.info-box > h5 {
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.info-box > .info-body {
  display: flex;
  align-items: flex-start;
  gap: 50px;
  align-self: stretch;
}

.info-section > .info-box > .info-labels {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  align-self: stretch;
}

.info-labels > .label{
  height: 24px ;
  display: flex;
  align-items: center;
}

.info-section > .info-box > .info-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  align-self: stretch;
}

.form-fields {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  -moz-column-gap: 20px;
       column-gap: 20px;
  row-gap: 20px;
}

.password-toggle {
  margin-left: -30px;
}

.form-fields > div {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.normal-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

@media (max-width: 1366px) {
  .profile-section{
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  .profile-section .profile-pic{
    width: 100px;
    height: 100px;
    min-width: 100px;
  }

  .info-section{
    flex-direction: column;
  }

  .info-box > form > div {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .form-fields{
    grid-template-columns: repeat(1, 1fr);
  }
}

.swiper {
  width: 100%;
  height: 100%;
}

.swiper-wrapper{
  padding: 50px 0px 0px 0px;
}

.swiper-slide {
  text-align: center;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: left;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.swiper-pagination-bullet {
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
  font-size: 12px;
  color: #000;
  opacity: 1;
  background: rgba(0, 0, 0, 0.2);
}

.swiper-pagination-bullet-active {
  color: #fff;
  background: #007aff;
}

.swiper-pagination{
  bottom: unset !important;
  top: 0 !important;
}

.swiper-button-next, .swiper-button-prev {
  /* position: sticky !important;   */
  top: 40px;
  color: var(--swiper-navigation-color,var(--swiper-theme-color));
  border: 1px solid;
  background: var(--bg);
  border-radius: 50%;
  box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
  padding: 20px;
  width: 25px;
  height: 25px;
}

.swiper-button-next:after, .swiper-button-prev:after {
  font-size: 25px;
}

.float-button {
  position: fixed;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  bottom: 0;
  right: 50%;
  transform: translate(50%, 0);
  padding: 20px;
}

/* Inizializza il contatore a livello del contenitore padre */

.argomenti-container {
  counter-reset: quest-counter-verbale;
}

/* Applica lo stile e incrementa il contatore per ogni bottone con classe quest-counter-verbale */

.quest-counter-verbale {
  border: 1px solid var(--stroke);
  border-radius: 10px;
  width: 50px;
  height: 50px;
  background-color: #fefeff;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--cell-content);
  font-size: 14px;
  counter-increment: quest-counter-verbale;
}

/* Usa ::before per visualizzare il numero del contatore */

.quest-counter-verbale::before {
  content: counter(quest-counter-verbale) ". ";
}

.float-note-wrapper{
  position: fixed;
  display: flex;
  flex-direction: column-reverse;
  align-items: flex-end;
  bottom: 0;
  right: 0;
  z-index: 9;
  padding: 20px;
  gap: 10px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width:none;
  max-height: 80%;
}

.float-container {
  width: 500px;
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid var(--stroke);
  padding: 20px;
  border-radius: 7px;
  visibility: hidden;
  animation: fadeInRight 0.2s ease-in forwards;
  word-wrap: break-word;
  /* Add this */
  overflow-wrap: break-word;
  /* Add this */
  transition: all 0.2s;
}

.float-container.notecollapsed{
  width: 20px;
  padding: 50px 0px;
  transition: all 0.2s;
}

.float-container.notecollapsed span, .float-container.notecollapsed .close-note, .float-container.notecollapsed p, .float-container.notecollapsed div{
  display: none;
}

.float-container.notecollapsed img{
  transform: rotate(180deg);
  transition: all 0.2s;
}

.float-container:nth-child(1) {
  animation-delay: 0.5s;
}

.float-container:nth-child(2) {
  animation-delay: 1s;
}

.float-container:nth-child(3) {
  animation-delay: 1.5s;
}

.float-container:nth-child(4) {
  animation-delay: 2s;
}

.float-container:nth-child(5) {
  animation-delay: 2.5s;
}

.float-container:nth-child(6) {
  animation-delay: 3s;
}

.float-container.notehidden {
  animation: fadeOutRight 0.2s ease-out forwards;
}

.float-container #close-note{
  float: right;
  width: 25px;
  height: 25px;
  padding: 5px;
}

.float-container #close-note:hover{
  cursor: pointer;
}

.float-container img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.float-container span{
  display: flex;
  flex-direction: row;
  align-items: center;
}

.float-container p{
  padding: 10px;
}

.float-container .title{
  text-transform: capitalize;
}

.verbale-button{
  font-size: 12px;
  padding: 7px 20px !important;
  display: inline-flex;
  color: var(--white);
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  margin-right: 10px
}

.argomenti-inputs{
  gap: 10px !important;
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translateX(50px);
    visibility: hidden;
  }

  1% {
    visibility: visible;
  }

  100% {
    opacity: 1;
    transform: translateX(0);
    visibility: visible;
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    transform: translateX(0);
    visibility: visible;
  }

  99% {
    visibility: visible;
  }

  100% {
    opacity: 0;
    transform: translateX(50px);
    visibility: hidden;
    display: none;
  }
}

/*
 * This combined file was created by the DataTables downloader builder:
 *   https://datatables.net/download
 *
 * To rebuild or modify this file with the latest versions of the included
 * software please visit:
 *   https://datatables.net/download/#dt/jq-3.7.0/jszip-3.10.1/pdfmake-0.2.7/dt-1.13.8/af-2.6.0/b-2.4.2/b-colvis-2.4.2/b-html5-2.4.2/b-print-2.4.2/cr-1.7.0/date-1.5.1/fc-4.3.0/fh-3.4.0/kt-2.11.0/r-2.5.0/rg-1.4.1/rr-1.4.1/sc-2.3.0/sb-1.6.0/sp-2.2.0/sl-1.7.0/sr-1.3.0
 *
 * Included libraries:
 *   jQuery 3 3.7.0, JSZip 3.10.1, pdfmake 0.2.7, DataTables 1.13.8, AutoFill 2.6.0, Buttons 2.4.2, Column visibility 2.4.2, HTML5 export 2.4.2, Print view 2.4.2, ColReorder 1.7.0, DateTime 1.5.1, FixedColumns 4.3.0, FixedHeader 3.4.0, KeyTable 2.11.0, Responsive 2.5.0, RowGroup 1.4.1, RowReorder 1.4.1, Scroller 2.3.0, SearchBuilder 1.6.0, SearchPanes 2.2.0, Select 1.7.0, StateRestore 1.3.0
 */

@tailwind base;

@tailwind components;

@tailwind utilities;

:root {
  --dt-row-selected: 13, 110, 253;
  --dt-row-selected-text: 255, 255, 255;
  --dt-row-selected-link: 9, 10, 11;
  --dt-row-stripe: 0, 0, 0;
  --dt-row-hover: 0, 0, 0;
  --dt-column-ordering: 0, 0, 0;
  --dt-html-background: white;
}

:root.dark {
  --dt-html-background: rgb(33, 37, 41);
}

table.dataTable td.dt-control {
  text-align: center;
  cursor: pointer;
}

table.dataTable td.dt-control:before {
  display: inline-block;
  color: rgba(0, 0, 0, 0.5);
  content: "▶";
}

table.dataTable tr.dt-hasChild td.dt-control:before {
  content: "▼";
}

html.dark table.dataTable td.dt-control:before {
  color: rgba(255, 255, 255, 0.5);
}

html.dark table.dataTable tr.dt-hasChild td.dt-control:before {
  color: rgba(255, 255, 255, 0.5);
}

table.dataTable thead {
  box-shadow: 0px 10px 30px -10px rgba(0, 0, 0, 0.17);
  position: relative;
}

table.dataTable thead > tr > th.sorting,
  table.dataTable thead > tr > th.sorting_disabled,
  table.dataTable thead > tr > th.sorting_asc,
  table.dataTable thead > tr > th.sorting_desc,
  table.dataTable thead > tr > th.sorting_asc_disabled,
  table.dataTable thead > tr > th.sorting_desc_disabled,
  table.dataTable thead > tr > td.sorting,
  table.dataTable thead > tr > td.sorting_asc,
  table.dataTable thead > tr > td.sorting_desc,
  table.dataTable thead > tr > td.sorting_asc_disabled,
  table.dataTable thead > tr > td.sorting_desc_disabled {
  cursor: pointer;
  position: relative;
  padding-right: 20px;
  color: var(--text-small);
  text-transform: uppercase;
  font-size: var(--body-small);
  font-weight: 500;
  line-height: normal;
  letter-spacing: 1px;
  font-style: normal;
}

table.dataTable thead > tr > th.sorting:before,
  table.dataTable thead > tr > th.sorting:after,
  table.dataTable thead > tr > th.sorting_asc:before,
  table.dataTable thead > tr > th.sorting_asc:after,
  table.dataTable thead > tr > th.sorting_desc:before,
  table.dataTable thead > tr > th.sorting_desc:after,
  table.dataTable thead > tr > th.sorting_asc_disabled:before,
  table.dataTable thead > tr > th.sorting_asc_disabled:after,
  table.dataTable thead > tr > th.sorting_desc_disabled:before,
  table.dataTable thead > tr > th.sorting_desc_disabled:after,
  table.dataTable thead > tr > td.sorting:before,
  table.dataTable thead > tr > td.sorting:after,
  table.dataTable thead > tr > td.sorting_asc:before,
  table.dataTable thead > tr > td.sorting_asc:after,
  table.dataTable thead > tr > td.sorting_desc:before,
  table.dataTable thead > tr > td.sorting_desc:after,
  table.dataTable thead > tr > td.sorting_asc_disabled:before,
  table.dataTable thead > tr > td.sorting_asc_disabled:after,
  table.dataTable thead > tr > td.sorting_desc_disabled:before,
  table.dataTable thead > tr > td.sorting_desc_disabled:after {
  position: absolute;
  display: block;
  opacity: 0.3;
  right: 10px;
  line-height: 9px;
  font-size: 0.8em;
}

table.dataTable thead > tr > th.sorting:before,
  table.dataTable thead > tr > th.sorting_asc:before,
  table.dataTable thead > tr > th.sorting_desc:before,
  table.dataTable thead > tr > th.sorting_asc_disabled:before,
  table.dataTable thead > tr > th.sorting_desc_disabled:before,
  table.dataTable thead > tr > td.sorting:before,
  table.dataTable thead > tr > td.sorting_asc:before,
  table.dataTable thead > tr > td.sorting_desc:before,
  table.dataTable thead > tr > td.sorting_asc_disabled:before,
  table.dataTable thead > tr > td.sorting_desc_disabled:before {
  bottom: 50%;
  content: url("../img/icons/chevron-down.svg");
  width: 18px;
  height: 18px;
  content: url("../img/icons/chevron-down.svg") / "";
  rotate: 180deg;
}

table.dataTable thead > tr > th.sorting:after,
  table.dataTable thead > tr > th.sorting_asc:after,
  table.dataTable thead > tr > th.sorting_desc:after,
  table.dataTable thead > tr > th.sorting_asc_disabled:after,
  table.dataTable thead > tr > th.sorting_desc_disabled:after,
  table.dataTable thead > tr > td.sorting:after,
  table.dataTable thead > tr > td.sorting_asc:after,
  table.dataTable thead > tr > td.sorting_desc:after,
  table.dataTable thead > tr > td.sorting_asc_disabled:after,
  table.dataTable thead > tr > td.sorting_desc_disabled:after {
  top: 50%;
  content: url("../img/icons/chevron-down.svg");
  width: 18px;
  height: 18px;
  content: url("../img/icons/chevron-down.svg") / "";
}

table.dataTable thead > tr > th.sorting_asc:before,
  table.dataTable thead > tr > th.sorting_desc:after,
  table.dataTable thead > tr > td.sorting_asc:before,
  table.dataTable thead > tr > td.sorting_desc:after {
  opacity: 1;
}

table.dataTable thead > tr > th.sorting_desc_disabled:after,
  table.dataTable thead > tr > th.sorting_asc_disabled:before,
  table.dataTable thead > tr > td.sorting_desc_disabled:after,
  table.dataTable thead > tr > td.sorting_asc_disabled:before {
  display: none;
}

table.dataTable thead > tr > th:active,
  table.dataTable thead > tr > td:active {
  outline: none;
}

div.dataTables_scrollBody > table.dataTable > thead > tr > th:before,
  div.dataTables_scrollBody > table.dataTable > thead > tr > th:after,
  div.dataTables_scrollBody > table.dataTable > thead > tr > td:before,
  div.dataTables_scrollBody > table.dataTable > thead > tr > td:after {
  display: none;
}

div.dataTables_processing {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 200px;
  margin-left: -100px;
  margin-top: -26px;
  text-align: center;
  padding: 2px;
  z-index: 10;
}

div.dataTables_processing > div:last-child {
  position: relative;
  width: 80px;
  height: 15px;
  margin: 1em auto;
}

div.dataTables_processing > div:last-child > div {
  position: absolute;
  top: 0;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: rgb(13, 110, 253);
  background: rgb(var(--dt-row-selected));
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

div.dataTables_processing > div:last-child > div:nth-child(1) {
  left: 8px;
  animation: datatables-loader-1 0.6s infinite;
}

div.dataTables_processing > div:last-child > div:nth-child(2) {
  left: 8px;
  animation: datatables-loader-2 0.6s infinite;
}

div.dataTables_processing > div:last-child > div:nth-child(3) {
  left: 32px;
  animation: datatables-loader-2 0.6s infinite;
}

div.dataTables_processing > div:last-child > div:nth-child(4) {
  left: 56px;
  animation: datatables-loader-3 0.6s infinite;
}

@keyframes datatables-loader-1 {
  0% {
    transform: scale(0);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes datatables-loader-3 {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0);
  }
}

@keyframes datatables-loader-2 {
  0% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(24px, 0);
  }
}

table.dataTable.nowrap th,
  table.dataTable.nowrap td {
  white-space: nowrap;
}

table.dataTable th.dt-left,
  table.dataTable td.dt-left {
  text-align: left;
}

table.dataTable th.dt-center,
  table.dataTable td.dt-center,
  table.dataTable td.dataTables_empty {
  text-align: center;
  vertical-align: middle;
}

table.dataTable th.dt-right,
  table.dataTable td.dt-right {
  text-align: right;
}

table.dataTable th.dt-justify,
  table.dataTable td.dt-justify {
  text-align: justify;
}

table.dataTable th.dt-nowrap,
  table.dataTable td.dt-nowrap {
  white-space: nowrap;
}

table.dataTable thead th,
  table.dataTable thead td,
  table.dataTable tfoot th,
  table.dataTable tfoot td {
  text-align: left;
}

table.dataTable thead th.dt-head-left,
  table.dataTable thead td.dt-head-left,
  table.dataTable tfoot th.dt-head-left,
  table.dataTable tfoot td.dt-head-left {
  text-align: left;
}

table.dataTable thead th.dt-head-center,
  table.dataTable thead td.dt-head-center,
  table.dataTable tfoot th.dt-head-center,
  table.dataTable tfoot td.dt-head-center {
  text-align: center;
}

table.dataTable thead th.dt-head-right,
  table.dataTable thead td.dt-head-right,
  table.dataTable tfoot th.dt-head-right,
  table.dataTable tfoot td.dt-head-right {
  text-align: right;
}

table.dataTable thead th.dt-head-justify,
  table.dataTable thead td.dt-head-justify,
  table.dataTable tfoot th.dt-head-justify,
  table.dataTable tfoot td.dt-head-justify {
  text-align: justify;
}

table.dataTable thead th.dt-head-nowrap,
  table.dataTable thead td.dt-head-nowrap,
  table.dataTable tfoot th.dt-head-nowrap,
  table.dataTable tfoot td.dt-head-nowrap {
  white-space: nowrap;
}

table.dataTable tbody th.dt-body-left,
  table.dataTable tbody td.dt-body-left {
  text-align: left;
}

table.dataTable tbody th.dt-body-center,
  table.dataTable tbody td.dt-body-center {
  text-align: center;
}

table.dataTable tbody th.dt-body-right,
  table.dataTable tbody td.dt-body-right {
  text-align: right;
}

table.dataTable tbody th.dt-body-justify,
  table.dataTable tbody td.dt-body-justify {
  text-align: justify;
}

table.dataTable tbody th.dt-body-nowrap,
  table.dataTable tbody td.dt-body-nowrap {
  white-space: nowrap;
}

/*
 * Table styles
 */

table.dataTable {
  width: 100%;
  margin: 0 auto;
  clear: both;
  border-collapse: separate;
  border-spacing: 0;
  /*
   * Header and footer styles
   */
  /*
   * Body styles
   */
}

table.dataTable thead th,
  table.dataTable tfoot th {
  font-weight: bold;
}

table.dataTable > thead > tr > th,
  table.dataTable > thead > tr > td {
  padding: 15px 7px 15px 7px;
  /* padding: 30px 10px 30px 10px; */
  /* border-bottom: 1px solid rgba(0, 0, 0, 0.3); */
}

table.dataTable > thead > tr > th:active,
  table.dataTable > thead > tr > td:active {
  outline: none;
}

table.dataTable > tfoot > tr > th,
  table.dataTable > tfoot > tr > td {
  padding: 10px 10px 6px 10px;
  border-top: 1px solid rgba(0, 0, 0, 0.3);
}

table.dataTable tbody {
  color: var(--cell-content);
}

table.dataTable tbody > tr > td > .table-id {
  color: var(--primary);
}

table.dataTable tbody > tr > td > .table-id:hover {
  color: var(--primary);
  text-decoration: underline;
}

table.dataTable tbody tr {
  background-color: transparent;
}

table.dataTable tbody tr.odd {
  background-color: var(--white);
}

table.dataTable tbody tr.odd:hover {
  background-color: var(--bg-user-light) ;
}

table.dataTable tbody tr.even {
  background-color: var(--bg);
}

table.dataTable tbody tr.even:hover {
  background-color: var(--bg-user-light) ;
}

table.dataTable tbody tr.selected /* > * */ {
  /* box-shadow: inset 0 0 0 9999px rgba(220, 234, 255, 0.9);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.9); */
  background-color: rgb(232, 246, 252);
  color: var(--primary);
  /* color: rgb(255, 255, 255);
  color: rgb(var(--dt-row-selected-text)); */
}

table.dataTable tbody tr.selected a {
  color: rgb(11, 9, 9);
  color: rgb(var(--dt-row-selected-link));
}

table.dataTable tbody th,
  table.dataTable tbody td {
  padding: 4px 5px;
  border-bottom: 1px solid var(--stroke2);
}

table.dataTable > tbody > tr {
  /* min-height: 70px; */
}

table.dataTable.row-border > tbody > tr > th,
  table.dataTable.row-border > tbody > tr > td,
  table.dataTable.display > tbody > tr > th,
  table.dataTable.display > tbody > tr > td {
  border-top: 1px solid rgba(0, 0, 0, 0.15);
}

table.dataTable.row-border > tbody > tr:first-child > th,
  table.dataTable.row-border > tbody > tr:first-child > td,
  table.dataTable.display > tbody > tr:first-child > th,
  table.dataTable.display > tbody > tr:first-child > td {
  border-top: none;
}

table.dataTable.row-border > tbody > tr.selected + tr.selected > td,
  table.dataTable.display > tbody > tr.selected + tr.selected > td {
  border-top-color: #0262ef;
}

table.dataTable.cell-border > tbody > tr > th,
  table.dataTable.cell-border > tbody > tr > td {
  border-top: 1px solid rgba(0, 0, 0, 0.15);
  border-right: 1px solid rgba(0, 0, 0, 0.15);
}

table.dataTable.cell-border > tbody > tr > th:first-child,
  table.dataTable.cell-border > tbody > tr > td:first-child {
  border-left: 1px solid rgba(0, 0, 0, 0.15);
}

table.dataTable.cell-border > tbody > tr:first-child > th,
  table.dataTable.cell-border > tbody > tr:first-child > td {
  border-top: none;
}

table.dataTable.stripe > tbody > tr.odd > *,
  table.dataTable.display > tbody > tr.odd > * {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.023);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-stripe), 0.023);
}

table.dataTable.stripe > tbody > tr.odd.selected > *,
  table.dataTable.display > tbody > tr.odd.selected > * {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.923);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.923);
}

table.dataTable.hover > tbody > tr:hover > *,
  table.dataTable.display > tbody > tr:hover > * {
  box-shadow: inset 0 0 0 9999px rgba(255, 0, 0, 0.035);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.035);
}

table.dataTable.hover > tbody > tr.selected:hover > *,
  table.dataTable.display > tbody > tr.selected:hover > * {
  box-shadow: inset 0 0 0 9999px #0d6efd !important;
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 1) !important;
}

table.dataTable.order-column > tbody tr > .sorting_1,
  table.dataTable.order-column > tbody tr > .sorting_2,
  table.dataTable.order-column > tbody tr > .sorting_3,
  table.dataTable.display > tbody tr > .sorting_1,
  table.dataTable.display > tbody tr > .sorting_2,
  table.dataTable.display > tbody tr > .sorting_3 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.019);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.019);
}

table.dataTable.order-column > tbody tr.selected > .sorting_1,
  table.dataTable.order-column > tbody tr.selected > .sorting_2,
  table.dataTable.order-column > tbody tr.selected > .sorting_3,
  table.dataTable.display > tbody tr.selected > .sorting_1,
  table.dataTable.display > tbody tr.selected > .sorting_2,
  table.dataTable.display > tbody tr.selected > .sorting_3 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.919);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.919);
}

table.dataTable.display > tbody > tr.odd > .sorting_1,
  table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_1 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.054);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.054);
}

table.dataTable.display > tbody > tr.odd > .sorting_2,
  table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_2 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.047);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.047);
}

table.dataTable.display > tbody > tr.odd > .sorting_3,
  table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_3 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.039);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.039);
}

table.dataTable.display > tbody > tr.odd.selected > .sorting_1,
  table.dataTable.order-column.stripe > tbody > tr.odd.selected > .sorting_1 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.954);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.954);
}

table.dataTable.display > tbody > tr.odd.selected > .sorting_2,
  table.dataTable.order-column.stripe > tbody > tr.odd.selected > .sorting_2 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.947);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.947);
}

table.dataTable.display > tbody > tr.odd.selected > .sorting_3,
  table.dataTable.order-column.stripe > tbody > tr.odd.selected > .sorting_3 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.939);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.939);
}

table.dataTable.display > tbody > tr.even > .sorting_1,
  table.dataTable.order-column.stripe > tbody > tr.even > .sorting_1 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.019);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.019);
}

table.dataTable.display > tbody > tr.even > .sorting_2,
  table.dataTable.order-column.stripe > tbody > tr.even > .sorting_2 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.011);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.011);
}

table.dataTable.display > tbody > tr.even > .sorting_3,
  table.dataTable.order-column.stripe > tbody > tr.even > .sorting_3 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.003);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.003);
}

table.dataTable.display > tbody > tr.even.selected > .sorting_1,
  table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_1 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.919);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.919);
}

table.dataTable.display > tbody > tr.even.selected > .sorting_2,
  table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_2 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.911);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.911);
}

table.dataTable.display > tbody > tr.even.selected > .sorting_3,
  table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_3 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.903);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.903);
}

table.dataTable.display tbody tr:hover > .sorting_1,
  table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.082);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.082);
}

table.dataTable.display tbody tr:hover > .sorting_2,
  table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.074);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.074);
}

table.dataTable.display tbody tr:hover > .sorting_3,
  table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.062);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.062);
}

table.dataTable.display tbody tr:hover.selected > .sorting_1,
  table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.982);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.982);
}

table.dataTable.display tbody tr:hover.selected > .sorting_2,
  table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.974);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.974);
}

table.dataTable.display tbody tr:hover.selected > .sorting_3,
  table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {
  box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0.962);
  box-shadow: inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.962);
}

table.dataTable.no-footer {
  /* border-bottom: 1px solid rgba(0, 0, 0, 0.3); */
  margin-bottom: 10px;
}

table.dataTable.compact thead th,
  table.dataTable.compact thead td,
  table.dataTable.compact tfoot th,
  table.dataTable.compact tfoot td,
  table.dataTable.compact tbody th,
  table.dataTable.compact tbody td {
  padding: 4px;
}

table.dataTable th,
  table.dataTable td {
  box-sizing: content-box;
}

/*
 * Control feature layout
 */

.dataTables_wrapper {
  position: relative;
  clear: both;
}

.dataTables_wrapper .dataTables_length {
  float: left;
  font-size: var(--body);
  margin: 0px 0px 20px 0px;
}

.dataTables_wrapper .dataTables_length select {
  border: 1px solid var(--stroke2) !important;
  border-radius: var(--borderXS) !important;
  padding: var(--paddingXS) !important;
  background-color: transparent;
  color: inherit;
}

.dataTables_wrapper .dataTables_filter {
  float: right;
  text-align: right;
}

.dataTables_wrapper .dataTables_filter input {
  border: 1px solid var(--stroke) !important;
  border-radius: var(--borderXS) !important;
  padding: var(--paddingXS) !important;
  background-color: transparent;
  color: inherit;
  margin: 0px 0px 20px 3px !important;
}

.dataTables_wrapper .dataTables_info {
  clear: both;
  float: left;
  padding-top: 0.755em;
}

.dataTables_wrapper .dataTables_paginate {
  float: right;
  text-align: right;
  padding-top: 0.25em;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  box-sizing: border-box;
  display: inline-block;
  min-width: 1.5em;
  padding: 0.5em 1em;
  margin-left: 2px;
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;
  color: inherit !important;
  border: 1px solid transparent;
  border-radius: 2px;
  background: transparent;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
  .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  color: inherit !important;
  border: 1px solid var(--stroke) !important;
  border-radius: 7px;
  background-color: rgba(0, 0, 0, 0.05);
  /* Chrome,Safari4+ */
  /* Chrome10+,Safari5.1+ */
  /* FF3.6+ */
  /* IE10+ */
  /* Opera 11.10+ */
  background: linear-gradient(
      to bottom,
      rgba(230, 230, 230, 0.05) 0%,
      rgba(0, 0, 0, 0.05) 100%
    );
  /* W3C */
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
  .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
  .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
  cursor: default;
  color: #666 !important;
  border: 1px solid transparent;
  background: transparent;
  box-shadow: none;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  color: white !important;
  border: 1px solid var(--stroke);
  background-color: var(--primary);
  border-radius: 7px;
  background: -webkit-gradient(var(--primary));
  /* Chrome,Safari4+ */
  /* Chrome10+,Safari5.1+ */
  /* FF3.6+ */
  /* IE10+ */
  background: -o-linear-gradient(var(--primary));
  /* Opera 11.10+ */
  background: var(--primary);
}

.dataTables_wrapper .dataTables_paginate .paginate_button:active {
  color: white !important;
  border: 1px solid var(--stroke2);
  background-color: var(--primary);
  border-radius: 7px;
  background: -webkit-gradient(var(--primary));
  /* Chrome,Safari4+ */
  /* Chrome10+,Safari5.1+ */
  /* FF3.6+ */
  /* IE10+ */
  background: -o-linear-gradient(var(--primary));
  /* Opera 11.10+ */
  background: var(--primary);
}

.dataTables_wrapper .dataTables_paginate .ellipsis {
  padding: 0 1em;
}

.dataTables_wrapper .dataTables_length,
  .dataTables_wrapper .dataTables_filter,
  .dataTables_wrapper .dataTables_info,
  .dataTables_wrapper .dataTables_processing,
  .dataTables_wrapper .dataTables_paginate {
  color: var(--text-menu);
}

.dataTables_wrapper .dataTables_scroll {
  clear: both;
}

.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
  -webkit-overflow-scrolling: touch;
}

.dataTables_wrapper
    .dataTables_scroll
    div.dataTables_scrollBody
    > table
    > thead
    > tr
    > th,
  .dataTables_wrapper
    .dataTables_scroll
    div.dataTables_scrollBody
    > table
    > thead
    > tr
    > td,
  .dataTables_wrapper
    .dataTables_scroll
    div.dataTables_scrollBody
    > table
    > tbody
    > tr
    > th,
  .dataTables_wrapper
    .dataTables_scroll
    div.dataTables_scrollBody
    > table
    > tbody
    > tr
    > td {
  vertical-align: middle;
}

.dataTables_wrapper
    .dataTables_scroll
    div.dataTables_scrollBody
    > table
    > thead
    > tr
    > th
    > div.dataTables_sizing,
  .dataTables_wrapper
    .dataTables_scroll
    div.dataTables_scrollBody
    > table
    > thead
    > tr
    > td
    > div.dataTables_sizing,
  .dataTables_wrapper
    .dataTables_scroll
    div.dataTables_scrollBody
    > table
    > tbody
    > tr
    > th
    > div.dataTables_sizing,
  .dataTables_wrapper
    .dataTables_scroll
    div.dataTables_scrollBody
    > table
    > tbody
    > tr
    > td
    > div.dataTables_sizing {
  height: 0;
  overflow: hidden;
  margin: 0 !important;
  padding: 0 !important;
}

.dataTables_wrapper.no-footer .dataTables_scrollBody {
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
}

.dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,
  .dataTables_wrapper.no-footer div.dataTables_scrollBody > table {
  border-bottom: none;
}

.dataTables_wrapper:after {
  visibility: hidden;
  display: block;
  content: "";
  clear: both;
  height: 0;
}

@media screen and (max-width: 767px) {
  .dataTables_wrapper .dataTables_info,
    .dataTables_wrapper .dataTables_paginate {
    float: none;
    text-align: center;
  }

  .dataTables_wrapper .dataTables_paginate {
    margin-top: 0.5em;
  }
}

@media screen and (max-width: 640px) {
  .dataTables_wrapper .dataTables_length,
    .dataTables_wrapper .dataTables_filter {
    float: none;
    text-align: center;
  }

  .dataTables_wrapper .dataTables_filter {
    margin-top: 0.5em;
  }
}

html.dark {
  --dt-row-hover: 255, 255, 255;
  --dt-row-stripe: 255, 255, 255;
  --dt-column-ordering: 255, 255, 255;
}

html.dark table.dataTable > thead > tr > th,
  html.dark table.dataTable > thead > tr > td {
  border-bottom: 1px solid rgb(89, 91, 94);
}

html.dark table.dataTable > thead > tr > th:active,
  html.dark table.dataTable > thead > tr > td:active {
  outline: none;
}

html.dark table.dataTable > tfoot > tr > th,
  html.dark table.dataTable > tfoot > tr > td {
  border-top: 1px solid rgb(89, 91, 94);
}

html.dark table.dataTable.row-border > tbody > tr > th,
  html.dark table.dataTable.row-border > tbody > tr > td,
  html.dark table.dataTable.display > tbody > tr > th,
  html.dark table.dataTable.display > tbody > tr > td {
  border-top: 1px solid rgb(64, 67, 70);
}

html.dark table.dataTable.row-border > tbody > tr.selected + tr.selected > td,
  html.dark table.dataTable.display > tbody > tr.selected + tr.selected > td {
  border-top-color: #0257d5;
}

html.dark table.dataTable.cell-border > tbody > tr > th,
  html.dark table.dataTable.cell-border > tbody > tr > td {
  border-top: 1px solid rgb(64, 67, 70);
  border-right: 1px solid rgb(64, 67, 70);
}

html.dark table.dataTable.cell-border > tbody > tr > th:first-child,
  html.dark table.dataTable.cell-border > tbody > tr > td:first-child {
  border-left: 1px solid rgb(64, 67, 70);
}

html.dark .dataTables_wrapper .dataTables_filter input,
  html.dark .dataTables_wrapper .dataTables_length select {
  border: 1px solid rgba(255, 255, 255, 0.2);
  background-color: var(--dt-html-background);
}

html.dark .dataTables_wrapper .dataTables_paginate .paginate_button.current,
  html.dark
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.current:hover {
  border: 1px solid rgb(89, 91, 94);
  background: rgba(255, 255, 255, 0.15);
}

html.dark .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
  html.dark
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.disabled:hover,
  html.dark
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button.disabled:active {
  color: #666 !important;
}

html.dark .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  border: 1px solid var(--stroke);
  background-color: var(--primary);
}

html.dark .dataTables_wrapper .dataTables_paginate .paginate_button:active {
  background: #3a3a3a;
}

div.dt-autofill-handle {
  position: absolute;
  height: 8px;
  width: 8px;
  z-index: 10;
  box-sizing: border-box;
  background: #36f;
  cursor: pointer;
}

div.dtk-focus-alt div.dt-autofill-handle {
  background: #ff8b33;
}

div.dt-autofill-select {
  position: absolute;
  z-index: 1001;
  background-color: #4989de;
  background-image: repeating-linear-gradient(
      45deg,
      transparent,
      transparent 5px,
      rgba(255, 255, 255, 0.5) 5px,
      rgba(255, 255, 255, 0.5) 10px
    );
}

div.dt-autofill-select.top,
  div.dt-autofill-select.bottom {
  height: 3px;
  margin-top: -1px;
}

div.dt-autofill-select.left,
  div.dt-autofill-select.right {
  width: 3px;
  margin-left: -1px;
}

div.dt-autofill-list {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 500px;
  margin-left: -250px;
  background-color: white;
  border-radius: 0.75em;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6);
  z-index: 104;
  box-sizing: border-box;
  padding: 2em;
}

div.dt-autofill-list div.dtaf-popover-close {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 22px;
  height: 22px;
  text-align: center;
  border-radius: 3px;
  cursor: pointer;
  z-index: 12;
}

div.dt-autofill-list > div.dt-autofill-list-items > button {
  display: block;
  width: 100%;
  margin: 1em 0;
  padding: 1em;
  border-radius: 0.5em;
  border: 1px solid rgba(0, 0, 0, 0.175);
  background-color: #f6f6f6;
  text-align: left;
  cursor: pointer;
}

div.dt-autofill-list > div.dt-autofill-list-items > button:hover {
  background-color: #ebebeb;
}

div.dt-autofill-list > div.dt-autofill-list-items > button:first-child {
  margin-top: 0;
}

div.dt-autofill-list > div.dt-autofill-list-items > button:last-child {
  margin-bottom: 0;
}

div.dt-autofill-list
    > div.dt-autofill-list-items
    > button
    input[type="number"] {
  padding: 6px;
  width: 30px;
  margin: -2px 0;
}

div.dt-autofill-list > div.dt-autofill-list-items > button span {
  float: right;
}

div.dtaf-popover-closeable {
  padding-top: 2.5em;
}

div.dt-autofill-background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  background: radial-gradient(
      ellipse farthest-corner at center,
      rgba(0, 0, 0, 0.3) 0%,
      rgba(0, 0, 0, 0.7) 100%
    );
  z-index: 103;
}

html.dark div.dt-autofill-handle {
  background: rgb(110, 168, 254);
}

html.dark div.dt-autofill-select {
  position: absolute;
  z-index: 1001;
  background-color: rgb(110, 168, 254);
  background-image: repeating-linear-gradient(
      45deg,
      transparent,
      transparent 5px,
      rgba(0, 0, 0, 0.5) 5px,
      rgba(0, 0, 0, 0.5) 10px
    );
}

html.dark div.dt-autofill-list {
  background-color: var(--dt-html-background);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

html.dark div.dt-autofill-list button {
  color: inherit;
  border: 1px solid rgba(255, 255, 255, 0.175);
  background-color: rgb(47, 52, 56);
}

html.dark div.dt-autofill-list button:hover {
  background-color: rgb(64, 69, 73);
}

@media screen and (max-width: 767px) {
  div.dt-autofill-handle {
    height: 16px;
    width: 16px;
  }

  div.dt-autofill-list {
    width: 90%;
    left: 74.5%;
  }
}

@keyframes dtb-spinner {
  100% {
    transform: rotate(360deg);
  }
}

div.dataTables_wrapper {
  position: relative;
}

div.dt-buttons {
  position: initial;
}

div.dt-buttons .dt-button {
  overflow: hidden;
  text-overflow: ellipsis;
}

div.dt-button-info {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 400px;
  margin-top: -100px;
  margin-left: -200px;
  background-color: white;
  border-radius: 0.75em;
  box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.8);
  text-align: center;
  z-index: 2003;
  overflow: hidden;
}

div.dt-button-info h2 {
  padding: 2rem 2rem 1rem 2rem;
  margin: 0;
  font-weight: normal;
}

div.dt-button-info > div {
  padding: 1em 2em 2em 2em;
}

div.dtb-popover-close {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 22px;
  height: 22px;
  text-align: center;
  border-radius: 3px;
  cursor: pointer;
  z-index: 2003;
}

button.dtb-hide-drop {
  display: none !important;
}

div.dt-button-collection-title {
  text-align: center;
  padding: 0.3em 0 0.5em;
  margin-left: 0.5em;
  margin-right: 0.5em;
  font-size: 0.9em;
}

div.dt-button-collection-title:empty {
  display: none;
}

span.dt-button-spacer {
  display: inline-block;
  margin: 0.5em;
  white-space: nowrap;
}

span.dt-button-spacer.bar {
  border-left: 1px solid rgba(0, 0, 0, 0.3);
  vertical-align: middle;
  padding-left: 0.5em;
}

span.dt-button-spacer.bar:empty {
  height: 1em;
  width: 1px;
  padding-left: 0;
}

div.dt-button-collection .dt-button-active {
  padding-right: 3em;
}

div.dt-button-collection .dt-button-active:after {
  position: absolute;
  top: 50%;
  margin-top: -10px;
  right: 1em;
  display: inline-block;
  content: "✓";
  color: inherit;
}

div.dt-button-collection .dt-button-active.dt-button-split {
  padding-right: 0;
}

div.dt-button-collection .dt-button-active.dt-button-split:after {
  display: none;
}

div.dt-button-collection .dt-button-active.dt-button-split > *:first-child {
  padding-right: 3em;
}

div.dt-button-collection
    .dt-button-active.dt-button-split
    > *:first-child:after {
  position: absolute;
  top: 50%;
  margin-top: -10px;
  right: 1em;
  display: inline-block;
  content: "✓";
  color: inherit;
}

div.dt-button-collection .dt-button-active-a a {
  padding-right: 3em;
}

div.dt-button-collection .dt-button-active-a a:after {
  position: absolute;
  right: 1em;
  display: inline-block;
  content: "✓";
  color: inherit;
}

div.dt-button-collection span.dt-button-spacer {
  width: 100%;
  font-size: 0.9em;
  text-align: center;
  margin: 0.5em 0;
}

div.dt-button-collection span.dt-button-spacer:empty {
  height: 0;
  width: 100%;
}

div.dt-button-collection span.dt-button-spacer.bar {
  border-left: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding-left: 0;
}

html.dark div.dt-button-info {
  background-color: var(--dt-html-background);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

div.dt-buttons {
  float: left;
}

div.dt-buttons.buttons-right {
  float: right;
}

div.dataTables_layout_cell div.dt-buttons {
  float: none;
}

div.dataTables_layout_cell div.dt-buttons.buttons-right {
  float: none;
}

div.dt-buttons > .dt-button,
  div.dt-buttons > div.dt-button-split .dt-button {
  /* position: relative;
  display: inline-block;
  box-sizing: border-box;
  margin-left: 0.167em;
  margin-right: 0.167em;
  margin-bottom: 0.333em;
  padding: 0.5em 1em;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 2px;
  cursor: pointer;
  font-size: 0.88em;
  line-height: 1.6em;
  color: inherit;
  white-space: nowrap;
  overflow: hidden;
  background-color: rgba(0, 0, 0, 0.1);
  background: linear-gradient(
    to bottom,
    rgba(230, 230, 230, 0.1) 0%,
    rgba(0, 0, 0, 0.1) 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr="rgba(230, 230, 230, 0.1)", EndColorStr="rgba(0, 0, 0, 0.1)");
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-decoration: none;
  outline: none;
  text-overflow: ellipsis; */
}

div.dt-buttons > .dt-button:first-child,
  div.dt-buttons > div.dt-button-split .dt-button:first-child {
  margin-left: 0;
}

div.dt-buttons > .dt-button.disabled,
  div.dt-buttons > div.dt-button-split .dt-button.disabled {
  cursor: default;
  opacity: 0.4;
}

div.dt-buttons > .dt-button.dt-button-active:not(.disabled),
  div.dt-buttons
    > div.dt-button-split
    .dt-button.dt-button-active:not(.disabled) {
  background-color: rgba(0, 0, 0, 0.1);
  /* Fallback */
  background: linear-gradient(
      to bottom,
      rgba(179, 179, 179, 0.1) 0%,
      rgba(0, 0, 0, 0.1) 100%
    );
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr="rgba(179, 179, 179, 0.1)", EndColorStr="rgba(0, 0, 0, 0.1)");
  box-shadow: inset 1px 1px 3px #999999;
}

div.dt-buttons
    > .dt-button.dt-button-active:not(.disabled):hover:not(.disabled),
  div.dt-buttons
    > div.dt-button-split
    .dt-button.dt-button-active:not(.disabled):hover:not(.disabled) {
  box-shadow: inset 1px 1px 3px #999999;
  background-color: rgba(0, 0, 0, 0.1);
  /* Fallback */
  background: linear-gradient(
      to bottom,
      rgba(128, 128, 128, 0.1) 0%,
      rgba(0, 0, 0, 0.1) 100%
    );
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr="rgba(128, 128, 128, 0.1)", EndColorStr="rgba(0, 0, 0, 0.1)");
}

div.dt-buttons > .dt-button:hover,
  div.dt-buttons > div.dt-button-split .dt-button:hover {
  text-decoration: none;
}

div.dt-buttons > .dt-button:hover:not(.disabled),
  div.dt-buttons > div.dt-button-split .dt-button:hover:not(.disabled) {
  border: 1px solid #666;
  background-color: rgba(0, 0, 0, 0.1);
  /* Fallback */
  background: linear-gradient(
      to bottom,
      rgba(153, 153, 153, 0.1) 0%,
      rgba(0, 0, 0, 0.1) 100%
    );
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr="rgba(153, 153, 153, 0.1)", EndColorStr="rgba(0, 0, 0, 0.1)");
}

div.dt-buttons > .dt-button:focus:not(.disabled),
  div.dt-buttons > div.dt-button-split .dt-button:focus:not(.disabled) {
  outline: 2px solid rgb(53, 132, 228);
}

div.dt-buttons > .dt-button embed,
  div.dt-buttons > div.dt-button-split .dt-button embed {
  outline: none;
}

div.dt-buttons > div.dt-button-split .dt-button:first-child {
  border-right: 1px solid rgba(0, 0, 0, 0.15);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

div.dt-buttons > div.dt-button-split .dt-button:first-child:hover {
  border-right: 1px solid #666;
}

div.dt-buttons > div.dt-button-split .dt-button:last-child {
  border-left: 1px solid transparent;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

div.dt-buttons > div.dt-button-split .dt-button:last-child:hover {
  border-left: 1px solid #666;
}

div.dt-buttons span.dt-button-down-arrow {
  position: relative;
  top: -2px;
  font-size: 10px;
  padding-left: 10px;
  line-height: 1em;
  opacity: 0.6;
}

div.dt-buttons div.dt-button-split {
  display: inline-block;
}

div.dt-buttons div.dt-button-split .dt-button:first-child {
  margin-right: 0;
}

div.dt-buttons div.dt-button-split .dt-button:last-child {
  margin-left: -1px;
  padding-left: 0.75em;
  padding-right: 0.75em;
  z-index: 2;
}

div.dt-buttons div.dt-button-split .dt-button:last-child span {
  padding-left: 0;
}

div.dt-button-collection {
  position: absolute;
  top: 0;
  left: 0;
  width: 200px;
  margin-top: 3px;
  margin-bottom: 3px;
  padding: 0.75em 0;
  border: 1px solid rgba(0, 0, 0, 0.4);
  background-color: white;
  overflow: hidden;
  z-index: 2002;
  border-radius: 5px;
  box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.3);
  box-sizing: border-box;
}

div.dt-button-collection .dt-button {
  position: relative;
  left: 0;
  right: 0;
  width: 100%;
  display: block;
  float: none;
  background: none;
  margin: 0;
  padding: 0.5em 1em;
  border: none;
  text-align: left;
  cursor: pointer;
  color: inherit;
}

div.dt-button-collection .dt-button.dt-button-active {
  background: none;
  box-shadow: none;
}

div.dt-button-collection .dt-button.disabled {
  cursor: default;
  opacity: 0.4;
}

div.dt-button-collection .dt-button:hover:not(.disabled) {
  border: none;
  background: rgba(153, 153, 153, 0.1);
  box-shadow: none;
}

div.dt-button-collection div.dt-button-split {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  align-items: stretch;
}

div.dt-button-collection div.dt-button-split button.dt-button {
  margin: 0;
  display: inline-block;
  width: 0;
  flex-grow: 1;
  flex-shrink: 0;
  flex-basis: 50px;
}

div.dt-button-collection div.dt-button-split button.dt-button-split-drop {
  min-width: 33px;
  flex: 0;
}

div.dt-button-collection.fixed .dt-button {
  border-radius: 0.25em;
  background: rgba(255, 255, 255, 0.1);
}

div.dt-button-collection.fixed {
  position: fixed;
  display: block;
  top: 50%;
  left: 50%;
  margin-left: -75px;
  border-radius: 5px;
  background-color: white;
  padding: 0.5em;
}

div.dt-button-collection.fixed.two-column {
  margin-left: -200px;
}

div.dt-button-collection.fixed.three-column {
  margin-left: -225px;
}

div.dt-button-collection.fixed.four-column {
  margin-left: -300px;
}

div.dt-button-collection.fixed.columns {
  margin-left: -409px;
}

@media screen and (max-width: 1024px) {
  div.dt-button-collection.fixed.columns {
    margin-left: -308px;
  }
}

@media screen and (max-width: 640px) {
  div.dt-button-collection.fixed.columns {
    margin-left: -203px;
  }
}

@media screen and (max-width: 460px) {
  div.dt-button-collection.fixed.columns {
    margin-left: -100px;
  }
}

div.dt-button-collection.fixed > :last-child {
  max-height: 100vh;
  overflow: auto;
}

div.dt-button-collection.two-column > :last-child,
  div.dt-button-collection.three-column > :last-child,
  div.dt-button-collection.four-column > :last-child {
  display: block !important;
  -moz-column-gap: 8px;
  -ms-column-gap: 8px;
  -o-column-gap: 8px;
  column-gap: 8px;
}

div.dt-button-collection.two-column > :last-child > *,
  div.dt-button-collection.three-column > :last-child > *,
  div.dt-button-collection.four-column > :last-child > * {
  -moz-column-break-inside: avoid;
       break-inside: avoid;
}

div.dt-button-collection.two-column {
  width: 400px;
}

div.dt-button-collection.two-column > :last-child {
  padding-bottom: 1px;
  -moz-column-count: 2;
       column-count: 2;
}

div.dt-button-collection.three-column {
  width: 450px;
}

div.dt-button-collection.three-column > :last-child {
  padding-bottom: 1px;
  -moz-column-count: 3;
       column-count: 3;
}

div.dt-button-collection.four-column {
  width: 600px;
}

div.dt-button-collection.four-column > :last-child {
  padding-bottom: 1px;
  -moz-column-count: 4;
       column-count: 4;
}

div.dt-button-collection .dt-button {
  border-radius: 0;
}

div.dt-button-collection.columns {
  width: auto;
}

div.dt-button-collection.columns > :last-child {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
  width: 818px;
  padding-bottom: 1px;
}

div.dt-button-collection.columns > :last-child .dt-button {
  min-width: 200px;
  flex: 0 1;
  margin: 0;
}

div.dt-button-collection.columns.dtb-b3 > :last-child,
  div.dt-button-collection.columns.dtb-b2 > :last-child,
  div.dt-button-collection.columns.dtb-b1 > :last-child {
  justify-content: space-between;
}

div.dt-button-collection.columns.dtb-b3 .dt-button {
  flex: 1 1 32%;
}

div.dt-button-collection.columns.dtb-b2 .dt-button {
  flex: 1 1 48%;
}

div.dt-button-collection.columns.dtb-b1 .dt-button {
  flex: 1 1 100%;
}

@media screen and (max-width: 1024px) {
  div.dt-button-collection.columns > :last-child {
    width: 612px;
  }
}

@media screen and (max-width: 640px) {
  div.dt-button-collection.columns > :last-child {
    width: 406px;
  }

  div.dt-button-collection.columns.dtb-b3 .dt-button {
    flex: 0 1 32%;
  }
}

@media screen and (max-width: 460px) {
  div.dt-button-collection.columns > :last-child {
    width: 200px;
  }
}

div.dt-button-background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  /* Fallback */
  background: radial-gradient(
      ellipse farthest-corner at center,
      rgba(0, 0, 0, 0.3) 0%,
      rgba(0, 0, 0, 0.7) 100%
    );
  /* W3C Markup, IE10 Release Preview */
  z-index: 2001;
}

.dt-button.processing {
  color: rgba(0, 0, 0, 0.2);
}

.dt-button.processing:after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 16px;
  margin: -8px 0 0 -8px;
  box-sizing: border-box;
  display: block;
  content: " ";
  border: 2px solid rgb(40, 40, 40);
  border-radius: 50%;
  border-left-color: transparent;
  border-right-color: transparent;
  animation: dtb-spinner 1500ms infinite linear;
  -o-animation: dtb-spinner 1500ms infinite linear;
  -ms-animation: dtb-spinner 1500ms infinite linear;
  -webkit-animation: dtb-spinner 1500ms infinite linear;
  -moz-animation: dtb-spinner 1500ms infinite linear;
}

@media screen and (max-width: 640px) {
  div.dt-buttons {
    float: none !important;
    text-align: center;
  }
}

html.dark div.dt-buttons > .dt-button,
  html.dark div.dt-buttons > div.dt-button-split .dt-button {
  border: 1px solid rgb(89, 91, 94);
  background: rgba(255, 255, 255, 0.15);
}

html.dark div.dt-buttons > .dt-button.dt-button-active:not(.disabled),
  html.dark
    div.dt-buttons
    > div.dt-button-split
    .dt-button.dt-button-active:not(.disabled) {
  background: rgba(179, 179, 179, 0.15);
  box-shadow: inset 1px 1px 2px black;
}

html.dark
    div.dt-buttons
    > .dt-button.dt-button-active:not(.disabled):hover:not(.disabled),
  html.dark
    div.dt-buttons
    > div.dt-button-split
    .dt-button.dt-button-active:not(.disabled):hover:not(.disabled) {
  background: rgba(128, 128, 128, 0.15);
  box-shadow: inset 1px 1px 3px black;
}

html.dark div.dt-buttons > .dt-button:hover:not(.disabled),
  html.dark
    div.dt-buttons
    > div.dt-button-split
    .dt-button:hover:not(.disabled) {
  background: rgba(179, 179, 179, 0.15);
}

html.dark div.dt-buttons > .dt-button:focus:not(.disabled),
  html.dark
    div.dt-buttons
    > div.dt-button-split
    .dt-button:focus:not(.disabled) {
  outline: 2px solid rgb(110, 168, 254);
}

html.dark div.dt-buttons > div.dt-button-split .dt-button:first-child {
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}

html.dark div.dt-buttons > div.dt-button-split .dt-button:first-child:hover {
  border-right: 1px solid rgb(89, 91, 94);
}

html.dark div.dt-buttons > div.dt-button-split .dt-button:last-child:hover {
  border-left: 1px solid rgb(89, 91, 94);
}

html.dark div.dt-button-collection {
  border: 1px solid rgba(255, 255, 255, 0.15);
  background-color: rgb(33, 37, 41);
  box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.8);
}

table.DTCR_clonedTable.dataTable {
  position: absolute !important;
  background-color: rgba(255, 255, 255, 0.7);
  z-index: 202;
  border-radius: 4px;
}

div.DTCR_pointer {
  width: 1px;
  background-color: #0259c4;
  z-index: 201;
}

html.dark table.DTCR_clonedTable.dataTable {
  background-color: rgba(33, 33, 33, 0.9);
}

html.dark div.DTCR_pointer {
  background-color: rgb(110, 168, 254);
}

div.dt-datetime {
  position: absolute;
  background-color: white;
  z-index: 2050;
  border: 1px solid #ccc;
  box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.5);
  padding: 6px 20px;
  width: 275px;
  border-radius: 5px;
}

div.dt-datetime.inline {
  position: relative;
  box-shadow: none;
}

div.dt-datetime div.dt-datetime-title {
  text-align: center;
  padding: 5px 0px 3px;
}

div.dt-datetime div.dt-datetime-buttons {
  text-align: center;
}

div.dt-datetime div.dt-datetime-buttons a {
  display: inline-block;
  padding: 0 0.5em 0.5em 0.5em;
  margin: 0;
  font-size: 0.9em;
}

div.dt-datetime div.dt-datetime-buttons a:hover {
  text-decoration: underline;
}

div.dt-datetime table {
  border-spacing: 0;
  margin: 12px 0;
  width: 100%;
}

div.dt-datetime table.dt-datetime-table-nospace {
  margin-top: -12px;
}

div.dt-datetime table th {
  font-size: 0.8em;
  color: #777;
  font-weight: normal;
  width: 14.285714286%;
  padding: 0 0 4px 0;
  text-align: center;
}

div.dt-datetime table td {
  font-size: 0.9em;
  color: #444;
  padding: 0;
}

div.dt-datetime table td.selectable {
  text-align: center;
  background: #f5f5f5;
}

div.dt-datetime table td.selectable.disabled {
  color: #aaa;
  background: white;
}

div.dt-datetime table td.selectable.disabled button:hover {
  color: #aaa;
  background: white;
}

div.dt-datetime table td.selectable.now {
  background-color: #ddd;
}

div.dt-datetime table td.selectable.now button {
  font-weight: bold;
}

div.dt-datetime table td.selectable.selected button {
  background: #4e6ca3;
  color: white;
  border-radius: 2px;
}

div.dt-datetime table td.selectable button:hover {
  background: #ff8000;
  color: white;
  border-radius: 2px;
}

div.dt-datetime table td.dt-datetime-week {
  font-size: 0.7em;
}

div.dt-datetime table button {
  width: 100%;
  box-sizing: border-box;
  border: none;
  background: transparent;
  font-size: inherit;
  color: inherit;
  text-align: center;
  padding: 4px 0;
  cursor: pointer;
  margin: 0;
}

div.dt-datetime table button span {
  display: inline-block;
  min-width: 14px;
  text-align: right;
}

div.dt-datetime table.weekNumber th {
  width: 12.5%;
}

div.dt-datetime div.dt-datetime-calendar table {
  margin-top: 0;
}

div.dt-datetime div.dt-datetime-label {
  position: relative;
  display: inline-block;
  height: 30px;
  padding: 5px 6px;
  border: 1px solid transparent;
  box-sizing: border-box;
  cursor: pointer;
}

div.dt-datetime div.dt-datetime-label:hover {
  border: 1px solid #ddd;
  border-radius: 2px;
  background-color: #f5f5f5;
}

div.dt-datetime div.dt-datetime-label select {
  position: absolute;
  top: 6px;
  left: 0;
  cursor: pointer;
  opacity: 0;
}

div.dt-datetime.horizontal {
  width: 550px;
}

div.dt-datetime.horizontal div.dt-datetime-date,
  div.dt-datetime.horizontal div.dt-datetime-time {
  width: 48%;
}

div.dt-datetime.horizontal div.dt-datetime-time {
  margin-left: 4%;
}

div.dt-datetime div.dt-datetime-date {
  position: relative;
  float: left;
  width: 100%;
}

div.dt-datetime div.dt-datetime-time {
  position: relative;
  float: left;
  width: 100%;
  text-align: center;
}

div.dt-datetime div.dt-datetime-time > span {
  vertical-align: middle;
}

div.dt-datetime div.dt-datetime-time th {
  text-align: left;
}

div.dt-datetime div.dt-datetime-time div.dt-datetime-timeblock {
  display: inline-block;
  vertical-align: middle;
}

div.dt-datetime div.dt-datetime-iconLeft,
  div.dt-datetime div.dt-datetime-iconRight {
  width: 30px;
  height: 30px;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0.3;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid transparent;
}

div.dt-datetime div.dt-datetime-iconLeft:hover,
  div.dt-datetime div.dt-datetime-iconRight:hover {
  border: 1px solid #ccc;
  border-radius: 2px;
  background-color: #f0f0f0;
  opacity: 0.6;
}

div.dt-datetime div.dt-datetime-iconLeft button,
  div.dt-datetime div.dt-datetime-iconRight button {
  border: none;
  background: transparent;
  text-indent: 30px;
  height: 100%;
  width: 100%;
  cursor: pointer;
}

div.dt-datetime div.dt-datetime-iconLeft {
  position: absolute;
  top: 5px;
  left: 5px;
}

div.dt-datetime div.dt-datetime-iconLeft button {
  position: relative;
  z-index: 1;
}

div.dt-datetime div.dt-datetime-iconLeft:after {
  position: absolute;
  top: 7px;
  left: 10px;
  display: block;
  content: "";
  border-top: 7px solid transparent;
  border-right: 7px solid black;
  border-bottom: 7px solid transparent;
}

div.dt-datetime div.dt-datetime-iconRight {
  position: absolute;
  top: 5px;
  right: 5px;
}

div.dt-datetime div.dt-datetime-iconRight button {
  position: relative;
  z-index: 1;
}

div.dt-datetime div.dt-datetime-iconRight:after {
  position: absolute;
  top: 7px;
  left: 12px;
  display: block;
  content: "";
  border-top: 7px solid transparent;
  border-left: 7px solid black;
  border-bottom: 7px solid transparent;
}

div.dt-datetime-error {
  clear: both;
  padding: 0 1em;
  max-width: 240px;
  font-size: 11px;
  line-height: 1.25em;
  text-align: center;
  color: #b11f1f;
}

html.dark input.dt-datetime {
  color-scheme: dark;
}

html.dark div.dt-datetime {
  border: 1px solid #595b5e;
  background-color: #212529;
  box-shadow: 3px 4px 10px 1px rgba(0, 0, 0, 0.8);
}

html.dark div.dt-datetime table th {
  color: #ccc;
}

html.dark div.dt-datetime table td {
  color: #eee;
}

html.dark div.dt-datetime table td.selectable {
  background: #373c41;
}

html.dark div.dt-datetime table td.selectable.disabled {
  color: #aaa;
  background: #171b1f;
}

html.dark div.dt-datetime table td.selectable.disabled button:hover {
  color: #aaa;
  background: #171b1f;
}

html.dark div.dt-datetime table td.selectable.now {
  background: #4b5055;
}

html.dark div.dt-datetime table td.selectable.selected button {
  background: #6ea8fe;
  color: black;
}

html.dark div.dt-datetime table td.selectable button:hover {
  background: #ff8000;
  color: black;
}

html.dark div.dt-datetime div.dt-datetime-label:hover {
  border: 1px solid transparent;
  background-color: rgba(255, 255, 255, 0.1);
}

html.dark div.dt-datetime div.dt-datetime-iconLeft:hover,
  html.dark div.dt-datetime div.dt-datetime-iconRight:hover,
  html.dark div.dt-datetime div.dt-datetime-iconUp:hover,
  html.dark div.dt-datetime div.dt-datetime-iconDown:hover {
  border: 1px solid transparent;
  background-color: rgba(255, 255, 255, 0.1);
}

html.dark div.dt-datetime div.dt-datetime-iconLeft:after {
  border-right-color: white;
}

html.dark div.dt-datetime div.dt-datetime-iconRight:after {
  border-left-color: white;
}

html.dark div.dt-datetime select {
  color-scheme: dark;
}

html.dark div.dt-datetime-error {
  color: #b11f1f;
}

table.dataTable thead tr > .dtfc-fixed-left,
  table.dataTable thead tr > .dtfc-fixed-right,
  table.dataTable tfoot tr > .dtfc-fixed-left,
  table.dataTable tfoot tr > .dtfc-fixed-right {
  top: 0;
  bottom: 0;
  z-index: 3;
  background-color: white;
}

table.dataTable tbody tr > .dtfc-fixed-left,
  table.dataTable tbody tr > .dtfc-fixed-right {
  z-index: 1;
  background-color: white;
}

div.dtfc-left-top-blocker,
  div.dtfc-right-top-blocker {
  background-color: white;
}

html.dark table.dataTable thead tr > .dtfc-fixed-left,
  html.dark table.dataTable thead tr > .dtfc-fixed-right,
  html.dark table.dataTable tfoot tr > .dtfc-fixed-left,
  html.dark table.dataTable tfoot tr > .dtfc-fixed-right {
  background-color: var(--dt-html-background);
}

html.dark table.dataTable tbody tr > .dtfc-fixed-left,
  html.dark table.dataTable tbody tr > .dtfc-fixed-right {
  background-color: var(--dt-html-background);
}

html.dark div.dtfc-left-top-blocker,
  html.dark div.dtfc-right-top-blocker {
  background-color: var(--dt-html-background);
}

table.fixedHeader-floating {
  background-color: white;
}

table.fixedHeader-floating.no-footer {
  border-bottom-width: 0;
}

table.fixedHeader-locked {
  position: absolute !important;
  background-color: white;
}

@media print {
  table.fixedHeader-floating {
    display: none;
  }
}

html.dark table.fixedHeader-floating {
  background-color: var(--dt-html-background);
}

html.dark table.fixedHeader-locked {
  background-color: var(--dt-html-background);
}

table.dataTable tbody th.focus,
  table.dataTable tbody td.focus {
  outline: 2px solid #3366ff;
  outline-offset: -2px;
}

table.dataTable tbody tr.selected th.focus,
  table.dataTable tbody tr.selected td.focus {
  outline-color: #0033cc;
}

div.dtk-focus-alt table.dataTable tbody th.focus,
  div.dtk-focus-alt table.dataTable tbody td.focus {
  outline: 2px solid #ff8b33;
  outline-offset: -2px;
}

html.dark table.dataTable tbody th.focus,
  html.dark table.dataTable tbody td.focus {
  outline-color: rgb(13, 110, 253);
}

html.dark table.dataTable tbody tr.selected th.focus,
  html.dark table.dataTable tbody tr.selected td.focus {
  outline-color: #0143a3;
}

html.dark div.dtk-focus-alt table.dataTable tbody th.focus,
  html.dark div.dtk-focus-alt table.dataTable tbody td.focus {
  outline-color: #ff8b33;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.child,
  table.dataTable.dtr-inline.collapsed > tbody > tr > th.child,
  table.dataTable.dtr-inline.collapsed > tbody > tr > td.dataTables_empty {
  cursor: default !important;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.child:before,
  table.dataTable.dtr-inline.collapsed > tbody > tr > th.child:before,
  table.dataTable.dtr-inline.collapsed
    > tbody
    > tr
    > td.dataTables_empty:before {
  display: none !important;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control,
  table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control {
  cursor: pointer;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before,
  table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before {
  margin-right: 0.5em;
  display: inline-block;
  color: rgba(0, 0, 0, 0.5);
  content: "►";
}

table.dataTable.dtr-inline.collapsed
    > tbody
    > tr
    > td.dtr-control.arrow-right::before,
  table.dataTable.dtr-inline.collapsed
    > tbody
    > tr
    > th.dtr-control.arrow-right::before {
  content: "◄";
}

table.dataTable.dtr-inline.collapsed
    > tbody
    > tr.parent
    > td.dtr-control:before,
  table.dataTable.dtr-inline.collapsed
    > tbody
    > tr.parent
    > th.dtr-control:before {
  content: "▼";
}

table.dataTable.dtr-inline.collapsed.compact > tbody > tr > td.dtr-control,
  table.dataTable.dtr-inline.collapsed.compact > tbody > tr > th.dtr-control {
  padding-left: 0.333em;
}

table.dataTable.dtr-column > tbody > tr > td.dtr-control,
  table.dataTable.dtr-column > tbody > tr > th.dtr-control,
  table.dataTable.dtr-column > tbody > tr > td.control,
  table.dataTable.dtr-column > tbody > tr > th.control {
  cursor: pointer;
}

table.dataTable.dtr-column > tbody > tr > td.dtr-control:before,
  table.dataTable.dtr-column > tbody > tr > th.dtr-control:before,
  table.dataTable.dtr-column > tbody > tr > td.control:before,
  table.dataTable.dtr-column > tbody > tr > th.control:before {
  display: inline-block;
  color: rgba(0, 0, 0, 0.5);
  content: "►";
}

table.dataTable.dtr-column > tbody > tr > td.dtr-control.arrow-right::before,
  table.dataTable.dtr-column > tbody > tr > th.dtr-control.arrow-right::before,
  table.dataTable.dtr-column > tbody > tr > td.control.arrow-right::before,
  table.dataTable.dtr-column > tbody > tr > th.control.arrow-right::before {
  content: "◄";
}

table.dataTable.dtr-column > tbody > tr.parent td.dtr-control:before,
  table.dataTable.dtr-column > tbody > tr.parent th.dtr-control:before,
  table.dataTable.dtr-column > tbody > tr.parent td.control:before,
  table.dataTable.dtr-column > tbody > tr.parent th.control:before {
  content: "▼";
}

table.dataTable > tbody > tr.child {
  padding: 0.5em 1em;
}

table.dataTable > tbody > tr.child:hover {
  background: transparent !important;
}

table.dataTable > tbody > tr.child ul.dtr-details {
  display: inline-block;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

table.dataTable > tbody > tr.child ul.dtr-details > li {
  border-bottom: 1px solid #efefef;
  padding: 0.5em 0;
}

table.dataTable > tbody > tr.child ul.dtr-details > li:first-child {
  padding-top: 0;
}

table.dataTable > tbody > tr.child ul.dtr-details > li:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

table.dataTable > tbody > tr.child span.dtr-title {
  display: inline-block;
  min-width: 75px;
  font-weight: bold;
}

div.dtr-modal {
  position: fixed;
  box-sizing: border-box;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 100;
  padding: 10em 1em;
}

div.dtr-modal div.dtr-modal-display {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 50%;
  height: -moz-fit-content;
  height: fit-content;
  max-height: 75%;
  margin: auto;
  z-index: 102;
  overflow: auto;
  background-color: #f5f5f7;
  border: 1px solid black;
  border-radius: 0.5em;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6);
}

div.dtr-modal div.dtr-modal-content {
  position: relative;
  padding: 2.5em;
}

div.dtr-modal div.dtr-modal-content h2 {
  margin-top: 0;
}

div.dtr-modal div.dtr-modal-close {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 22px;
  height: 22px;
  text-align: center;
  border-radius: 3px;
  cursor: pointer;
  z-index: 12;
}

div.dtr-modal div.dtr-modal-background {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 101;
  background: rgba(0, 0, 0, 0.6);
}

@media screen and (max-width: 767px) {
  div.dtr-modal div.dtr-modal-display {
    width: 95%;
  }
}

html.dark table.dataTable > tbody > tr > td.dtr-control:before {
  color: rgba(255, 255, 255, 0.5) !important;
}

html.dark table.dataTable > tbody > tr.child ul.dtr-details > li {
  border-bottom-color: rgb(64, 67, 70);
}

html.dark div.dtr-modal div.dtr-modal-display {
  background-color: rgb(33, 37, 41);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

table.dataTable tr.dtrg-group th {
  background-color: rgba(0, 0, 0, 0.1);
  text-align: left;
}

table.dataTable tr.dtrg-group.dtrg-level-0 th {
  font-weight: bold;
}

table.dataTable tr.dtrg-group.dtrg-level-1 th,
  table.dataTable tr.dtrg-group.dtrg-level-2 th,
  table.dataTable tr.dtrg-group.dtrg-level-3 th,
  table.dataTable tr.dtrg-group.dtrg-level-4 th,
  table.dataTable tr.dtrg-group.dtrg-level-5 th {
  background-color: rgba(0, 0, 0, 0.05);
  padding-top: 0.25em;
  padding-bottom: 0.25em;
  padding-left: 2em;
  font-size: 0.9em;
}

table.dataTable tr.dtrg-group.dtrg-level-2 th {
  background-color: rgba(0, 0, 0, 0.01);
  padding-left: 2.5em;
}

table.dataTable tr.dtrg-group.dtrg-level-3 th {
  background-color: rgba(0, 0, 0, 0.01);
  padding-left: 3em;
}

table.dataTable tr.dtrg-group.dtrg-level-4 th {
  background-color: rgba(0, 0, 0, 0.01);
  padding-left: 3.5em;
}

table.dataTable tr.dtrg-group.dtrg-level-5 th {
  background-color: rgba(0, 0, 0, 0.01);
  padding-left: 4em;
}

html.dark table.dataTable tr.dtrg-group th {
  background-color: rgba(255, 255, 255, 0.1);
}

html.dark table.dataTable tr.dtrg-group.dtrg-level-1 th {
  background-color: rgba(255, 255, 255, 0.05);
}

html.dark table.dataTable tr.dtrg-group.dtrg-level-2 th,
  html.dark table.dataTable tr.dtrg-group.dtrg-level-3 th,
  html.dark table.dataTable tr.dtrg-group.dtrg-level-4 th,
  html.dark table.dataTable tr.dtrg-group.dtrg-level-5 th {
  background-color: rgba(255, 255, 255, 0.01);
}

div.dt-rowReorder-float-parent {
  table-layout: fixed;
  outline: 2px solid rgb(10, 89, 203);
  z-index: 2001;
  position: absolute !important;
  overflow: hidden;
  border-radius: 3px;
}

div.dt-rowReorder-float-parent table.dt-rowReorder-float {
  opacity: 0.9;
  background-color: white;
  margin: 0 !important;
}

div.dt-rowReorder-float-parent.drop-not-allowed {
  cursor: not-allowed;
}

tr.dt-rowReorder-moving {
  outline: 2px solid #888;
  outline-offset: -2px;
}

body.dt-rowReorder-noOverflow {
  overflow-x: hidden;
}

table.dataTable td.reorder {
  text-align: center;
  cursor: move;
}

html.dark div.dt-rowReorder-float-parent {
  outline-color: rgb(110, 168, 254);
}

html.dark div.dt-rowReorder-float-parent table.dt-rowReorder-float {
  background-color: var(--dt-html-background);
}

html.dark tr.dt-rowReorder-moving {
  outline-color: #aaa;
}

div.dts {
  display: block !important;
}

div.dts tbody th,
  div.dts tbody td {
  white-space: nowrap;
}

div.dts div.dts_loading {
  z-index: 1;
}

div.dts div.dts_label {
  position: absolute;
  right: 20px;
  background: rgba(0, 0, 0, 0.8);
  color: white;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.5);
  text-align: right;
  border-radius: 3px;
  padding: 0.4em;
  z-index: 2;
  display: none;
}

div.dts div.dataTables_scrollBody {
  background: repeating-linear-gradient(
      45deg,
      rgba(0, 0, 0, 0.025),
      rgba(0, 0, 0, 0.025) 10px,
      rgba(0, 0, 0, 0) 10px,
      rgba(0, 0, 0, 0) 20px
    );
}

div.dts div.dataTables_scrollBody table {
  background-color: white;
  z-index: 2;
}

div.dts div.dt-length,
  div.dts div.dt-paging,
  div.dts div.dataTables_paginate,
  div.dts div.dataTables_length {
  display: none;
}

html.dark div.dts div.dts_label {
  background: rgba(255, 255, 255, 0.8);
  color: black;
}

html.dark div.dts div.dataTables_scrollBody {
  background: repeating-linear-gradient(
      45deg,
      rgba(255, 255, 255, 0.025),
      rgba(255, 255, 255, 0.025) 10px,
      rgba(255, 255, 255, 0) 10px,
      rgba(255, 255, 255, 0) 20px
    );
}

html.dark div.dts div.dataTables_scrollBody table {
  background-color: var(--dt-html-background);
  z-index: 2;
}

div.dt-button-collection {
  overflow: visible !important;
  z-index: 2002 !important;
}

div.dt-button-collection div.dtsb-searchBuilder {
  padding-left: 1em !important;
  padding-right: 1em !important;
}

div.dt-button-collection.dtb-collection-closeable div.dtsb-titleRow {
  padding-right: 40px;
}

.dtsb-greyscale {
  border: 1px solid #cecece !important;
}

div.dtsb-logicContainer .dtsb-greyscale {
  border: none !important;
}

div.dtsb-searchBuilder {
  justify-content: space-evenly;
  cursor: default;
  margin-bottom: 1em;
  text-align: left;
}

div.dtsb-searchBuilder button.dtsb-button,
  div.dtsb-searchBuilder select {
  font-size: 1em;
}

div.dtsb-searchBuilder div.dtsb-titleRow {
  justify-content: space-evenly;
  margin-bottom: 0.5em;
}

div.dtsb-searchBuilder div.dtsb-titleRow div.dtsb-title {
  display: inline-block;
  padding-top: 14px;
}

div.dtsb-searchBuilder div.dtsb-titleRow div.dtsb-title:empty {
  display: inline;
}

div.dtsb-searchBuilder div.dtsb-titleRow button.dtsb-clearAll {
  float: right;
  margin-bottom: 0.8em;
}

div.dtsb-searchBuilder div.dtsb-vertical .dtsb-value,
  div.dtsb-searchBuilder div.dtsb-vertical .dtsb-data,
  div.dtsb-searchBuilder div.dtsb-vertical .dtsb-condition {
  display: block;
}

div.dtsb-searchBuilder div.dtsb-group {
  position: relative;
  clear: both;
  margin-bottom: 0.8em;
}

div.dtsb-searchBuilder div.dtsb-group button.dtsb-search {
  float: right;
}

div.dtsb-searchBuilder div.dtsb-group button.dtsb-clearGroup {
  margin: 2px;
  text-align: center;
  padding: 0;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer {
  transform: rotate(90deg);
  position: absolute;
  margin-top: 0.8em;
  margin-right: 0.8em;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria {
  margin-bottom: 0.8em;
  display: flex;
  justify-content: start;
  flex-flow: row wrap;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-dropDown,
  div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {
  padding: 0.4em;
  margin-right: 0.8em;
  min-width: 5em;
  max-width: 20em;
  color: inherit;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    select.dtsb-dropDown
    option.dtsb-notItalic,
  div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    input.dtsb-input
    option.dtsb-notItalic {
  font-style: normal;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-italic {
  font-style: italic;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont {
  flex: 1;
  white-space: nowrap;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-inputCont
    span.dtsp-joiner {
  margin-right: 0.8em;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-inputCont
    input.dtsb-value {
  width: 33%;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-inputCont
    select,
  div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-inputCont
    input {
  height: 100%;
  box-sizing: border-box;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-buttonContainer {
  margin-left: auto;
  display: inline-block;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-buttonContainer
    button.dtsb-delete,
  div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-buttonContainer
    button.dtsb-right,
  div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-buttonContainer
    button.dtsb-left {
  margin-right: 0.8em;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-buttonContainer
    button.dtsb-delete:last-child,
  div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-buttonContainer
    button.dtsb-right:last-child,
  div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    div.dtsb-buttonContainer
    button.dtsb-left:last-child {
  margin-right: 0;
}

@media screen and (max-width: 550px) {
  div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria {
    display: flex;
    flex-flow: none;
    flex-direction: column;
    justify-content: start;
    padding-right: calc(35px + 0.8em);
    margin-bottom: 0px;
  }

  div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:not(:first-child),
    div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:not(:nth-child(2)),
    div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:not(:last-child) {
    padding-top: 0.8em;
  }

  div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:first-child,
    div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:nth-child(2),
    div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:last-child {
    padding-top: 0em;
  }

  div.dtsb-searchBuilder
      div.dtsb-group
      div.dtsb-criteria
      select.dtsb-dropDown,
    div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {
    max-width: none;
    width: 100%;
    margin-bottom: 0.8em;
    margin-right: 0.8em;
  }

  div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont {
    margin-right: 0.8em;
  }

  div.dtsb-searchBuilder
      div.dtsb-group
      div.dtsb-criteria
      div.dtsb-buttonContainer {
    position: absolute;
    width: 35px;
    display: flex;
    flex-wrap: wrap-reverse;
    right: 0;
  }

  div.dtsb-searchBuilder
      div.dtsb-group
      div.dtsb-criteria
      div.dtsb-buttonContainer
      button {
    margin-right: 0px !important;
  }
}

div.dtsb-searchBuilder button,
  div.dtsb-searchBuilder select.dtsb-dropDown,
  div.dtsb-searchBuilder input {
  background-color: #f9f9f9;
}

div.dtsb-searchBuilder button.dtsb-button {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  padding: 0.5em 1em;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 2px;
  cursor: pointer;
  font-size: 0.88em;
  line-height: 1.6em;
  color: inherit;
  white-space: nowrap;
  overflow: hidden;
  background-color: rgba(0, 0, 0, 0.1);
  /* Fallback */
  background: linear-gradient(
      to bottom,
      rgba(230, 230, 230, 0.1) 0%,
      rgba(0, 0, 0, 0.1) 100%
    );
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  text-decoration: none;
  outline: none;
  text-overflow: ellipsis;
}

div.dtsb-searchBuilder button.dtsb-button:hover {
  background-color: #cecece;
  cursor: pointer;
}

div.dtsb-searchBuilder div.dtsb-logicContainer {
  border: 1px solid rgba(0, 0, 0, 0.3);
  background-color: rgba(0, 0, 0, 0.1);
  /* Fallback */
  background: linear-gradient(
      to right,
      rgba(230, 230, 230, 0.1) 0%,
      rgba(0, 0, 0, 0.1) 100%
    );
}

div.dtsb-searchBuilder div.dtsb-logicContainer button {
  border: 1px solid transparent;
  background: transparent;
}

div.dtsb-searchBuilder button.dtsb-clearGroup {
  min-width: 2em;
  padding: 0;
}

div.dtsb-searchBuilder button.dtsb-iptbtn {
  min-width: 100px;
  text-align: left;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer {
  border: 1px solid;
  border-color: #cecece;
  border-radius: 3px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  align-items: flex-start;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-logicContainer
    button.dtsb-logic {
  border: none;
  border-radius: 0px;
  flex-grow: 1;
  flex-shrink: 0;
  flex-basis: 3em;
  margin: 0px;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-logicContainer
    button.dtsb-clearGroup {
  border: none;
  border-radius: 0px;
  width: 2em;
  margin: 0px;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-dropDown,
  div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {
  border: 1px solid;
  border-radius: 3px;
}

div.dtsb-searchBuilder
    div.dtsb-group
    div.dtsb-criteria
    select.dtsb-condition {
  border-color: #48b13c;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-data {
  border-color: #e70f00;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-value,
  div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-value {
  border-color: #0069ba;
}

html.dark div.dtsb-searchBuilder button.dtsb-button,
  html.dark div.dtsb-searchBuilder select.dtsb-dropDown,
  html.dark div.dtsb-searchBuilder input.dtsb-input {
  background-color: rgb(66, 69, 73) !important;
  color-scheme: dark;
}

html.dark div.dtsb-searchBuilder button.dtsb-button {
  border: 1px solid rgb(89, 91, 94);
  background: rgba(255, 255, 255, 0.15);
}

html.dark div.dtsb-searchBuilder button.dtsb-button:hover {
  background: rgba(179, 179, 179, 0.15);
}

html.dark div.dtsb-searchBuilder div.dtsb-logicContainer {
  border: 1px solid rgb(89, 91, 94);
}

html.dark div.dtsb-searchBuilder .dtsb-greyscale {
  border-color: rgba(255, 255, 255, 0.2) !important;
}

div.dtsp-topRow {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  border: 2px solid rgba(0, 0, 0, 0);
  border-radius: 3px;
  justify-content: space-around;
  align-content: flex-start;
  align-items: flex-start;
  min-height: 37px;
}

div.dtsp-topRow input.dtsp-search {
  text-overflow: ellipsis;
  min-width: 50px;
  flex-basis: 90px;
  max-width: none;
}

div.dtsp-topRow input.dtsp-search::-moz-placeholder {
  color: inherit;
}

div.dtsp-topRow input.dtsp-search::placeholder {
  color: inherit;
}

div.dtsp-topRow div.dtsp-subRow1 {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  flex: 1 1 auto;
}

div.dtsp-topRow div.dtsp-subRow1 div.dtsp-searchCont {
  position: relative;
  width: 100%;
}

div.dtsp-topRow
    div.dtsp-subRow1
    div.dtsp-searchCont
    input.dtsp-disabledButton {
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: transparent;
}

div.dtsp-topRow div.dtsp-subRow1 input {
  padding-right: 2em;
  width: 100% !important;
  box-sizing: border-box;
  font-size: 1em;
}

div.dtsp-topRow div.dtsp-subRow1 button.dtsp-searchIcon {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}

div.dtsp-topRow div.dtsp-subRow1 button.dtsp-searchIcon span {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAABbmlDQ1BpY2MAACiRdZE7SwNBFIU/EyWikRRaiFhsoWKhEBREO42FTZAQFYza7G5eQhKX3QQJtoKNhWAh2vgq/AfaCrYKgqAIIhb+Al+NhPVOEkiQZJbZ+3FmzmXmDHjCGTPrtAYhm8vb0bmQthxb0Xzv+PHRxRSabjrWTCQSpun4eaRF1YdR1av5voajM55wTGhpF54wLTsvPC0c3sxbineFe8y0Hhc+ER6x5YDCt0o3KvymOFXhL8X2YnQWPKqnlqpjo47NtJ0VHhYeyGYKZvU86ib+RG5pQWqfzH4coswRQsOgwDoZ8oxKzUlmjX3Bsm+eDfGY8rcoYosjRVq8I6IWpGtCalL0hHwZiir3/3k6yfGxSnd/CNpeXfdzEHz7UNpz3d9T1y2dgfcFrnM1/4bkNPkt+l5NGziGwDZc3tQ04wCudqD32dJtvSx5ZXqSSfi4gK4YdN9Dx2olq+o650+wuCVPdAeHRzAk+wNrfw8JaBFXEnV+AAAACXBIWXMAAA9hAAAPYQGoP6dpAAABMUlEQVQoU6XRr0vDQRjH8akoM4iIjqGoOIZ5oIjB5XWxajaYDGLSIhhNYjcPRDSJwbQNw+L+BNGgYYo/5pT5/shz8vDlBgMPXux7z3N3z+25VOofYyCyd4ZYCavI4gXPsRp9LqiDdrEMH+8wv8Vh8gBfWclFPOEUN3hAHjlMoRa7wTzBS5xgKLFglPkZLjDic6HyDsEMNvGR2Nxifoci3tEI+X770JU0XmPXIlax+LTPh83fFox1X6kxyzdjm9UcdXi9S+Vti6svfyNULhNR9TVsYNhW6Ff9KKCNR7/Zv6eeaQ+6+qcdpu9BqGlp1HFgud+FYdzzUcUExu0Q/cdzHGEFetIlXKPjK/sbqYoOftMiS+j9jzEJPd1Wt+5+kdR/9EM9ucIC5jCbyPc01Q32kfsBppYz3hYFcCwAAAAASUVORK5CYII=") !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
}

div.dtsp-topRow div.dtsp-subRow2 {
  white-space: nowrap;
  flex: 0 0 auto;
}

div.dtsp-topRow button > span {
  display: inline-block;
  height: 100%;
  width: 100%;
}

div.dtsp-topRow button.dtsp-nameButton span {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAABcGlDQ1BpY2MAACiRdZHNSwJBGMYftTDS8FCHkA57sOigIAXRMQzyYh3UIKvL7rirwe66zK6IdA26dBA6RF36OvQf1DXoWhAERRAR9B/0dQnZ3nEFJXSG2ffHs/O8zDwD+DM6M+yBJGCYDs+mU9JaYV0KviNMM4QoEjKzreXcUh59x88jfKI+JESv/vt6jlBRtRngGyKeYxZ3iBeIMzXHErxHPMbKcpH4hDjO6YDEt0JXPH4TXPL4SzDPZxcBv+gplbpY6WJW5gbxNHHM0KusfR5xk7BqruaoRmlNwEYWaaQgQUEVW9DhIEHVpMx6+5It3woq5GH0tVAHJ0cJZfLGSa1SV5WqRrpKU0dd5P4/T1ubnfG6h1PA4Kvrfk4CwX2g2XDd31PXbZ4BgRfg2uz4K5TT/DfpjY4WOwYiO8DlTUdTDoCrXWD82ZK53JICtPyaBnxcACMFYPQeGN7wsmr/x/kTkN+mJ7oDDo+AKdof2fwDCBRoDkL8UccAAAAJcEhZcwAAD2EAAA9hAag/p2kAAAK2SURBVFgJ7ZY9j41BFICvryCExrJBQ6HyEYVEIREaUZDQIRoR2ViJKCioxV+gkVXYTVZEQiEUhG2EQnxUCh0FKolY4ut5XnM2cyfva3Pt5m7EPcmzZ2bemTNnzjkzd1utnvQi0IvAfxiBy5z5FoxO89kPY+8mbMjtzs47RXs5/WVpbAG6bWExt5PuIibvhVkwmC+ck3eK9ln6/fAddFojYzBVuYSBpcnIEvRaqOw2RcaN18FPuJH0JvRUxbT3wWf4ltiKPgfVidWlbGZgPozDFfgAC+EA/K2EI4cwcAJ+gPaeQ+VQU2SOMMGcPgPl/m/V2p50rrbRsRgt9Iv5h6xtpP22Bz7Ce1C+gFFxfKzOmShcU+Qmyh2w3w8rIJfddHTck66EukL/xPhj+JM8rHNmFys0Pg4v0up3aFNlwR9NYyodd3OL/C64zpsymcTFcf6ElM4YzjAWKYrJkaq8kE/yUYNP4BoYvS1QRo+hNtF5xfkTUjoTheukSFFMjlTFm6PjceOca/SMpKfeCR1L6Uzk/y2WIkVhNFJlJAZhP+hYns7b9D3IPuhY5mYrIv8OrQJvR5NYyNaW4jsU8pSGNySiVx4o5tXq3JkoXE/mg5R/M8dGJCJpKhaDcjBRdbI/Rm8g69c122om33BHmj2CHoV5qa9jUXBraJ+G1fAVjIBO1klc87ro1K4JZ/K35SWW3TwcyDd6TecqnAEd8cGq2+w84xvBm1n3vS0izKkkwh5XNC/GmFPqqAtPF89AOScKuemaNzoTV1SD5dtSbmLf1/RV+tC0WTgcj6R7HEtrVGWaqu/lYDZ/2pvxQ/kIyw/gFByHC9AHw910hv1aUUumyd8yy0QfhmEkfiNod0Xusct68J1qc8Tdux0Z97Q+hsDb+AYGYEbF/4Guw2Q/qDPqZG/zXgT+3Qj8AtKnfWhFwmuAAAAAAElFTkSuQmCC") !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 23px;
  vertical-align: bottom;
}

div.dtsp-topRow button.dtsp-countButton span {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABcGlDQ1BpY2MAACiRdZHNSwJBGMYftTDS8FCHkA57sOigIAXRMQzyYh3UIKvL7rirwe66zK6IdA26dBA6RF36OvQf1DXoWhAERRAR9B/0dQnZ3nEFJXSG2ffHs/O8zDwD+DM6M+yBJGCYDs+mU9JaYV0KviNMM4QoEjKzreXcUh59x88jfKI+JESv/vt6jlBRtRngGyKeYxZ3iBeIMzXHErxHPMbKcpH4hDjO6YDEt0JXPH4TXPL4SzDPZxcBv+gplbpY6WJW5gbxNHHM0KusfR5xk7BqruaoRmlNwEYWaaQgQUEVW9DhIEHVpMx6+5It3woq5GH0tVAHJ0cJZfLGSa1SV5WqRrpKU0dd5P4/T1ubnfG6h1PA4Kvrfk4CwX2g2XDd31PXbZ4BgRfg2uz4K5TT/DfpjY4WOwYiO8DlTUdTDoCrXWD82ZK53JICtPyaBnxcACMFYPQeGN7wsmr/x/kTkN+mJ7oDDo+AKdof2fwDCBRoDkL8UccAAAAJcEhZcwAAD2EAAA9hAag/p2kAAAG5SURBVEgN3VU9LwVBFF0fiYhofUSlEQkKhU7z/oBCQkIiGr9BgUbhVzy9BAnhFyjV/AYFiU5ICM7ZN+c5Zud5dm3lJmfmzrkz9+7cu3c3y/6jjOBSF8CxXS7FmTkbwqIJjDpJvTcmsJ4K3KPZUpyZsx0sxoB9J6mnAkyC7wGuuCFIipNtEcpcWExgXpOBc78vgj6N+QO4NVsjwdFM59tUIDxDrHMBOeIQ34C5ZDregXuAQm4YcI68nN9B3wr2PcwPAIPkN2EqtJH6b+QZm1ajjTx7BqwAr26Lb+C2Kvpbt0Mb2HAJ7NrGFGfmXO3DeA4UshDfQAVmH0gaUFg852TTTDvlxwBlCtxy9zXyBhQFaq0wMmIdRebrfgosA3zb2hKnqG0oqchp4QbuR8X0TjzABhbdOT8jnQ/atcgqpnfwOA7yqZyTU587ZkIGdesLTt2EkynOnbreMUUKMI/dA4B/QVOcO13CQh+5wWCgDwo/75u59odB/wjmfhbgvACcAOyZPHihMWAoIwxyCLgf1oxfgjzVbgBXSTzIN+f0pg6s5DkcesLMRpsBrgE2XO3CN64JFP7JtUeKHX4CKtRRXFZ+7dEAAAAASUVORK5CYII=") !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px;
  vertical-align: bottom;
}

div.dtsp-topRow button.dtsp-collapseButton span.dtsp-caret {
  position: relative;
  top: 9px;
  display: inline-block;
}

div.dtsp-topRow button.dtsp-collapseButton.dtsp-rotated {
  transform: rotate(180deg);
}

div.dtsp-searchPane table thead th,
  div.dtsp-searchPane table thead td {
  width: 100% !important;
}

div.dt-button-collection {
  z-index: 2002;
}

div.dt-button-collection.dtb-collection-closeable div.dtsp-titleRow {
  padding-right: 25px;
}

div.dtsp-columns-1 {
  max-width: 100%;
  min-width: 100%;
  margin: 0px !important;
}

div.dtsp-columns-2 {
  max-width: 49%;
  min-width: 49%;
  margin: 0px !important;
}

div.dtsp-columns-3 {
  max-width: 32%;
  min-width: 32%;
  margin: 0px !important;
}

div.dtsp-columns-4 {
  max-width: 24%;
  min-width: 24%;
  margin: 0px !important;
}

div.dtsp-columns-5 {
  max-width: 19%;
  min-width: 19%;
  margin: 0px !important;
}

div.dtsp-columns-6 {
  max-width: 16%;
  min-width: 16%;
  margin: 0px !important;
}

div.dtsp-columns-7 {
  max-width: 14%;
  min-width: 14%;
  margin: 0px !important;
}

div.dtsp-columns-8 {
  max-width: 12%;
  min-width: 12%;
  margin: 0px !important;
}

div.dtsp-columns-9 {
  max-width: 10.5%;
  min-width: 10.5%;
  margin: 0px !important;
}

div.dtsp-narrow {
  flex-direction: column !important;
}

div.dtsp-narrow div.dtsp-subRow1,
  div.dtsp-narrow div.dtsp-subRow2 {
  width: 100%;
}

div.dtsp-narrow div.dtsp-subRow2 button {
  margin: 0 !important;
  width: 25% !important;
}

div.dt-button-collection {
  float: none;
}

div.dtsp-panesContainer {
  margin-bottom: 1em;
}

div.dtsp-searchPane div.dataTables_wrapper {
  width: 100%;
}

div.dtsp-searchPane div.dataTables_wrapper div.dataTables_layout_cell {
  padding: 0;
}

div.dtsp-searchPane div.dataTables_wrapper div.dataTables_scrollHead {
  display: none !important;
}

div.dtsp-searchPane div.dataTables_wrapper div.dataTables_scrollBody {
  background: white !important;
  border-bottom: none;
}

div.dtsp-searchPane div.dataTables_wrapper div.dataTables_scrollBody thead {
  display: none;
}

div.dtsp-searchPane div.dataTables_wrapper div.dataTables_scrollBody table {
  table-layout: fixed;
}

div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    table
    tr
    > th,
  div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    table
    tr
    > td {
  padding: 5px 10px;
}

div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    td.dtsp-nameColumn {
  width: 100% !important;
}

div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    div.dtsp-nameCont {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-content: flex-start;
  align-items: flex-start;
}

div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    div.dtsp-nameCont
    span.dtsp-name,
  div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    div.dtsp-nameCont
    span.dtsp-pill {
  cursor: default;
}

div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    div.dtsp-nameCont
    span.dtsp-name {
  text-overflow: ellipsis;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  flex-grow: 1;
  text-align: left;
}

div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    div.dtsp-nameCont
    span.dtsp-pill {
  display: inline-block;
  background-color: #cfcfcf;
  text-align: center;
  border-radius: 10px;
  width: auto;
  min-width: 30px;
  color: black;
  font-size: 0.9em;
  padding: 0 4px;
}

div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    div.dtsp-nameCont
    span.dtsp-pill:empty {
  display: none;
}

div.dtsp-panesContainer {
  clear: both;
  padding-left: 0;
  padding-right: 0;
  text-align: center;
}

div.dtsp-panesContainer div.dtsp-searchPanes {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: flex-start;
  align-items: stretch;
  clear: both;
  text-align: left;
}

div.dtsp-panesContainer div.dtsp-searchPanes div.dtsp-searchPane {
  flex-grow: 1;
  flex-shrink: 0;
  font-size: 0.9em;
  margin-top: 15px !important;
}

div.dtsp-panesContainer
    div.dtsp-searchPanes
    div.dtsp-searchPane
    div.dataTables_wrapper {
  flex: 1;
  box-sizing: border-box;
}

div.dtsp-panesContainer
    div.dtsp-searchPanes
    div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_filter {
  display: none;
}

div.dtsp-panesContainer div.dtsp-title {
  float: left;
  padding: 10px 0;
}

div.dtsp-panesContainer button.dtsp-clearAll,
  div.dtsp-panesContainer button.dtsp-collapseAll,
  div.dtsp-panesContainer button.dtsp-showAll {
  float: right;
  padding: 10px;
}

div.dtsp-hidden {
  display: none !important;
}

div.dtsp-searchPane div.dataTables_wrapper {
  border: 1px solid #f0f0f0;
  border-radius: 4px;
  overflow: hidden;
}

div.dtsp-searchPane div.dataTables_wrapper:hover {
  border: 1px solid #cfcfcf;
}

div.dtsp-searchPane div.dtsp-topRow {
  border: 1px solid transparent;
}

div.dtsp-searchPane div.dtsp-topRow div.dtsp-searchCont input.dtsp-search {
  border: none;
  padding-left: 3px;
}

div.dtsp-searchPane div.dtsp-topRow.dtsp-bordered {
  border: 1px solid #f0f0f0;
  border-radius: 3px;
}

div.dtsp-searchPane div.dtsp-topRow.dtsp-bordered:hover {
  background-color: #f0f0f0;
}

div.dtsp-searchPane input.dtsp-paneInputButton,
  div.dtsp-searchPane button.dtsp-paneButton {
  height: 35px;
  width: 35px;
  min-width: 0;
  display: inline-block;
  margin: 2px;
  border: 0px solid transparent;
  background-color: transparent;
  margin-bottom: 0px;
}

div.dtsp-searchPane input.dtsp-paneInputButton:hover,
  div.dtsp-searchPane button.dtsp-paneButton:hover {
  background-color: #f0f0f0;
  border-radius: 2px;
  cursor: pointer;
}

div.dtsp-searchPane button.dtsp-paneButton {
  vertical-align: middle;
  opacity: 0.6;
}

div.dtsp-panesContainer button.dtsp-clearAll,
  div.dtsp-panesContainer button.dtsp-collapseAll,
  div.dtsp-panesContainer button.dtsp-showAll {
  border: 1px solid transparent;
  background-color: transparent;
}

div.dtsp-panesContainer button.dtsp-clearAll:hover,
  div.dtsp-panesContainer button.dtsp-collapseAll:hover,
  div.dtsp-panesContainer button.dtsp-showAll:hover {
  background-color: #f0f0f0;
  border-radius: 2px;
  cursor: pointer;
}

div.dtsp-panesContainer button.dtsp-disabledButton {
  cursor: default !important;
  color: rgb(124, 124, 124);
}

div.dtsp-panesContainer button.dtsp-disabledButton:hover {
  background-color: transparent;
}

div.dtsp-panesContainer button.dtsp-disabledButton:focus {
  outline: none;
}

@media screen and (max-width: 767px) {
  div.dtsp-columns-4,
    div.dtsp-columns-5,
    div.dtsp-columns-6 {
    max-width: 31% !important;
    min-width: 31% !important;
  }
}

@media screen and (max-width: 640px) {
  div.dtsp-searchPanes {
    flex-direction: column !important;
  }

  div.dtsp-searchPane {
    max-width: 98% !important;
    min-width: 98% !important;
  }
}

html.dark div.dtsp-topRow div.dtsp-subRow1 button.dtsp-searchIcon span {
  filter: invert();
}

html.dark div.dtsp-topRow button.dtsp-nameButton span {
  filter: invert();
}

html.dark div.dtsp-topRow button.dtsp-countButton span {
  filter: invert();
}

html.dark div.dtsp-topRow input.dtsp-paneInputButton,
  html.dark div.dtsp-topRow button.dtsp-paneButton {
  color: inherit;
}

html.dark div.dtsp-topRow input.dtsp-paneInputButton:hover,
  html.dark div.dtsp-topRow button.dtsp-paneButton:hover {
  background-color: rgb(64, 69, 73);
}

html.dark div.dtsp-topRow.dtsp-bordered {
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgb(47, 52, 56) !important;
}

html.dark div.dtsp-topRow.dtsp-bordered:hover {
  border: 1px solid rgba(255, 255, 255, 0.3);
}

html.dark div.dtsp-panesContainer button.dtsp-clearAll,
  html.dark div.dtsp-panesContainer button.dtsp-collapseAll,
  html.dark div.dtsp-panesContainer button.dtsp-showAll {
  color: inherit;
}

html.dark div.dtsp-panesContainer button.dtsp-clearAll:hover,
  html.dark div.dtsp-panesContainer button.dtsp-collapseAll:hover,
  html.dark div.dtsp-panesContainer button.dtsp-showAll:hover {
  background-color: rgb(64, 69, 73);
}

html.dark div.dtsp-panesContainer button.dtsp-disabledButton {
  color: rgb(124, 124, 124);
}

html.dark div.dtsp-searchPane div.dataTables_wrapper {
  border: 1px solid rgba(255, 255, 255, 0.2);
}

html.dark div.dtsp-searchPane div.dataTables_wrapper:hover {
  border: 1px solid rgba(255, 255, 255, 0.3);
}

html.dark
    div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody {
  background: rgb(47, 52, 56) !important;
}

html.dark
    div.dtsp-searchPane
    div.dataTables_wrapper
    div.dataTables_scrollBody
    div.dtsp-nameCont
    span.dtsp-pill {
  background-color: rgb(33, 37, 41);
  color: inherit;
}

table.dataTable > tbody > tr > .selected {
  background-color: rgba(13, 110, 253, 0.9);
  color: white;
}

table.dataTable > tbody > tr > td.select-checkbox,
  table.dataTable > tbody > tr > th.select-checkbox {
  position: relative;
}

table.dataTable > tbody > tr > td.select-checkbox:before,
  table.dataTable > tbody > tr > td.select-checkbox:after,
  table.dataTable > tbody > tr > th.select-checkbox:before,
  table.dataTable > tbody > tr > th.select-checkbox:after {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 16px;
  box-sizing: border-box;
}

table.dataTable > tbody > tr > td.select-checkbox:before,
  table.dataTable > tbody > tr > th.select-checkbox:before {
  content: " ";
  margin-top: -6px;
  margin-left: -6px;
  border: 1px solid #d6d8df;
  background-color: var(--white);
  border-radius: 4px;
}

table.dataTable > tbody > tr.selected > td.select-checkbox:before,
  table.dataTable > tbody > tr.selected > th.select-checkbox:before {
  border: 1px solid #d6d8df;
}

table.dataTable > tbody > tr.selected > td.select-checkbox:after,
  table.dataTable > tbody > tr.selected > th.select-checkbox:after {
  content: url("../img/icons/check-table.svg");
  background-color: var(--primary);
  font-size: 0px;
  margin-top: -6px;
  height: 16px;
  margin-left: -6px;
  text-align: center;
  border-radius: 3px;
}

table.dataTable.compact > tbody > tr > td.select-checkbox:before,
  table.dataTable.compact > tbody > tr > th.select-checkbox:before {
  margin-top: -12px;
}

table.dataTable.compact > tbody > tr.selected > td.select-checkbox:after,
  table.dataTable.compact > tbody > tr.selected > th.select-checkbox:after {
  margin-top: -16px;
}

div.dataTables_wrapper span.select-info,
  div.dataTables_wrapper span.select-item {
  margin-left: 0.5em;
}

html.dark table.dataTable > tbody > tr > td.select-checkbox:before,
  html.dark table.dataTable > tbody > tr > th.select-checkbox:before,
  html[data-bs-theme="dark"]
    table.dataTable
    > tbody
    > tr
    > td.select-checkbox:before,
  html[data-bs-theme="dark"]
    table.dataTable
    > tbody
    > tr
    > th.select-checkbox:before {
  border: 1px solid rgba(255, 255, 255, 0.6);
}

@media screen and (max-width: 640px) {
  div.dataTables_wrapper span.select-info,
    div.dataTables_wrapper span.select-item {
    margin-left: 0;
    display: block;
  }
}

div.dtsr-confirmation,
  div.dtsr-creation {
  position: fixed;
  top: 20%;
  left: 50%;
  width: 500px;
  margin-left: -250px;
  background-color: white;
  border-radius: 0.75em;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6);
  z-index: 2003;
  box-sizing: border-box;
  padding: 2em;
}

div.dtsr-confirmation button,
  div.dtsr-creation button {
  display: inline-block;
  margin: 1em;
  padding: 0.5em 1em;
  border-radius: 0.5em;
  border: 1px solid rgba(0, 0, 0, 0.175);
  background-color: #f6f6f6;
  text-align: left;
  cursor: pointer;
}

div.dtsr-confirmation button:hover,
  div.dtsr-creation button:hover {
  background-color: #ebebeb;
}

div.dtsr-confirmation div.dtsr-creation-text,
  div.dtsr-confirmation div.dtsr-confirmation-title-row,
  div.dtsr-creation div.dtsr-creation-text,
  div.dtsr-creation div.dtsr-confirmation-title-row {
  text-align: left;
}

div.dtsr-confirmation div.dtsr-creation-text h2,
  div.dtsr-confirmation div.dtsr-confirmation-title-row h2,
  div.dtsr-creation div.dtsr-creation-text h2,
  div.dtsr-creation div.dtsr-confirmation-title-row h2 {
  border-bottom: 0px;
  margin-top: 0px;
  padding-top: 0px;
  margin-bottom: 1rem;
}

div.dtsr-confirmation div.dtsr-confirmation-text,
  div.dtsr-creation div.dtsr-confirmation-text {
  text-align: center;
}

div.dtsr-confirmation div.dtsr-modal-foot,
  div.dtsr-confirmation div.dtsr-confirmation-buttons,
  div.dtsr-creation div.dtsr-modal-foot,
  div.dtsr-creation div.dtsr-confirmation-buttons {
  text-align: right;
  margin-top: 1em;
}

div.dtsr-confirmation div.dtsr-modal-foot button,
  div.dtsr-confirmation div.dtsr-confirmation-buttons button,
  div.dtsr-creation div.dtsr-modal-foot button,
  div.dtsr-creation div.dtsr-confirmation-buttons button {
  margin: 0px;
}

div.dtsr-confirmation div.dtsr-creation-text,
  div.dtsr-creation div.dtsr-creation-text {
  text-align: left;
  padding: 0px;
  border: none;
}

div.dtsr-confirmation div.dtsr-creation-text span,
  div.dtsr-creation div.dtsr-creation-text span {
  font-size: 20px;
}

div.dtsr-confirmation div.dtsr-creation-form div.dtsr-left,
  div.dtsr-confirmation div.dtsr-creation-form div.dtsr-right,
  div.dtsr-creation div.dtsr-creation-form div.dtsr-left,
  div.dtsr-creation div.dtsr-creation-form div.dtsr-right {
  display: inline-block;
  width: 50%;
}

div.dtsr-confirmation div.dtsr-creation-form div.dtsr-left,
  div.dtsr-creation div.dtsr-creation-form div.dtsr-left {
  text-align: right;
}

div.dtsr-confirmation div.dtsr-creation-form div.dtsr-right,
  div.dtsr-confirmation div.dtsr-creation-form div.dtsr-name-row,
  div.dtsr-creation div.dtsr-creation-form div.dtsr-right,
  div.dtsr-creation div.dtsr-creation-form div.dtsr-name-row {
  text-align: left;
}

div.dtsr-confirmation div.dtsr-creation-form div.dtsr-form-row,
  div.dtsr-creation div.dtsr-creation-form div.dtsr-form-row {
  margin: 0.5em 0;
}

div.dtsr-confirmation div.dtsr-creation-form div.dtsr-form-row:first-child,
  div.dtsr-creation div.dtsr-creation-form div.dtsr-form-row:first-child {
  margin-top: 0;
}

div.dtsr-confirmation div.dtsr-creation-form div.dtsr-form-row:last-child,
  div.dtsr-creation div.dtsr-creation-form div.dtsr-form-row:last-child {
  margin-bottom: 0;
}

div.dtsr-confirmation
    div.dtsr-creation-form
    div.dtsr-form-row
    label.dtsr-name-label,
  div.dtsr-creation
    div.dtsr-creation-form
    div.dtsr-form-row
    label.dtsr-name-label {
  width: 25%;
  display: inline-block;
  text-align: right;
  padding-right: 15px;
  padding-left: 15px;
}

div.dtsr-confirmation
    div.dtsr-creation-form
    div.dtsr-form-row
    input.dtsr-name-input,
  div.dtsr-creation
    div.dtsr-creation-form
    div.dtsr-form-row
    input.dtsr-name-input {
  width: 66.6%;
  display: inline-block;
}

div.dtsr-confirmation
    div.dtsr-creation-form
    div.dtsr-form-row
    input.dtsr-check-box,
  div.dtsr-creation
    div.dtsr-creation-form
    div.dtsr-form-row
    input.dtsr-check-box {
  margin-left: 25%;
  margin-right: 14px;
  display: inline-block;
}

div.dtsr-confirmation div.dtsr-confirmation-text,
  div.dtsr-creation div.dtsr-confirmation-text {
  text-align: left;
}

div.dtsr-confirmation div.dtsr-confirmation-text label.dtsr-name-label,
  div.dtsr-creation div.dtsr-confirmation-text label.dtsr-name-label {
  width: auto;
  display: inline-block;
  text-align: right;
  padding-right: 15px;
}

div.dtsr-confirmation div.dtsr-confirmation-text input.dtsr-name-input,
  div.dtsr-creation div.dtsr-confirmation-text input.dtsr-name-input {
  width: 66.6%;
  display: inline-block;
}

div.dtsr-confirmation div.dtsr-confirmation-text input.dtsr-check-box,
  div.dtsr-creation div.dtsr-confirmation-text input.dtsr-check-box {
  margin-left: 33.3%;
  margin-right: 14px;
  display: inline-block;
}

div.dtsr-confirmation div.dtsr-modal-foot,
  div.dtsr-creation div.dtsr-modal-foot {
  text-align: right;
  padding-top: 10px;
}

div.dtsr-confirmation span.dtsr-modal-error,
  div.dtsr-creation span.dtsr-modal-error {
  color: red;
  font-size: 0.9em;
}

div.dtsr-creation {
  top: 10%;
}

div.dtsr-check-row {
  padding-top: 0px;
}

div.dtsr-popover-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 22px;
  height: 22px;
  text-align: center;
  border-radius: 3px;
  cursor: pointer;
  z-index: 12;
}

div.dtsr-background {
  z-index: 2002;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  background: radial-gradient(
      ellipse farthest-corner at center,
      rgba(0, 0, 0, 0.3) 0%,
      rgba(0, 0, 0, 0.7) 100%
    );
}

div.dt-button-collection h3 {
  text-align: center;
  margin-top: 4px;
  margin-bottom: 8px;
  font-size: 1.5em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

div.dt-button-collection span.dtsr-emptyStates {
  border-radius: 5px;
  display: inline-block;
  line-height: 1.6em;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
  width: 100%;
  padding-bottom: 7px;
  padding-top: 3px;
}

html.dark div.dtsr-confirmation,
  html.dark div.dtsr-creation,
  html[data-bs-theme="dark"] div.dtsr-confirmation,
  html[data-bs-theme="dark"] div.dtsr-creation {
  background-color: rgb(33, 37, 41);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

html.dark div.dtsr-confirmation button,
  html.dark div.dtsr-creation button,
  html[data-bs-theme="dark"] div.dtsr-confirmation button,
  html[data-bs-theme="dark"] div.dtsr-creation button {
  color: inherit;
  border: 1px solid rgba(255, 255, 255, 0.175);
  background-color: rgb(47, 52, 56);
}

html.dark div.dtsr-confirmation button:hover,
  html.dark div.dtsr-creation button:hover,
  html[data-bs-theme="dark"] div.dtsr-confirmation button:hover,
  html[data-bs-theme="dark"] div.dtsr-creation button:hover {
  background-color: rgb(64, 69, 73);
}

div.dt-button-collection h3 {
  font-size: 1.1em;
}

div.dtsr-creation-form div.dtsr-form-row input.dtsr-name-input {
  width: 57% !important;
  padding: 5px 4px;
  border: 1px solid #aaa;
  border-radius: 3px;
}

div.dtsr-creation-form div.dtsr-form-row input.dtsr-check-box {
  margin-left: calc(25% + 30px) !important;
}

div.dtsr-creation-form div.dtsr-form-row label.dtsr-toggle-title {
  margin-right: calc(-25% - 30px) !important;
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.child,table.dataTable.dtr-inline.collapsed>tbody>tr>th.child,table.dataTable.dtr-inline.collapsed>tbody>tr>td.dataTables_empty{
  cursor:default !important
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.child:before,table.dataTable.dtr-inline.collapsed>tbody>tr>th.child:before,table.dataTable.dtr-inline.collapsed>tbody>tr>td.dataTables_empty:before{
  display:none !important
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control,table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control{
  position:relative;
  padding-left:30px;
  cursor:pointer
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before,table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before{
  top:50%;
  left:5px;
  height:1em;
  width:1em;
  margin-top:-9px;
  display:block;
  position:absolute;
  color:white;
  border:.15em solid white;
  border-radius:1em;
  box-shadow:0 0 .2em #444;
  box-sizing:content-box;
  text-align:center;
  text-indent:0 !important;
  font-family:"Courier New",Courier,monospace;
  line-height:1em;
  content:"+";
  background-color:#31b131
}

table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td.dtr-control:before,table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th.dtr-control:before{
  content:"-";
  background-color:#d33333
}

table.dataTable.dtr-inline.collapsed.compact>tbody>tr>td.dtr-control,table.dataTable.dtr-inline.collapsed.compact>tbody>tr>th.dtr-control{
  padding-left:27px
}

table.dataTable.dtr-inline.collapsed.compact>tbody>tr>td.dtr-control:before,table.dataTable.dtr-inline.collapsed.compact>tbody>tr>th.dtr-control:before{
  left:4px;
  height:14px;
  width:14px;
  border-radius:14px;
  line-height:14px;
  text-indent:3px
}

table.dataTable.dtr-column>tbody>tr>td.dtr-control,table.dataTable.dtr-column>tbody>tr>th.dtr-control,table.dataTable.dtr-column>tbody>tr>td.control,table.dataTable.dtr-column>tbody>tr>th.control{
  position:relative;
  cursor:pointer
}

table.dataTable.dtr-column>tbody>tr>td.dtr-control:before,table.dataTable.dtr-column>tbody>tr>th.dtr-control:before,table.dataTable.dtr-column>tbody>tr>td.control:before,table.dataTable.dtr-column>tbody>tr>th.control:before{
  top:50%;
  left:50%;
  height:.8em;
  width:.8em;
  margin-top:-0.5em;
  margin-left:-0.5em;
  display:block;
  position:absolute;
  color:white;
  border:.15em solid white;
  border-radius:1em;
  box-shadow:0 0 .2em #444;
  box-sizing:content-box;
  text-align:center;
  text-indent:0 !important;
  font-family:"Courier New",Courier,monospace;
  line-height:1em;
  content:"+";
  background-color:#31b131
}

table.dataTable.dtr-column>tbody>tr.parent td.dtr-control:before,table.dataTable.dtr-column>tbody>tr.parent th.dtr-control:before,table.dataTable.dtr-column>tbody>tr.parent td.control:before,table.dataTable.dtr-column>tbody>tr.parent th.control:before{
  content:"-";
  background-color:#d33333
}

table.dataTable>tbody>tr.child{
  padding:.5em 1em
}

table.dataTable>tbody>tr.child:hover{
  background:transparent !important
}

table.dataTable>tbody>tr.child ul.dtr-details{
  display:inline-block;
  list-style-type:none;
  margin:0;
  padding:0
}

table.dataTable>tbody>tr.child ul.dtr-details>li{
  border-bottom:1px solid #efefef;
  padding:.5em 0
}

table.dataTable>tbody>tr.child ul.dtr-details>li:first-child{
  padding-top:0
}

table.dataTable>tbody>tr.child ul.dtr-details>li:last-child{
  border-bottom:none
}

table.dataTable>tbody>tr.child span.dtr-title{
  display:inline-block;
  min-width:75px;
  font-weight:bold
}

div.dtr-modal{
  position:fixed;
  box-sizing:border-box;
  top:0;
  left:0;
  height:100%;
  width:100%;
  z-index:100;
  padding:10em 1em
}

div.dtr-modal div.dtr-modal-display{
  position:absolute;
  top:0;
  left:0;
  bottom:0;
  right:0;
  width:50%;
  height:50%;
  margin:auto;
  z-index:102;
  overflow:auto;
  background-color:#f5f5f7;
  border:1px solid black;
  border-radius:.5em;
  box-shadow:0 12px 30px rgba(0, 0, 0, 0.6)
}

div.dtr-modal div.dtr-modal-content{
  position:relative;
  padding:1em
}

div.dtr-modal div.dtr-modal-close{
  position:absolute;
  top:6px;
  right:6px;
  width:22px;
  height:22px;
  border:1px solid #eaeaea;
  background-color:#f9f9f9;
  text-align:center;
  border-radius:3px;
  cursor:pointer;
  z-index:12
}

div.dtr-modal div.dtr-modal-close:hover{
  background-color:#eaeaea
}

div.dtr-modal div.dtr-modal-background{
  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  z-index:101;
  background:rgba(0, 0, 0, 0.6)
}

@media screen and (max-width: 767px){
  div.dtr-modal div.dtr-modal-display{
    width:95%
  }
}

/* Stile generale per il container della matrice */

.risk-matrix-wrapper{
  max-width: calc(100dvw - var(--menuWidth) - 60px);
}

.risk-matrix-container {
  color: #333;
  background-color: #f5f7fa;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  margin: 1.5rem 0;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
}

/* Imposta una larghezza massima e consenti il testo a capo per le celle con data-title="Evento pericoloso" */

.risk-table td{
  max-width: 300px;
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/* Stili per le schede di navigazione tra le fasi */

.phase-tabs {
  display: flex;
  background-color: #fff;
  border-bottom: 1px solid #e1e5eb;
  padding: 0 1rem;
  position: sticky;
  top: 0;
  z-index: 10;
  flex-wrap: wrap;
}

.phase-tab {
  padding: 1rem 1.5rem;
  color: #64748b;
  font-weight: 600;
  font-size: 0.95rem;
  border: none;
  background: transparent;
  border-bottom: 3px solid transparent;
  cursor: pointer;
  transition: all 0.2s ease;
  text-align: center;
  white-space: nowrap;
}

.phase-tab:hover {
  color: var(--primary);
}

.phase-tab.active {
  color:  var(--primary);
  border-bottom-color:  var(--primary);
}

/* Contenuto delle fasi */

.phase-content {
  padding: 1.5rem;
  overflow-x: auto;
}

.phase-panel {
  display: none;
}

.phase-panel.active {
  display: block;
}

/* Header delle fasi */

.phase-header {
  margin-bottom: 1.5rem;
}

.phase-header h2 {
  font-size: 1.5rem;
  margin: 0 0 0.5rem 0;
  color: #1e293b;
}

.phase-header p {
  color: var(--text-small);
  margin: 0;
}

/* Wrapper per la tabella con scroll orizzontale */

.risk-table-wrapper {
  overflow-x: auto;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  margin-bottom: 2rem;
  background-color: #fff;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
  /* Miglior scorrimento su iOS */
}

/* Stile base della tabella */

.risk-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  white-space: nowrap;
  min-width: 1000px;
  /* Assicura che la tabella non si comprima troppo */
}

/* Header della tabella */

.risk-table th {
  background-color: #f8fafc;
  color: #4b5563;
  font-weight: 600;
  text-align: left;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #e5e7eb;
  position: sticky;
  top: 0;
  z-index: 1;
}

.header-group {
  text-transform: uppercase;
  letter-spacing: 0.025rem;
  font-size: 0.8rem;
  text-align: center;
}

/* Colori per i gruppi di header */

.header-group.identification {
  background-color: #e0f2fe;
  color: #0369a1;
}

.header-group.event {
  background-color: #fef3c7;
  color: #92400e;
}

.header-group.evaluation {
  background-color: #fce7f3;
  color: #9d174d;
}

.header-group.control {
  background-color: #dcfce7;
  color: #15803d;
}

.header-group.monitoring {
  background-color: #dbeafe;
  color: #1d4ed8;
}

.header-group.residual {
  background-color: #f3e8ff;
  color: #7e22ce;
}

.header-group.improvement {
  background-color: #f0fdf4;
  color: #166534;
}

.header-group.verification {
  background-color: #e0f2fe;
  color: #0284c7;
}

/* Titoli delle colonne */

.title-identification {
  font-size: 0.85rem;
  font-weight: 500;
  padding: 0.75rem 1rem;
  vertical-align: middle;
  height: 80px;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  background-color: #f8fafc;
}

/* Celle della tabella */

.risk-table td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #e5e7eb;
  font-size: 0.875rem;
  vertical-align: middle;
  transition: background-color 0.15s ease;
}

.risk-table tr:hover td {
  background-color: #f8fafc;
}

/* Celle cliccabili con effetto hover */

.risk-table td[style*="cursor:pointer"] {
  position: relative;
  background-color: #fff;
}

.risk-table td[style*="cursor:pointer"]:hover {
  background-color: #f1f5f9;
}

/* Icona di modifica sulle celle cliccabili */

.risk-table td[style*="cursor:pointer"]::after {
  content: '✎';
  position: absolute;
  top: 4px;
  right: 4px;
  color: #94a3b8;
  font-size: 12px;
  opacity: 0;
  transition: opacity 0.2s;
}

.risk-table td[style*="cursor:pointer"]:hover::after {
  opacity: 1;
}

/* Celle non cliccabili */

.noClick {
  background-color: #f8fafc !important;
}

/* Celle con rischio */

.risk1, .risk2, .risk3 {
  font-weight: 600;
  text-align: center;
  position: relative;
}

/* Effetto di evidenziazione per rischio alto (> 15) */

.risk1[data-value='15'], .risk2[data-value='15'], .risk3[data-value='15'],
.risk1[data-value='16'], .risk2[data-value='16'], .risk3[data-value='16'],
.risk1[data-value='20'], .risk2[data-value='20'], .risk3[data-value='20'],
.risk1[data-value='25'], .risk2[data-value='25'], .risk3[data-value='25'] {
  background-color: #fee2e2 !important;
  color: #b91c1c;
}

/* Effetto di evidenziazione per rischio medio (8-12) */

.risk1[data-value='8'], .risk2[data-value='8'], .risk3[data-value='8'],
.risk1[data-value='9'], .risk2[data-value='9'], .risk3[data-value='9'],
.risk1[data-value='10'], .risk2[data-value='10'], .risk3[data-value='10'],
.risk1[data-value='12'], .risk2[data-value='12'], .risk3[data-value='12'] {
  background-color: #fef3c7 !important;
  color: #92400e;
}

/* Pulsanti aggiungi e rimuovi riga */

.add-row-button, .delete-row-button {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  transition: background-color 0.2s;
}

.add-row-button {
  color: #2563eb;
}

.delete-row-button {
  color: #dc2626;
}

.add-row-button:hover, .delete-row-button:hover {
  background-color: #f1f5f9;
}

/* Contenitore azioni per le righe */

.button-table-container {
  display: flex;
  gap: 0.5rem;
}

/* Input nascosti */

.hidden {
  display: none;
}

/* Pannello di riepilogo */

.risk-summary {
  margin-top: 2rem;
}

.summary-panel {
  background-color: #fff;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  padding: 1.5rem;
}

.summary-panel h3 {
  margin-top: 0;
  margin-bottom: 1rem;
  font-size: 1.25rem;
  color: #1e293b;
}

.summary-metrics {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
}

.metric {
  display: flex;
  flex-direction: column;
  min-width: 120px;
  margin-bottom: 1rem;
}

.metric-label {
  font-size: 0.875rem;
  color: #64748b;
  margin-bottom: 0.25rem;
}

.metric-value {
  font-size: 1.5rem;
  font-weight: 600;
  color: #1e293b;
}

/* Contenitore del pulsante salva */

.save-container {
  position: sticky;
  bottom: 1.5rem;
  margin-top: 1rem;
  display: flex;
  justify-content: center;
  z-index: 10;
}

.save-button {
  background-color: var(--primary);
  color: white;
  border: none;
  border-radius: 6px;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s;
  box-shadow: 0 2px 10px rgba(37, 99, 235, 0.3);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  max-width: 100%;
  width: auto;
}

.save-button:hover {
  background-color: #1d4ed8;
}

/* Classes specifiche per evidenziare campi importanti */

.highlight-field {
  background-color: #f0fdf4 !important;
  border-left: 3px solid #16a34a !important;
}

/* Effetto di transizione per cambiamenti di fase */

.phase-panel {
  transition: opacity 0.2s;
  opacity: 0;
}

.phase-panel.active {
  opacity: 1;
}

/* Stili responsive */

@media screen and (max-width: 1200px) {
  .risk-table {
    min-width: 900px;
  }

  .title-identification {
    max-width: 120px;
    font-size: 0.8rem;
  }

  .phase-header h2 {
    font-size: 1.3rem;
  }
}

@media screen and (max-width: 1024px) {
  .phase-tabs {
    flex-direction: column;
    padding: 0;
  }

  .phase-tab {
    padding: 0.75rem;
    text-align: left;
    border-bottom: 1px solid #e1e5eb;
    border-left: 3px solid transparent;
  }

  .phase-tab.active {
    border-bottom-color: #e1e5eb;
    border-left-color: var(--primary);
  }

  .summary-metrics {
    flex-direction: column;
    gap: 1rem;
  }

  .phase-content {
    padding: 1rem;
  }

  .metric {
    margin-bottom: 0.5rem;
  }
}

@media screen and (max-width: 768px) {
  .risk-matrix-container {
    margin: 1rem 0;
    border-radius: 6px;
  }

  .phase-header h2 {
    font-size: 1.2rem;
  }

  .phase-header p {
    font-size: 0.8rem;
  }

  .summary-panel {
    padding: 1rem;
  }

  .summary-panel h3 {
    font-size: 1.1rem;
  }

  .metric-value {
    font-size: 1.3rem;
  }

  .save-button {
    padding: 0.6rem 1.2rem;
    font-size: 0.9rem;
  }
}

@media screen and (max-width: 480px) {
  .risk-matrix-container {
    margin: 0.5rem 0;
    border-radius: 4px;
  }

  .phase-content {
    padding: 0.75rem;
  }

  .phase-header h2 {
    font-size: 1.1rem;
  }

  .phase-header p {
    font-size: 0.75rem;
  }

  .summary-panel {
    padding: 0.75rem;
  }

  .summary-panel h3 {
    font-size: 1rem;
    margin-bottom: 0.75rem;
  }

  .metric-label {
    font-size: 0.75rem;
  }

  .metric-value {
    font-size: 1.1rem;
  }

  .save-button {
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    width: 90%;
  }

  /* Aumenta la dimensione dei pulsanti per facilitare il tocco su mobile */

  .add-row-button, .delete-row-button {
    padding: 0.35rem;
  }

  .add-row-button i, .delete-row-button i {
    font-size: 1.1rem;
  }

  /* Miglioramenti per l'interazione touch */

  .risk-table td[style*="cursor:pointer"]::after {
    opacity: 0.5;
    /* Mantieni l'icona parzialmente visibile su mobile */
    font-size: 14px;
  }
}

/* Miglioramenti per la stampa */

@media print {
  .risk-matrix-container {
    box-shadow: none;
    margin: 0;
  }

  .phase-tabs, .save-container {
    display: none;
  }

  .phase-panel {
    display: block !important;
    opacity: 1 !important;
    -moz-column-break-inside: avoid;
         break-inside: avoid;
  }

  .risk-table-wrapper {
    overflow: visible;
    box-shadow: none;
  }

  .risk-table {
    white-space: normal;
    font-size: 9pt;
  }

  .risk-table th, .risk-table td {
    padding: 4pt;
  }

  .button-table-container {
    display: none;
  }
}

.nodi-tree {
  padding: 20px;
  background: #f8f9fa;
  border-radius: 8px;
}

.nodo-item {
  margin: 10px 0px 10px 0px;
  transition: all 0.3s ease;
}

.nodo-container {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
}

.nodo-container:hover {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.nodo-info {
  flex-grow: 1;
  display: flex;
  align-items: center;
  gap: 8px;
}

.nodo-name {
  font-weight: 600;
  color: #2d3748;
}

.nodo-type {
  font-size: 0.875rem;
  color: #718096;
  padding: 2px 8px;
  background: #edf2f7;
  border-radius: 4px;
}

.nodo-actions {
  display: flex;
  gap: 8px;
}

.children-container {
  margin-left: 40px;
  padding-left: 40px;
  border-left: 2px dashed #cbd5e0;
}

/* Stili per i bottoni */

.nodo-button {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 4px;
  font-size: 0.875rem;
  cursor: pointer;
  transition: all 0.21s ease;
}

.nodo-id {
  font-size: var(--body);
  color: var(--primary);
  padding: 2px 8px;
  border-radius: 4px;
}

.swal-input {
  width: auto !important;
}

.indirizzo-item {
  background: #f8f9fa;
  padding: 1rem;
  border-radius: 0.5rem;
  border: 1px solid #e2e8f0;
}

.indirizzo-item:hover {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* Reset principale del counter */

.nodi-tree {
  counter-reset: level1 level2 level3;
}

/* Counter per il primo livello */

.nodi-tree > .nodo-item > .nodo-container::before {
  counter-increment: level1;
  content: counter(level1) ". ";
}

/* Counter per il secondo livello */

.nodi-tree
    > .nodo-item
    > .children-container
    > .nodo-item
    > .nodo-container::before {
  counter-increment: level2;
  content: counter(level1) "." counter(level2) ". ";
}

/* Counter per il terzo livello */

.nodi-tree
    > .nodo-item
    > .children-container
    > .nodo-item
    > .children-container
    > .nodo-item
    > .nodo-container::before {
  counter-increment: level3;
  content: counter(level1) "." counter(level2) "." counter(level3) ". ";
}

/* Reset dei counter per ogni nuovo sottogruppo */

.children-container {
  counter-reset: level2 level3;
}

/* Stile comune per i container */

.nodo-container::before {
  color: #666;
  font-weight: 600;
  font-size: var(--body);
  padding-right: 8px;
  border-width: 0px 1px 0px 0px;
  border-color: var(--stroke) !important;
}

/* TABLET */

@media (max-width: 1366px) {
  /* TABLET */

  .content-wrapper {
    padding-top: 140px !important;
  }

  .menu-container {
    display: none !important;
  }

  .content-layout {
    width: 100%;
  }

  .page-title{
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 60vw;
    margin-left: auto;
    margin-right: auto;
  }

  .mobile-menu {
    width: 40vw;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100dvh;
    z-index: 9999;
    background-color: var(--white);
    box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
    overflow: auto;
  }

  .menu_button {
    display: block !important;
  }

  .loader {
    width: 100% !important;
  }

  .loader-container {
    transform: translateX(0px) !important;
  }

  .mobile-menu .logo-container-mobile {
    padding: var(--paddingXL) !important;
  }

  .mobile-menu .logo-container-mobile img {
    max-width: calc(50%) !important;
  }

  .header-container {
    width: 100% !important;
    z-index: 999;
  }

  .header-wrapper {
    position: fixed;
    width: 100% !important;
  }

  .user-badge p.bodysmall {
    display: none;
  }

  .info-nodo {
    display: flex;
    flex-direction: column-reverse !important;
  }

  .info-nodo > .left-wrapper {
    width: 100% !important;
  }

  .info-nodo > .right-wrapper {
    width: 100% !important;
    padding: 0px 0px 20px 0px !important;
  }

  .table-buttons {
    flex-wrap: wrap;
  }

  .table-buttons img {
    width: 18px !important;
    height: 18px !important;
  }

  button.form-button > a, button.back-button > a {
    font-size: 12px;
  }

  button.form-button > a > img, button.back-button > a > img {
    width: 15px;
  }

  .team-wrapper {
    flex-direction: column !important;
  }

  .import-wrapper {
    flex-direction: column !important;
  }

  button.float-back-button.left-variant {
    display: none !important;
  }

  button.float-back-button.left-variant.mobile {
    display: flex !important;
  }

  .menu_button_wrapper {
    z-index: 99999;
  }

  .menu_button_container {
    background-color: var(--white);
    padding: 5px;
    border-radius: 10px;
  }

  .menu_button_container:has(.on_menu) {
    box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.25);
  }

  .menu_button_wrapper {
    display: block !important;
  }

  tr.last-file-row {
    border-bottom: 1px solid #d0d4e1;
  }

  td[colspan="5"]:has(tr.last-file-row),
  td[colspan="4"]:has(tr.last-file-row) {
    display: flex;
    flex-direction: column;
  }

  tr:has(td span button.comeback-button) td:not(:nth-child(2)) {
    display: none;
  }

  tr:has(td span button.comeback-button) td:nth-child(2):before {
    display: none;
  }

  tr:has(td span button.comeback-button) td:nth-child(2) {
    border: none;
  }

  .checklist-container {
    gap: 10px !important;
    padding: 10px !important;
    justify-content: center !important;
  }

  .checklist-container.builder {
    flex-wrap: wrap;
    justify-content: center;
  }

  .checklist-container.added {
    flex-wrap: wrap;
    justify-content: space-between !important;
  }

  .hidden-div {
    padding: 20px 0px 0px 0px !important;
  }

  .type-domanda.normal-input {
    padding: 5px !important;
    min-width: 150px;
  }

  .checklist-item-container > div {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 0px !important;
  }

  .checklist-item {
    padding: 10px !important;
  }

  .checklist-container.builder button {
    margin: 0px !important;
    width: 100% !important;
    justify-content: center !important;
  }

  .checklist-container.builder > div,
  .checklist-container.builder input {
    width: 100% !important;
  }

  .checklist-wrapper.builder {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .checklist-item.quest > div > div {
    flex-direction: column !important;
  }

  .checklist-item.quest > div > div button {
    justify-content: center;
  }

  .checklist-item:not(.quest) .checklist-item-container > div:first-child {
    gap: 10px !important;
    padding: 5px !important;
    background-color: var(--bg);
    border-radius: 5px;
  }

  .checklist-item:not(.quest)
    .checklist-item-container
    > div:first-child
    input {
    background-color: var(--white);
  }

  .quest-counter {
    margin: 0px !important;
  }

  .checklist-item-container .text-domanda {
    min-width: calc(100vw - 150px) !important;
  }

  .sub-domanda > ul > li .line-vertical,
  .sub-domanda > ul > li .line-horizontal {
    display: none !important;
  }

  .sub-domanda > ul > li .response-item {
    margin: 0px !important;
  }

  span.checklist-item-option {
    margin-left: 0px !important;
  }

  .container-chk-specifications {
    flex-wrap: wrap !important;
    justify-content: left !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .container-free-specification > div {
    margin: 0px !important;
    flex-direction: column !important;
    width: 100% !important;
  }

  .checklist-item-option.options-specifications:has(label) {
    border: 1px dashed var(--stroke) !important;
  }

  ul.question-parameters:has(.container-spec-parameters) {
    flex-direction: column !important;
    align-items: start !important;
    justify-content: flex-start !important;
  }

  .container-spec-parameters {
    flex-direction: column !important;
    width: 100% !important;
  }

  .container-spec-parameters input {
    width: 100% !important;
  }

  input.text-block-text-area {
    width: 100% !important;
    margin: 0px !important;
  }

  .container-options-specifications {
    width: 100% !important;
  }

  .container-options-specifications > div {
    width: 100% !important;
    margin: 0px !important;
  }

  .checklist-item-option:has(.container-spec-parameters) {
    flex-direction: row !important;
    border: 1px dashed var(--stroke) !important;
  }

  .container-options-specifications {
    margin-left: 0px !important;
  }

  .checklist-item-container label,
  span.checklist-item-hint {
    font-size: 16px !important;
  }

  .compila-checklist {
    gap: 20px !important;
  }

  .compila-checklist > .info-box {
    border: 2px dashed var(--stroke);
  }

  .checklist-validated-cointainer {
    width: 100% !important;
  }

  .button-container-argomenti {
    flex-wrap: wrap;
    gap: 10px !important;
  }

  .form-container.verbale{
    padding: 10px;
  }

  .children-container{
    margin-left: 10px !important;
    padding-left: 10px !important;
  }

  .checklist-wrapper.builder.checklist-validator-wrapper.flex.flex-row {
    max-width: calc(100dvw);
  }

  .admin-validator-wrapper:has(.user-checklists-wrapper){
    width: 100%;
  }

  .admin-validator-wrapper:has(.admin-validator){
    width: 100%;
  }

  .admin-revision .reviewed-by{
    padding-left: 5px;
    padding-right: 5px;
  }

  .reviewed-by{
    flex-wrap: wrap;
    justify-content: center;
  }

  .risk-matrix-wrapper {
    max-width: 100dvw !important;
  }

  .breadcrumb{
    display: none;
  }
}

@media (max-width: 800px) {
  .content-layout {
    width: 100%;
  }

  .dataTables_wrapper {
    /* zoom: 0.6;
      -ms-zoom: 0.6;
      -webkit-zoom: 0.6; */
  }

  /* .checklist-wrapper {
      zoom: 0.6;
      -ms-zoom: 0.6;
      -webkit-zoom: 0.6;
    } */

  .import-wrapper {
    flex-direction: column !important;
  }
}

@media (max-width: 1024px) {
  .content-layout {
    width: 100%;
  }

  .dataTables_wrapper {
    /* zoom: 0.7;
      -ms-zoom: 0.7;
      -webkit-zoom: 0.7; */
  }

  /* .checklist-wrapper {
      zoom: 0.7;
      -ms-zoom: 0.7;
      -webkit-zoom: 0.7;
    } */

  .import-wrapper {
    flex-direction: column !important;
  }
}

@media (max-width: 820px) {
  .content-layout {
    width: 100%;
  }

  .dataTables_wrapper {
    /* zoom: 0.7;
      -ms-zoom: 0.7;
      -webkit-zoom: 0.7; */
  }

  /* .checklist-wrapper {
      zoom: 0.7;
      -ms-zoom: 0.7;
      -webkit-zoom: 0.7;
    } */

  .import-wrapper {
    flex-direction: column !important;
  }
}

/* SMARTPHONE */

@media (max-width: 768px) {
  /* SMARTPHONE */

  .dataTables_wrapper {
    /* zoom: 0.4;
      -ms-zoom: 0.4;
      -webkit-zoom: 0.4; */
  }

  .content-layout {
    width: 100%;
  }

  /* .checklist-wrapper {
      zoom: 0.4;
      -ms-zoom: 0.4;
      -webkit-zoom: 0.4;
    } */

  .menu-container {
    display: none !important;
  }

  .heading-page {
    padding: 10px !important;
  }

  .header-container {
    width: 100% !important;
    z-index: 999;
    /* padding: 2px !important; */
  }

  .header-wrapper {
    height: 70px !important;
    width: 100% !important;
    padding: 8px !important;
  }

  .profile-name {
    gap: 5px !important;
  }

  .profile-pic.header {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
  }

  .user-badge p {
    display: none;
  }

  .content-wrapper {
    padding: 70px var(--paddingM) var(--paddingM) var(--paddingM) !important;
  }

  .main-container-body,
  .main-container-body-auto {
    padding: var(--paddingL) !important;
  }

  .menu_button {
    display: block !important;
  }

  .mobile-menu {
    width: 70vw;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100dvh;
    z-index: 9999;
    background-color: var(--white);
    box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
    overflow: auto;
  }

  .mobile-menu .logo-container-mobile {
    padding: var(--paddingXL) !important;
  }

  .mobile-menu .logo-container-mobile img {
    max-width: calc(50%) !important;
  }

  button > a {
    padding: var(--paddingM) var(--paddingL) !important;
    font-size: 10px;
  }

  .loader {
    width: 100vw !important;
  }

  .loader-container {
    width: 100vw !important;
    transform: translateX(0px) !important;
  }

  .upload-wrapper-alt {
    width: 100% !important;
    padding: var(--paddingM) !important;
  }

  .import-wrapper {
    flex-direction: column !important;
  }

  .step p {
    font-size: 11px !important;
    bottom: -17px !important;
  }

  .step:not(.active) p {
    display: none;
  }

  .main-container-body:has(.step) {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
}

.info-psa{
  width: 100%;
  max-width: 1140px;
}

/* Select2 migliorato */

.select2-dropdown-enhanced {
  border-radius: 10px !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1), 0 5px 10px rgba(0, 0, 0, 0.04) !important;
  padding: 8px !important;
  background: linear-gradient(to bottom right, #ffffff, #f8fafc) !important;
  overflow: hidden !important;
  max-width: 350px !important;
}

.select2-container--classic .select2-results>.select2-results__options {
  overflow-x: hidden;
}

.select2-search--dropdown {
  padding: 8px !important;
}

.select2-search--dropdown .select2-search__field {
  border-radius: 8px !important;
  border: 1px solid #e2e8f0 !important;
  padding: 6px 10px !important;
  font-size: 0.8rem !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.05) !important;
  transition: all 0.2s !important;
}

.select2-search--dropdown .select2-search__field:focus {
  border-color: var(--primary-color) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.2), inset 0 2px 4px rgba(0,0,0,0.05) !important;
}

.select2-results__option {
  padding: 6px 10px !important;
  border-radius: 6px !important;
  margin-bottom: 2px !important;
  transition: all 0.25s ease !important;
  font-size: 0.8rem !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.select2-container--classic .select2-results__group {
  padding: 6px 10px !important;
  font-weight: 600 !important;
  color: #4b5563 !important;
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

.select2-results__option--highlighted[aria-selected] {
  background-color: rgba(var(--primary-rgb), 0.1) !important;
  color: var(--primary-color) !important;
  transform: translateX(5px) !important;
}

.select2-container--classic .select2-selection--single {
  height: 36px !important;
  padding: 6px 10px !important;
  border-radius: 8px !important;
  border: 1px solid #e2e8f0 !important;
  background: #ffffff !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.3s !important;
  max-width: 100% !important;
}

.select2-selection-enhanced {
  border-radius: 8px !important;
}

.select2-container--classic.select2-container--open .select2-selection--single {
  border-color: var(--primary-color) !important;
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.2) !important;
}

.select2-container--classic .select2-selection--single:focus {
  border-color: var(--primary-color) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.2) !important;
}

.select2-container--classic .select2-selection--single .select2-selection__arrow {
  height: 100% !important;
  width: 24px !important;
  background: transparent !important;
  border: none !important;
}

.select2-container--classic .select2-selection--single .select2-selection__arrow b {
  border-color: #64748b transparent transparent transparent !important;
  border-width: 5px 5px 0 5px !important;
  transition: all 0.2s !important;
}

.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent #64748b transparent !important;
  border-width: 0 5px 5px 5px !important;
}

.select2-container--classic .select2-selection--single .select2-selection__rendered {
  color: #1e293b !important;
  line-height: 1.4 !important;
  font-size: 0.8rem !important;
  padding-left: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: calc(100% - 30px) !important;
}

.select2-container--classic .select2-results__option--highlighted[aria-selected] {
  background-color: rgba(var(--primary-rgb), 0.1) !important;
  color: var(--primary-color) !important;
}

.select2-selection__placeholder{
  font-weight: 500 !important;
}

/* Stile per il placeholder di Select2 */

.select2-container--classic .select2-selection--single .select2-selection__placeholder {
  color: #94a3b8 !important;
  font-size: 0.8rem !important;
}

/* Limita la larghezza massima del container Select2 */

.select2-container {
  max-width: 550px !important;
}

/* Stili specifici per Select2 nella tabella */

#nodes-table thead tr.filters-row .select2-container {
  max-width: 100% !important;
}

#nodes-table thead tr.filters-row .select2-container .select2-selection--single {
  height: 32px !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
}

#nodes-table thead tr.filters-row .select2-container .select2-selection--single .select2-selection__rendered {
  line-height: 24px !important;
  font-size: 0.75rem !important;
  padding-left: 0 !important;
}

#nodes-table thead tr.filters-row .select2-container .select2-selection--single .select2-selection__arrow {
  height: 30px !important;
  width: 20px !important;
}

#nodes-table thead tr.filters-row .select2-container .select2-selection--single .select2-selection__arrow b {
  border-width: 4px 4px 0 4px !important;
}

#nodes-table thead tr.filters-row .select2-dropdown {
  font-size: 0.75rem !important;
  max-width: 300px !important;
}

#nodes-table thead tr.filters-row .select2-results__option {
  padding: 5px 8px !important;
  font-size: 0.75rem !important;
}

#nodes-table thead tr.filters-row .select2-search--dropdown .select2-search__field {
  padding: 5px 8px !important;
  font-size: 0.75rem !important;
}

/* =================================================
   DataTables Editor Modal Popup Styles
   ================================================= */

/* Modal base styling */

.altEditor-modal {
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  z-index: 9999;
  animation: fadeIn 0.3s ease-out;
  display: none;
  flex-direction: column;
  align-content: center;
  justify-content: center;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.altEditor-modal .modal-dialog {
  max-width: 600px;
  margin: 2rem auto;
  animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
  from {
    transform: translateY(-50px);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

/* Modal content container */

.altEditor-modal .modal-content {
  background: var(--white);
  border-radius: var(--borderM);
  box-shadow: 0px 20px 60px rgba(0, 0, 0, 0.15);
  border: none;
  overflow: hidden;
}

/* Modal header */

.altEditor-modal .modal-header {
  background: linear-gradient(135deg, var(--primary) 0%, var(--nice-blue-hover) 100%);
  color: var(--white);
  padding: var(--paddingL) var(--paddingXL);
  border-bottom: none;
  position: relative;
}

.altEditor-modal .modal-title {
  font-size: var(--h4);
  font-weight: 600;
  margin: 0;
  padding: 0 !important;
  color: var(--white);
}

.altEditor-modal .close-button {
  position: absolute;
  right: var(--paddingL);
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.2);
  border: none;
  border-radius: 50%;
  width: 35px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  font-size: 18px;
  cursor: pointer;
  transition: all 0.2s ease;
  margin: 0 !important;
}

.altEditor-modal .close-button:hover {
  background: rgba(255, 255, 255, 0.3);
  transform: translateY(-50%) scale(1.1);
}

.altEditor-modal .close-button span {
  line-height: 1;
}

/* Modal body */

.altEditor-modal .modal-body {
  padding: var(--paddingXL);
  background: var(--white);
}

/* Error labels */

.altEditor-modal .errorLabel {
  color: var(--red);
  font-size: var(--body-small);
  margin-top: var(--paddingXS);
  display: block;
  font-weight: 400;
}

/* Modal footer */

.altEditor-modal .modal-footer {
  background: var(--bg);
  padding: var(--paddingL) var(--paddingXL);
  border-top: 1px solid var(--stroke);
  display: flex;
  justify-content: flex-end;
  gap: var(--paddingM);
}

*, ::before, ::after{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

/* ! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com */

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box;
  /* 1 */
  border-width: 0;
  /* 2 */
  border-style: solid;
  /* 2 */
  border-color: #e5e7eb;
  /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -moz-tab-size: 4;
  /* 3 */
  -o-tab-size: 4;
     tab-size: 4;
  /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  /* 4 */
  font-feature-settings: normal;
  /* 5 */
  font-variation-settings: normal;
  /* 6 */
  -webkit-tap-highlight-color: transparent;
  /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0;
  /* 1 */
  line-height: inherit;
  /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0;
  /* 1 */
  color: inherit;
  /* 2 */
  border-top-width: 1px;
  /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  /* 1 */
  font-feature-settings: normal;
  /* 2 */
  font-variation-settings: normal;
  /* 3 */
  font-size: 1em;
  /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0;
  /* 1 */
  border-color: inherit;
  /* 2 */
  border-collapse: collapse;
  /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-feature-settings: inherit;
  /* 1 */
  font-variation-settings: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  font-weight: inherit;
  /* 1 */
  line-height: inherit;
  /* 1 */
  letter-spacing: inherit;
  /* 1 */
  color: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
  padding: 0;
  /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button;
  /* 1 */
  background-color: transparent;
  /* 2 */
  background-image: none;
  /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  /* 1 */
  vertical-align: middle;
  /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

/* Aggiungi questo al tuo CSS principale */

html {
  font-family: "poppins", sans-serif;
  background-color: var(--bg);
  transition: filter 0.2s ease-in;
}

html.dark {
  filter: invert(93%) hue-rotate(180deg);
}

/* Applica la transizione solo dopo il caricamento iniziale */

html:not(:defined) {
  transition: none !important;
  visibility: hidden;
}

html.dark:not(:defined) {
  visibility: hidden !important;
}

html:defined {
  visibility: visible;
}

html.dark img,
  html.dark video,
  html.dark iframe,
  html.dark .profile-pic {
  filter: invert(93%) hue-rotate(180deg);
}

/* Aggiungi le transizioni dopo il caricamento iniziale */

@media (prefers-reduced-motion: no-preference) {
  html.dark,
    html.dark img,
    html.dark video,
    html.dark iframe,
    html.dark .profile-pic {
    transition: filter 0.2s ease-in;
  }
}

/* ===== Scrollbar CSS ===== */

/* Firefox */

* {
  scrollbar-width: auto;
  scrollbar-color: #217dc2 transparent;
}

/* Chrome, Edge, and Safari */

*::-webkit-scrollbar {
  width: 5px;
}

*::-webkit-scrollbar-track {
  background: transparent;
}

*::-webkit-scrollbar-thumb {
  background-color: #217dc2;
  border-radius: 10px;
  border: 3px solid transparent;
}

/* Aggiungi questo CSS al tuo stile */

input:focus,
  textarea:focus,
  select:focus {
  outline: none;
  /* Rimuove il bordo nero */
  border: 2px solid #babed1;
  /* Puoi impostare uno stile del bordo desiderato */
}

select:disabled,
  input:not([type="checkbox"]):disabled,
  select:disabled > option{
  opacity: 0.7 !important;
}

.supersmall {
  font-size: var(--supersmall);
  color: var(--cell-content);
}

.bodysmall {
  font-size: var(--body-small);
  color: var(--cell-content);
}

.bodynormal {
  font-size: var(--body);
  color: var(--text-small);
}

.bodynormal-green {
  font-size: var(--body-large);
  color: var(--special-badge-color);
}

.bodylarge {
  font-size: var(--body-large);
  color: var(--cell-content);
}

.bodyXL {
  font-size: var(--bodyXL);
  color: var(--cell-content);
}

.label{
  font-size: var(--label);
  color: var(--text-small);
  letter-spacing: 2px;
  text-transform: uppercase;
}

h6 {
  font-size: 22px;
  color: var(--cell-content);
}

h5 {
  font-size: var(--h5);
  font-weight: 500;
  color: var(--cell-content);
}

h4 {
  font-size: var(--h4);
  line-height: 1.75rem;
  font-weight: 600;
  color: var(--cell-content);
}

h3 {
  font-size: var(--h3);
  line-height: var(--h3);
  color: var(--cell-content);
  font-weight: 600;
}

h2 {
  font-size: var(--h2);
  color: var(--cell-content);
  font-weight: 400;
}

h1 {
  font-size: var(--h3);
  color: var(--cell-content);
  font-weight: 400;
}

button,
  button[type="submit"] {
  background-color: #217DC2;
  font-size: 0.875rem;
  font-weight: 400;
  transition: all 0.3s ease-out;
}

button > a {
  padding: var(--paddingMS) var(--paddingL) var(--paddingMS) var(--paddingL);
}

input[type="email"],
  input[type="text"],
  input[type="password"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="url"],
  input[type="datetime-local"],
  select.popup-select {
  border-radius: 7px;
  padding: 7px var(--paddingL) 7px var(--paddingL);
  width: 100%;
  font-weight: 500;
}

input[type="datetime-local"] {
  color: #878a97;
}

textarea {
  border-radius: 7px;
  padding: 7px var(--paddingL) 7px var(--paddingL);
  width: 100%;
  font-weight: 500;
}

hr {
  color: #dee7ec;
  background-color: #dee7ec;
}

.dt-buttons {
  flex-wrap: wrap !important;
}

.\!container{
  width: 100% !important;
}

.container{
  width: 100%;
}

@media (min-width: 640px){
  .\!container{
    max-width: 640px !important;
  }

  .container{
    max-width: 640px;
  }
}

@media (min-width: 768px){
  .\!container{
    max-width: 768px !important;
  }

  .container{
    max-width: 768px;
  }
}

@media (min-width: 1024px){
  .\!container{
    max-width: 1024px !important;
  }

  .container{
    max-width: 1024px;
  }
}

@media (min-width: 1280px){
  .\!container{
    max-width: 1280px !important;
  }

  .container{
    max-width: 1280px;
  }
}

@media (min-width: 1536px){
  .\!container{
    max-width: 1536px !important;
  }

  .container{
    max-width: 1536px;
  }
}

/* TABLET */

@media (max-width: 1366px) {
  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.dataTable > tbody > tr {
    display: flex;
    width: 100% !important;
    flex-direction: column;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS);
    padding: var(--paddingM);
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1);
    margin-bottom: 20px;
  }

  table.dataTable > tbody > tr > td {
    text-align: right;
    vertical-align: middle;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  table.dataTable > tbody > tr > td::before {
    text-align: left;
    content: attr(data-label);
    float: left;
    font-size: var(--label);
    color: var(--text-small);
    letter-spacing: 2px;
    text-transform: uppercase;
  }

  table.dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

  button.table-button > a > img {
    max-width: 20px !important;
  }

  table.dataTable > tbody > tr > td.select-checkbox {
    display: none;
  }

  table.dataTable > tbody > tr > td > div {
    justify-content: flex-end;
  }

  table.dataTable > tbody > tr > td > span.green-dot {
    float: right;
  }

  table.dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right;
  }

  tr.last-file-row {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    padding-left: 0px !important;
  }

  table.dataTable > thead {
    display: none;
  }

  table.dataTable {
    width: 100% !important;
  }

  table.dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

   {
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    border: none !important;
    max-width: 20px !important;
    display: none !important;
    justify-content: flex-end !important;
    float: right !important;
    width: auto !important;
    min-width: auto !important;
  }

  table.dataTable > tbody > tr > td > div.breadcrumb.\!table {
    float: right !important;
  }

   {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
    display: none !important;
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */

  table.\!dataTable > tbody > tr {
    display: flex !important;
    width: 100% !important;
    flex-direction: column !important;
    border: 1px solid var(--stroke2) !important;
    border-radius: var(--borderS) !important;
    padding: var(--paddingM) !important;
    box-shadow: 0px 0px 30px -10px rgb(0, 0, 0, 0.1) !important;
    margin-bottom: 20px !important;
  }

  table.\!dataTable > tbody > tr > td {
    text-align: right !important;
    vertical-align: middle !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  table.\!dataTable > tbody > tr > td::before {
    text-align: left !important;
    content: attr(data-label) !important;
    float: left !important;
    font-size: var(--label) !important;
    color: var(--text-small) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
  }

  table.\!dataTable > tbody > tr > td:last-child {
    border: none !important;
  }

   {
    max-width: 20px !important;
  }

  table.\!dataTable > tbody > tr > td.select-checkbox {
    display: none !important;
  }

  table.\!dataTable > tbody > tr > td > div {
    justify-content: flex-end !important;
  }

  table.\!dataTable > tbody > tr > td > span.green-dot {
    float: right !important;
  }

  table.\!dataTable > tbody > tr > td > div.button-table-container {
    width: auto !important;
    min-width: auto !important;
  }

  table.\!dataTable > tbody > tr > td > div.breadcrumb.table {
    float: right !important;
  }

   {
    display: flex !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding-left: 0px !important;
  }

  table.\!dataTable > thead {
    display: none !important;
  }

  table.\!dataTable {
    width: 100% !important;
  }

  table.\!dataTable > tbody {
    width: 100% !important;
  }

  /* .dataTables_paginate.paging_simple_numbers {
      width: 95% !important; 
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto; 
      padding: 10px;
      background-color: var(--white);
      border-radius: 5px;
      border: 2px solid var(--stroke);
      box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.35);
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      align-items: center;
    } */
}

@media (max-width: 800px) {
}

@media (max-width: 1024px) {
}

@media (max-width: 820px) {
}

/* SMARTPHONE */

@media (max-width: 768px) {
}

.rotate180 {
  transform: rotate(180deg);
}

.map-popup-container {
  font-family: Poppins, Arial, Helvetica, sans-serif;
  display: flex;
  flex-direction: column;
  gap: 20px;
  color: var(--cell-content);
}

.map-label {
  font-size: var(--label);
  color: var(--text-small);
}

.map-popup-container p {
  margin: 0px !important;
}

.map-popup-title {
  font-weight: 600 !important;
}

.coord-wrapper {
  display: flex;
  flex-direction: row;
  gap: 25px;
}

.map-value {
  font-size: var(--bodyXL);
  color: var(--cell-content);
  font-weight: 500;
  text-transform: capitalize;
}

button.small-button {
  border: 2px solid var(--primary) !important;
}

button.small-button > a {
  color: var(--primary) !important;
}

button.small-button:hover {
  background-color: var(--primary) !important;
}

button.small-button:hover > a {
  color: var(--white) !important;
}

#mappa-dashboard {
  background-color: var(--stroke2);
  border-radius: 12px;
  width: 100%;
  min-height: calc(100vh - 200px);
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.25);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.map-loader {
  width: 100px;
  height: 100px;
  margin: 20px;
  display: inline-block;
}

.into-info-box {
  display: flex;
  padding: 10px 20px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: var(--Spacing-system-padding-s, 10px);
  align-self: stretch;
  border-radius: var(--Border-radius-border-s, 7px);
  background: var(--bg);
}

.hover-blue:hover {
  color: var(--primary) !important;
  text-decoration: underline;
}

.box-select-tipi-nodi {
  position: absolute;
  background: rgb(255, 255, 255);
  margin-top: 40px;
  border-radius: 10px;
  padding: 20px;
  box-shadow: 1px grey;
}

.btn-apply-type-node {
  padding: 5px;
  border-radius: 10px;
  margin-top: 10px;
  background: green;
  color: white;
}

.form-container {
  max-width: 80%;
  flex-direction: column;
  gap: 10px;
}

.form-container.verbale > div {
  display: flex;
  width: 100%;
  flex-direction: row;
  gap: 10px;
}

.form-container.verbale > div > div {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.swal2-container .select2-dropdown {
  z-index: 9999 !important;
  /* Forza un indice z maggiore */
}

.swal2-container .select2-container--open {
  display: block !important;
  /* Assicura che sia visibile */
  z-index: 9999 !important;
}

.select2-container {
  z-index: 999 !important;
}

.select2-container--open {
  z-index: 9999 !important;
}

.select2-container--default .select2-selection--multiple {
  border-radius: 10px !important;
  background: #f0f0f0 !important;
  width: 100%;
  font-weight: 500;
  border: 2px solid var(--normal-input-inside) !important;
}

.select2-container--default .select2-selection--multiple:hover {
  border: 2px solid var(--secondary) !important;
}

.select2-container--disabled {
  opacity: 60%;
}

table.\!dataTable tbody th, table.\!dataTable tbody td {
  font-size: 0.875rem !important;
  border-right: 1px solid var(--stroke2) !important;
}

table.dataTable tbody th, table.dataTable tbody td {
  font-size: 0.875rem;
  border-right: 1px solid var(--stroke2);
}

table.\!dataTable tbody th, table.\!dataTable tbody td {
  font-size: 0.875rem !important;
  border-right: 1px solid var(--stroke2) !important;
}

table.\!dataTable tbody td[data-label="Nome nodo"] {
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
}

table.dataTable tbody td[data-label="Nome nodo"] {
  font-size: 0.9375rem;
  font-weight: 500;
}

div.dt-buttons {
  float: left !important;
  display: flex;
  flex-wrap: wrap !important;
  gap: 10px;
  padding: 0px 10px 0px 0px;
  margin-bottom: 10px;
}

.dropdown-toggle {
  background-color: transparent;
  border: none;
  cursor: pointer;
  padding: 5px;
}

.dropdown-menu {
  display: none;
  position: absolute;
  /* right: 0; */
  background-color: white;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1000;
  border-radius: 4px;
  border: 1px solid #ddd;
}

.dropdown-menu.show {
  display: block;
}

.dropdown-item {
  color: black;
  padding: 8px 16px;
  text-decoration: none;
  display: flex;
  gap: 10px;
  transition: background-color 0.3s;
}

.dropdown-item:hover {
  background-color: #f1f1f1;
}

.dropdown-divider {
  height: 1px;
  background-color: #e9ecef;
  margin: 4px 0;
}

.base-layout {
  display: flex;
  padding: 0px;
  margin: 0px;
  justify-content: center;
  align-items: flex-start;
  gap: 0px;
  min-height: 100vh;
}

.main-container-body {
  display: flex;
  padding: 15px;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  border-radius: 12px;
  background: var(--colors-base-colors-white, #fff);
  /* Shadow */
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.1);
}

.main-container-body-auto {
  display: flex;
  padding: 15px;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  height: auto;
  border-radius: 12px;
  background: var(--colors-base-colors-white, #fff);
  /* Shadow */
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.1);
}

.main-container-body.nobg{
  background-color: transparent;
  box-shadow: none;
}

.main-container-body.nolayout{
  display: flex;
  flex-direction: column;
  align-items: unset;
  padding: unset;
}

.page-title {
  text-align: center;
}

button.form-button{
  background: var(--gradient-primary);
}

button.form-button:hover{
  background: var(--gradient-primary-hover);
}

button.form-button,
  button.form-button > a {
  display: inline-flex;
  gap: 10px;
  color: #ffffff;
  border-radius: 5px;
  font-weight: 600;
  justify-content: center;
  align-items: center;
}

button.form-button.csv {
  background: #27af7f;
}

button.form-button.csv:hover {
  box-shadow: 0px 10px 20px 0px rgba(33, 194, 119, 0.3);
  background: #29c790;
}

button.form-button:hover {
  box-shadow: 0px 10px 20px 0px rgba(33, 125, 194, 0.3);
  background-color: #339bea;
}

button.form-button > a > img {
  filter: brightness(1000%);
  max-width: 15px;
  max-height: 15px;
}

button.outlined-button-blue {
  display: inline-flex;
  background-color: #ffffff;
  border: 2px solid #217DC2;
  color: #217DC2;
  border-radius: 7px;
}

button.outlined-button-blue:hover {
  box-shadow: 0px 10px 20px 0px rgba(33, 125, 194, 0.3);
  background-color: #217DC2;
  color: #ffffff;
}

button.outlined-button-blue > a > img {
  filter: invert(44%) sepia(46%) saturate(884%) hue-rotate(164deg)
      brightness(88%) contrast(93%);
}

button.outlined-button-blue:hover > a > img {
  filter: brightness(1000%);
}

button.outlined-button-blue > a {
  text-align: center;
}

button.outlined-button-white {
  display: inline-flex;
  background-color: #ffffff;
  border: 2px solid #303651;
  color: #303651;
  border-radius: 7px;
}

button.outlined-button-white:hover {
  box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.3);
  background-color: #303651;
  color: #ffffff;
}

button.outlined-button-green {
  display: inline-flex;
  background-color: #ffffff;
  border: 2px solid #27af7f;
  color: #27af7f;
  border-radius: 7px;
}

button.outlined-button-green:hover {
  box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.3);
  background-color: #27af7f;
  color: #ffffff;
}

button.outlined-button-green > a > img {
  filter: invert(48%) sepia(98%) saturate(342%) hue-rotate(107deg)
      brightness(99%) contrast(84%);
}

button.outlined-button-green:hover > a > img {
  filter: brightness(1000%);
}

.filter-white,
  .outlined-button-white:hover > a > img {
  filter: brightness(1000%);
}

.menu-container {
  display: flex;
  width: 250px;
  overflow: auto;
  padding: 20px 0px;
  flex-direction: column;
  align-items: flex-start;
  gap: 70px;
  flex-shrink: 0;
  align-self: stretch;
  background: #ffffff;
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.1);
  transition: all 0.1s ease-in;
}

td.select-checkbox{
  min-width: 10px;
}

/* ===== Scrollbar CSS ===== */

/* Firefox */

.menu-container {
  scrollbar-width: none;
  scrollbar-color: #217dc2 #ffffff00;
  opacity: 1;
}

/* Chrome, Edge, and Safari */

.menu-container::-webkit-scrollbar {
  width: 0px;
}

.menu-container::-webkit-scrollbar-track {
  background: #ffffff00;
}

.menu-container::-webkit-scrollbar-thumb {
  background-color: #217dc2;
  border-radius: 0px;
  border: 0px solid #ffffff00;
}

.menu-container.collapsed {
  width: 80px;
  transition: all 0.3s ease-in;
}

.menu-container.\!collapsed {
  width: 80px !important;
  transition: all 0.3s ease-in !important;
}

.menu-container.collapsed .text-text-menu,
  .menu-container.collapsed .icon-dropdown {
  /* display: none !important; */
  opacity: 0;
  transition: all 0.3s ease-in;
}

.menu-container.\!collapsed .text-text-menu,
  .menu-container.\!collapsed .icon-dropdown {
  /* display: none !important; */
  /* display: none !important; */
  opacity: 0 !important;
  transition: all 0.3s ease-in !important;
}

.menu-container .text-text-menu,
  .menu-container .icon-dropdown {
  /* display: none !important; */
  opacity: 1;
  transition: all 0.3s ease-in;
}

.menu-container.collapsed .label-container {
  visibility: hidden;
}

.menu-container.\!collapsed .label-container {
  visibility: hidden !important;
}

#collapse-button,
  .collapse-button {
  z-index: 9999;
  position: fixed;
  top: 140px;
  transform: translateX(20px);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

#collapse-button:hover {
  box-shadow: 0px 0px 30px -10px #217DC2;
}

#collapse-button > img {
  /* filter: brightness(1000%); */
  transition: all 0.3s linear;
}

.content-layout {
  display: flex;
  padding: 0px;
  padding-bottom: 30px;
  flex-direction: column;
  align-items: flex-start;
  /* gap: theme("spacing.paddingL"); */
  flex: 1 0 0;
  align-self: stretch;
  border-radius: 12px;
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.1);
}

.table-buttons {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 15px;
  margin-bottom: 5px;
}

.content-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  flex: 1 0 0;
  align-self: stretch;
  padding-top: 0px;
  padding-bottom: 0px !important;
}

.header-container {
  /* height: 100px; */
  margin-bottom: 0px;
  width: calc(100%);
}

.header-wrapper {
  /* position: fixed; */
  display: flex;
  /* height: 100px; */
  /* width: calc(100% - 250px); */
  transition: all 0.1s linear;
  /* padding: theme("spacing.paddingS"); */
  padding: 20px 30px 
      0px 30px;
}

.heading-page {
  display: flex;
  width: 100%;
  padding: 15px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  transition: all ease-out 0.2s;
  border-radius: 12px;
  background-color: #ffffff;
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.2);
}

.head-active {
  background-color: #ffffff;
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.2);
}

.head-active:hover {
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.3);
}

.first-section-menu {
  display: flex;
  padding: 0px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  align-self: stretch;
}

.normal-input {
  /* min-height: 45px; */
  border-radius: var(--borderS);
  background: #F0F0F0;
  font-size: 14px;
  border: 1px solid #d1d5db;
  color: #303651;
}

.normal-input:disabled {
  border: 1px solid #babed1;
  cursor: not-allowed !important;
}

.normal-input.cap:disabled {
  color: #878a97;
}

select:disabled{
  color: #878a97;
}

.normal-input:disabled:hover {
  background: #F0F0F0 !important;
  border: 1px solid #babed1;
}

.normal-input:disabled::-moz-placeholder {
  color: #878a97;
}

.normal-input:disabled::placeholder {
  color: #878a97;
}

.normal-input::-moz-placeholder {
  color: #878a97;
}

.normal-input::placeholder {
  color: #878a97;
}

.normal-input-error {
  font-size: 14px;
  min-height: 45px;
  background-color: #fee5ee !important;
  border: 2px solid #fee5ee;
}

.login-input {
  background-color: #f5f6ff;
  border: 2px solid #babed1;
}

.login-input[type="password"],
  .normal-input[type="password"] {
  width: 100%;
}

.login-input:hover,
  .login-input:focus,
  .login-input-error:hover,
  .login-input-error:focus,
  .normal-input:hover,
  .normal-input:focus,
  .normal-input-error:hover,
  .normal-input-error:focus {
  border: 1px solid #5BC5EC;
  background-color: #f5f6ff !important;
  transition: all 0.3s ease-in;
}

.login-input::-moz-placeholder {
  color: #878a97 !important;
}

.login-input::placeholder {
  color: #878a97 !important;
}

.soft-input {
  min-height: 45px;
  border-radius: var(--borderS);
  background: #F9FAFF;
  border: 1px solid #d0d4e1;
  font-size: 14px;
  color: #878a97;
}

.soft-input:hover,
  .soft-input:focus {
  border: 1px solid #5BC5EC;
  background-color: #f5f6ff !important;
  transition: all 0.3s ease-in;
}

.soft-input::-moz-placeholder {
  color: #878a97;
}

.soft-input::placeholder {
  color: #878a97;
}

textarea.normal-input {
  min-height: 100px;
  border-radius: var(--borderS);
  background: #F0F0F0;
  font-size: 14px;
  color: #303651;
}

input::-moz-placeholder, .login-input::-moz-placeholder {
  color: #303651;
  font-weight: 500;
  opacity: 1;
  /* Firefox */
}

input::placeholder,
  .login-input::placeholder {
  color: #303651;
  font-weight: 500;
  opacity: 1;
  /* Firefox */
}

.login-input-error {
  border: 2px solid #d30b0b;
  background-color: #fee5ee !important;
}

.login-btn {
  color: #ffffff;
  padding: var(--paddingM) var(--paddingXXL) var(--paddingM) var(--paddingXXL);
}

.login-btn:hover {
  background-color: #339bea;
  box-shadow: 0px 10px 20px 0px rgba(33, 125, 194, 0.3);
}

.google-btn {
  background-color: white;
  border: 1px solid #d0d4e1;
  gap: 10px;
  padding: var(--paddingM) var(--paddingXXL) var(--paddingM) var(--paddingXXL);
}

.google-btn:hover {
  background-color: #F2F2F2;
}

button.table-button {
  background-color: #ffffff;
  border-radius: 5px;
  border: 1px solid #d0d4e1;
}

button.table-button > a {
  display: flex;
  /* width: 33px;
    height: 33px; */
  padding: 6px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

button.table-button > a > img {
  width: 15px;
  height: 15px;
  min-width: 15px;
  min-height: 15px;
}

button.table-button.comeback-button{
  color: #878a97;
  padding: 5px 10px;
}

button.table-button.comeback-button:hover{
  color: #217DC2;
}

button.table-button.edit.still {
  border: 1px solid #217DC2;
  background: #e9effc;
}

button.table-button.edit.still > a {
  color: #217DC2;
}

button.table-button.delete.still {
  border: 1px solid #d30b08;
  background: #fee5ee;
}

button.table-button.delete.still > a {
  color: #d30b08;
}

button.table-button.delete.still > a > img {
  filter: invert(17%) sepia(69%) saturate(4110%) hue-rotate(351deg)
      brightness(87%) contrast(114%);
}

/* button.table-button.admin.still {
    border: 1px solid #ff9900;
    background: #ffecc3;
  }
  button.table-button.admin.still > a {
    color: #ff9900;
  }
  button.table-button.admin:hover {
    border: 1px solid #ff9900;
    background: #ffecc3;
  }
  button.table-button.admin:hover {
    color: #ff9900 !important;
  } */

button.table-button.add.still {
  border: 1px solid #27af7f !important;
  background: var(--special-badge-bg);
}

button.table-button.\!add.still {
  border: 1px solid #27af7f !important;
  background: var(--special-badge-bg) !important;
}

button.table-button.add.still > a {
  color: #27af7f;
}

button.table-button.\!add.still > a {
  color: #27af7f !important;
}

button.table-button.edit:hover {
  border-radius: 5px;
  border: 1px solid #217DC2;
  background: #e9effc;
}

button.table-button.edit.still > a > img,
  button.table-button.edit:hover > a > img {
  filter: invert(38%) sepia(79%) saturate(768%) hue-rotate(170deg)
      brightness(93%) contrast(88%);
}

button.table-button.delete:hover {
  border-radius: 5px;
  border: 1px solid #d30b08;
  background: #fee5ee;
}

button.table-button.delete:hover > a {
  color: #d30b08 !important;
}

button.table-button.delete:hover > a > img {
  filter: invert(17%) sepia(69%) saturate(4110%) hue-rotate(351deg)
      brightness(87%) contrast(114%);
}

button.table-button.add:hover {
  border-radius: 5px;
  border: 1px solid #27af7f !important;
  background: var(--special-badge-bg);
}

button.table-button.\!add:hover {
  border-radius: 5px !important;
  border: 1px solid #27af7f !important;
  background: var(--special-badge-bg) !important;
}

button.table-button.add:hover > a {
  color: #27af7f !important;
}

button.table-button.\!add:hover > a {
  color: #27af7f !important;
}

button.table-button.add:hover > a > img {
  filter: invert(52%) sepia(70%) saturate(446%) hue-rotate(107deg)
      brightness(95%) contrast(85%);
}

button.table-button.\!add:hover > a > img {
  filter: invert(52%) sepia(70%) saturate(446%) hue-rotate(107deg)
      brightness(95%) contrast(85%) !important;
}

button.table-button.text > a {
  text-wrap: nowrap;
  display: flex;
  flex-direction: row !important;
  width: auto;
  height: auto;
  padding: 5px 10px;
  /* flex-direction: column; */
  justify-content: center;
  align-items: center;
  gap: 10px;
}

button.table-button.\!text > a {
  text-wrap: nowrap !important;
  display: flex !important;
  flex-direction: row !important;
  width: auto !important;
  height: auto !important;
  padding: 5px 10px !important;
  /* flex-direction: column; */
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
}

button.table-button.text:hover > a {
  color: #217DC2;
}

button.table-button.\!text:hover > a {
  color: #217DC2 !important;
}

button.table-button.text > a > img {
  max-width: unset !important;
}

button.table-button.\!text > a > img {
  max-width: unset !important;
}

.icon-button{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 7px;
  border: 1px solid var(--stroke, #d0d4e1);
  background: var(--white, #fff);
}

.icon-button > a {
  display: inline-flex;
  gap: 10px;
  padding: var(--paddingMS) var(--paddingMS) var(--paddingMS) var(--paddingMS);
}

.icon-button:hover{
  background: var(--bg-user-light, #f5f7fa);
}

.icon-button > a > img {
  max-width: 20px;
  max-height: 20px;
  width: 20px;
  height: 20px;
}

.datatable-custom-button.disabled .form-button,
  .back-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 7px;
  border: 1px solid var(--stroke, #d0d4e1);
  background: var(--white, #fff);
}

.datatable-custom-button.\!disabled .form-button {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 10px !important;
  border-radius: 7px !important;
  border: 1px solid var(--stroke, #d0d4e1) !important;
  background: var(--white, #fff) !important;
}

.datatable-custom-button.disabled .form-button > a,
  .back-button > a {
  display: inline-flex;
  gap: 10px;
  color: var(--text-normal) !important;
}

.datatable-custom-button.\!disabled .form-button > a {
  display: inline-flex !important;
  gap: 10px !important;
  color: var(--text-normal) !important;
}

.datatable-custom-button.disabled .form-button:hover,
  .back-button:hover{
  background: var(--bg-user-light, #f5f7fa);
}

.datatable-custom-button.\!disabled .form-button:hover{
  background: var(--bg-user-light, #f5f7fa) !important;
}

.datatable-custom-button.disabled .form-button > a > img
  {
  filter: invert(51%) sepia(56%) saturate(484%) hue-rotate(107deg)
      brightness(0%) contrast(98%);
}

.datatable-custom-button.\!disabled .form-button > a > img
  {
  filter: invert(51%) sepia(56%) saturate(484%) hue-rotate(107deg)
      brightness(0%) contrast(98%) !important;
}

button.small-button {
  border-radius: 7px;
  border: 2px solid #27af7f;
  background: transparent;
}

button.small-button > a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: #27af7f;
  padding: 7px 30px 7px 30px;
}

button.small-button > a > img {
  filter: invert(51%) sepia(56%) saturate(484%) hue-rotate(107deg)
      brightness(98%) contrast(98%);
}

button.file-upload-button {
  border-radius: 7px;
  border: 1px solid #27af7f;
  background: #27af7f;
}

button.file-upload-button-alt {
  border-radius: 7px;
  border: 1px solid #217DC2;
  background: #217DC2;
}

button.file-upload-button > label,
  button.file-upload-button-alt > label {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: #ffffff;
  padding: 7px 30px 7px 30px;
  cursor: pointer;
}

button.file-upload-button > label > img,
  button.file-upload-button-alt > label > img {
  filter: brightness(1000%);
}

button.float-back-button {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 2px solid #d0d4e1;
  background: #ffffff;
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.1);
  z-index: 9999;
}

button.float-back-button.left-variant {
  /* right: none; */
  width: 50px;
  height: 50px;
  bottom: 20px;
  left: 15px;
}

button.float-back-button.still-variant {
  position: static !important;
  width: 40px;
  height: 40px;
  margin: 30px 30px !important;
}

button.float-back-button.left-variant.mobile {
  display: none;
}

button.float-back-button.left-variant.\!mobile {
  display: none !important;
}

button.float-back-button.note-variant {
  width: 40px;
  height: 40px;
  bottom: 50%;
  left: -20px;
}

button.float-back-button:hover {
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.3);
  transition: all 0.3s ease-in;
}

button.float-back-button img {
  max-width: 18px;
  width: 18px;
  height: 18px;
}

button.float-back-button.right-variant {
  transform: translateX(25px);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  top: 80px;
  background-color: #217DC2;
  border: none;
}

button.float-back-button.right-variant:hover {
  box-shadow: 0px 0px 30px -10px #217DC2;
}

button.float-back-button.right-variant img {
  filter: brightness(1000%);
  transition: all 0.3s linear;
}

button.float-back-button.left-variant.alt {
  right: 15px !important;
  left: unset !important;
}

button .tooltipwrap,
  .step p::before {
  position: absolute;
  display: flex;
  flex-direction: row;
  align-content: space-between;
  padding: 6px 8px 6px 8px;
  gap: 20px;
  background-color: #102a43;
  color: #ffffff;
  border-radius: 10px;
  z-index: 99;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.247);
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition-delay: 0.2s;
}


  .\!step p::before {
  position: absolute !important;
  display: flex !important;
  flex-direction: row !important;
  align-content: space-between !important;
  padding: 6px 8px 6px 8px !important;
  gap: 20px !important;
  background-color: #102a43 !important;
  color: #ffffff !important;
  border-radius: 10px !important;
  z-index: 99 !important;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.247) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55) !important;
  transition-delay: 0.2s !important;
}

button .tooltipwrap:before {
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background-color: #102a43;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
}

button:hover .tooltipwrap {
  opacity: 1;
  margin-top: -90px;
  transition-delay: 0.6s;
}

.tooltiptext {
  font-size: 12px;
  font-weight: 400;
  z-index: 9999;
}

.tooltipkey {
  width: 20px;
  height: 20px;
  text-align: center;
  background-color: #486582;
  border-radius: 5px;
}

/* Stli di base per l'alert */

.alert {
  padding: 20px;
  border-radius: 7px;
  font-size: 0.875rem;
}

.alert ul {
  padding-left: 20px;
  list-style: circle;
}

.alert a {
  font-weight: 600;
}

/* Stili per gli alert di successo */

.alert-success {
  background-color: #e7f8f2;
  border: 1px solid #27af7f;
  color: #303651;
}

/* Stili per gli alert di errore */

.alert-error {
  background-color: #fee5ee !important;
  border: 1px solid #f5c6cb !important;
  color: #721c24;
}

/* Stili per gli alert di avviso */

/* Stili per gli alert informativi */

.error-text {
  font-size: 0.875rem;
  color: #8a1818;
}

.menu-wrapper {
  display: flex;
  padding: 0px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  align-self: stretch;
}

.menu-wrapper .label {
  padding: 20px 0px
      0px 30px;
  color: #babed1;
}

.menu-wrapper .menu-item {
  display: flex;
  padding: 10px 30px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  align-self: stretch;
}

.sub-item {
  display: flex;
  flex-direction: column;
  height: 38px;
  line-height: 38px;
}

.sub-menu > ul > li,
  .sub-menu-collapsed > ul > li {
  height: 43px;
  display: flex;
  width: 100%;
  align-items: center;
  transition: all ease-in-out 0.2s;
}

.sub-menu > ul > li > a > p,
  .sub-menu-collapsed > ul > li > a > p {
  padding-left: 10px;
}

.sub-menu-collapsed > ul > li > a > p {
  padding-right: 10px;
}

.sub-menu > ul > li > a > p:hover,
  .sub-menu-collapsed > ul > li > a > p:hover,
  .sub-item.active {
  transition: color 0.2s ease-in;
  color: #217DC2;
  background-color: #effafe;
  border-radius: 12px;
  border: 0px;
}


  .sub-item.\!active {
  transition: color 0.2s ease-in !important;
  color: #217DC2 !important;
  background-color: #effafe !important;
  border-radius: 12px !important;
  border: 0px !important;
}

.sub-menu-collapsed {
  position: absolute;
  display: none;
  left: 80px;
  background-color: var(--white);
  border-radius: 7px;
  margin-top: -38px;
  padding: 5px 12px;
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.25);
  z-index: 999999999999999;
}

.menu-wrapper .menu-item:hover {
  transition: background 0.2s ease-in;
  border-right: 2px solid #217DC2;
  background: #effafe;
}

.display-block {
  display: block !important;
}

.menu-item:hover > div > p {
  color: #217DC2;
}

.sub-menu {
  display: none;
}

.rotate {
  transform: rotate(90deg);
}

.rotate180 {
  transform: rotate(180deg);
}

.menu-item:hover img,
  .sub-item:hover img {
  transition: filter 0.2s ease-in;
  filter: invert(44%) sepia(46%) saturate(884%) hue-rotate(164deg)
      brightness(88%) contrast(93%);
  transition: transform 0.2s ease;
}

.menu-item.active p,
  .sub-item.active p {
  color: #217DC2 !important;
}

.menu-item.\!active p,
  .sub-item.\!active p {
  color: #217DC2 !important;
}

.menu-item.active {
  border-right: 2px solid #217DC2;
  background: #effafe;
}

.menu-item.\!active {
  border-right: 2px solid #217DC2 !important;
  background: #effafe !important;
}

.menu-item.active img,
  .sub-item.active img {
  filter: invert(44%) sepia(46%) saturate(884%) hue-rotate(164deg)
      brightness(88%) contrast(93%);
}

.menu-item.\!active img,
  .sub-item.\!active img {
  filter: invert(44%) sepia(46%) saturate(884%) hue-rotate(164deg)
      brightness(88%) contrast(93%) !important;
}

.menu-wrapper .menu-item:hover .icon-dropdown,
  .menu-wrapper .active .icon-dropdown {
  margin-right: -2px;
  /*correzione piccolo offset causato dall'hover*/
}


  .menu-wrapper .\!active .icon-dropdown {
  margin-right: -2px !important;
  /*correzione piccolo offset causato dall'hover*/
}

.menu-wrapper ul li {
  cursor: pointer;
}

.line-vertical {
  display: block;
  background-color: #dee7ec;
  width: 2px;
  height: 48px;
  transition: all 0.2s linear;
  animation-fill-mode: forwards;
}

.line-horizontal {
  display: block;
  background-color: #dee7ec;
  height: 2px;
  min-width: 12px;
}

.sub-menu > ul > li:last-child > .line-vertical {
  height: 25px;
  align-self: flex-start;
}

.\!notification {
  position: fixed !important;
  width: -moz-max-content !important;
  width: max-content !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 24px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-radius: 6px !important;
  /* background-color: theme("colors.white"); */
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1) !important;
  transform: translateY(40px) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  animation: fade-in 3s linear !important;
  z-index: 9999 !important;
}

.notification {
  position: fixed;
  width: -moz-max-content;
  width: max-content;
  left: 0;
  right: 0;
  bottom: 24px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 6px;
  /* background-color: theme("colors.white"); */
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
  transform: translateY(40px);
  opacity: 0;
  visibility: hidden;
  animation: fade-in 3s linear;
  z-index: 9999;
}

.success {
  background-color: #e7f8f2 !important;
  color: #27af7f;
}

.warning {
  background-color: #fff3cd !important;
  color: #856404;
}

.\!info {
  background-color: #d0ecf5 !important;
  color: #0c5460 !important;
}

.info {
  background-color: #d0ecf5 !important;
  color: #0c5460;
}

.\!error {
  background-color: #fee5ee !important;
  color: red !important;
}

.error {
  background-color: #fee5ee !important;
  color: red;
}

.\!error:has(.notification__progress) .notification__progress {
  background: linear-gradient(to right, #fee5ee,red) !important;
}

.error:has(.notification__progress) .notification__progress {
  background: linear-gradient(to right, #fee5ee,red);
}

.\!error:has(.notification__icon) .notification__icon {
  filter: invert(37%) sepia(68%) saturate(4361%) hue-rotate(340deg)
      brightness(105%) contrast(106%) !important;
}

.error:has(.notification__icon) .notification__icon {
  filter: invert(37%) sepia(68%) saturate(4361%) hue-rotate(340deg)
      brightness(105%) contrast(106%);
}

.warning:has(.notification__icon) .notification__icon {
  filter: invert(14%) sepia(64%) saturate(749%) hue-rotate(39deg)
      brightness(100%) contrast(91%);
}

.\!info:has(.notification__icon) .notification__icon {
  filter: invert(27%) sepia(22%) saturate(749%) hue-rotate(169deg)
      brightness(92%) contrast(87%) !important;
}

.info:has(.notification__icon) .notification__icon {
  filter: invert(27%) sepia(22%) saturate(749%) hue-rotate(169deg)
      brightness(92%) contrast(87%);
}

.success:has(.notification__icon) .notification__icon {
  filter: invert(49%) sepia(94%) saturate(341%) hue-rotate(107deg)
      brightness(95%) contrast(88%);
}

.notification__icon {
  height: 26px;
  width: 26px;
  margin-right: 6px;
}

.notification__body {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 18px 20px;
}

.notification__progress {
  position: absolute;
  left: 4px;
  bottom: 4px;
  width: calc(100% - 8px);
  height: 3px;
  transform: scaleX(0);
  transform-origin: left;
  border-radius: inherit;
  animation: progress 2.5s 0.3s linear;
}

.success .notification__progress {
  background: linear-gradient(to right, #e7f8f2,#27af7f);
}

.warining .notification__progress {
  background: linear-gradient(to right, #fff3cd, #856404);
}

.\!info .notification__progress {
  background: linear-gradient(to right, #d0ecf5, #0c5460) !important;
}

.info .notification__progress {
  background: linear-gradient(to right, #d0ecf5, #0c5460);
}

.\!error .notification__progress {
  background: linear-gradient(to right, #fee5ee, red) !important;
}

.error .notification__progress {
  background: linear-gradient(to right, #fee5ee, red);
}

@keyframes fade-in {
  5% {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }

  95% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes progress {
  to {
    transform: scaleX(1);
  }
}

.dropdown__wrapper {
  position: absolute;
  top: 0px;
  right: 0px;
  padding: 100px 50px 0px 0px;
  z-index: 99999;
}

.dropdown {
  border-radius: 8px;
  background-color: #ffffff;
  display: none;
  padding: 15px;
  width: 100%;
  max-width: 600px;
  box-shadow: 0px 0px 30px -10px rgba(0, 0, 0, 0.25);
  z-index: 2;
  animation: fadeIn 0.2s ease-in-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: scale(0.99) translateY(-0.7em);
    transform-origin: top;
  }

  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.user-badge:hover ~ .dropdown__wrapper > .dropdown,
  .dropdown__wrapper:hover > .dropdown {
  display: block;
}

.badge,
  .risk {
  display: inline-flex;
  align-self: flex-start;
  padding: 4px 8px;
  font-size: var(--body-small);
  /* letter-spacing: 1px; */
  font-weight: 600;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  text-transform: uppercase;
  border-radius: 5px;
  background-color: #F2F2F2;
}

.badge-cliente,
  .risk-2 {
  color: #205fdc;
  background: #e9effc;
}

.badge-admin,
  .risk-3 {
  color: #b94f00;
  background: #fff3e8;
}

.badge-utente,
  .badge-operatore,
  .risk-1,
  .badge-active,
  .badge-attivo {
  color: #27af7f;
  background: #e7f8f2;
}

.badge-test,
  .risk-4,
  .risk-5,
  .badge-inactive,
  .badge-inattivo {
  color: #d30b0b;
  background: #fee5ee;
}

.dataTables_wrapper {
  width: 100%;
}

#nodes-table_length {
  float: left;
}

#nodes-table_filter {
  float: right;
}

.cell-sub-text {
  font-size: 0.875rem;
  color: #878a97;
}

.propic-box .cell-sub-text {
  font-size: 10px !important;
}

.info-filiere .label {
  margin-bottom: 5px;
}

.info-filiere > h5,
  .filiere-builder > h5 {
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 20px;
}

.header-dropdown-menu > li {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 5px 4px 5px 4px;
  border-radius: 5px;
  color: #687084;
}

.header-dropdown-menu > li:hover {
  color: #217DC2;
  background-color: #eefbfe;
}

.header-dropdown-menu > li:hover > a > img {
  filter: invert(44%) sepia(46%) saturate(884%) hue-rotate(164deg)
      brightness(88%) contrast(93%);
}

.propic-box {
  font-weight: 500;
}

.propic {
  border-radius: 50%;
  width: 35px;
  height: 35px;
  margin-right: 10px;
}

input[type="file"]::file-selector-button {
  display: none;
}

.upload-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  gap: 20px;
  border: 2px dashed #27af7f;
  border-radius: 7px;
  padding: 15px;
  background-color: rgb(238, 238, 238);
}

.upload-wrapper-alt {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  gap: 20px;
  border: 2px dashed #217DC2;
  border-radius: 7px;
  padding: 15px;
  background-color: rgb(238, 238, 238);
}

.left-wrapper {
  width: 50%;
  /* height: 550px; */
  border-radius: 12px;
}

.right-wrapper {
  width: 50%;
  /* height: 550px; */
}

.list-info.normal > li {
  color: #0f1827;
}

.split-wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
}

.label-nodo {
  font-size: var(--label);
  color: var(--cell-content);
  letter-spacing: 1px;
  font-weight: 500;
  text-transform: uppercase;
}

.\!loader {
  position: fixed !important;
  width: 100% !important;
  height: 100vh !important;
  overflow-x: hidden !important;
  background-color: #f5f6ff !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  transition: 0.3s all ease-in !important;
  opacity: 1 !important;
}

.loader {
  position: fixed;
  width: 100%;
  height: 100vh;
  overflow-x: hidden;
  background-color: #f5f6ff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: 0.3s all ease-in;
  opacity: 1;
}

.loader-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transform: translateX(-100px);
}

.\!loader.stop {
  opacity: 0 !important;
  visibility: hidden !important;
  transition: all 0.4s ease !important;
}

.loader.stop {
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}

.menu_button_wrapper {
  display: none;
}

tr.last-file-row {
  display: flex;
  width: 100%;
  align-items: center;
  padding-left: 60px;
}

tr.last-file-row > td {
  border-bottom: none !important;
  width: 100%;
  flex: 1;
}

#files-table tr,
  #checklist-table tr {
  cursor: pointer;
}

.breadcrumb {
  color: #217DC2;
  background-color: #ffffff;
  border: 1px solid #d0d4e1;
  font-size: 14px;
  padding: 3px 10px;
  border-radius: 7px;
}

.breadcrumb a:hover {
  text-decoration: underline;
}

.datatable-reset-button{
  all: unset !important;
}

.datatable-reset-button:hover, .datatable-reset-button:active, .datatable-reset-button:focus {
  all: unset !important;
  outline: none !important;
}

.datatable-reset-button .dt-button-down-arrow{
  display: none !important;
}

.datatable-custom-button {
  border-radius: 7px;
}

.datatable-custom-button > span > a {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 10px 30px;
  border-radius: 7px;
  background-color: #217DC2;
  color: #ffffff;
  transition: all 0.3s ease-out;
}

.datatable-custom-button.green > span > a {
  background-color: #27af7f !important;
}

.datatable-custom-button:hover > span > a,
  .datatable-custom-button:active > span > a,
  .datatable-custom-button:active,
  .datatable-custom-button:hover {
  background-color: #339bea;
  box-shadow: 0px 10px 20px 0px rgba(33, 125, 194, 0.3);
  transition: all 0.3s ease-out;
  border: none !important;
  outline: none !important;
}

.datatable-custom-button.green:hover > span > a,
  .datatable-custom-button.green:active > span > a,
  .datatable-custom-button.green:active,
  .datatable-custom-button.green:hover {
  background-color: #339bea;
  box-shadow: 0px 10px 20px 0px rgba(33, 194, 60, 0.3);
  transition: all 0.3s ease-out;
  border: none !important;
  outline: none !important;
}

.datatable-custom-button > span > a > img {
  filter: brightness(1000%);
}

.green-dot {
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 1px solid #d0d4e1;
  background: #d0d4e1;
  color: transparent;
}

.green-dot.active {
  background-color: #27af7f;
}

.green-dot.\!active {
  background-color: #27af7f !important;
}

.green-dot.orange {
  background-color: #ffec02;
}

.green-dot.assigned {
  border: 2px solid #ffec02;
}

.menu_button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
  border: none;
  outline: none;
}

.menu_button,
  .menu_button span {
  display: inline-block;
  box-sizing: border-box;
  transition: all 0.4s;
}

.menu_button {
  z-index: 99992;
  width: 3rem;
  height: 2.2rem;
  transform: translate(-50%, -50%);
  transform: scale(0.5);
  display: none;
}

.menu_button_line {
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.2rem;
  background: #303651;
  border-radius: 0.2rem;
}

.menu_button .menu_button_line.top {
  top: 0;
}

.menu_button .menu_button_line.\!top {
  top: 0 !important;
}

.menu_button .menu_button_line.mid {
  top: 1rem;
  /* (heght(.menu_button)  - height(.menu_button span)) / 2 */
}

.menu_button .menu_button_line.botm {
  bottom: 0;
}

.menu_button.on_menu .menu_button_line {
  background: #233b5d;
}

.menu_button.on_menu .menu_button_line.top {
  transform: translateY(1rem) rotate(-45deg);
}

.menu_button.on_menu .menu_button_line.\!top {
  transform: translateY(1rem) rotate(-45deg) !important;
}

.menu_button.on_menu .menu_button_line.mid {
  opacity: 0;
}

.menu_button.on_menu .menu_button_line.botm {
  transform: translateY(-1rem) rotate(45deg);
}

.mobile-menu {
  display: none;
}

.upload-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: flex-start;
  justify-items: flex-start;
}

.form-group.alt {
  flex-direction: row;
  align-items: center;
  padding: 10px 0px;
}

tr.last-file-row:not(:last-child) {
  border-bottom: 1px solid var(--stroke);
}

.status-badge {
  padding: 8px 16px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: bold;
}

.online {
  background-color: #4caf50;
  color: white;
}

.offline {
  background-color: #f44336;
  color: white;
}

.badge {
  padding: 4px 8px;
  border-radius: 4px;
  font-size: var(--body-small);
}

.alert {
  background-color: #fff3e0;
  border: 1px solid #ffe0b2;
  padding: 16px;
  border-radius: 4px;
  margin-bottom: 20px;
}

button[disabled] {
  cursor: not-allowed;
}

input.text-block-text-area:-moz-read-only, input.text-block-text-area:-moz-read-only:hover {
  border: 2px solid #babed1 !important;
  background: #F0F0F0 !important;
}

input.text-block-text-area:read-only,
  input.text-block-text-area:read-only:hover {
  border: 2px solid #babed1 !important;
  background: #F0F0F0 !important;
}

.pill-text {
  font-size: var(--bodyXL);
  color: #718096;
  padding: 4px 12px;
  background: #f8f9fa;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
}

.pill-text.green {
  color: var(--special-badge-color);
  background: var(--special-badge-bg);
  border: 1px solid var(--special-badge-color);
}

.pill-text.green * {
  color: var(--special-badge-color);
}

.pill-text.blue {
  color: var(--primary);
  background: var(--bg-blue);
  border: 1px solid var(--primary);
}

.pill-text.blue * {
  color: var(--primary);
}

.pill-text.yellow {
  background: #ffecc3 !important;
  color: #ff9900;
  border: 1px solid #ff9900;
}

.pill-text.yellow * {
  color: #ff9900;
}

.pill-text.white {
  background: var(--white) !important;
  color: #718096;
  border: 1px solid #e2e8f0;
}

.pill-text.white * {
  color: #718096;
}

/* Stili per tab verticali gerarchici */

.vertical-tab-button {
  display: flex;
  flex-direction: column;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
  padding: 8px;
  border-radius: 6px;
  background: white;
  border: 2px solid transparent;
  align-items: flex-start;
}

.vertical-tab-button:hover {
  background: #f8fafc;
  border-color: #e2e8f0;
}

.vertical-tab-button.active {
  background: #f1f5f9;
  border-color: #3b82f6;
}

.vertical-tab-button.\!active {
  background: #f1f5f9 !important;
  border-color: #3b82f6 !important;
}

.vertical-tab-button[data-order="1"] {
  border-left: 4px solid #3b82f6;
}

.vertical-tab-button[data-order="1"]:hover {
  background: #eff6ff;
}

.vertical-tab-button[data-order="1"].active {
  background: #dbeafe;
  border-color: #3b82f6;
}

.vertical-tab-button[data-order="1"].\!active {
  background: #dbeafe !important;
  border-color: #3b82f6 !important;
}

.vertical-tab-button:not([data-order="1"]) {
  border-left: 4px solid #10b981;
}

.vertical-tab-button:not([data-order="1"]):hover {
  background: #ecfdf5;
}

.vertical-tab-button:not([data-order="1"]).active {
  background: #d1fae5;
  border-color: #10b981;
}

.vertical-tab-button:not([data-order="1"]).\!active {
  background: #d1fae5 !important;
  border-color: #10b981 !important;
}

/* Troncamento del nome PDF */

.vertical-tab-button .font-medium {
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
}

.step-indicator {
  display: flex;
  align-items: center;
  padding: 0 40px;
}

.\!step.active {
  background-color: transparent !important;
}

.step.active {
  background-color: transparent;
}

.step.\!active {
  background-color: transparent !important;
}

.\!step {
  display: flex !important;
  align-items: center !important;
  flex-direction: column !important;
  position: relative !important;
  z-index: 1 !important;
  border: none !important;
  cursor: pointer !important;
}

.step {
  display: flex;
  align-items: center;
  flex-direction: column;
  position: relative;
  z-index: 1;
  border: none;
  cursor: pointer;
}

.step-indicator .step-icon {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: transparent;
  border: 1px solid #878a97;
  color: #878a97;
  font-size: 16px;
  text-align: center;
  position: relative;
  line-height: 40px;
  font-weight: 400;
  font-style: italic;
}

.\!step.active .step-icon {
  background: var(--primary) !important;
  border: 1px solid #217DC2 !important;
  color: #ffffff !important;
}

.step.active .step-icon {
  background: var(--primary);
  border: 1px solid #217DC2;
  color: #ffffff;
}

.step.\!active .step-icon {
  background: var(--primary) !important;
  border: 1px solid #217DC2 !important;
  color: #ffffff !important;
}

/* Seleziona l'ultimo step attivo */

.step-indicator .step.active:has(+ .indicator-line:not(.active)) .step-icon {
  animation: pulse-animation 2s infinite;
}

.step-indicator .\!step.active:has(+ .indicator-line:not(.active)) .step-icon {
  animation: pulse-animation 2s infinite !important;
}

.step-indicator .step.\!active:has(+ .indicator-line:not(.\!active)) .step-icon {
  animation: pulse-animation 2s infinite !important;
}

/* Seleziona step precedenti superati */

.step-indicator .step.active:has(+ .indicator-line.active) .step-icon {
  position: relative;
  font-size: 0;
  background: #e9effc;
  border: 1px solid #217DC2;
  color: #217DC2;
}

.step-indicator .\!step.active:has(+ .indicator-line.active) .step-icon {
  position: relative !important;
  font-size: 0 !important;
  background: #e9effc !important;
  border: 1px solid #217DC2 !important;
  color: #217DC2 !important;
}

.step-indicator .step.\!active:has(+ .indicator-line.\!active) .step-icon {
  position: relative !important;
  font-size: 0 !important;
  background: #e9effc !important;
  border: 1px solid #217DC2 !important;
  color: #217DC2 !important;
}

.step-indicator
    .step.active:has(+ .indicator-line.active)
    .step-icon::before {
  content: "✓" !important;
  font-size: 16px;
}

.step-indicator
    .\!step.active:has(+ .indicator-line.active)
    .step-icon::before {
  content: "✓" !important;
  font-size: 16px !important;
}

.step-indicator
    .step.\!active:has(+ .indicator-line.\!active)
    .step-icon::before {
  content: "✓" !important;
  font-size: 16px !important;
}

.\!step p {
  color: #878a97 !important;
  text-align: center !important;
  position: absolute !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  min-width: 300px !important;
  bottom: -30px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  z-index: 999999 !important;
}

.step p {
  color: #878a97;
  text-align: center;
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 300px;
  bottom: -30px;
  font-size: 14px;
  font-weight: 400;
  z-index: 999999;
}

.\!step p::before {
  content: attr(data-text) !important;
  font-size: 12px !important;
}

.step p::before {
  content: attr(data-text);
  font-size: 12px;
}

.\!step p::after {
  opacity: 0 !important;
  position: absolute !important;
  content: "" !important;
  height: 15px !important;
  width: 15px !important;
  background-color: #102a43 !important;
  top: -7px !important;
  left: 50% !important;
  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55) !important;
  transition-delay: 0.2s !important;
  transform: translateX(-50%) rotate(45deg) !important;
}

.step p::after {
  opacity: 0;
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background-color: #102a43;
  top: -7px;
  left: 50%;
  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition-delay: 0.2s;
  transform: translateX(-50%) rotate(45deg);
}

.\!step p:not([data-text])::before,
  .\!step p:not([data-text])::after {
  display: none !important;
}

.step p:not([data-text])::before,
  .step p:not([data-text])::after {
  display: none !important;
}

.\!step p:not([data-text])::before,
  .\!step p:not([data-text])::after {
  display: none !important;
}

.\!step:hover p::before {
  opacity: 1 !important;
}

.step:hover p::before {
  opacity: 1;
}

.\!step:hover p::after {
  opacity: 1 !important;
}

.step:hover p::after {
  opacity: 1;
}

.\!step.active p {
  color: var(--primary) !important;
}

.step.active p {
  color: var(--primary);
}

.step.\!active p {
  color: var(--primary) !important;
}

.\!step.step2 p,
  .\!step.step3 p {
  left: 50% !important;
  transform: translateX(-50%) !important;
}

.step.step2 p,
  .step.step3 p {
  left: 50%;
  transform: translateX(-50%);
}

.\!step.step2 p,
  .\!step.step3 p {
  left: 50% !important;
  transform: translateX(-50%) !important;
}

.indicator-line {
  width: 100%;
  height: 1px;
  background: #878a97;
  flex: 1;
}

.indicator-line.active {
  background: var(--primary);
}

.indicator-line.\!active {
  background: var(--primary) !important;
}

@keyframes pulse-animation {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(33, 125, 194, 0.7);
  }

  70% {
    transform: scale(1);
    box-shadow: 0 0 0 15px rgba(0, 0, 0, 0);
  }

  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
}

.select2-container--default
    .select2-selection--multiple
    .select2-selection__choice__remove {
  margin: 0;
}

.leaflet-control-attribution {
  display: none !important;
}

a.filepond--credits {
  display: none;
}

.select-all-checkbox {
  cursor: pointer;
  margin: 0;
  padding: 0;
  position: relative;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 16px;
  height: 16px;
  border: none;
  background: transparent;
  outline: none;
  vertical-align: top;
}

.select-all-checkbox:focus {
  outline: none;
  box-shadow: none;
  border: none;
}

.select-all-checkbox:active {
  transform: none;
}

.select-all-checkbox::before {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  width: 16px;
  height: 16px;
  border: 1px solid #d6d8df;
  background-color: var(--white);
  border-radius: 4px;
  display: block;
  box-sizing: border-box;
}

.select-all-checkbox:checked::before {
  content: url(../img/icons/check-table.svg);
  background-color: var(--primary);
  font-size: 0px;
  height: 16px;
  text-align: center;
  border-radius: 3px;
  border: 1px solid var(--primary);
}

.select-all-checkbox:indeterminate::before {
  content: "−";
  background-color: var(--primary);
  color: white;
  font-size: 14px;
  line-height: 14px;
  height: 16px;
  text-align: center;
  border-radius: 3px;
  border: 1px solid var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Stili per i tabs orizzontali */

.tabs-container {
  align-self: baseline;
  border-radius: var(--borderM);
}

.tabs-nav {
  display: flex;
  justify-content: center;
  background: transparent;
  border: 8px solid white;
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
  padding: 0;
}

.tab-button {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: #F0F0F0;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: all 0.3s ease;
  color: #64748b;
  box-shadow: none;
  min-width: auto;
  flex: none;
  position: relative;
}

.tab-button:hover {
  background: #effafe;
  color: var(--primary);
}

.tab-button.active {
  background: var(--gradient-primary);
  color: var(--white);
  font-weight: 600;
  box-shadow: none;
}

.tab-button.\!active {
  background: var(--gradient-primary) !important;
  color: var(--white) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.tab-button.active:first-child,.tab-button:first-child {
  border-radius: 12px 0px 0px 12px;
}

.tab-button.\!active:first-child {
  border-radius: 12px 0px 0px 12px !important;
}

.tab-button.active:not(:first-child):not(:last-child), .tab-button:not(:first-child):not(:last-child) {
  border-radius: 0px;
}

.tab-button.\!active:not(:first-child):not(:last-child) {
  border-radius: 0px !important;
}

.tab-button.active:last-child, .tab-button:last-child {
  border-radius: 0px 12px 12px 0px;
}

.tab-button.\!active:last-child {
  border-radius: 0px 12px 12px 0px !important;
}

.tab-button.active .tab-icon {
  filter: brightness(0) invert(1);
}

.tab-button.\!active .tab-icon {
  filter: brightness(0) invert(1) !important;
}

.tab-icon {
  width: 16px;
  height: 16px;
  opacity: 0.7;
  transition: all 0.3s ease;
}

.tab-button:hover .tab-icon {
  opacity: 0.9;
}

.tab-button.active .tab-icon {
  opacity: 1;
}

.tab-button.\!active .tab-icon {
  opacity: 1 !important;
}

.tab-content {
  background: transparent;
  min-height: 400px;
  width: 100%;
}

/* Stili per i tabs verticali */

.vertical-tabs-nav {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.vertical-tabs-container{
  max-height: 600px;
  overflow-y: auto;
}

.vertical-tab-button {
  padding: 12px 16px;
  background: #f8f9fa;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
  font-weight: 400;
  color: #6b7280;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
}

.vertical-tab-button:hover {
  background: #e9ecef;
  color: #374151;
}

.vertical-tab-button.active {
  background: #effafe;
  color: #3b82f6;
  border-left-color: #3b82f6;
}

.vertical-tab-button.\!active {
  background: #effafe !important;
  color: #3b82f6 !important;
  border-left-color: #3b82f6 !important;
}

.vertical-tab-content {
  width: 100%;
}

#tab3 .content-wrapper {
  padding: 0;
}

/* Stili per il sistema di tab parametrizzabili */

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}

.tab-content.\!active {
  display: block !important;
}

.tab-button {
  transition: all 0.3s ease;
}

.tab-button.active {
  background-color: #3b82f6;
  color: white;
}

.tab-button.\!active {
  background-color: #3b82f6 !important;
  color: white !important;
}

/* Stili per la tabella links-table per forzare width 100% */

#links-table {
  width: 100% !important;
  table-layout: fixed !important;
}

#links-table_wrapper {
  width: 100% !important;
  overflow-x: auto;
}

#links-table_wrapper .dataTables_scroll {
  width: 100% !important;
}

#links-table_wrapper .dataTables_scrollHead,
    #links-table_wrapper .dataTables_scrollBody {
  width: 100% !important;
}

.table-responsive {
  width: 100% !important;
  overflow-x: auto;
}

.pointer-events-none{
  pointer-events: none;
}

.\!visible{
  visibility: visible !important;
}

.visible{
  visibility: visible;
}

.invisible{
  visibility: hidden;
}

.collapse{
  visibility: collapse;
}

.static{
  position: static;
}

.fixed{
  position: fixed;
}

.absolute{
  position: absolute;
}

.relative{
  position: relative;
}

.sticky{
  position: sticky;
}

.inset-0{
  inset: 0px;
}

.inset-y-0{
  top: 0px;
  bottom: 0px;
}

.bottom-0{
  bottom: 0px;
}

.bottom-8{
  bottom: 2rem;
}

.left-0{
  left: 0px;
}

.left-1\/2{
  left: 50%;
}

.left-3{
  left: 0.75rem;
}

.left-4{
  left: 1rem;
}

.right-0{
  right: 0px;
}

.right-3{
  right: 0.75rem;
}

.top-1\/2{
  top: 50%;
}

.top-2\.5{
  top: 0.625rem;
}

.top-20{
  top: 5rem;
}

.top-3{
  top: 0.75rem;
}

.top-8{
  top: 2rem;
}

.z-10{
  z-index: 10;
}

.z-50{
  z-index: 50;
}

.col-span-2{
  grid-column: span 2 / span 2;
}

.col-span-full{
  grid-column: 1 / -1;
}

.m-1{
  margin: 0.25rem;
}

.m-2{
  margin: 0.5rem;
}

.m-\[10px\]{
  margin: 10px;
}

.m-auto{
  margin: auto;
}

.mx-4{
  margin-left: 1rem;
  margin-right: 1rem;
}

.mx-5{
  margin-left: 1.25rem;
  margin-right: 1.25rem;
}

.mx-auto{
  margin-left: auto;
  margin-right: auto;
}

.my-1{
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}

.my-4{
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.my-6{
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

.my-7{
  margin-top: 1.75rem;
  margin-bottom: 1.75rem;
}

.\!ml-0{
  margin-left: 0px !important;
}

.-mt-\[50px\]{
  margin-top: -50px;
}

.mb-0{
  margin-bottom: 0px;
}

.mb-1{
  margin-bottom: 0.25rem;
}

.mb-2{
  margin-bottom: 0.5rem;
}

.mb-3{
  margin-bottom: 0.75rem;
}

.mb-4{
  margin-bottom: 1rem;
}

.mb-5{
  margin-bottom: 1.25rem;
}

.mb-6{
  margin-bottom: 1.5rem;
}

.mb-8{
  margin-bottom: 2rem;
}

.mb-\[-20px\]{
  margin-bottom: -20px;
}

.mb-\[20px\]{
  margin-bottom: 20px;
}

.mb-\[30px\]{
  margin-bottom: 30px;
}

.mb-paddingS{
  margin-bottom: 10px;
}

.mb-paddingXS{
  margin-bottom: 5px;
}

.ml-1{
  margin-left: 0.25rem;
}

.ml-2{
  margin-left: 0.5rem;
}

.ml-3{
  margin-left: 0.75rem;
}

.ml-\[50px\]{
  margin-left: 50px;
}

.ml-auto{
  margin-left: auto;
}

.ml-paddingS{
  margin-left: 10px;
}

.mr-1{
  margin-right: 0.25rem;
}

.mr-2{
  margin-right: 0.5rem;
}

.mr-3{
  margin-right: 0.75rem;
}

.mr-\[20px\]{
  margin-right: 20px;
}

.mt-0\.5{
  margin-top: 0.125rem;
}

.mt-1{
  margin-top: 0.25rem;
}

.mt-1\.5{
  margin-top: 0.375rem;
}

.mt-2{
  margin-top: 0.5rem;
}

.mt-3{
  margin-top: 0.75rem;
}

.mt-4{
  margin-top: 1rem;
}

.mt-5{
  margin-top: 1.25rem;
}

.mt-6{
  margin-top: 1.5rem;
}

.mt-8{
  margin-top: 2rem;
}

.mt-\[20px\]{
  margin-top: 20px;
}

.mt-\[30px\]{
  margin-top: 30px;
}

.mt-paddingL{
  margin-top: 20px;
}

.mt-paddingS{
  margin-top: 10px;
}

.\!block{
  display: block !important;
}

.block{
  display: block;
}

.inline-block{
  display: inline-block;
}

.\!inline{
  display: inline !important;
}

.inline{
  display: inline;
}

.flex{
  display: flex;
}

.inline-flex{
  display: inline-flex;
}

.\!table{
  display: table !important;
}

.table{
  display: table;
}

.table-caption{
  display: table-caption;
}

.table-cell{
  display: table-cell;
}

.table-column{
  display: table-column;
}

.table-column-group{
  display: table-column-group;
}

.table-row-group{
  display: table-row-group;
}

.table-row{
  display: table-row;
}

.\!grid{
  display: grid !important;
}

.grid{
  display: grid;
}

.contents{
  display: contents;
}

.\!hidden{
  display: none !important;
}

.hidden{
  display: none;
}

.\!h-\[50px\]{
  height: 50px !important;
}

.h-0\.5{
  height: 0.125rem;
}

.h-1{
  height: 0.25rem;
}

.h-1\/2{
  height: 50%;
}

.h-10{
  height: 2.5rem;
}

.h-12{
  height: 3rem;
}

.h-16{
  height: 4rem;
}

.h-2{
  height: 0.5rem;
}

.h-2\.5{
  height: 0.625rem;
}

.h-3{
  height: 0.75rem;
}

.h-32{
  height: 8rem;
}

.h-4{
  height: 1rem;
}

.h-5{
  height: 1.25rem;
}

.h-6{
  height: 1.5rem;
}

.h-7{
  height: 1.75rem;
}

.h-8{
  height: 2rem;
}

.h-9{
  height: 2.25rem;
}

.h-\[100px\]{
  height: 100px;
}

.h-\[150px\]{
  height: 150px;
}

.h-\[200px\]{
  height: 200px;
}

.h-\[24px\]{
  height: 24px;
}

.h-\[50px\]{
  height: 50px;
}

.h-auto{
  height: auto;
}

.h-full{
  height: 100%;
}

.max-h-32{
  max-height: 8rem;
}

.min-h-\[120px\]{
  min-height: 120px;
}

.min-h-\[40px\]{
  min-height: 40px;
}

.min-h-\[50px\]{
  min-height: 50px;
}

.\!w-\[50px\]{
  width: 50px !important;
}

.w-1{
  width: 0.25rem;
}

.w-10{
  width: 2.5rem;
}

.w-12{
  width: 3rem;
}

.w-16{
  width: 4rem;
}

.w-2{
  width: 0.5rem;
}

.w-2\.5{
  width: 0.625rem;
}

.w-3{
  width: 0.75rem;
}

.w-4{
  width: 1rem;
}

.w-48{
  width: 12rem;
}

.w-5{
  width: 1.25rem;
}

.w-6{
  width: 1.5rem;
}

.w-7{
  width: 1.75rem;
}

.w-8{
  width: 2rem;
}

.w-9{
  width: 2.25rem;
}

.w-\[150px\]{
  width: 150px;
}

.w-\[24px\]{
  width: 24px;
}

.w-\[300px\]{
  width: 300px;
}

.w-\[50\%\]{
  width: 50%;
}

.w-\[50px\]{
  width: 50px;
}

.w-\[80vw\]{
  width: 80vw;
}

.w-full{
  width: 100%;
}

.min-w-\[100\%\]{
  min-width: 100%;
}

.min-w-\[200px\]{
  min-width: 200px;
}

.min-w-\[400px\]{
  min-width: 400px;
}

.max-w-32{
  max-width: 8rem;
}

.max-w-64{
  max-width: 16rem;
}

.max-w-\[1180px\]{
  max-width: 1180px;
}

.max-w-full{
  max-width: 100%;
}

.max-w-md{
  max-width: 28rem;
}

.flex-1{
  flex: 1 1 0%;
}

.flex-shrink-0{
  flex-shrink: 0;
}

.shrink{
  flex-shrink: 1;
}

.\!grow{
  flex-grow: 1 !important;
}

.\!grow-0{
  flex-grow: 0 !important;
}

.grow{
  flex-grow: 1;
}

.border-collapse{
  border-collapse: collapse;
}

.-translate-x-1\/2{
  --tw-translate-x: -50%;
  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));
}

.-translate-y-1\/2{
  --tw-translate-y: -50%;
  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));
}

.rotate-180{
  --tw-rotate: 180deg;
  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));
}

.transform{
  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));
}

.animate-\[loading_1s_ease-in-out_infinite\]{
  animation: loading 1s ease-in-out infinite;
}

@keyframes pulse{
  50%{
    opacity: .5;
  }
}

.animate-pulse{
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes spin{
  to{
    transform: rotate(360deg);
  }
}

.animate-spin{
  animation: spin 1s linear infinite;
}

.cursor-pointer{
  cursor: pointer;
}

.select-all{
  -webkit-user-select: all;
     -moz-user-select: all;
          user-select: all;
}

.resize{
  resize: both;
}

.list-inside{
  list-style-position: inside;
}

.list-disc{
  list-style-type: disc;
}

.grid-cols-1{
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid-cols-2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.flex-row{
  flex-direction: row;
}

.flex-row-reverse{
  flex-direction: row-reverse;
}

.flex-col{
  flex-direction: column;
}

.flex-wrap{
  flex-wrap: wrap;
}

.items-start{
  align-items: flex-start;
}

.items-center{
  align-items: center;
}

.justify-start{
  justify-content: flex-start;
}

.justify-end{
  justify-content: flex-end;
}

.justify-center{
  justify-content: center;
}

.\!justify-between{
  justify-content: space-between !important;
}

.justify-between{
  justify-content: space-between;
}

.\!gap-5{
  gap: 1.25rem !important;
}

.\!gap-6{
  gap: 1.5rem !important;
}

.gap-0{
  gap: 0px;
}

.gap-1{
  gap: 0.25rem;
}

.gap-10{
  gap: 2.5rem;
}

.gap-2{
  gap: 0.5rem;
}

.gap-3{
  gap: 0.75rem;
}

.gap-4{
  gap: 1rem;
}

.gap-5{
  gap: 1.25rem;
}

.gap-6{
  gap: 1.5rem;
}

.gap-8{
  gap: 2rem;
}

.gap-\[10px\]{
  gap: 10px;
}

.gap-\[15px\]{
  gap: 15px;
}

.gap-\[20px\]{
  gap: 20px;
}

.gap-\[30px\]{
  gap: 30px;
}

.gap-\[50px\]{
  gap: 50px;
}

.gap-\[5px\]{
  gap: 5px;
}

.gap-paddingL{
  gap: 20px;
}

.gap-paddingM{
  gap: 15px;
}

.gap-paddingS{
  gap: 10px;
}

.gap-paddingXL{
  gap: 30px;
}

.gap-paddingZero{
  gap: 0px;
}

.space-x-2 > :not([hidden]) ~ :not([hidden]){
  --tw-space-x-reverse: 0;
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
}

.space-x-4 > :not([hidden]) ~ :not([hidden]){
  --tw-space-x-reverse: 0;
  margin-right: calc(1rem * var(--tw-space-x-reverse));
  margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}

.space-y-1 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}

.space-y-2 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}

.space-y-4 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}

.space-y-8 > :not([hidden]) ~ :not([hidden]){
  --tw-space-y-reverse: 0;
  margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(2rem * var(--tw-space-y-reverse));
}

.divide-y > :not([hidden]) ~ :not([hidden]){
  --tw-divide-y-reverse: 0;
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}

.divide-gray-200 > :not([hidden]) ~ :not([hidden]){
  --tw-divide-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-divide-opacity, 1));
}

.self-center{
  align-self: center;
}

.overflow-auto{
  overflow: auto;
}

.overflow-hidden{
  overflow: hidden;
}

.overflow-x-auto{
  overflow-x: auto;
}

.truncate{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.whitespace-pre-wrap{
  white-space: pre-wrap;
}

.break-words{
  overflow-wrap: break-word;
}

.break-all{
  word-break: break-all;
}

.\!rounded-borderS{
  border-radius: 7px !important;
}

.rounded{
  border-radius: 0.25rem;
}

.rounded-2xl{
  border-radius: 1rem;
}

.rounded-borderL{
  border-radius: 50px;
}

.rounded-borderM{
  border-radius: 12px;
}

.rounded-borderS{
  border-radius: 7px;
}

.rounded-full{
  border-radius: 9999px;
}

.rounded-lg{
  border-radius: var(--radius);
}

.rounded-md{
  border-radius: calc(var(--radius) - 2px);
}

.rounded-sm{
  border-radius: calc(var(--radius) - 4px);
}

.rounded-xl{
  border-radius: 0.75rem;
}

.border{
  border-width: 1px;
}

.border-2{
  border-width: 2px;
}

.border-\[1px\]{
  border-width: 1px;
}

.border-\[3px\]{
  border-width: 3px;
}

.border-b{
  border-bottom-width: 1px;
}

.border-l-4{
  border-left-width: 4px;
}

.border-t{
  border-top-width: 1px;
}

.border-solid{
  border-style: solid;
}

.border-dashed{
  border-style: dashed;
}

.border-\[\#e0e0e0\]{
  --tw-border-opacity: 1;
  border-color: rgb(224 224 224 / var(--tw-border-opacity, 1));
}

.border-bg{
  --tw-border-opacity: 1;
  border-color: rgb(245 246 255 / var(--tw-border-opacity, 1));
}

.border-blue-100{
  --tw-border-opacity: 1;
  border-color: rgb(219 234 254 / var(--tw-border-opacity, 1));
}

.border-blue-200{
  --tw-border-opacity: 1;
  border-color: rgb(191 219 254 / var(--tw-border-opacity, 1));
}

.border-blue-300{
  --tw-border-opacity: 1;
  border-color: rgb(147 197 253 / var(--tw-border-opacity, 1));
}

.border-blue-400{
  --tw-border-opacity: 1;
  border-color: rgb(96 165 250 / var(--tw-border-opacity, 1));
}

.border-blue-500{
  --tw-border-opacity: 1;
  border-color: rgb(59 130 246 / var(--tw-border-opacity, 1));
}

.border-gray-100{
  --tw-border-opacity: 1;
  border-color: rgb(243 244 246 / var(--tw-border-opacity, 1));
}

.border-gray-200{
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
}

.border-gray-300{
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
}

.border-green-100{
  --tw-border-opacity: 1;
  border-color: rgb(220 252 231 / var(--tw-border-opacity, 1));
}

.border-green-200{
  --tw-border-opacity: 1;
  border-color: rgb(187 247 208 / var(--tw-border-opacity, 1));
}

.border-green-300{
  --tw-border-opacity: 1;
  border-color: rgb(134 239 172 / var(--tw-border-opacity, 1));
}

.border-green-400{
  --tw-border-opacity: 1;
  border-color: rgb(74 222 128 / var(--tw-border-opacity, 1));
}

.border-green-500{
  --tw-border-opacity: 1;
  border-color: rgb(34 197 94 / var(--tw-border-opacity, 1));
}

.border-primary{
  --tw-border-opacity: 1;
  border-color: rgb(33 125 194 / var(--tw-border-opacity, 1));
}

.border-purple-300{
  --tw-border-opacity: 1;
  border-color: rgb(216 180 254 / var(--tw-border-opacity, 1));
}

.border-purple-400{
  --tw-border-opacity: 1;
  border-color: rgb(192 132 252 / var(--tw-border-opacity, 1));
}

.border-stroke{
  --tw-border-opacity: 1;
  border-color: rgb(208 212 225 / var(--tw-border-opacity, 1));
}

.border-stroke2{
  --tw-border-opacity: 1;
  border-color: rgb(222 231 236 / var(--tw-border-opacity, 1));
}

.border-yellow-400{
  --tw-border-opacity: 1;
  border-color: rgb(250 204 21 / var(--tw-border-opacity, 1));
}

.bg-amber-50{
  --tw-bg-opacity: 1;
  background-color: rgb(255 251 235 / var(--tw-bg-opacity, 1));
}

.bg-bg{
  --tw-bg-opacity: 1;
  background-color: rgb(245 246 255 / var(--tw-bg-opacity, 1));
}

.bg-black{
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}

.bg-blue-100{
  --tw-bg-opacity: 1;
  background-color: rgb(219 234 254 / var(--tw-bg-opacity, 1));
}

.bg-blue-200{
  --tw-bg-opacity: 1;
  background-color: rgb(191 219 254 / var(--tw-bg-opacity, 1));
}

.bg-blue-400{
  --tw-bg-opacity: 1;
  background-color: rgb(96 165 250 / var(--tw-bg-opacity, 1));
}

.bg-blue-50{
  --tw-bg-opacity: 1;
  background-color: rgb(239 246 255 / var(--tw-bg-opacity, 1));
}

.bg-blue-500{
  --tw-bg-opacity: 1;
  background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1));
}

.bg-blue-600{
  --tw-bg-opacity: 1;
  background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
}

.bg-gray-100{
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}

.bg-gray-200{
  --tw-bg-opacity: 1;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
}

.bg-gray-50{
  --tw-bg-opacity: 1;
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}

.bg-gray-50\/50{
  background-color: rgb(249 250 251 / 0.5);
}

.bg-gray-600{
  --tw-bg-opacity: 1;
  background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1));
}

.bg-gray-900{
  --tw-bg-opacity: 1;
  background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
}

.bg-green-100{
  --tw-bg-opacity: 1;
  background-color: rgb(220 252 231 / var(--tw-bg-opacity, 1));
}

.bg-green-400{
  --tw-bg-opacity: 1;
  background-color: rgb(74 222 128 / var(--tw-bg-opacity, 1));
}

.bg-green-50{
  --tw-bg-opacity: 1;
  background-color: rgb(240 253 244 / var(--tw-bg-opacity, 1));
}

.bg-green-500{
  --tw-bg-opacity: 1;
  background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1));
}

.bg-green-600{
  --tw-bg-opacity: 1;
  background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));
}

.bg-inherit{
  background-color: inherit;
}

.bg-primary{
  --tw-bg-opacity: 1;
  background-color: rgb(33 125 194 / var(--tw-bg-opacity, 1));
}

.bg-purple-100{
  --tw-bg-opacity: 1;
  background-color: rgb(243 232 255 / var(--tw-bg-opacity, 1));
}

.bg-purple-50{
  --tw-bg-opacity: 1;
  background-color: rgb(250 245 255 / var(--tw-bg-opacity, 1));
}

.bg-red-100{
  --tw-bg-opacity: 1;
  background-color: rgb(254 226 226 / var(--tw-bg-opacity, 1));
}

.bg-red-400{
  --tw-bg-opacity: 1;
  background-color: rgb(248 113 113 / var(--tw-bg-opacity, 1));
}

.bg-slate-50{
  --tw-bg-opacity: 1;
  background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));
}

.bg-transparent{
  background-color: transparent;
}

.bg-white{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.bg-yellow-50{
  --tw-bg-opacity: 1;
  background-color: rgb(254 252 232 / var(--tw-bg-opacity, 1));
}

.bg-opacity-10{
  --tw-bg-opacity: 0.1;
}

.bg-opacity-20{
  --tw-bg-opacity: 0.2;
}

.bg-opacity-30{
  --tw-bg-opacity: 0.3;
}

.bg-opacity-50{
  --tw-bg-opacity: 0.5;
}

.bg-opacity-70{
  --tw-bg-opacity: 0.7;
}

.bg-gradient-to-b{
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
}

.bg-gradient-to-br{
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}

.bg-gradient-to-r{
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

.bg-gradient-to-t{
  background-image: linear-gradient(to top, var(--tw-gradient-stops));
}

.from-blue-50{
  --tw-gradient-from: #eff6ff var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(239 246 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-blue-500{
  --tw-gradient-from: #3b82f6 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(59 130 246 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-blue-600{
  --tw-gradient-from: #2563eb var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(37 99 235 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-gray-50{
  --tw-gradient-from: #f9fafb var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(249 250 251 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-gray-900{
  --tw-gradient-from: #111827 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(17 24 39 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-green-100{
  --tw-gradient-from: #dcfce7 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(220 252 231 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-green-50{
  --tw-gradient-from: #f0fdf4 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(240 253 244 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-green-600{
  --tw-gradient-from: #16a34a var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(22 163 74 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-primary{
  --tw-gradient-from: #217DC2 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(33 125 194 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-purple-500{
  --tw-gradient-from: #a855f7 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(168 85 247 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-purple-600{
  --tw-gradient-from: #9333ea var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(147 51 234 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-secondary{
  --tw-gradient-from: #5BC5EC var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(91 197 236 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-transparent{
  --tw-gradient-from: transparent var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-white{
  --tw-gradient-from: #ffffff var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.via-blue-300{
  --tw-gradient-to: rgb(147 197 253 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), #93c5fd var(--tw-gradient-via-position), var(--tw-gradient-to);
}

.to-blue-100{
  --tw-gradient-to: #dbeafe var(--tw-gradient-to-position);
}

.to-blue-500{
  --tw-gradient-to: #3b82f6 var(--tw-gradient-to-position);
}

.to-blue-600{
  --tw-gradient-to: #2563eb var(--tw-gradient-to-position);
}

.to-blue-800{
  --tw-gradient-to: #1e40af var(--tw-gradient-to-position);
}

.to-gray-200{
  --tw-gradient-to: #e5e7eb var(--tw-gradient-to-position);
}

.to-gray-50{
  --tw-gradient-to: #f9fafb var(--tw-gradient-to-position);
}

.to-green-100{
  --tw-gradient-to: #dcfce7 var(--tw-gradient-to-position);
}

.to-green-700{
  --tw-gradient-to: #15803d var(--tw-gradient-to-position);
}

.to-nice-blue{
  --tw-gradient-to: #2563eb var(--tw-gradient-to-position);
}

.to-transparent{
  --tw-gradient-to: transparent var(--tw-gradient-to-position);
}

.to-white{
  --tw-gradient-to: #ffffff var(--tw-gradient-to-position);
}

.bg-cover{
  background-size: cover;
}

.bg-clip-text{
  -webkit-background-clip: text;
          background-clip: text;
}

.bg-no-repeat{
  background-repeat: no-repeat;
}

.p-0{
  padding: 0px;
}

.p-1{
  padding: 0.25rem;
}

.p-1\.5{
  padding: 0.375rem;
}

.p-10{
  padding: 2.5rem;
}

.p-2{
  padding: 0.5rem;
}

.p-3{
  padding: 0.75rem;
}

.p-4{
  padding: 1rem;
}

.p-5{
  padding: 1.25rem;
}

.p-6{
  padding: 1.5rem;
}

.p-8{
  padding: 2rem;
}

.p-\[10px\]{
  padding: 10px;
}

.p-\[20px\]{
  padding: 20px;
}

.p-paddingL{
  padding: 20px;
}

.p-paddingM{
  padding: 15px;
}

.p-paddingS{
  padding: 10px;
}

.p-paddingXL{
  padding: 30px;
}

.px-1{
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.px-2{
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.px-2\.5{
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}

.px-3{
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.px-4{
  padding-left: 1rem;
  padding-right: 1rem;
}

.px-5{
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.px-6{
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.px-8{
  padding-left: 2rem;
  padding-right: 2rem;
}

.px-\[80px\]{
  padding-left: 80px;
  padding-right: 80px;
}

.py-0\.5{
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}

.py-1{
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.py-12{
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.py-2{
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.py-3{
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.py-4{
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.py-8{
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.py-paddingS{
  padding-top: 10px;
  padding-bottom: 10px;
}

.\!pt-\[80px\]{
  padding-top: 80px !important;
}

.pb-0{
  padding-bottom: 0px;
}

.pb-10{
  padding-bottom: 2.5rem;
}

.pb-6{
  padding-bottom: 1.5rem;
}

.pb-\[10px\]{
  padding-bottom: 10px;
}

.pb-\[30px\]{
  padding-bottom: 30px;
}

.pb-\[50px\]{
  padding-bottom: 50px;
}

.pb-paddingL{
  padding-bottom: 20px;
}

.pb-paddingS{
  padding-bottom: 10px;
}

.pb-paddingXXL{
  padding-bottom: 40px;
}

.pl-10{
  padding-left: 2.5rem;
}

.pl-12{
  padding-left: 3rem;
}

.pl-3{
  padding-left: 0.75rem;
}

.pl-paddingXXL{
  padding-left: 40px;
}

.pr-3{
  padding-right: 0.75rem;
}

.pr-4{
  padding-right: 1rem;
}

.pr-paddingS{
  padding-right: 10px;
}

.pt-4{
  padding-top: 1rem;
}

.pt-5{
  padding-top: 1.25rem;
}

.pt-\[20px\]{
  padding-top: 20px;
}

.pt-paddingL{
  padding-top: 20px;
}

.pt-paddingM{
  padding-top: 15px;
}

.pt-paddingS{
  padding-top: 10px;
}

.pt-paddingXL{
  padding-top: 30px;
}

.pt-paddingXS{
  padding-top: 5px;
}

.text-left{
  text-align: left;
}

.text-center{
  text-align: center;
}

.text-right{
  text-align: right;
}

.align-top{
  vertical-align: top;
}

.align-middle{
  vertical-align: middle;
}

.font-mono{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.text-2xl{
  font-size: 1.5rem;
  line-height: 2rem;
}

.text-3xl{
  font-size: 1.875rem;
  line-height: 2.25rem;
}

.text-\[42px\]{
  font-size: 42px;
}

.text-body{
  font-size: 0.875rem;
}

.text-body-large{
  font-size: 1rem;
}

.text-body-small{
  font-size: 0.75rem;
}

.text-bodyXL{
  font-size: 1.125rem;
}

.text-lg{
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.text-sm{
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.text-xl{
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.text-xs{
  font-size: 0.75rem;
  line-height: 1rem;
}

.font-bold{
  font-weight: 700;
}

.font-light{
  font-weight: 300;
}

.font-medium{
  font-weight: 500;
}

.font-semibold{
  font-weight: 600;
}

.uppercase{
  text-transform: uppercase;
}

.lowercase{
  text-transform: lowercase;
}

.capitalize{
  text-transform: capitalize;
}

.\!italic{
  font-style: italic !important;
}

.italic{
  font-style: italic;
}

.leading-relaxed{
  line-height: 1.625;
}

.leading-tight{
  line-height: 1.25;
}

.tracking-wide{
  letter-spacing: 0.025em;
}

.\!text-white{
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}

.text-amber-600{
  --tw-text-opacity: 1;
  color: rgb(217 119 6 / var(--tw-text-opacity, 1));
}

.text-blue-100{
  --tw-text-opacity: 1;
  color: rgb(219 234 254 / var(--tw-text-opacity, 1));
}

.text-blue-400{
  --tw-text-opacity: 1;
  color: rgb(96 165 250 / var(--tw-text-opacity, 1));
}

.text-blue-500{
  --tw-text-opacity: 1;
  color: rgb(59 130 246 / var(--tw-text-opacity, 1));
}

.text-blue-600{
  --tw-text-opacity: 1;
  color: rgb(37 99 235 / var(--tw-text-opacity, 1));
}

.text-blue-700{
  --tw-text-opacity: 1;
  color: rgb(29 78 216 / var(--tw-text-opacity, 1));
}

.text-blue-800{
  --tw-text-opacity: 1;
  color: rgb(30 64 175 / var(--tw-text-opacity, 1));
}

.text-cell-content{
  --tw-text-opacity: 1;
  color: rgb(48 54 81 / var(--tw-text-opacity, 1));
}

.text-cyan-600{
  --tw-text-opacity: 1;
  color: rgb(8 145 178 / var(--tw-text-opacity, 1));
}

.text-gray-400{
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}

.text-gray-500{
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}

.text-gray-600{
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity, 1));
}

.text-gray-700{
  --tw-text-opacity: 1;
  color: rgb(55 65 81 / var(--tw-text-opacity, 1));
}

.text-gray-800{
  --tw-text-opacity: 1;
  color: rgb(31 41 55 / var(--tw-text-opacity, 1));
}

.text-gray-900{
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}

.text-green-400{
  --tw-text-opacity: 1;
  color: rgb(74 222 128 / var(--tw-text-opacity, 1));
}

.text-green-500{
  --tw-text-opacity: 1;
  color: rgb(34 197 94 / var(--tw-text-opacity, 1));
}

.text-green-600{
  --tw-text-opacity: 1;
  color: rgb(22 163 74 / var(--tw-text-opacity, 1));
}

.text-green-700{
  --tw-text-opacity: 1;
  color: rgb(21 128 61 / var(--tw-text-opacity, 1));
}

.text-green-800{
  --tw-text-opacity: 1;
  color: rgb(22 101 52 / var(--tw-text-opacity, 1));
}

.text-orange-600{
  --tw-text-opacity: 1;
  color: rgb(234 88 12 / var(--tw-text-opacity, 1));
}

.text-primary{
  --tw-text-opacity: 1;
  color: rgb(33 125 194 / var(--tw-text-opacity, 1));
}

.text-purple-600{
  --tw-text-opacity: 1;
  color: rgb(147 51 234 / var(--tw-text-opacity, 1));
}

.text-red-500{
  --tw-text-opacity: 1;
  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
}

.text-red-600{
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity, 1));
}

.text-red-800{
  --tw-text-opacity: 1;
  color: rgb(153 27 27 / var(--tw-text-opacity, 1));
}

.text-redd-600{
  --tw-text-opacity: 1;
  color: rgb(229 62 62 / var(--tw-text-opacity, 1));
}

.text-slate-600{
  --tw-text-opacity: 1;
  color: rgb(71 85 105 / var(--tw-text-opacity, 1));
}

.text-slate-700{
  --tw-text-opacity: 1;
  color: rgb(51 65 85 / var(--tw-text-opacity, 1));
}

.text-slate-800{
  --tw-text-opacity: 1;
  color: rgb(30 41 59 / var(--tw-text-opacity, 1));
}

.text-text-menu{
  --tw-text-opacity: 1;
  color: rgb(104 112 132 / var(--tw-text-opacity, 1));
}

.text-text-normal{
  --tw-text-opacity: 1;
  color: rgb(15 24 39 / var(--tw-text-opacity, 1));
}

.text-text-small{
  --tw-text-opacity: 1;
  color: rgb(135 138 151 / var(--tw-text-opacity, 1));
}

.text-transparent{
  color: transparent;
}

.text-white{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.text-yellow-800{
  --tw-text-opacity: 1;
  color: rgb(133 77 14 / var(--tw-text-opacity, 1));
}

.underline{
  text-decoration-line: underline;
}

.overline{
  text-decoration-line: overline;
}

.line-through{
  text-decoration-line: line-through;
}

.antialiased{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.opacity-25{
  opacity: 0.25;
}

.opacity-40{
  opacity: 0.4;
}

.opacity-75{
  opacity: 0.75;
}

.shadow{
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-inner{
  --tw-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: inset 0 2px 4px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-lg{
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-md{
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-sm{
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-xl{
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-transparent{
  --tw-shadow-color: transparent;
  --tw-shadow: var(--tw-shadow-colored);
}

.outline{
  outline-style: solid;
}

.ring{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.ring-4{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.ring-blue-100{
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(219 234 254 / var(--tw-ring-opacity, 1));
}

.blur{
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.grayscale{
  --tw-grayscale: grayscale(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.\!invert{
  --tw-invert: invert(100%) !important;
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;
}

.invert{
  --tw-invert: invert(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.\!filter{
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;
}

.filter{
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.backdrop-blur-sm{
  --tw-backdrop-blur: blur(4px);
  -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}

.backdrop-filter{
  -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}

.transition{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-all{
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-colors{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-transform{
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.duration-200{
  transition-duration: 200ms;
}

.duration-300{
  transition-duration: 300ms;
}

.duration-500{
  transition-duration: 500ms;
}

.ease-in{
  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
}

.ease-in-out{
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.ease-out{
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}

@keyframes enter{
  from{
    opacity: var(--tw-enter-opacity, 1);
    transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));
  }
}

@keyframes exit{
  to{
    opacity: var(--tw-exit-opacity, 1);
    transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));
  }
}

.duration-200{
  animation-duration: 200ms;
}

.duration-300{
  animation-duration: 300ms;
}

.duration-500{
  animation-duration: 500ms;
}

.ease-in{
  animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
}

.ease-in-out{
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.ease-out{
  animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
}

.running{
  animation-play-state: running;
}

.paused{
  animation-play-state: paused;
}

.hover\:-translate-y-1:hover{
  --tw-translate-y: -0.25rem;
  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));
}

.hover\:scale-105:hover{
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  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));
}

.hover\:scale-\[1\.02\]:hover{
  --tw-scale-x: 1.02;
  --tw-scale-y: 1.02;
  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));
}

.hover\:border-blue-300:hover{
  --tw-border-opacity: 1;
  border-color: rgb(147 197 253 / var(--tw-border-opacity, 1));
}

.hover\:border-blue-400:hover{
  --tw-border-opacity: 1;
  border-color: rgb(96 165 250 / var(--tw-border-opacity, 1));
}

.hover\:border-gray-400:hover{
  --tw-border-opacity: 1;
  border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));
}

.hover\:border-green-400:hover{
  --tw-border-opacity: 1;
  border-color: rgb(74 222 128 / var(--tw-border-opacity, 1));
}

.hover\:border-purple-300:hover{
  --tw-border-opacity: 1;
  border-color: rgb(216 180 254 / var(--tw-border-opacity, 1));
}

.hover\:border-red-300:hover{
  --tw-border-opacity: 1;
  border-color: rgb(252 165 165 / var(--tw-border-opacity, 1));
}

.hover\:bg-blue-50\/20:hover{
  background-color: rgb(239 246 255 / 0.2);
}

.hover\:bg-blue-50\/50:hover{
  background-color: rgb(239 246 255 / 0.5);
}

.hover\:bg-blue-600:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
}

.hover\:bg-blue-700:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(29 78 216 / var(--tw-bg-opacity, 1));
}

.hover\:bg-gray-100:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}

.hover\:bg-gray-50:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}

.hover\:bg-gray-700:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}

.hover\:bg-green-50:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(240 253 244 / var(--tw-bg-opacity, 1));
}

.hover\:bg-primary:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(33 125 194 / var(--tw-bg-opacity, 1));
}

.hover\:bg-purple-50\/20:hover{
  background-color: rgb(250 245 255 / 0.2);
}

.hover\:bg-red-50:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
}

.hover\:bg-red-600:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));
}

.hover\:bg-gradient-to-r:hover{
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

.hover\:from-blue-500:hover{
  --tw-gradient-from: #3b82f6 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(59 130 246 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.hover\:from-blue-600:hover{
  --tw-gradient-from: #2563eb var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(37 99 235 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.hover\:from-green-600:hover{
  --tw-gradient-from: #16a34a var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(22 163 74 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.hover\:from-green-700:hover{
  --tw-gradient-from: #15803d var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(21 128 61 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.hover\:from-primary:hover{
  --tw-gradient-from: #217DC2 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(33 125 194 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.hover\:from-purple-700:hover{
  --tw-gradient-from: #7e22ce var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(126 34 206 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.hover\:to-blue-600:hover{
  --tw-gradient-to: #2563eb var(--tw-gradient-to-position);
}

.hover\:to-blue-700:hover{
  --tw-gradient-to: #1d4ed8 var(--tw-gradient-to-position);
}

.hover\:to-emerald-700:hover{
  --tw-gradient-to: #047857 var(--tw-gradient-to-position);
}

.hover\:to-green-800:hover{
  --tw-gradient-to: #166534 var(--tw-gradient-to-position);
}

.hover\:text-blue-900:hover{
  --tw-text-opacity: 1;
  color: rgb(30 58 138 / var(--tw-text-opacity, 1));
}

.hover\:text-green-700:hover{
  --tw-text-opacity: 1;
  color: rgb(21 128 61 / var(--tw-text-opacity, 1));
}

.hover\:text-primary:hover{
  --tw-text-opacity: 1;
  color: rgb(33 125 194 / var(--tw-text-opacity, 1));
}

.hover\:text-red-500:hover{
  --tw-text-opacity: 1;
  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
}

.hover\:text-white:hover{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.hover\:underline:hover{
  text-decoration-line: underline;
}

.hover\:shadow-lg:hover{
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-md:hover{
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-xl:hover{
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.focus\:border-green-500:focus{
  --tw-border-opacity: 1;
  border-color: rgb(34 197 94 / var(--tw-border-opacity, 1));
}

.focus\:border-primary:focus{
  --tw-border-opacity: 1;
  border-color: rgb(33 125 194 / var(--tw-border-opacity, 1));
}

.focus\:outline-none:focus{
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.focus\:ring-2:focus{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.focus\:ring-blue-500:focus{
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));
}

.focus\:ring-green-500:focus{
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(34 197 94 / var(--tw-ring-opacity, 1));
}

.focus\:ring-primary:focus{
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(33 125 194 / var(--tw-ring-opacity, 1));
}

.focus\:ring-purple-500:focus{
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(168 85 247 / var(--tw-ring-opacity, 1));
}

.group:hover .group-hover\:border-blue-300{
  --tw-border-opacity: 1;
  border-color: rgb(147 197 253 / var(--tw-border-opacity, 1));
}

.group:hover .group-hover\:border-gray-300{
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
}

.group:hover .group-hover\:bg-white{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.group:hover .group-hover\:bg-opacity-20{
  --tw-bg-opacity: 0.2;
}

.group:hover .group-hover\:shadow-lg{
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.group:hover .group-hover\:shadow-md{
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.dark\:bg-gray-700:is(.dark *){
  --tw-bg-opacity: 1;
  background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
}

.dark\:bg-gray-900:is(.dark *){
  --tw-bg-opacity: 1;
  background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
}

@media (min-width: 640px){
  .sm\:flex-row{
    flex-direction: row;
  }
}

@media (min-width: 768px){
  .md\:mb-2{
    margin-bottom: 0.5rem;
  }

  .md\:mt-0{
    margin-top: 0px;
  }

  .md\:max-h-\[100vh\]{
    max-height: 100vh;
  }

  .md\:w-2\/3{
    width: 66.666667%;
  }

  .md\:w-64{
    width: 16rem;
  }

  .md\:w-\[30\%\]{
    width: 30%;
  }

  .md\:w-\[70\%\]{
    width: 70%;
  }

  .md\:w-auto{
    width: auto;
  }

  .md\:grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .md\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .md\:flex-row{
    flex-direction: row;
  }

  .md\:flex-col{
    flex-direction: column;
  }

  .md\:flex-nowrap{
    flex-wrap: nowrap;
  }

  .md\:items-center{
    align-items: center;
  }

  .md\:p-6{
    padding: 1.5rem;
  }

  .md\:text-body-large{
    font-size: 1rem;
  }
}

@media (min-width: 1024px){
  .lg\:w-auto{
    width: auto;
  }

  .lg\:grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lg\:grid-cols-3{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lg\:grid-cols-5{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .lg\:flex-row{
    flex-direction: row;
  }

  .lg\:text-bodyXL{
    font-size: 1.125rem;
  }
}