:root {
  --blu-platform: #204769;
  --error-platform: #ff0000;
  --verde-to: #206953;
  --giallo: #f9d33e;
  --bg-sys-admin: rgb(144, 117, 74);
  /* Giallo Sibylla */
  --bg-sys-admin-h: rgb(180, 156, 119);
  /* Giallo Sibylla */
  --quaranta2: #424242;
  --gray: #dbdbdb;
  --white: #fff;
  --new-black: #4a4d53;
  --celeste: #297fff;
  --lgray: #e9ebed;
  --bxshadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  --agora: #708090;
  --agora-icn: #5b6876;
  --agoTitle: #404850;
  --celestino: #f8fcff;
  --side-hover-p: #3f6f99;
  --active-btn: #eaf8ff;
  --hover-to: #a2b992;
  --secondary-hover: #5c9cd4;
  --sb-border-radius: 6px;
  --blu-platform-light: rgba(32, 71, 105, 0.65);
}

.body-sys-admin {
  background-color: var(--bg-sys-admin);
}

.bacheca.report .fasciaBianca {
  background-color: var(--white);
  height: 35px;
  width: 100%;
  position: fixed;
  bottom: 0;
}

a {
  text-decoration: none !important;
}

.body-bacheca {
  color: var(--new-black);
}

.bacheca .mainContainer {
  width: 100% !important;
  height: calc(100vh - 82px);
  padding: 0 24px;
  overflow-y: hidden;
  /*DONT PUT OVERFLOW, THIS HAS TO STAY HIDDEN */
  position: relative;
  display: flex;
  flex-direction: column;
  scrollbar-width: thin;
}

/* Toast */
.toast-container {
  z-index: 1000;
}

/* Toast */

/* Custom scrollbar */
.bacheca .mainContainer::-webkit-scrollbar {
  width: 1px;
  /* thin scrollbar */
}

.bacheca .mainContainer::-webkit-scrollbar-thumb {
  background-color: var(--bg-color-hotel);
  /* blue color */
}

/* For Firefox */
.bacheca .mainContainer {
  scrollbar-width: none;
  /*scrollbar-width: thin;*/
  /*scrollbar-color: var(--blu-platform) transparent;*/
}

.to .bacheca .mainContainer {
  scrollbar-width: none;
  /*scrollbar-width: thin;*/
  /*scrollbar-color: var(--verde-to) transparent;*/
}

.bacheca .mainContainer::-webkit-scrollbar {
  width: 1px;
  /* Adjust the width of the scrollbar */
  height: 1px;
  /* Adjust the height of the scrollbar for horizontal scrolling */
}

.subContainer {
  width: 100%;
  height: calc(100vh - 260px);
}

.fullContain {
  width: 100%;
  height: calc(100% - 100px);
  position: relative;
}

.bacheca .header {
  height: 100px;
  display: inline-flex;
  align-items: flex-start;
  justify-content: center;
  position: sticky;
  text-align: center;
  width: 100%;
  top: 0;
  z-index: 2;
  padding-top: 24px;
  background-color: var(--white);
}

.body-ag .bacheca .header {
  background-color: transparent;
}

.bacheca .header .btn-anulla {
  width: fit-content;
  height: fit-content;
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  left: 0;
  padding: 5px;
  border-radius: 6px;
  color: var(--blu-platform);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.4s ease-out;
  border: none;
  background-color: transparent;
  gap: 5px;
}

.to .bacheca .header .btn-anulla,
.to .bacheca .header .title,
.to .bacheca .header h2,
.to .subheader .hBtn,
.to .popup .hBtn,
.to .bacheca .subContainer .tr .th {
  color: var(--verde-to) !important;
}

.to .subheader .hBtn:hover,
.to .popup .hBtn:hover {
  /* box-shadow: 0 0 2px 2px var(--verde-to);*/
  color: var(--bg-color-to);
  background-color: #dcebd2;
  border: 1px solid #404850;
  border-radius: 6px;
}

.bacheca .header .btn-anulla i {
  font-size: 15px;
  height: 19px;
  display: flex;
  align-items: center;
}

.bacheca .subheader .hBtn i,
.bacheca .subheader .hBtn2 i,
.popup .hBtn i {
  /*padding: 0 8px 0 0 !important; da controllare bene*/
  font-size: 18px;
}

.bacheca .header .btn-anulla:hover {
  background-color: var(--blu-platform);
  color: var(--white);
}

.bacheca.sys-admin .header .btn-anulla:hover {
  background-color: var(--bg-sys-admin);
  color: var(--white);
}

.to .bacheca .header .btn-anulla:hover {
  background-color: var(--verde-to);
  color: var(--white) !important;
}

.bacheca .header .title,
.bacheca .header h2 {
  position: relative;
  font-size: 32px;
  font-weight: 600;
  color: var(--blu-platform);
  font-family: "Poppins", sans-serif;
  line-height: 32px;
}

.body-ag .bacheca .header .title,
.body-ag .bacheca .header h2,
.body-ag .bacheca .header .btn-anulla {
  color: var(--agoTitle);
}

.body-ag .bacheca .header .btn-anulla:hover {
  background-color: var(--agora);
  color: var(--white);
}

.header .hdBtn {
  background-color: var(--giallo);
  position: absolute;
  right: 0;
  margin-right: 3%;
  color: var(--quaranta2);
  height: 42px;
  padding: 5px 20px;
  width: fit-content;
  outline: none;
  border: none;
  font-size: 1.1rem;
  font-weight: 600;
  border-radius: 6px;
  transition: all 0.3s ease-out;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header .hdBtn:hover {
  background-color: var(--blu-platform);
  color: var(--giallo);
}

bacheca.sys-admin .header .hdBtn:hover {
  background-color: var(--bg-sys-admin);
}

.bacheca .header .small-sub {
  color: var(--blu-platform);
  font-size: 14px;
}

.bacheca .header .small-sub {
  position: absolute;
  top: 60px;
  color: var(--blu-platform);
  font-size: 14px;
}

.bacheca .header .small-sub2 {
  position: absolute;
  top: 80px;
  color: var(--blu-platform);
  font-size: 14px;
}

.to .bacheca .header .small-sub {
  position: absolute;
  top: 60px;
  color: var(--verde-to) !important;
  font-size: 14px;
}

.to .bacheca .header .small-sub2 {
  position: absolute;
  top: 80px;
  color: var(--verde-to) !important;
  font-size: 14px;
}

.subheader {
  position: relative;
  display: inline-flex;
  width: 100%;
  flex-wrap: wrap;
  font-size: 14px !important;
  align-items: end;
  margin-bottom: 15px;
  height: 60px;
}

.subheader .left,
.subheader .right {
  display: flex;
  width: 50%;
  height: 60px;
  flex-direction: row;
  align-items: end;
}

.subheader .full {
  display: flex;
  width: 100%;
  height: 60px;
  flex-direction: row;
  align-items: flex-end;
  gap: 15px;
}

.subheader .left {
  justify-content: start;
  gap: 15px;
}

.subheader .right {
  justify-content: end;
  /*align-items:end;*/
}

.subheader .btnGroup1 .left,
.subheader .btnGroup1 .right {
  width: 100%;
  height: fit-content;
  gap: 0.5vw;
}

.subheader .btnGroup1 .left {
  margin-right: 0.5vw;
}

.subheader .hCol,
.hCol {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  position: relative;
}

.subheader .nameS,
.nameS {
  font-size: 14px;
  margin: 1px;
  font-weight: 600;
  color: var(--blu-platform);
}

.subheader .nameS,
.nameS {
  font-size: 14px;
  margin: 1px;
  font-weight: 600;
  color: var(--blu-platform);
}

.to .subheader .nameS,
.to .nameS {
  color: var(--verde-to);
}

.subheader .hSelect,
.hSelect {
  /*width: 155px;*/
  width: fit-content;
  height: 40px;
  outline: none;
  border-radius: 6px;
  border: 1px solid var(--gray);
  background-color: var(--white);
  padding: 0 10px;
  cursor: pointer;
  font-size: 14px;
  appearance: auto;
  background-image: none;
  padding-right: 30px;
  max-width: 166px;
}

.subheader .form-select {
  appearance: none;
  background-size: 12px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.7rem center;
  background-size: 12px;
}

.subheader .multiSelectHelper,
.multiSelectHelper {
  width: 185px;
  height: 40px;
  outline: none;
  border-radius: 6px;
  border: 1px solid var(--gray);
  background-color: var(--white);
  padding: 8px;
  cursor: pointer;
  font-size: 14px;
  appearance: auto;
  padding: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.7rem center;
  background-size: 12px;
}

.hSel2-options {
  display: none;
}

.hsel2-options.active {
  display: block;
}

.subheader .hSel2-options.active,
.hSel2-options.active {
  position: absolute;
  background-color: white;
  border: 1px solid var(--gray);
  z-index: 4;
  top: 62px;
  width: 185px;
  border-radius: 6px;
  padding: 8px;
  max-height: 200px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 8px 8px;
}

.hCol .hSel2-options:not(.active) {
  display: none;
}

.subheader .choice-buttons,
.choice-buttons {
  display: flex;
  width: 100%;
  height: 40px;
  border-radius: 6px;
  border: 1px solid var(--gray);
  border-radius: 6px;
  border: 1px solid var(--gray);
}

.subheader .hRadio,
.hRadio {
  cursor: pointer;
  height: 30px;
  width: 15px;
  margin: auto 5px;
}

.subheader .hLbl,
.hLbl {
  display: flex;
  font-weight: 400;
  align-items: center;
  padding: 3px 10px 3px 2px;
  font-size: 14px;
  cursor: pointer;
  gap: 5px;
}

.hCas {
  flex: 1;
  justify-content: center;
  align-items: center;
  display: flex;
  height: 100%;
}

.hCol.hCol-1 {
  flex: 1;
}

.hCol.hCol-2 {
  flex: 2;
}

.hCol.hCol-3 {
  flex: 3;
}

.hCol.hCol-4 {
  flex: 4;
}

.hCol.hCol-5 {
  flex: 5;
}

.hCol.hCol-6 {
  flex: 6;
}

.spinnerBox {
  max-width: 60px;
  /* Adjust the width as needed */
  padding: 5px;
  /* Adjust padding for better appearance */
  margin-left: 10px;
  /* Adjust margin to ensure spacing between elements */
  border: 1px solid var(--gray);
  border-radius: 6px !important;
}

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

.hLblNew {
  white-space: nowrap;
  margin-right: 20px;
  align-content: center;
}

.radio-group {
  display: flex;
  align-items: center;
  gap: 20px;
}

.input-group {
  display: flex;
  align-items: center;
  gap: 10px;
}

.subheader .hBtn,
.popup .hBtn {
  width: fit-content;
  height: 40px;
  background-color: var(--white);
  color: var(--blu-platform);
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  pointer-events: all;
  text-decoration: none;
  border-radius: 6px;
  /*margin-right: 1vw;*/
  transition: 0.3s ease-out;
  padding: 8px 16px;
  cursor: pointer;
  position: relative;
  gap: 10px;
  border: 1px solid var(--blu-platform);
  color: var(--blu-platform);
}

.agora .subheader .hBtn,
.agora .popup .hBtn {
  gap: 10px;
  border: 1px solid var(--agora);
  color: #404850;
}

.agora .subheader .hBtn:hover,
.agora .popup .hBtn:hover {
  color: #404850;
  background-color: #dae8f5;
  border: 1px solid #404850;
  border-radius: 6px;
}

.hBtn2 {
  width: fit-content;
  height: 40px;
  color: var(--white);
  background-color: var(--blu-platform);
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  pointer-events: all;
  text-decoration: none;
  border-radius: 7px;
  transition: 0.3s ease-out;
  padding: 5px 8px;
  cursor: pointer;
  border: none;
}

.hStars {
  width: fit-content;
  height: 32px;
  outline: none;
  border-radius: 6px;
  border: 1px solid var(--gray);
  background-color: var(--white);
  padding: 0 10px;
  font-size: 16px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}

.hStars i {
  cursor: pointer;
}

/*.subheader .hBtn:hover {
            background-color: var(--blu-platform);
            color: var(--white);
        }*/

.right .hBtn {
  margin-right: 0;
  margin-left: 0;
}

.subheader .hBtn.icon {
  width: 32px;
  margin-top: 22px;
}

.subheader .btnGroup1 .hBtn.icon {
  margin-top: 0;
}

.subheader .hBtn.icon i {
  font-size: 20px;
  width: 25px;
  height: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
}

.subheader .hDate,
.hDate {
  height: 40px;
  border: 1px solid var(--gray);
  outline: none;
  border-radius: 6px !important;
  background-color: var(--white);
  font-size: 14px;
  padding: 5px;
}

.subheader .hInput,
.hInput {
  height: 40px;
  border: 1px solid var(--gray);
  outline: none;
  border-radius: 6px !important;
  background-color: var(--white);
  width: 220px;
  font-size: 14px;
  padding: 8px;
  display: flex;
  align-items: center;
  width: 155px;
}

.subheader .btnGroup1,
.subheader .btnGroup2 {
  /*border: 1px solid var(--gray);*/
  height: fit-content;
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
}

.subheader .btnGroup1 .hBtn,
.subheader .btnGroup2 .hBtn {
  margin: 0;
}

.subheader .btnGroup1 {
  width: fit-content;
  margin-left: auto;
}

.subheader .btnGroup2 {
  width: calc(100% / 3);
}

.hCheckbox {
  width: 18px;
  height: 18px;
  margin-left: 40px;
  margin: 5px 5px 5px 40px;
  cursor: pointer;
}

/* SideBar */

.mainSidebar_version {
  position: fixed !important;
  bottom: 0.1%;
  width: 70px !important;
  left: 0;
}

.mainSidebar_version a i {
  pointer-events: none !important;
}

.bacheca #main_sidebar {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  height: calc(100% - 82px);
  max-width: 361px;
  min-width: 361px;
  position: fixed;
  z-index: 21;
  bottom: 0;
  left: 0;
  background-color: var(--blu-platform);
  overflow-x: hidden;
  padding-left: 0;
  transition: all 0.3s;
  white-space: nowrap;
  color: var(--white);
  font-family: Poppins, sans-serif;
}

.bacheca.sys-admin #main_sidebar {
  background-color: var(--bg-sys-admin);
}

.bacheca #main_sidebar a {
  color: var(--white);
  text-decoration: none;
  border-radius: 6px 0px 0px 6px;
  transition: 0.3s ease;
}

.bacheca #main_sidebar a .lightColored {
  /*color: grey;*/
  cursor: not-allowed;
  opacity: 0.5;
  /*pointer-events: none;*/
}

.bacheca #main_sidebar a.lightColored {
  /*color: grey;*/
  cursor: not-allowed;
  opacity: 0.5;
  pointer-events: none;
}

.bacheca #main_sidebar .mainSelect .icn {
  transition: 0.4s ease;
}

.bacheca #main_sidebar a .icn {
  border-radius: 5px;
  transition: 0.3s ease;
}

.bacheca #main_sidebar a:hover,
.bacheca #main_sidebar a:hover .icn {
  /*background-color: var(--side-hover-p);*/
  background-color: #3f6f99;
}

.bacheca.sys-admin #main_sidebar a:hover,
.bacheca.sys-admin #main_sidebar a:hover .icn {
  background-color: var(--bg-sys-admin-h);
}

.bacheca.agora #main_sidebar a:hover,
.bacheca.agora #main_sidebar a:hover .icn {
  /*background-color: var(--side-hover-p);*/
  background-color: #8798a9;
}

.to .bacheca #main_sidebar a:hover,
.to .bacheca #main_sidebar a:hover .icn {
  /*background-color: var(--side-hover-p);*/
  background-color: #27905f;
}

.bacheca #main_sidebar .profile-container a:hover {
  background-color: unset;
}

.bacheca #main_sidebar.active .firstLi {
  margin-left: 20px;
}

.bacheca #main_sidebar.collapsed {
  min-width: 80px;
  max-width: 80px;
}

.bacheca #main_sidebar.collapsed li {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.profile-container .mainSelect {
  margin-left: 20px;
  width: 40px;
}

.active .profile-container .mainSelect {
  margin-left: 0px;
}

.active .secondLi {
  margin-left: 5px;
  /* QUESTO NN FA MUOVERE LE ICONE A DESTRA E SINISTRA, PARLARE CON HASSAN */
}

.bacheca #main_sidebar .static-icon {
  margin-bottom: 20px;
}

/*.bacheca #main_sidebar.collapsed .static-icon {
    width: 40px;
}*/

.bacheca #main_sidebar.collapsed .firstLi {
  width: 80px;
  /*margin-left: 20px;*/
}

.bacheca #main_sidebar.collapsed .firstLi .drpDown,
.bacheca #main_sidebar.collapsed .firstLi .txtSide {
  display: none;
}

.bacheca #main_sidebar.collapsed .secondLi,
.bacheca #main_sidebar.collapsed .thirdLi {
  padding: 0;
  display: flex;
  justify-content: center;
}

.bacheca #main_sidebar.collapsed .secondLi i,
.bacheca #main_sidebar.collapsed .thirdLi i {
  text-align: center;
}

/*.bacheca #main_sidebar #icon-static-id ul {
    width: 100%;
    text-decoration: none;
    font-size: 14px;
    display: block;
    text-align: start;
    padding: 0px;
    list-style: none;
    margin: 0;*/
/* margin-bottom: auto;*/
/*}*/

.bacheca #main_sidebar ul {
  width: 100%;
  text-decoration: none;
  font-size: 14px;
  display: flex;
  flex-direction: column;
  padding: 0px;
  list-style: none;
  margin: 0;
  margin-bottom: auto !important;
  overflow-y: auto;
}
.bacheca #main_sidebar > ul {
  gap: 10px;
}

li ul {
  gap: 0px;
}

/* Custom scrollbar */
.bacheca #main_sidebar ul::-webkit-scrollbar {
  width: 5px;
  /* thin scrollbar */
}

.bacheca #main_sidebar ul::-webkit-scrollbar-thumb {
  background-color: transparent;
  /* blue color */
}

/* For Firefox */
.bacheca #main_sidebar ul {
  scrollbar-width: none;
  scrollbar-color: transparent transparent;
}

.bacheca #main_sidebar .profile-container {
  position: sticky;
  display: flex;
  flex-direction: row !important;
  height: 65px;
  background-color: var(--blu-platform);
  top: 0;
  align-items: center;
  transition: all 0.3s ease;
  z-index: 1;
}

.bacheca.sys-admin #main_sidebar .profile-container {
  background-color: var(--bg-sys-admin);
}

.bacheca.agora #main_sidebar .profile-container,
.body-ag .bacheca.agora .Bnavbar,
.bacheca.agora #main_sidebar,
.body-ag,
.bacheca.agora .Bnavbar #main_sidebar_button {
  background-color: var(--agora) !important;
}

.bacheca.agora .Bnavbar .icon-container i,
.bacheca.agora .Bnavbar .icon-container a:hover .button-text,
.bacheca.agora .Bnavbar #logout-button i,
.body-ag .agora .Bnavbar #logout-button:hover #exitTxt,
.body-ag .bacheca.agora .Bnavbar .icon-container #portafoglio .text,
.bacheca.agora .Bnavbar #main_sidebar_button i,
.body-ag .bacheca.agora .Bnavbar #main_sidebar_button:hover i {
  color: var(--white);
}

.bacheca.agora .Bnavbar #main_sidebar_button:hover {
  background-color: rgba(250, 250, 250, 0.3) !important;
}

.agora .mainSelect .icn {
  background-color: var(--agora-icn);
}

.body-ag {
  background-color: #e1ebf7;
}

.bacheca #main_sidebar .profile-container .username {
  /*max-width: 185px;*/
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  position: relative;
  /*left: 20%;*/
  font-size: large;
  font-weight: 500;
  display: inline-flex;
  text-align: center;
}

.Bnavbar .icnBtn {
  color: var(--white);
}

.bacheca #main_sidebar.collapsed .profile-container .text {
  opacity: 0;
}

.bacheca #main_sidebar .profile-container img {
  min-width: 40px;
  min-height: 40px;
  max-width: 40px;
  max-height: 40px;
  border-radius: 50%;
  box-shadow: 0 0 5px var(--white);
}

/*
.bacheca.sys-admin #main_sidebar .profile-container img {
    margin-left: 20px;
}
.bacheca.sys-admin #main_sidebar.active .profile-container img {
    margin-left: 0px;
}
*/

.mainSelect {
  display: flex;
  align-items: center;
  height: fit-content;
  transition: 0.3s ease-out;
}

.mainSelect .icn {
  background-color: #244f75;
  color: var(--white);
  width: 35px;
  min-width: 35px;
  height: 35px;
  min-height: 35px;
  font-size: 21px;
  padding: 5px;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bacheca.sys-admin .mainSelect .icn {
  background-color: var(--bg-sys-admin);
}

.bacheca #main_sidebar.collapsed .mainSelect {
  justify-content: center;
}

.mainSelect .txtSide,
a .txtSide {
  padding-left: 0.5vw;
  width: 90%;
  height: 100%;
  display: flex;
  align-items: center;
}

.mainSelect .txtSide {
  font-weight: 400;
  font-size: 16px;
}

.firstLi .drpDown {
  font-size: 12px;
  min-width: 45px;
  min-height: 30px;
  justify-content: center;
  align-items: center;
  display: flex;
  transition: 0.3s ease-out;
}

.bacheca #main_sidebar .secondLi {
  /*    padding-left: 2.5vw;*/
  font-size: 14px;
}

.bacheca #main_sidebar .thirdLi {
  padding-left: 1vw;
  font-size: 12px;
}

.secondUl .icn {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 30px;
  max-width: 30px;
  min-height: 30px;
  max-height: 30px;
  font-size: 16px;
}

.secondUl a {
  display: flex;
  align-items: center;
  font-weight: 300;
}

#favorites .subTit i.rotate,
#main_sidebar .drpDown.rotate,
#main_sidebar.collapsed .drpDown.rotate {
  transform: rotate(180deg);
}

.bacheca #main_sidebar ul.collapse {
  display: none;
}

.secondUl .forthLi i {
  font-size: 14px;
  justify-content: center;
}

#main_sidebar.collapsed .secondUl .forthLi i {
  justify-content: center;
}

.bacheca #main_sidebar .forthLi {
  font-size: 12px;
  padding-left: 10px;
}

.bacheca #main_sidebar .fifthLi {
  font-size: 12px;
  padding-left: 15px;
}

.secondUl .fifthLi i {
  font-size: 12px;
  justify-content: center;
}

#main_sidebar.collapsed li a.active {
  background-color: var(--white);
  color: var(--blu-platform) !important;
  font-weight: 600;
  border-radius: 0;
  min-width: 80px;
  justify-content: center;
}

.to #main_sidebar.collapsed li a.active {
  background-color: var(--white);
  color: #5b6876 !important;
  font-weight: 600;
  border-radius: 0;
  min-width: 80px;
  justify-content: center;
}

#main_sidebar li a.active {
  background-color: var(--white) !important;
  color: var(--blu-platform) !important;
  font-weight: 600;
  border-radius: 5px 0 0 5px;
}

.to #main_sidebar li a.active {
  background-color: var(--white) !important;
  color: #5b6876 !important;
  font-weight: 600;
  border-radius: 5px 0 0 5px;
}

.bacheca #main_sidebar a.active:hover .icn {
  background-color: var(--white) !important;
}

.bacheca.agora #main_sidebar.collapsed li a.active {
  background-color: var(--white);
  color: #404850 !important;
  font-weight: 600;
  border-radius: 0;
  min-width: 80px;
  justify-content: center;
}

.bacheca.agora #main_sidebar li a.active {
  background-color: var(--white) !important;
  color: #404850 !important;
  font-weight: 600;
  border-radius: 5px 0 0 5px;
}

/* Colore Tour Operator */
.to .bacheca #main_sidebar .profile-container {
  background-color: var(--verde-to);
}

.to .mainSelect .icn {
  background-color: #24755e;
}

/* Colore Tour Operator */

/* SideBar */

/* Navbar */

.bacheca .Bnavbar {
  position: fixed;
  z-index: 995;
  top: 0%;
  left: 0;
  width: 100%;
  height: 82px;
  max-height: 82px;
  background-color: var(--blu-platform);
  display: flex;
  flex-direction: row;
}

.bacheca.sys-admin .Bnavbar {
  background-color: var(--bg-sys-admin);
}

.Bnavbar .hIcons {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin: auto 0.5vw auto auto;
  width: fit-content;
  height: fit-content;
  gap: 0.5vw;
}

.Bnavbar .favorites .titTxt {
  color: var(--white);
  width: max-content;
  font-family: Poppins;
}

.Bnavbar .favorites .icnContainer {
  padding-right: 0.5vw;
  border-right: 1px solid var(--white);
  /* TEMPORANEO PER ME, NN VOGLIO VEDERNE TANTI */
  overflow-x: auto;
  max-width: 145px;
  scrollbar-width: none;
  overflow-y: hidden;
}

.Bnavbar .favorites {
  padding-right: 0.5vw;
  border-right: 1px solid var(--white);
}

.Bnavbar .hIcons .icnBtn i {
  color: var(--white) !important;
  font-size: 20px;
  min-height: 35px;
  min-width: 35px;
  padding: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  flex-direction: column;
  border-radius: 5px;
  transition: 0.3s ease-out;
}

.Bnavbar .hIcons .icnBtn:hover i,
.bacheca .Bnavbar #logout-button:hover i {
  color: var(--white) !important;
  background-color: #244f75;
}

.bacheca.sys-admin .Bnavbar .hIcons .icnBtn:hover i,
.bacheca.sys-admin .Bnavbar #logout-button:hover i {
  background-color: var(--bg-sys-admin-h);
}

.bacheca.agora .Bnavbar .hIcons .icnBtn:hover i,
.bacheca.agora .Bnavbar #logout-button:hover i {
  color: var(--white) !important;
  background-color: #8798a9;
}

.to .Bnavbar .hIcons .icnBtn:hover i,
.to .bacheca .Bnavbar #logout-button:hover i {
  background-color: #24755e;
}

.Bnavbar .hIcons .icnBtn {
  height: 35px;
  width: 35px;
  padding: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  flex-direction: column;
}

.Bnavbar .hIcons .icnBtn .button-text,
.Bnavbar .sib-amount {
  opacity: 0;
  font-size: 10px;
  font-weight: 300;
  position: absolute;
  width: 80px;
  white-space: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}

.bacheca .Bnavbar #portafoglio:hover .sib-amount {
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}

/*.bacheca .Bnavbar #portafoglio:hover i {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}
*/

.bacheca .Bnavbar .icnBtn:hover .button-text {
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}

.Bnavbar sib-amount {
  top: 10px;
  width: 65px;
  font-size: 12px;
  text-align: center;
}

.Bnavbar .hIcons .icnBtn .button-text {
  bottom: -19.5px;
}

#main_sidebar #agoraTXT {
  opacity: 0;
  font-size: 14px;
  font-weight: 300;
  position: absolute;
  width: auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  bottom: 60px;
}

#main_sidebar .agoraAnt:hover #agoraTXT {
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}

.bacheca .Bnavbar .searchbar {
  position: relative;
  display: flex;
  justify-content: start;
  align-items: center;
  padding: 0 10px;
  border-radius: 6px;
  border: 2px solid #ced4da;
  margin: auto 1vw;
  height: 36px;
  min-width: 120px;
  max-width: 400vw;
  width: 18vw;
  background-color: var(--white);
}

.bacheca .Bnavbar .searchbar.focus {
  border: 2px solid #86b7fe;
}

#txt-search {
  border: none;
  outline: none;
  padding: 0;
  background-color: transparent;
  width: 100%;
  margin: 0px 10px;
  height: 100%;
}

.bacheca .Bnavbar .searchbar img {
  padding-left: 0%;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 20px;
  height: auto;
}

.bacheca .Bnavbar #logout-button {
  color: var(--white);
  font-size: 30px;
  height: 40px;
  width: 40px;
  padding: 5px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto 0.5vw auto auto;
}

.bacheca .Bnavbar #logout-button i {
  color: var(--white) !important;
  font-size: 20px;
  min-height: 35px;
  min-width: 35px;
  padding: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  flex-direction: column;
  border-radius: 5px;
  transition: 0.3s ease-out;
}

.bacheca .Bnavbar #main_sidebar_button {
  position: relative;
  margin: auto 15px;
  min-width: 50px;
  width: 50px;
  height: 45px;
  background-color: var(--bg-color-hotel);
  border-radius: 8px;
  transition:
    width 0.3s ease,
    transform 0.3s ease,
    background-color 0.3s ease;
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bacheca.sys-admin .Bnavbar #main_sidebar_button {
  background-color: var(--bg-sys-admin);
}

.Bnavbar .breadcrumb {
  margin: auto 0.5vw;
  color: var(--white);
  width: inherit;
}

.link {
  color: var(--white) !important;
  gap: 5px;
  display: flex;
  align-items: center;
  text-decoration: none;
  font-size: 14px;
}

.Bnavbar .breadcrumb .containLinks {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  margin-left: 1%;
  font-size: 14px;
}

.Bnavbar .icnContainer {
  display: flex;
}

/* Navbar */
.hRow {
  display: flex;
  flex-direction: row;
}

italic {
  font-style: italic;
  font-weight: 400;
}

.modal-body {
  display: flex;
  justify-content: center;
  padding: 24px;
}

.main_sidebar .firstLi.profile-container .txtSide {
  padding-left: 0.5vw;
  width: 90%;
  height: fit-content;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  max-height: 100%;
}

.main_sidebar .firstLi.profile-container .txtSide .text {
  width: 100%;
}

.bacheca #main_sidebar .profile-container .username {
  font-size: 14px;
}

.bacheca #main_sidebar .profile-container #currentDate {
  font-size: 12px;
}

/* Modale work in progress */
.modal-dialog.inProgress .modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #fff;
  background-clip: padding-box;
  outline: 0;
  border-radius: 10px;
  border: 0;
}

/*.modal.show .modal-dialog {
    transform: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
}*/

.modal.show .modal-dialog .close {
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
}

#backg {
  font-size: 157px;
  position: absolute;
  right: 30px;
  top: -60px;
  transform: rotate(345deg);
  opacity: 0.2;
  pointer-events: none;
}

.modal-dialog.inProgress #btn-form-modal-submit {
  display: none;
}

.modal-title {
  font-family: "Poppins", sans-serif;
  position: relative;
  z-index: 1;
  font-weight: 600;
  font-size: 24px;
  color: var(--blu-platform);
}

.to .modal-title {
  color: var(--verde-to);
}

.body-ag.modal-open .modal-title {
  color: var(--agoTitle);
}

.body-ag .modal-title {
  color: var(--agoTitle);
}

@media (max-width: 1460px) {
  .subheader .hSelect,
  .hSelect {
    max-width: 95px;
    font-size: 12px;
  }

  .subheader .nameS,
  .nameS {
    font-size: 12px;
  }
}

/* Modale work in progress */

/*SIDEBAR COLLAPSED*/
.show-sidebar {
  display: block !important;
}

.badge.hidden {
  display: none;
}

.hBtn.active {
  background-color: var(--active-btn);
}

/*.modal.fade .modal-dialog {
    transition: transform 0s, opacity 0.3s ease-out;
}*/

.container {
  max-width: 1792px;
}

/********** PER FORM MODAL *********************/
.modal.fade .modal-dialog {
  transition:
    transform 0.3s ease-out,
    opacity 0.3s ease-out;
}

.modal.show .modal-dialog {
  transform: none;
}

.modal-dialog {
  display: flex;
  align-items: center;
  min-height: calc(100% - 1rem);
}

.modal-dialog::before {
  content: "";
  display: block;
  height: calc(100vh - 1rem);
  height: -webkit-min-content;
  height: -moz-min-content;
  height: min-content;
}

/****************************************/

/*Table standards added by Waleed*/

.colored-row {
  background-color: #f8fcff !important;
}

.colored-row .data-cell {
  background-color: #f8fcff !important;
}

.total-row .data-cell {
  background-color: #a6bac8 !important;
}

.total-row .data-cell {
  background-color: #a6bac8 !important;
}

.tableCellWithIcon {
  /*font-size: 24px;*/
  color: rgb(64, 72, 80);
}

.body-bacheca .tableCellWithIcon i {
  color: var(--blu-platform);
}

.body-ag .tableCellWithIcon i {
  color: var(--agora);
}

.platformcolor {
  color: #204769;
}

.table-icon-button {
  background: none;
  border: 0;
  color: #204769;
}

.tableCellWithtxt,
.tableCellWithTotaleVal,
.totaleCell {
  /* font-family: Poppins;
    font-size: 14px;
    line-height: 21px;
    color: #4A4D53;*/
  font-family: Poppins;
  color: #4a4d53;
  font-size: 14px;
  font-weight: 400;
  line-height: 16.34px;
}

.tableCellWithTotaleVal {
  font-weight: 600;
}

.totaleCell {
  /*color: #204769;*/
  font-size: 14px;
  font-weight: 600;
  line-height: 19.07px;
}

.second {
  font-weight: 400 !important;
}

.tableCellWithtxt i {
  margin-right: 1%;
}

.tableCellWithBtnOnly {
  font-size: 16px;
}

.tableCellWithBtnOnly i {
  cursor: pointer;
}

/*agora*/
.body-ag .tableCellWithBtnOnly i {
  color: var(--agora);
}

/*tableau*/
.to .bacheca .tableCellWithBtnOnly i {
  color: var(--verde-to);
}

/*PLATFORM*/
.tableCellWithBtnOnly i {
  color: var(--blu-platform);
}

.cellContentTxtIcon {
  display: flex;
  align-items: center;
  /* Align items vertically in the center */
  flex: 1;
  /* Allows the text to take up the remaining space */
  word-wrap: break-word;
  /* Ensures long text breaks into a new line if necessary */
}

.circle-img,
.circle-img-placeholder {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  margin-right: 10px;
  /* Adds some space between the image/placeholder and text */
}

.circle-img {
  object-fit: cover;
  /* Ensures the image covers the container while maintaining its aspect ratio */
}

.circle-img-placeholder {
  background-color: transparent;
  /* Ensures the placeholder has a transparent background */
  /*background-color: #f0f0f0;*/
  /* Optional: you can add a background color to the placeholder if desired */
}

.cellProPicAndTxt {
  display: flex;
  align-items: center;
  /* Vertically aligns the items */
  flex-wrap: nowrap;
  /* Ensures the image and text stay on the same line */
}

.table thead {
  position: sticky;
  top: 0;
  background-color: white;
  /**/
  /* Same background as your header */
  background-color: rgba(255, 255, 255, 1);
  /* 50% transparent white background */
  /*background-color: rgba(255, 255, 255, 0.5);*/
  /* 50% transparent white background */
  z-index: 1;
  border: transparent;
}

.mainPageScroll {
  overflow-y: auto;
  /* Allow vertical scrolling when content exceeds height */
  height: 100vh;
  /* Set height to full viewport height */
  padding: 20px;
  /* Add padding for content spacing */
}

/* Custom scrollbar */
.mainPageScroll::-webkit-scrollbar {
  width: 5px;
  /* thin scrollbar */
}

.mainPageScroll::-webkit-scrollbar-thumb {
  background-color: var(--agora);
  /* blue color */
}

/* For Firefox */
.mainPageScroll {
  scrollbar-width: thin;
  scrollbar-color: var(--agora) transparent;
}

.form-control:focus {
  box-shadow: unset !important;
}

.bacheca .mainContainer .form-control {
  height: 40px !important;
}

.tablehead {
  font-family: Poppins;
  font-size: 14px;
  font-weight: 600;
  line-height: 21px;
  text-align: center;
}

.platformTableHeadColor {
  color: #4a4949;
}

.AgoraColor {
  color: var(--agora) !important;
}

.tableauColor {
  color: var(--bg-color-to) !important;
}

.table td {
  text-align: center;
  vertical-align: middle;
  height: 45px;
  border: none;
}

.table th {
  border: none;
}

.special-borders tbody td {
  position: relative;
  padding: 8px 12px;
}

.special-borders tbody td::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  width: 1px;
  height: 50%;
  background-color: #dbdbdb;
}

.special-borders tbody td:last-child::after {
  content: none;
}

.greetingsMessage {
  padding: 1em;
  display: flex;
  flex-direction: column;
  margin-top: 0.5em;
  align-items: flex-start;
}

.modal-dialog.inProgress .modal-content {
  top: unset;
  right: unset;
}

.modal-dialog.inProgress #modal-footer {
  display: flex;
}

.modal-dialog.inProgress #modal-footer button {
  position: relative;
  border: none;
  padding: 5px;
  padding-bottom: 0;
  transition: 0.3s ease-out;
  width: 120px;
  height: 38.81px;
  border-radius: 6px;
  background-color: #204769 !important;
  font-family: Open Sans;
  font-size: 14px;
  font-weight: 700;
  line-height: 19.07px;
  letter-spacing: -0.01em;
  color: white !important;
}

#main_sidebar #foglia {
  background-color: #244f75;
  color: var(--white);
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
  font-size: 24px;
  padding: 5px;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bacheca #main_sidebar #foglia:hover {
  text-decoration: none;
}

.table-responsive {
  overflow: auto;
  max-height: 63.5vh;
}

.table thead,
.container-fixed-height thead {
  position: sticky;
  top: 0;
  background-color: white;
  background-color: rgba(255, 255, 255, 1);
  /*background-color: rgba(255, 255, 255, 0.5);*/
  z-index: 1;
}

/* Custom scrollbar */
.table-responsive::-webkit-scrollbar {
  width: 5px;
  /* thin scrollbar */
}

/* For Firefox */
.table-responsive {
  scrollbar-width: thin;
}

.moreThanOneIconContainer {
  display: flex;
  align-content: center;
  justify-content: center;
}

.agora .sub-head .searchbar {
  position: relative;
  background-color: transparent;
  display: flex;
  align-items: center;
  margin: 0px;
  margin-right: 0px;
  margin-right: 0px;
  width: 458px;
  height: 40px;
  border-radius: 6px;
  border: 1px solid var(--gray);
  justify-content: start;
  margin-right: 1%;
  min-width: min-content;
  min-height: min-content;
}

.searchbar form {
  position: absolute;
  width: 100%;
  height: 100%;
}

.searchbar .in {
  background-color: transparent;
  border: medium;
  outline: none;
  font-size: 16px;
  width: 100%;
  height: 100%;
  padding: 0px 7px;
}

.searchbar i {
  position: absolute;
  top: 0px;
  right: 0px;
  padding: 11px;
  color: #848484;
}

.cercaLabelForSearchBar {
  font-family: Open Sans;
  font-size: 14px;
  font-weight: 600;
  line-height: 19.07px;
  text-align: left;
}

.table th {
  font-family: Poppins;
  font-size: 14px;
  font-weight: 600;
  line-height: 19.07px;
  color: #404850;
  text-align: center;
  vertical-align: middle;
  height: 70px;
}

/*Tableau*/
/*table head, pop-up head, pop-up label, notifications center headers, notifications center bottom border, Tipo notifica, Storico notifiche,
    notifications pop-up coloring for tableau*/
.to .bacheca .mainContainer .table th,
.to .bacheca .prof .popup .title,
.to .bacheca .prof .popup .row label,
.to .bacheca .notifiche #container .list .head,
.to .bacheca .notifiche #container .list .head,
.to .bacheca .subheader .nameS,
.to .bacheca .nameS,
.to .bacheca .notifiche .wrapText,
.to .bacheca .Bnavbar #pop-up-not .head,
.to .notification-link .notification-icon,
.to .notification-link .notification-title,
.to .bacheca .Bnavbar #pop-up-not .footer a,
.to .link .fa-xmark:hover {
  color: var(--verde-to) !important;
  border-color: var(--verde-to) !important;
}

/*pop-up btn background color for tableau*/
.to .bacheca .prof .to .foot .btn-invia {
  background-color: var(--verde-to) !important;
}

/*notifications center scroll-bar color for tableau*/
/* Custom scrollbar */
.to .bacheca .forToday.lista::-webkit-scrollbar,
.to .bacheca .toHide1 ::-webkit-scrollbar,
.to .bacheca .toHide2 ::-webkit-scrollbar,
.to .bacheca .toHide3 ::-webkit-scrollbar,
.to .bacheca .Bnavbar #pop-up-not .corpo ::-webkit-scrollbar {
  width: 5px !important;
  /* thin scrollbar */
}

.to .bacheca .forToday.lista::-webkit-scrollbar-thumb,
.to .bacheca .toHide1::-webkit-scrollbar-thumb,
.to .bacheca .toHide2::-webkit-scrollbar-thumb,
.to .bacheca .toHide3::-webkit-scrollbar-thumb,
.to .bacheca .Bnavbar #pop-up-not .corpo::-webkit-scrollbar-thumb {
  background-color: var(--verde-to) !important;
}

/* For Firefox */
.to .bacheca .forToday.lista,
.to .bacheca .toHide1,
.to .bacheca .toHide2,
.to .bacheca .toHide3,
.to .bacheca .Bnavbar #pop-up-not .corpo {
  scrollbar-width: thin;
  scrollbar-color: var(--verde-to) transparent !important;
}

/*Platform*/
/*table head, pop-up head, pop-up label, notifications center headers, notifications center bottom border, Tipo notifica, Storico notifiche,
    notifications pop-up coloring for platform*/
.bacheca .mainContainer .table th,
.bacheca .prof .popup .title,
.bacheca .prof .popup .row label,
.bacheca .notifiche #container .list .head,
.bacheca .notifiche #container .list .head,
.bacheca .subheader .nameS,
.bacheca .nameS,
.bacheca .notifiche .wrapText,
.Bnavbar #pop-up-not .head,
.Bnavbar #pop-up-not .footer a,
.link .fa-xmark:hover {
  color: var(--blu-platform) !important;
  border-color: var(--blu-platform) !important;
}

.notification-link .notification-icon,
.notification-link .notification-title {
  color: var(--blu-platform);
  border-color: var(--blu-platform);
}

/*pop-up btn background color for platform*/
.bacheca .prof .to .btn-invia,
.bacheca .prof .foot .btn-invia {
  background-color: var(--blu-platform) !important;
}

.to .bacheca .prof .to .btn-invia,
.to .bacheca .prof .foot .btn-invia {
  background-color: var(--bg-color-to) !important;
}

/*notifications center scroll-bar color for platform*/
/* Custom scrollbar */
.bacheca .forToday.lista::-webkit-scrollbar,
.bacheca .toHide1 ::-webkit-scrollbar,
.bacheca .toHide2 ::-webkit-scrollbar,
.bacheca .toHide3 ::-webkit-scrollbar,
.bacheca .Bnavbar #pop-up-not .corpo ::-webkit-scrollbar {
  width: 5px !important;
  /* thin scrollbar */
}

.bacheca .forToday.lista::-webkit-scrollbar-thumb,
.bacheca .toHide1::-webkit-scrollbar-thumb,
.bacheca .toHide2::-webkit-scrollbar-thumb,
.bacheca .toHide3::-webkit-scrollbar-thumb,
.bacheca .Bnavbar #pop-up-not .corpo::-webkit-scrollbar-thumb {
  background-color: var(--blu-platform) !important;
}

/* For Firefox */
.bacheca .forToday.lista,
.bacheca .toHide1,
.bacheca .toHide2,
.bacheca .toHide3,
.bacheca .Bnavbar #pop-up-not .corpo {
  scrollbar-width: thin;
  scrollbar-color: var(--blu-platform) transparent !important;
}

/*Agora*/
/*table head, pop-up head, pop-up label, notifications center headers, notifications center bottom border, Tipo notifica, Storico notifiche,
    notifications pop-up coloring for agora*/
.body-ag .bacheca .mainContainer .table th,
.body-ag .bacheca .prof .popup .title,
.body-ag .bacheca .prof .popup .row label,
.body-ag .bacheca .notifiche #container .list .head,
.body-ag .bacheca .notifiche #container .list .head,
.body-ag .bacheca .subheader .nameS,
.body-ag .bacheca .nameS,
.body-ag .bacheca .notifiche .wrapText,
.body-ag .Bnavbar #pop-up-not .head,
.body-ag .Bnavbar #pop-up-not .footer a,
.body-ag .link .fa-xmark:hover {
  color: var(--agora) !important;
  border-color: var(--agora) !important;
}

.body-ag .notification-link .notification-icon,
.body-ag .notification-link .notification-title {
  color: var(--agora);
  border-color: var(--agora);
}

/*pop-up btn background color for agora*/
.body-ag .bacheca .prof .to .btn-invia,
.body-ag .bacheca .prof .foot .btn-invia {
  background-color: var(--agora) !important;
}

/*notifications center scroll-bar color for agora*/
/* Custom scrollbar */
.body-ag .bacheca .forToday.lista::-webkit-scrollbar,
.body-ag .bacheca .toHide1 ::-webkit-scrollbar,
.body-ag .bacheca .toHide2 ::-webkit-scrollbar,
.body-ag .bacheca .toHide3 ::-webkit-scrollbar,
.body-ag .bacheca .Bnavbar #pop-up-not .corpo ::-webkit-scrollbar {
  width: 5px !important;
  /* thin scrollbar */
}

.body-ag .bacheca .forToday.lista::-webkit-scrollbar-thumb,
.body-ag .bacheca .toHide1::-webkit-scrollbar-thumb,
.body-ag .bacheca .toHide2::-webkit-scrollbar-thumb,
.body-ag .bacheca .toHide3::-webkit-scrollbar-thumb,
.body-ag .bacheca .Bnavbar #pop-up-not .corpo::-webkit-scrollbar-thumb {
  background-color: var(--agora) !important;
}

/* For Firefox */
.body-ag .bacheca .forToday.lista,
.body-ag .bacheca .toHide1,
.body-ag .bacheca .toHide2,
.body-ag .bacheca .toHide3,
.bacheca .Bnavbar #pop-up-not .corpo {
  scrollbar-width: thin;
  scrollbar-color: var(--agora) transparent !important;
}

.footer-Btns {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: end;
}

.fa-kit.fa-light-paper-plane-circle-dollar {
  font-weight: 300;
}

.tit {
  font-size: 14px !important;
  font-weight: 600 !important;
}

.form-select-css,
.form-note-css {
  height: 40px;
  border: 1px solid var(--gray);
  border-radius: 6px;
  background-color: white;
  font-size: 14px;
  font-weight: 400;
}

.form-select:focus {
  border-color: #86b7fe;
  border-color: none;
  outline: 0;
  /*box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);*/
  box-shadow: none !important;
}

.form-note-css {
  height: 80px;
  max-height: 120px;
}

.form-date-css {
  height: 40px;
  border: 1px solid var(--gray);
  border-radius: 8px;
  background-color: white;
  font-size: 14px;
  font-weight: 600;
  color: #4a4d53;
}

.form-date-css i {
  color: #204769;
  right: 0;
  position: absolute;
}

month-head span {
  font-family: Open Sans;
  font-size: 14px;
  font-weight: 600;
  line-height: 19.07px;
  text-align: center;
  color: #204769;
}

.dimStrutture {
  font-size: 14px;
  font-weight: 600;
}

/*waleed*/
.profile-cell {
  display: flex;
  align-items: center;
  padding: 0;
  /* Ensure there's no padding in the cell */
}

.table-profile-picture {
  flex-shrink: 0;
  /* Prevent the image from shrinking */
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background-color: #ccc;
  overflow: hidden;
  /*  border: 1px solid #fff;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);*/
  margin-right: 10px;
  /* Space between image and text */
}

.table-profile-picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Ensure the image covers the container */
}

.profile-text {
  margin-left: 70px;
  font-family: Poppins;
  font-size: 14px;
  font-weight: 600;
  line-height: 21px;
  color: #4a4d53;
}

.small-table td {
  background-color: #f8fcff;
  color: #4a4d53;
}

.small-table tbody tr {
  /*border: 1px solid #DBDBDB;*/
  border: 0;
}

.small-table tbody td {
  /*border: 1px solid #DBDBDB;*/
  height: 30px;
}

.small-table thead th {
  /*border: 1px solid #DBDBDB;*/
  height: 30px;
}

table th {
  height: 30px;
}

.content-above-table {
  /* Example styles for content above the table */
  /*padding: 20px;
    background-color: #f8f9fa;*/
  margin-bottom: 5px;
}

.new-scroll {
  overflow-y: auto;
}

.new-scroll::-webkit-scrollbar {
  width: 5px;
  /* thin scrollbar */
}

.new-scroll::-webkit-scrollbar-thumb {
  background-color: var(--bg-color-hotel);
  /* blue color */
}

/* For Firefox */
.new-scroll {
  scrollbar-width: thin;
  scrollbar-color: var(--bg-color-hotel) transparent;
}

.agora .new-scroll::-webkit-scrollbar-thumb {
  background-color: var(--agora);
  /* blue color */
}

/* For Firefox */
.agora .new-scroll {
  scrollbar-width: thin;
  scrollbar-color: var(--agora) transparent;
}

.to .new-scroll::-webkit-scrollbar-thumb {
  background-color: var(--bg-color-to);
  /* blue color */
}

/* For Firefox */
.to .new-scroll {
  scrollbar-width: thin;
  scrollbar-color: var(--bg-color-to) transparent;
}

/*Tableau btns*/
.to .bacheca .mainContainer .primary-btn,
.to .primary-btn,
.to .btn-primary {
  color: white !important;
  background-color: var(--bg-color-to) !important;
  border: 0;
}

.to .bacheca .mainContainer .primary-btn.disabled,
.to .primary-btn.disabled,
.to .btn-primary.disabled {
  color: #a9aaad !important;
  background-color: #e9eaed !important;
  border: 0;
}

.to .bacheca .mainContainer .primary-btn:hover,
.to .primary-btn:hover,
.to .btn-primary:hover {
  color: white;
  box-shadow: 0 0 3px white !important;
  background-color: #dcebd2 !important;
  border: 0;
}

.to .bacheca .mainContainer .secondary-btn,
.to .secondary-btn,
.to .btn-secondary {
  color: var(--bg-color-to);
  background-color: white;
  border: 1px solid var(--bg-color-to);
  border-radius: 6px;
}

.to .bacheca .mainContainer .secondary-btn.disabled,
.to .secondary-btn.disabled,
.to .btn-secondary.disabled {
  color: #a9aaad;
  background-color: white;
  border: 1px solid #a9aaad;
  border-radius: 6px;
}

.to .bacheca .mainContainer .secondary-btn:hover,
.to .secondary-btn:hover,
.to .btn-secondary:hover {
  color: var(--bg-color-to);
  background-color: #dcebd2;
  border: 1px solid #404850;
  border-radius: 6px;
}

.to .bacheca .mainContainer .tertiary-btn {
  color: var(--bg-color-to);
  background-color: white;
  border: 0;
}

.to .bacheca .mainContainer .tertiary-btn .disabled {
  color: #a9aaad;
  background-color: white;
  border: 0;
}

.to .bacheca .mainContainer .tertiary-btn:hover {
  color: var(--bg-color-to);
  background-color: #dcebd2;
  border: 0;
}

.to #formModal .modal-dialog.inProgress #modal-footer #btn-form-modal-cancel {
  background-color: var(--bg-color-to);
}

/*PLATFORM btns*/
.bacheca .mainContainer .primary-btn,
.primary-btn {
  color: white;
  background-color: #204769;
  border: 0;
  min-width: 144px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 6px;
  height: 40px;
  /*padding: 12px 24px;*/
  display: flex;
  justify-content: center;
  align-items: center;
}

.bacheca .mainContainer .primary-btn.disabled,
.primary-btn.disabled {
  color: #a9aaad;
  background-color: #e9eaed;
  border: 0;
}

.bacheca .mainContainer .primary-btn:hover,
.primary-btn:hover {
  color: white;
  background-color: #5c9cd4;
  border: 0;
}

.bacheca .mainContainer .primary-btn i {
  padding: 0 8px 0 0;
}

.bacheca .mainContainer .primary-btn.disabled:hover,
.primary-btn.disabled:hover {
  color: #a9aaad;
  background-color: #e9eaed;
  border: 0;
}

.bacheca .mainContainer a,
.bacheca .mainContainer input,
.bacheca .mainContainer button,
a,
button,
#swalContent input {
  transition: 0.3s ease-out;
}

.bacheca .mainContainer .secondary-btn,
.secondary-btn {
  color: #204769;
  background-color: white;
  border: 1px solid #204769;
  border-radius: 6px;
  min-width: 144px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 6px;
  height: 40px;
  padding: 8px 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.3s ease-out;
}

.bacheca .mainContainer .secondary-btn i {
  padding: 0 8px 0 0;
}

.bacheca .mainContainer .secondary-btn.disabled,
.secondary-btn.disabled {
  color: #a9aaad;
  background-color: white;
  border: 1px solid #a9aaad;
  border-radius: 6px;
}

.bacheca .mainContainer .secondary-btn:hover,
.secondary-btn:hover {
  color: #5c9cd4;
  background-color: #f0f5f8;
  /*border: 1px solid #A9AAAD !important;*/
  border-radius: 6px;
}

.bacheca .mainContainer .secondary-btn.disabled:hover,
.secondary-btn.disabled:hover {
  color: #a9aaad;
  background-color: white;
  border: 1px solid #a9aaad;
  border-radius: 6px;
}

.bacheca .mainContainer .tertiary-btn,
.tertiary-btn {
  color: #204769;
  background-color: white;
  border: 0;
  transition: 0.3s ease-out;
}

.bacheca .mainContainer .tertiary-btn.disabled,
.tertiary-btn.disabled {
  color: #a9aaad;
  background-color: white;
  border: 0;
}

.bacheca .mainContainer .tertiary-btn:hover,
.tertiary-btn:hover {
  color: #5c9cd4;
  background-color: #f0f5f8;
  border: 0;
}

.bacheca .mainContainer .danger-btn,
.bacheca .mainContainer .btn-danger,
.danger-btn,
.btn-danger {
  color: rgba(255, 97, 111, 1);
  border: 1px solid rgba(255, 97, 111, 1);
  background-color: #fff;
  cursor: pointer;
}

.bacheca .mainContainer .danger-btn:hover,
.bacheca .mainContainer .btn-danger:hover,
.danger-btn:hover,
.btn-danger:hover {
  color: #fff;
}

bacheca .mainContainer .nodanger-btn,
.bacheca .mainContainer .nodanger-btn,
.nodanger-btn,
.nodanger-btn {
  color: #4a4d53;
  border: 1px solid #4a4d53;
  background-color: #fff;
  cursor: pointer;
}

/*AGORA btns*/

.agora .mainContainer .primary-btn,
.agora .primary-btn {
  color: white;
  background-color: #708090;
  border: 0;
  min-width: 144px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 6px;
  height: 40px;
  /*padding: 12px 24px;*/
  display: flex;
  justify-content: center;
  align-items: center;
}

.agora .mainContainer .secondary-btn,
.agora .secondary-btn {
  color: #404850;
  background-color: white;
  border: 1px solid #404850;
  border-radius: 6px;
  min-width: 144px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 6px;
  height: 40px;
  padding: 8px 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.3s ease-out;
}

.body-ag .mainContainer .primary-btn,
.body-ag .primary-btn {
  color: white;
  background-color: #708090;
  border: 0;
  transition: 0.3s ease-out;
  cursor: pointer;
}

.body-ag .mainContainer .primary-btn.disabled,
.body-ag .primary-btn.disabled {
  color: #a9aaad;
  background-color: #e9eaed;
  border: 0;
}

.body-ag .mainContainer .primary-btn:hover,
.body-ag .primary-btn:hover {
  color: white;
  background-color: #b2c8de;
  border: 0;
}

.body-ag .mainContainer .secondary-btn,
.body-ag .secondary-btn {
  color: #404850;
  background-color: white;
  border: 1px solid #404850;
  border-radius: 6px;
}

.body-ag .mainContainer .secondary-btn.disabled,
.body-ag .secondary-btn.disabled {
  color: #a9aaad;
  background-color: white;
  border: 1px solid #a9aaad;
  border-radius: 6px;
}

.body-ag .mainContainer .secondary-btn:hover,
.body-ag .secondary-btn:hover {
  color: #404850;
  background-color: #dae8f5;
  border: 1px solid #404850;
  border-radius: 6px;
}

.body-ag .mainContainer .tertiary-btn,
.body-ag .tertiary-btn {
  color: #404850;
  background-color: white;
  border: 0;
}

.body-ag .mainContainer .tertiary-btn.disabled,
.body-ag .tertiary-btn.disabled {
  color: #a9aaad;
  background-color: white;
  border: 0;
}

.body-ag .mainContainer .tertiary-btn:hover,
.body-ag .tertiary-btn:hover {
  color: #404850;
  background-color: #dae8f5;
  border: 0;
}

@media (max-width: 1450px) {
  .Bnavbar .breadcrumb .containLinks {
    display: none;
  }
}

.custom-spin-box {
  position: relative;
  text-align: center;
}

.custom-spin-box input[type="number"] {
  width: 35px;
  /* Adjusted width */
  font-size: 12px;
  padding: 5px;
  text-align: center;
  border: 0;
  /* Added border to maintain a consistent appearance */
  border-radius: 0px;
  -moz-appearance: textfield;
  background-color: transparent;
  height: min-content;
}

.custom-spin-box input[type="number"]::-webkit-outer-spin-button,
.custom-spin-box input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.spin-button {
  display: flex;
  flex-direction: column;
  position: absolute;
  right: 13px;
  /* Adjusted position to be closer */
  top: 50%;
  transform: translateY(-50%);
}

.spin-button .fa-sort-up,
.spin-button .fa-sort-down {
  cursor: pointer;
  padding: 0;
  /* Removed padding */
}

.spin-button .fa-sort-up {
  color: #204769;
  font-size: 15px;
}

.spin-button .fa-sort-down {
  color: #9a9a9a;
  font-size: 15px;
}

.marginLeft {
  margin-left: auto;
}

.noBorder {
  border: 0;
}

.customRadio {
  width: 15px;
  height: 15px;
  padding: 0;
  margin-top: 0.2em;
  margin-right: 0.5em;
}

.mgrRiga {
  margin-top: 30px;
}

.highlight {
  background-color: #a9d7ff;
  color: var(--white);
}

.form-control:focus {
  box-shadow: unset;
}

.d-inline-grid {
  display: inline-grid;
}

/* css datepicker calendar */
.input-group .input-group-append {
  margin-left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  position: absolute;
  right: 10px;
  pointer-events: none;
}

.input-group input {
  border-radius: 6px;
  cursor: pointer;
}

.input-group > .form-control:focus,
.input-group .input-group-append .form-control:focus,
.input-group .input-group-append input:focus,
.form-control:focus {
  z-index: unset;
  border-color: #5c9cd4 !important;
}

.input-group .input-group-append .fa-calendar {
  right: unset !important;
  top: unset !important;
  color: var(--blu-platform);
  position: relative;
  pointer-events: none;
}

.to .input-group .input-group-append .fa-calendar {
  color: var(--verde-to);
}

/* css datepicker calendar */
/* Popup standard */

#formConfirmModal .modal-content {
  width: 550px;
  max-height: 250px;
  border-radius: 8px;
  border: 2px solid var(--lgray);
  overflow: hidden;
}

#formConfirmModal .modal-dialog {
  margin: 0 !important;
  height: 100% !important;
  min-height: 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  justify-content: center;
  top: 0;
  left: 0;
}

#formConfirmModal #backG {
  pointer-events: none;
  font-size: 11vw;
  position: absolute;
  top: 0px;
  right: -40px;
  z-index: 0;
  color: #a9aaad;
  opacity: 0.6;
}

#formConfirmModal #formModalTitle,
#formConfirmModal #formModalBody,
#formConfirmModal #modal-footer {
  z-index: 1;
}

#formConfirmModal #backG.fa-circle-xmark {
  color: rgba(255, 12, 12, 0.14);
  transform: rotate(0deg);
  top: -37px;
  right: -22px;
}

#formConfirmModal #backG.fa-triangle-exclamation {
  color: rgba(255, 204, 129, 0.4);
  transform: rotate(-15deg);
  right: 0px;
  top: -38px;
}

#formConfirmModal #backG.fa-circle-check {
  color: rgba(0, 183, 51, 0.25);
  top: -37px;
  right: -22px;
}

#formConfirmModal .modal-header .close {
  width: 30px;
  height: 30px;
  padding: 0px;
  position: relative;
}

#formConfirmModal .modal-header .close i {
  top: unset;
  right: unset;
  padding: 0px;
  position: relative;
}

#formConfirmModal #formModalBody {
  padding: 10px 20px;
  font-size: 14px;
}

#formConfirmModal #modal-footer {
  margin: 0;
  padding: 0;
  height: 65px;
  justify-content: flex-end;
  gap: 20px;
  padding: 10px 24px;
}

#formConfirmModal #modal-footer button {
  margin: 0;
}

/* Popup standard */

/******************* SELECT 2 ******************************************************************************/

.custom-dropdown-style .select2-results__options {
  max-height: 250px;
  /* Limita altezza */
  overflow-y: auto;
  /* Abilita lo scorrimento */
}

/* Rimuove la freccia nativa */
.select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  display: none;
  /* Nasconde la freccia di default */
}

/* Aggiunge l'icona arrow-down */
.select2-container--default .select2-selection--single {
  position: relative;
  /* Necessario per posizionare l'icona */
}

.select2-container--default .select2-selection--single:after {
  content: "\f107";
  /* Codice per l'icona arrow-down di Font Awesome */
  font-family: "FontAwesome";
  font-weight: 100;
  position: absolute;
  right: 10px;
  /* Posizione a destra */
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  color: #343a40;
  /* Colore dell'icona */
}

.select2-container--default .select2-selection--single {
  background-color: #fff !important;
  border: 1px solid #cfcfcf !important;
  border-radius: 6px !important;
  height: 40px !important;
  padding-top: 4px;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  color: #444;
  line-height: 28px;
  padding-top: 4px !important;
}

/**********************************************************************************************************/

.crEstensione .form-container .hRow {
  gap: 15px;
}

/********* SELECT NAVBAR ****************/

.multi-struttura {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 20px;
}

#selectHotel {
  height: 34px;
  width: auto;
  background-color: var(--blu-platform);
  color: white;
  border-color: var(--blu-platform);
  font-size: 14px;
  cursor: pointer;
}

.bacheca.sys-admin #selectHotel {
  background-color: var(--bg-sys-admin);
  border-color: var(--bg-sys-admin);
}

.to #selectHotel {
  height: 34px;
  width: auto;
  background-color: var(--bg-color-to);
  color: white;
  border-color: var(--bg-color-to);
  font-size: 14px;
  cursor: pointer;
}

/* Nascondi la freccia predefinita */
.select-wrapper select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  font-size: 14px;
  width: 100%;
}

/* Nascondi la freccia predefinita di IE */
.select-wrapper select::-ms-expand {
  display: none !important;
}

.select-wrapper::after {
  content: "\f0d7";
  /* Codice di FontAwesome per la freccia giù */
  font-family: "FontAwesome";
  position: absolute;
  left: 10px;
  /* Posiziona la freccia a sinistra */
  top: 50%;
  transform: translateY(-50%);
  color: white;
  /* Colore della freccia */
  font-size: 16px;
  pointer-events: none;
}

.select-wrapper {
  position: relative;
  width: 100%;
}

#selectHotel.form-select {
  padding: 0;
  background-image: none !important;
  padding-left: 25px;
}

#selectHotel option:hover {
  background-color: #3f6f99;
  color: white;
}

.body-ag #selectHotel {
  background-color: var(--agora) !important;
  border-color: var(--agora) !important;
}

.to .bacheca .mainContainer .subContainer #pagination .page-btn {
  color: #206953;
  font-weight: 600;
}

.to .bacheca .mainContainer .subContainer #pagination .page-btn.active {
  background: #206953 !important;
  color: white;
}

.subheader select.form-select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-size: 12px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.7rem center;
  background-size: 12px;
}

/*.subheader select.form-select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;*/
/* elimina SOLO l'immagine di sfondo di Bootstrap, non il colore inline */
/*background-image: none !important;
    background-repeat: no-repeat !important;
}

    .subheader select.form-select.hSelect {*/
/* lascia intatto l'inline background-color (giallo) */
/*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
        background-position: right 0.7rem center !important;
        background-size: 12px !important;
        padding-right: 2rem;*/ /* spazio per la freccia a destra */
/*}*/

#formModal.modal-loading .modal-body {
  min-height: clamp(60px, 6vh, 110px);
  position: relative;
  overflow: hidden;
}

/* overlay dello spinner */
#formModal .modal-spinner {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}

/*
.hcas.intestazione.arrow {
    max-width: 15px;
    flex: 1;
    justify-content: center;
    align-items: center;
    display: flex;
    height: 100%;
}*/
/*.hcas.intestazione {
    max-width: 15px;
    flex: 1;
    justify-content: center;
    align-items: center;
    display: flex;
    height: 100%;
}
.hcas.intestazione.camera {
        max-width: 15px;
        flex: 1;
        justify-content: center;
        align-items: center;
        display: flex;
        height: 100%;
}
.hcas.intestazione.reparto1 {
        max-width: 15px;
        flex: 1;
        justify-content: center;
        align-items: center;
        display: flex;
        height: 100%;
}
.hcas.intestazione {
    max-width: 15px;
    flex: 1;
    justify-content: center;
    align-items: center;
    display: flex;
    height: 100%;
}*/
/*

.select-box {
    background-color: var(--blu-platform);
    color: white;
    padding: 8px;
    border: 1px solid var(--blu-platform);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 25px;
    font-size: 14px
}


.select-options {
    display: none;
    position: absolute;
    background-color: var(--blu-platform);
    border: 1px solid #ccc;
    max-height: 350px;
    overflow-y: auto;
    width: fit-content;
    z-index: 1000;
    border-radius: 4px;
}

    .select-options div {
        padding: 2px;
        padding-left: 2px;
        cursor: pointer;
        padding-left: 6px;
        font-size: 14px;
    }

        .select-options div:hover {
            background-color: #3f6f99;
            color: white;
        }
*/