﻿: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: 90;
}

/* 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;
    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: 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.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: 500;
    font-size: 18px;
}

.firstLi .drpDown {
    font-size: 15px;
    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: 16px;
}

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

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

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

#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: 13px;
    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: 16px;
}

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


.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: .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.20em;
    margin-right: .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;
        }
*/

