/* -------------------------------------------------------------------- */
/* Colori                                                               */
/* -------------------------------------------------------------------- */

:root {
    --light-blue: #0162DD; /* rgba(1, 98, 221, 1) */
    --green: #C0DCC0; /* rgba(192, 220, 192, 1) */
    --green-update: #2A802A; /* rgba(42, 128, 42, 1) */
    --grey: #EEEEEE; /* rgba(238, 238, 238, 1) */
    --dark-grey: #424242;
    --main-blue: #2A5780; /* rgba(42, 87, 128, 1) */ /* Colore da utilizzare SOLO sulla barra orizzontale in alto e nei pulsanti */
    --title-blue: #002F60; /* rgba(0, 47, 96, 1) */
    --white: #FFFFFF; /* rgba(255, 255, 255, 1) */
}

.green-icon {
    color: var(--green-update);
}
.rz-event-list-btn { /* Questa classe non ha riferimenti nel codice della soluzione, perchè è una classe di default */
    color: #0362DD !important; /* rgba(3, 98, 221, 1) */
}

/* -------------------------------------------------------------------- */
/* Home                                                                 */
/* -------------------------------------------------------------------- */

.main-content img {
    padding: 5px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.homeSidebar {
    padding: 20px;
    border-radius: 8px;
}

/* -------------------------------------------------------------------- */
/* Objects Style (titles, imported fields, read only fields etc.)       */
/* -------------------------------------------------------------------- */

.item-selected {
    background-color: #e0e0e0;
    border-radius: 4px;
}

.lblTitle {
    color: var(--title-blue);
    font-size: 16px;
    font-weight: bold;
}

.lblSectionTitle {
    color: var(--title-blue);
    font-size: 20px;
    font-weight: bold;
    padding-bottom: 20px;
}

.imported-field {
    background: var(--green);
    margin: 0 !important; /* Rimuove qualsiasi margine */
    padding: 0 !important; /* Rimuove qualsiasi padding */
    text-transform: uppercase;
}

.propertycolumn-font {
    color: var(--title-blue) !important;
    font-size: 15px !important;
    font-weight: bold !important;
    line-height: 25.5px !important;
}

.propertycolumn-font-center {
    justify-items: center;
}

.tbox-grey {
    background: var(--grey);
}

.titlefont-denomination {
    color: var(--title-blue) !important;
    font-size: 25px !important;
    font-weight: bold;
    letter-spacing: 0.1em !important;
    line-height: 34.15px !important;
    text-align: left;
}

.titlefont-variable {
    color: var(--light-blue);
    font-size: 25px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    line-height: 34.15px !important;
    text-align: left;
}

.searchbar-font {
    color: var(--title-blue);
    font-size: 20px !important;
    font-weight: bold !important;
    line-height: 27.23px !important;
    text-align: center;
}

.divider {
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: transparent;
}

.login-width {
    width: 500px !important;
}

.DatePicker {
    border: none !important;
}

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

input.mud-input-slot {
    text-transform: uppercase;
}
.none-text > .mud-input-control-input-container > .mud-input> input.mud-input-slot {
    text-transform: none !important;
}


.mud-input-password input {
    text-transform: none;
}

.style-compact-column {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

label.radio-label {
    border: 2px solid #767676;
    border-radius: 50%;
    cursor: pointer;
    display: inline-block;
    height: 20px;
    position: relative;
    width: 20px;
}

label.radio-label::before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #767676;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: opacity 0.2s;
}

label.radio-label:focus {
    box-shadow: 0 0 0 15px rgba(0, 0, 0, 0.058823529411764705);
}

label.radio-label:hover {
    box-shadow: 0 0 0 15px rgba(0, 0, 0, 0.058823529411764705);
}

span.radio-label {
    font-size: 16px !important;
    margin-left: 15px !important;
}

.tooltip-left-align {
    text-align: left !important;
}

.uppercase-text {
    text-transform: uppercase;
}

.mud-list-item-text > .mud-typography {
    text-transform: uppercase;
}

.lowercase > .mud-list-item-text > .mud-typography {
    text-transform: none;
}

.modal-header-style {
    background: #F2F2F2;
    margin-left: -16px;
    margin-right: -16px;
    height: 81px;
}

.modal-centered-style {
    position: fixed;
    width: 100vw;
    height: 100vh;
    max-height: 90vh;
    z-index: 1050;
    display: flex;
    padding-bottom: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.no-uppercase-wrapper textarea {
    text-transform: none !important;
}

/* -------------------------------------------------------------------- */
/* Buttons                                                              */
/* -------------------------------------------------------------------- */
.bt-clienti {
    border-radius: 5px;
    font-size: 16px !important;
    text-transform: none;
}

.bt-long {
    background: var(--main-blue) !important;
    border-radius: 5px;
    color: var(--white) !important;
    font-size: 16px !important;
    height: 50px;
    text-transform: none;
    width: 220px;
}

.bt-long-important {
    background: var(--light-blue) !important;
    border-radius: 5px;
    color: var(--white) !important;
    font-size: 16px !important;
    height: 50px;
    text-transform: none;
    width: 220px;
}

.bt-passwordvalidity {
    background: var(--white);
    border: 1px solid var(--main-blue) !important;
    border-radius: 5px !important;
    font-size: 16px !important;
    height: 40px;
    text-transform: none;
    width: 110px;
}

.bt-short {
    background: var(--main-blue) !important;
    border-radius: 5px;
    color: var(--white) !important;
    font-size: 16px !important;
    height: 50px;
    text-transform: none;
    width: 120px;
}

.bt-short-important {
    background: var(--light-blue) !important;
    border-radius: 5px;
    color: var(--white) !important;
    font-size: 16px !important;
    height: 50px;
    text-transform: none;
    width: 120px;
}

.bt-tipoPersona {
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
}

.bt-navigation {
    text-transform: none;
    text-align: left;
    background: var(--main-blue) !important;
    height: 50px;
    color: var(--white) !important;
    border-radius: 5px;
    font-size: 17px !important;
    min-width: 114px;
}

.bt-submit {
    text-transform: none;
    text-align: left;
    height: 50px;
    background: var(--light-blue) !important;
    border-radius: 5px;
    color: var(--white) !important;
    font-size: 17px !important;
    min-width: 144px;
}

.padding-top-20 {
    padding-top: 20px;
}

/* -------------------------------------------------------------------- */
/* Width                                                                */
/* -------------------------------------------------------------------- */

.width-60 {
    width: 60px;
}

.width-80 {
    width: 80px;
}

.width-125 {
    width: 125px;
}

.width-150 {
    width: 150px;
}

.width-160 {
    width: 160px;
}

.width-190 {
    width: 190px;
}

.width-200 {
    width: 200px;
}
.width-250 {
    width: 250px;
}

.width-350 {
    width: 350px;
}

.width-500 {
    width: 500px;
}

.width-10percent {
    width: 10%;
}

.width-25percent {
    width: 25%;
}

.width-40percent {
    width: 40%;
}

.width-80percent {
    width: 80%;
}

.width-100percent {
    width: 100%;
}

/* -------------------------------------------------------------------- */
/* MessageBox                                                           */
/* -------------------------------------------------------------------- */
div.mud-dialog-content {
    padding: 0px 20px 20px !important;
}

.truncate-value {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

div.mud-dialog-title {
    padding: 20px !important;
}

.truncate-text-twolines {
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Limita a due righe */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    word-break: break-all;
}

.fieldLabel {
    margin-bottom: 5px;
    padding-left: 3px;
}

.custom-ps-button-group {
    display: flex;
    gap: 8px;
}

.custom-ps-button {
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: var(--title-blue);
    border: 2px solid var(--title-blue);
    border-radius: 25px;
    padding: 8px 16px;
    transition: all 0.3s ease-in-out;
    background-color: white;
}

/* -------------------------------------------------------------------- */
/* Scheduler                                                            */
/* -------------------------------------------------------------------- */

.rz-popup {
    padding: 0 !important;
    z-index: 10;
}

.rz-tooltip-content {
    background: transparent !important;
}

/* Nasconde le fasce orarie nel calendario con visualizzazione Giorno e Settimana */
.rz-slot-hours .rz-slot-header {
    display: none;
}

/* Centra il popup che si apre con Vedi Tutti */
.rz-dialog {
    position: fixed;
    top: 50%;
    left: 40%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    display: block;
    height: 50%;
}

/* Nasconde i giorni di altri mesi con visualizzazione Anno */
.rz-year-view .rz-slot .rz-slot-title.rz-other-month {
    visibility: hidden !important;
}

.header-style {
    margin-left: -16px;
    margin-right: -16px;
}

.muditem-min-width {
    min-width: 300px;
    width: 100%;
}

.mudselect-min-width {
    min-width: 200px;
    width: 100%;
}

.mudchip-style {
    border-radius: 10px !important;
    width: 150px;
}

.low-priority {
    background-color: rgba(203,230,200,1);
}

    .low-priority:hover {
        background-color: rgba(203, 230, 200, 1) !important;
    }

.medium-priority {
    background-color: rgba(254,249,193,1);
}

    .medium-priority:hover {
        background-color: rgba(254,249,193,1) !important;
    }

.high-priority {
    background-color: rgba(251,204,209,1);
}

    .high-priority:hover {
        background-color: rgba(251,204,209,1) !important;
    }

.fulfilmentslist-mudchip-style {
    border-radius: 10px !important;
    width: 70px;
}

.fulfilmentslist-progresslinear-style {
    width: 80px;
}

.reminder-card-style {
    width: 350px;
    height: 200px;
    background-color: transparent;
    border-left: 9px solid;
    margin: 0;
}

.high-priority-border {
    border-left-color: rgba(251,204,209,1);
}

.medium-priority-border {
    border-left-color: rgba(254,249,193,1);
}

.low-priority-border {
    border-left-color: rgba(203,230,200,1);
}

.fulfilment-state {
    background-color: rgb(33,150,243);
    color: white
}

    .fulfilment-state:hover {
        background-color: rgb(33,150,243) !important;
    }

.state-to-be-completed {
    background-color: rgba(255,246,249,1);
}

.state-completed {
    background-color: rgba(33,99,181,1);
    color: white
}

.week-view {
    background: rgba(255,220,40,.2);
}

.month-view {
    background: rgba(255,220,40,.2);
}

.year-view {
    background: red;
    color: black;
    font-weight: bold;
}

.calendar-item-style {
    text-transform: uppercase;
    font-size: 11px;
    color: black;
    font-weight: bold;
    padding-left: 4px;
    min-height: 24px;
    display: flex;
    align-items: center;
    line-height: 24px;
}

.custom-calendar-item {
    border-color: white;
    border: 2px solid white;
}

.deadlinedate-alignment {
    display: flex;
    align-items: center;
    gap: 30px;
}

.tooltip-content {
    background-color: #616161 !important;
    font-size: small !important;
    z-index: 1500;
    border-radius: 5px;
}

.txt-truncated {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.istitutional-calendar-item-style {
    background-color: rgba(1,98,221,0.12);
    text-transform: uppercase;
    font-size: 11px;
    color: black;
    font-weight: bold;
}

.appbar-style {
    padding-top: 15px;
    padding-bottom: 5px;
}

/* -------------------------------------------------------------------- */
/* User Manual                                                          */
/* -------------------------------------------------------------------- */

.usermanual-title-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.usermanual-title-position {
    margin: 0;
    padding: 0;
}

.usermanual-card-style {
    flex: 1;
    border-left-color: rgba(224, 224, 224, 1);
    border-left-width: 10px;
}

.usermanual-card-flex-spacing {
    display: flex;
    gap: 16px;
}

.usermanual-scroll-up-align {
    text-align: right;
}

.usermanual-list-style-type {
    padding-left: 25px;
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.custom-list {
    list-style-type: none;
    padding-left: 20px;
}

    .custom-list li {
        text-indent: -10px;
        padding-left: 10px;
    }

        .custom-list li::before {
            content: "- ";
        }

/* Tiene solo il contenuto da stampare nascondendo il pulsante print e rimuovendo data,
   ora, titolo finestra e percorso dalla pagina quando viene effettuata la stampa */
@media print {
    .mud-tooltip, .mud-icon-button {
        display: none;
    }

    .content-to-print {
        visibility: visible;
        position: absolute;
        top: 0;
    }

    @page {
        margin: 10px;
    }

    div@page {
        display: none;
    }
}

/* -------------------------------------------------------------------- */
/* AdminPortal                                                          */
/* -------------------------------------------------------------------- */
.uniform-row-height {
    height: 60px;
}

.header-text-centered {
    text-align: center; /* Centra il testo orizzontalmente */
    vertical-align: middle; /* Centra il testo verticalmente */
}

/* -------------------------------------------------------------------- */
/* Attachments                                                          */
/* -------------------------------------------------------------------- */
.dropzone {
    border: 2px dashed var(--dark-grey);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: var(--white);
    color: #444;
    cursor: pointer;
    position: relative;
}

    .dropzone:hover {
        background-color: var(--grey);
    }

    .dropzone input[type=file] {
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0;
        padding: 3em;
        cursor: pointer;
    }

.dropzone-drag {
    background-color: var(--grey);
}
.overlay-blocker {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.85);
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none; 
    text-align: center;
    padding: 1rem;
}