* {
    box-sizing: border-box;
}
@font-face {
    font-family: "Roboto-Regular";
    src: url(font/Roboto-Regular.ttf);
}

@font-face {
    font-family: "Roboto-bold";
    src: url(font/Roboto-Bold.ttf);
}

/*variabili*/
:root {
    --Grey-Divider: #F2F4F8;
    --Grey-Text-color-default-dark: #121619;
    --Primary-Orange-100: #FDEEE9;
    --Primary-Orange-500: #F26B1A;
    --Secondary-Blue-50: #EAEFFC;
    --Grey-Grey-Stroke: #BABABA;
    --Grey-Button-disable: #C1C7CD;
    --Surface-General-Background: #F2F4F8;
    --CoolGray-20: #DDE1E6;
    --Secondary-Blue-500: #6490DD;
    --Green-300: #75B798;
    --Green-800: #0A3622;
    --sfondo-verde-chiaro: #E0FFD5;
}

ul,
li {
    margin: 0;
    padding: 0;
    list-style: none;
}

h1,
h2,
h3 {
    margin: 0;
    padding: 0
}
h1{
    margin-bottom:5px;
}
p {
    padding: 0;
    margin: 0;
}

a:link,
a:visited,
a:active,
a:hover {
    text-decoration: none;
    color: var(--Grey-Text-color-default-dark);
}
button:focus{
    outline:none;
}
button:focus-visible {
    outline: none;
}
.btn-close:focus{
    box-shadow:none;
}
body {
    margin: 0;
    padding: 0;
    font-family: "Roboto-Regular", sans-serif;
    font-size: 14px;
    font-style: normal;
    line-height: normal;
    background-color: var(--Grey-Divider);
    min-width: 1230px;
    width: 100%;
}
.form-control:focus{
    border:solid 1px var(--Primary-Orange-500);
}
h3 {
    font-size: 16px;
    color: var(--Grey-Text-color-default-dark) !important;
}

main {
    display: flex;
    margin: auto;
    width: 100%;
    height: 100%;
}

header {
    max-width: 264px;
    width: 100%;
    padding: 16px 24px;
    background-color: #fff;
    position: fixed;
    height: 100%;
    /*overflow-y:auto;*/
}

.contenuto {
    width: 100%;
    padding: 24px;
    background-color: var(--Grey-Divider);
    padding-left: 300px;
}

.logo {
    width: 110px;
    margin-bottom: 24px;
}

.menu a, .menu label {
    display: flex;
    align-items: center;
    padding: 12px 8px;
    border-bottom: 1px solid var(--Grey-Divider);
    color: var(--Grey-Text-color-default-dark);
    text-decoration: none;
    font-family: "Roboto-Regular", sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

    .menu a:hover {
        background-color: var(--Primary-Orange-100);
    }

.menu img {
    margin-right: 5px;
}

.freccia {
    margin-left: 30px;
}

.sottomenu a, .sottomenu label {
    padding-left: 40px;
}

.active {
    background-color: var(--Primary-Orange-100);
    font-family: "Roboto-bold";
}

h1 {
    font-family: "Roboto-bold";
    font-size: 32px;
    font-style: normal;
    line-height: normal;
}

input,
select {
    padding: 11px 16px;
    align-items: center;
    border-radius: 6px;
    border: 1px solid #DEE2E6;
    font-family: "Roboto-Regular", sans-serif;
    width: 100%;
}
select option:hover{
    background-color:var(--Primary-Orange-500);
}

    input[type=checkbox] {
        width: 16px;
        height: 16px;
    }
    input[type=radio] {
        width: 16px;
        height: 16px;
    }
.form-control:focus {
    box-shadow: none;
    outline:none;
}
    input:focus{
        outline:none;
        border:1px solid var(--Primary-Orange-500);
    }
.cerca {
    width: 240px;
    background-image: url(../img/icona-search.svg);
    background-repeat: no-repeat;
    background-position: 16px;
    padding-left: 46px;
    height: 42px;
}

::placeholder {
    color: var(--Grey-Grey-Stroke);
}

.filtri {
    height: 40px;
    padding: 10px 16px;
    border-radius: 6px;
    background-color: var(--Primary-Orange-500);
    border: 0;
    color: #fff !important;
    text-decoration:none;
    cursor:pointer;
}

.bottone-nuovo-cliente {
    padding-top: 12px;
}

.wrap-account {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}
.table-container {
    overflow-x: auto; /* Enables horizontal scrolling */
    white-space: nowrap; /* Prevents content from wrapping */
}
table {
    width: 100%;
    margin-top: 24px;
}

th {
    background-color: var(--Secondary-Blue-50);
    padding: 14px 12px;
    border-top: 1px solid var(--Grey-Divider);
    text-align: left;
}
th a {
    display:inline !important;
    cursor:pointer;
}
th img{
    margin-left:5px;
    display:inline;
}
table input {
    padding: 9px 16px;
}

td {
    padding: 12px;
    border-top: 1px solid var(--Grey-Divider);
   /* vertical-align: top;*/
}
a {
 cursor:pointer;
}
td img{
    cursor:pointer;
}
table input {
    display: block;
}

table ul li input[type='checkbox'] {
  /*  width: 18px;
    height: 18px;*/
    padding: 0;
    margin-right:5px;
}
table ul li input[type='radio'] {
    /*  width: 18px;
    height: 18px;*/
    padding: 0;
    margin-right: 5px;
}
table ul li{
    display:flex;
    align-items:center;
    margin-bottom:5px;
}
table {
    border-spacing: 0;
    border-collapse: collapse;
    background-color: #fff;
}

.check-mini {
    max-width: 70px;
}

table a {
    color: var(--Primary-Orange-500) !important;
    /*display: block;*/
}

input[type="checkbox"] {
    position: relative;
    accent-color: var(--Primary-Orange-500);
}
input[type="radio"] {
    position: relative;
    accent-color: var(--Primary-Orange-500);
}
.checkbox-partial {
    accent-color: var(--Grey-Text-color-default-dark) !important;
}

table input[type="text"],
table select {
    min-width: 135px;
}





.paginazione {
    text-align: center;
    margin-top: 24px;
}

    .paginazione ul li {
        display: inline-block;
        border-radius: 4px;
        border: 1px solid var(--Grey-Grey-Stroke);
        cursor:pointer;
        margin: 0 2px;
    }

    .paginazione a {
        display: block;
        text-decoration: none;
        padding: 12px 16px;
        color: var(--Grey-Text-color-default-dark);
    }

        .paginazione a:hover {
            color: #fff !important;
            background-color: var(--Primary-Orange-500);
        }

    .paginazione .attivo {
        color: #fff;
        background-color: var(--Primary-Orange-500);
    }

    .paginazione .disabilitato, .paginazione .disabilitato:hover {
        color: var(--Grey-Button-disable) !important;
        background-color: transparent !important;
        cursor: default;
    }

table img {
    margin-top: -3px;
}

.sfondo-overlayer {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(242, 244, 248, 0.6);
    z-index: 100;
    display: none;
}

.drawer {
    width: 450px;
    height: 850px;
    background-color: #fff;
    position: absolute;
    top: 0;
    right: 0;
    padding: 40px;
    z-index: 200;
    border: 1px solid var(--CoolGray-20);
    overflow: hidden;
    overflow-y: scroll;
}


    .drawer a {
        display: block;
        text-align: right;
    }

.cerca-drawer {
    width: 100%;
    margin-top: 24px;
}

.seleziona-tariffe {
    font-size: 18px;
    font-family: "Roboto-bold";
    margin-top: 40px;
    margin-bottom: 5px;
}

.drawer-tariffe {
    position: absolute;
    height: 540px;
    width: 370px;
    padding-right: 20px;
    overflow: hidden;
    overflow-y: scroll;
}

    .drawer-tariffe::-webkit-scrollbar {
        width: 5px;
        background-color: #fff;
    }

    .drawer-tariffe::-webkit-scrollbar-thumb {
        background: var(--Secondary-Blue-500);
        border-radius: 5px;
    }

    .drawer-tariffe span {
        display: block;
    }

    .drawer-tariffe input {
        width: 16px;
        height: 16px;
        margin-right: 10px;
    }

    .drawer-tariffe li {
        display: flex;
        align-items: center;
        padding: 12px;
        border-top: 1px solid var(--Grey-Divider);
        background-color: #fdeee9;
        /* Da chiarire con Chriss il colore corretto */
    }

    .drawer-tariffe span {
        border-top: 1px solid var(--Grey-Divider);
        background: var(--Secondary-Blue-50);
        padding: 12px 12px 12px 40px;
        margin-top: 24px;
    }

.drawer-disabilitato {
    background-color: #fff !important;
}

    .drawer-disabilitato input {
        border-radius: 50%;
        border: 1px solid red
    }

.drawer-pulsanti {
    display: flex;
    margin-top: 564px;
    align-items: center;
    justify-content: center;
    gap: 16px
}

.pulsante-annulla {
    padding: 10px 16px;
    text-align: center;
    font-size: 16px;
    font-style: normal;

    color: var(--Primary-Orange-500) !important;
    border-radius: 6px;
    border: 1px solid var(--Primary-Orange-500);
    text-align: center;
    text-decoration:none;
    cursor:pointer;
}

.pulsante-aggiungi-tariffa {
    padding: 10px 16px;
    text-align: center;
    border-radius: 6px;
    opacity: 0.55;
    background: var(--Grey-Button-disable);
    font-size: 16px;
    color: var(--Grey-Button-disable);

}

.cerca-home {
    min-width: 400px;
}

.errore {
    text-align: left;
    display: block;
    color: red;
    margin-top: 5px;
}

table input[type="checkbox"] {
    display: inline;
}
table input[type="radio"] {
    display: inline;
}
.centro {
    text-align: center;
}

td ul {
    display: none;
}

.drawerApri {
    display: block;
}

/*modal*/
/* eliminato
.modal-dialog {
    position: fixed;
    margin: auto;
    width: 320px;
    height: 100%;
    right: 0px;
}
    */

.modal-content {
    height: 100%;
}

.blocco-contenuto {
    background-color: #fff;
    /*padding: 24px;*/
    padding: 6px;
    /*margin-bottom: 24px;*/
    margin-bottom: 6px;
}

h2 {
    font-size: 18px;
    font-family: "Roboto-bold";
    margin-bottom: 4px;
}

.dati-clienti-form {
    display: flex;
    margin-top: 24px;
    margin-bottom: 24px;
}

label {
    font-weight: normal;
}

.dati-clienti-form span {
    color: var(--Grey-Button-disable);
    display: block;
    margin-top: 5px;
    font-size: 12px;
}

.margin-right-16 {
    margin-right: 16px;
}

.anagrafica-clienti {
    border: 1px solid var(--Grey-Divider);
    padding: 16px;
}

.form-parametri > div {
    width: 100%;
    margin-right: 16px;
}

.input-arrow-rx {
    background-image: url(../img/icona-freccia-giu.svg);
    background-repeat: no-repeat;
    background-position: right;
}

.check-box-label {
    display: flex;
    align-items: center;
}

    .check-box-label input {
        margin-top: 0;
        margin-right: 4px;
    }

.dettaglio-clienti-pulsanti {
    margin-top: 0px;
    justify-content: right;
}

.logo-footer {
/*    display: flex;
    align-items: center;
    justify-content: space-between;*/
    text-align:right;
    padding-right:150px;
    background-color:var(--Grey-Divider);
}

.wrap-dettaglio-cliente {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pulsante-elimina {
    background-color: #ff0000;
    color: #fff !important;
}

.wrap-nuovo-cliente {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nuovo-cliente-overlayer {
    position: relative;
}

.overlayer {
    width: 200px;
    height: 130px;
    background-color: #fff;
    position: absolute;
    left: -80px;
    top: 26px;
    z-index: 1000;
    /*display: none;*/
    border-radius: 6px;
    border: 1px solid #DEE2E6;
}

    .overlayer span {
        color: #ABB5BE;
        display: block;
        padding: 12px;
    }

    .overlayer a {
        display: block;
        padding: 12px;
    }

        .overlayer a:hover {
            background-color: var(--Primary-Orange-500);
            color: #fff;
        }

.input-arrow-Dropdwon {
    background-image: url(../img/icona-freccia-dropdwon.svg);
    background-repeat: no-repeat;
    background-position: right;
}

.nuovo-cliente-copia > div {
    width: 100%;
}

.form-drawer-anagrafica > div {
    width: 100%;
}

.align-right {
    text-align: right;
}

.text-normal {
    font-weight: normal;
    margin-top: 5px;
}

.no-bordo {
    border: 0;
}

.body-drawer-grafica {
    border: 1px solid var(--Grey-Divider);
    padding: 20px 20px 0 20px;
    border-radius: 6px;
}

.pulsate-drawer-anagrafica {
    margin-top: 40px;
}

.margin-top-30 {
    margin-top: 30%;
}

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

.mostra-tariffe{
    margin:15px 0;
}

/*Parzialmente Responsive*/
@media screen and (max-width: 1430px) {
    table a {
        margin-top: 3px;
    }

    table img {
        margin-top: 0px;
    }
}

@media screen and (max-width: 1240px) {
    table input {
        width: 100%;
        min-width: 50px;
    }


}
/* aggiunto in data 27/03/2025 */
:root {
    --Primary-Orange-100: #FDEEE9;
    --Primary-Orange-600: #B85011;
    --Secondary-Blue-600: #456CAB;
    --bassa-stagione: #B81111;
    --promo-25: #11B830;
    --promo-50: #B8119F;
    --Grey-text: #757575;
}

h1 {
    display: flex;
    align-items: center;
}

    h1 span {
        background-color: var(--Primary-Orange-100);
        height: 40px;
        width: 40px;
        justify-content: center;
        align-items: center;
        display: flex;
        margin-right: 16px;
    }

.gruppo-calendario {
    margin-top: 16px;
}

.interruttore > span {
    margin-right: 5px;
}

.interruttore {
    margin: 30px 0;
}

/* Switch */
.switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: auto;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 12px;
        width: 12px;
        left: 1px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
        top: 2px
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

/* Fine Switch */
.calendario-legenda p {
    background-color: var(--Secondary-Blue-50);
    font-family: "Roboto-bold";
    padding: 16px 12px;
}

.calendario-legenda li {
    font-family: "Roboto-bold";
    padding: 16px 12px;
    border-bottom: 1px solid var(--Grey-Divider);
    display: flex;
    justify-content: space-between;
}

.calendario-legenda img {
    margin-left: 10px;
}

input[type=radio] {
    width: auto;
}

.seleziona-giornata {
    min-width: 450px;
}

.gruppo-calendario {
    display: flex;
    gap: 16px;
}

    .gruppo-calendario > div {
        border: 1px solid var(--Grey-Divider);
        padding: 16px 16px 0 16px;
    }

    .gruppo-calendario input[type=radio] {
        accent-color: var(--Primary-Orange-500);
        width: 16px;
        height: 16px;
        margin-right: 25px;
        margin-top: 0;
    }

    .gruppo-calendario li > div {
        display: flex;
        align-items: center;
    }

    .gruppo-calendario li label {
        margin: 0;
        font-family: "Roboto-Regular", sans-serif;
    }

.legenda-attiva {
    background-color: var(--Primary-Orange-100);
}

    .legenda-attiva label {
        font-family: "Roboto-bold", sans-serif !important;
    }

.calendario-legenda li span {
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.colore-promotional-easy {
    background-color: var(--Primary-Orange-600);
}

.colore-alta-stagione {
    background-color: var(--Secondary-Blue-600);
}

.colore-bassa-stagione {
    background-color: var(--bassa-stagione);
}

.colore-promo-25 {
    background-color: var(--promo-25);
}

.colore-promo-50 {
    background-color: var(--promo-50);
}

.associa-le-giornata {
    width: 100%;
}

.gruppo-associa-le-giornata {
    display: flex;
}

    .gruppo-associa-le-giornata > div {
        width: 50%;
    }

.mese-seleziona {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 26px;
    font-family: "Roboto-bold";
    font-size: 18px;
}

    .mese-seleziona a {
        text-decoration: underline;
        color: var(--Primary-Orange-500);
        font-size: 14px;
        display:inline;
    }

.tabella-calendario {
    margin-top: 17px;
}

    .tabella-calendario th {
        background-color: #fff;
        border-top: 0;
        border-bottom: 1px solid var(--Grey-Divider);
        font-family: "Roboto-Regular";
        color: var(--Grey-text);
    }
    .tabella-calendario th a {
        background-color: #fff;
        border-top: 0;
        border-bottom: 1px solid var(--Grey-Divider);
        font-family: "Roboto-Regular";
        color: var(--Grey-text) !important;
        cursor: pointer;
    }

    .tabella-calendario td {
        color: #fff;
    }

    .tabella-calendario tr {
        border-bottom: 10px solid #fff;
    }

.giorni-bordo {
    padding: 0;
}

    .giorni-bordo div {
        height: 1px;
        background-color: var(--Grey-Divider);
        ;
    }

.giornate-utilizzate {
    margin: 11px 0 20px 20px;
    border: 1px solid var(--Grey-Divider);
    padding: 16px 16px 0 16px;
}

.giornate-utilizzate-legenda li span {
    width: 16px;
    height: 16px;
}

.no-bordo {
    border: 0 !important;
}

.pulsano-creazione-calendario {
    background-color: var(--Green-300);
    font-size: 12px;
    color: var(--Green-800);
    padding: 16px;
    border-radius: 6px;
    z-index: 100;
    position: absolute;
    right: 0;
}

    .pulsano-creazione-calendario img {
        margin-left: 10px;
    }


/* Css contratti del 02/04/2025 */
:root {
    --Primary-Orange-200: #FEDAD2;
    --Sfondo-Cestino: #FFD2D2;
    --Green-numerico: #00FF88;
    --Sfondo-giallo: #FFD000;
    --Sfondo-viola: #DE4BAC;
    --Sfondo-grigio: #ddd;
    --Sfondo-rosso: #FF0000 /*#FFD2D2*/;
    --Sfondo-verde: #00FF88;
    --Secondary-Blue-900: #182A47;
    --Secondary-Light: #ABB5BE;
}

.intestazione-contratti {
    display: flex;
    gap: 16px;
    align-items: start;
}

    .intestazione-contratti label {
        display: block;
    }

    .intestazione-contratti input,
    .intestazione-contratti select {
        width: 250px;
    }

.wrap-tipologia ul {
    display: flex;
}

    .wrap-tipologia ul li {
        margin-left: 8px;
        padding: 8px 16px;
        border: 1px solid var(--Grey-Button-disable);
        border-radius: 5px;
        cursor: pointer;
        line-height: 0;
        display: flex;
        align-items: center;
        gap: 10px;
    }

.wrap-tipologia .attivo {
    background-color: var(--Primary-Orange-200);
    font-family: "Roboto-bold";
}

.wrap-tipologia {
    background-color: transparent;
    padding: 0;
    display: flex;
    justify-content: space-between;
}

.wrap-tipologia-piu {
    background-color: var(--Primary-Orange-500);
    border: 0 !important;
}

.sfondo-promo {
    background: rgb(242, 244, 248);
    background: linear-gradient(90deg, rgba(242, 244, 248, 1) 80%, rgba(0, 0, 0, 0.4) 100%);
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-right: 0 !important;
}

.elenco-prodotti {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    width: 100%;
    /*margin-bottom: 20px;*/ /* tolto perchè nei prodotti dei contratti serve spazio */
    position: relative;
    /*border-bottom: 1px solid var(--Grey-Divider);
    border-bottom: 1px solid var(--CoolGray-20);*/
}

.elenco-prodotti-interno {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    /*margin-top:15px;*/
    background-color:floralwhite;
    border-radius: 18px;
    padding: 15px;
}
    .elenco-prodotti-interno > div {
        width: 20%;
        margin-bottom: 20px;
    }
    .elenco-prodotti-interno select {
       margin-top:-8px
    }

.elenco-prodotti-cliente {
    width: 24% !important;
    position: relative;
}

.nascondi {
    display: none
}
.valore-prodotti-container-oggetti {
    width: 68%;
    overflow-x: auto;
}
.valore-prodotti-container {
    width:68%;
    overflow-x:auto;
}
.valore-prodotti {
    display: flex;
    gap: 8px;
    width: 64%;
    margin-bottom: 2px;
}

    .valore-prodotti li {
        /* min-width: 48px;
       width: 100%;*/
        position: relative;
        /*width: auto;
        width: 60px;*/
    }

strong {
    font-family: "Roboto-bold";
}

.strong {
    font-family: "Roboto-bold";
}

.color-grey-text {
    color: var(--Grey-text);
}

.blocco-prodotti input[type=radio] {
    accent-color: var(--Primary-Orange-500);
    width: 16px;
    height: 16px;
    margin-top: 0;
}

.campi-prodotti {
    display: flex;
    gap: 6px;
    position: relative;
}

.radio-sconto {
    width: 60px;
    height: 30px;
    position: absolute;
    top: -6px;
    left: 80px;
    display: block;
}

.cestino-frecce {
    position: absolute;
    /*right: 15px;*/
    right: 30px;
    /*top: 3px;*/
    top: 16px;
    width: 55px !important;
    display: flex;
    gap: 6px;
}

.gruppo-numero-freccia-contratto {
    /*display: flex;*/
    justify-content: space-between;
    /* margin-bottom: 5px;*/
    position: absolute;
    top: -3px;
    right: -7px;
    font-size: 10px;
    color: #0A3622;
    font-weight: bolder;
}
.gruppo-numero-freccia {
    display: flex;
    justify-content: space-between;
    /* margin-bottom: 5px;*/
}

    .gruppo-numero-freccia img {
        width: 15px;
    }

.valore-numerico {
   
    border-radius: 6px;
    font-family: "Roboto-Bold";
    line-height: 24px;
    text-align: center;
    border: 1px solid var(--Grey-Button-disable);
    padding: 0;
    width:55px;
}

.nessun-prezzo {
    background-color: white;
}

.sfondo-giallo {
    background-color: var(--Sfondo-giallo);
    font-family: "Roboto-bold";
}
.sfondo-viola {
    background-color: var(--Sfondo-viola);
    font-family: "Roboto-bold";
}
.sfondo-grigio {
    background-color: var(--Sfondo-grigio);
    font-family: "Roboto-bold";
}
.sfondo-rosso {
    background-color: var(--Sfondo-rosso);
    font-family: "Roboto-bold";
}
.sfondo-verde {
    background-color: var(--Green-numerico) !important;
    font-family: "Roboto-bold";
}
.sfondo-verde-chiaro {
    background-color: var(--sfondo-verde-chiaro) !important;
}

.sfondo-arancione {
    background-color: var(--Primary-Orange-100);
    font-family: "Roboto-bold";
}

.codice-prodotto {
    width: 180px;
    padding: 8px 6px 8px 14px;
    border-radius: 4px;
    position: absolute;
    color: #fff;
    right: -130px;
    top: 10px;
    background-image: url(../img/tooltip.svg);
    display: none;
    z-index: 999;
}

.elenco-prodotti-cliente:hover .codice-prodotto {
    display: block;
}

.modifica-prezzo {
    display: block;
    position: absolute;
    width: 164px;
    border-radius: 8px;
    border: 1px solid var(--Grey-Divider);
    background-color: #fff;
    left: -20px;
    z-index:100;

}

    .modifica-prezzo li {
        padding: 12px 16px;
        display: flex;
        gap: 8px;
        border-bottom: 1px solid var(--Grey-Divider);
        align-items: center;
        width:100%;
    }

    .modifica-prezzo .attivo {
        background-color: var(--Primary-Orange-100);
        font-family: "Roboto-bold";
        width: 100%;
    }

.modifica-prezzo-titolo {
    font-size: 12px;
    color: var(--Secondary-Light);
    text-transform: uppercase;
    text-align: center;
}

.img-freccia {
    cursor: pointer;
}

/* Nuovo CSS del 14/04/2024 */


.modifica-prezzo input {
    height: auto;
}

.dati-oggetto {
    align-items: center;
    gap: 16px;
    position: relative;
}

    .dati-oggetto div {
        width: 300px;
    }

.oggetto-valori-fisso {
    width: 10% !important;
}

.align-right {
    text-align: right;
}

.fascia-tassazione {
    position: absolute;
    bottom: 0;
    right: 0px;
    width: auto !important;
    top: 20px;
}

.gruppo-validita {
    display: flex;
    gap: 16px;
}

    .gruppo-validita p {
        display: flex;
        gap: 16px;
    }

    .gruppo-validita label {
        display: block;
        margin-top: 3px;
    }

.freccia-su-oggetto {
    position: absolute;
    top: 20px;
    right: 28px;
}

.relative {
    position: relative;
}

.margin-bottom-30 {
    margin-bottom: 30px;
}

.oggetto-dettagli {
    background-color: var(--Secondary-Blue-50);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    width: 100px !important;
    /*height: 60px !important;*/
    margin-right: 25px;
    margin-bottom:2px;
    font-family: "Roboto-bold";
}

.bottone-piu {
    margin:10px;
    /*height: 40px;*/
    height: 27px;
}

.freccia-oggetto {
    margin-right: 16px;
}

.freccia-oggetto-aggiungi {
    width: 200px !important;
    margin-right: -28px;
    top: 20px;
}

.sfondo-bianco {
    background-color: #fff;
}

.body-drawer-grafica {
    border: 1px solid var(--Grey-Divider);
    padding: 20px;
    border-radius: 6px;
}

.seleziona-prodotto {
    margin-bottom: 20px;
}

.input-100 {
    width: 100%;
}

.domini-attivita {
    display: flex;
    gap: 16px;
    margin-top: 30px;
}

    .domini-attivita div {
        width: 25%;
    }

    .domini-attivita label {
        margin-bottom: 5px;
    }

.wrap-nome-famiglia {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; 
}

    .wrap-nome-famiglia div {
        width: 30%;
        border-bottom: 1px solid var(--Grey-Divider);
        padding: 10px 20px;
    }

    .wrap-nome-famiglia p {
        display: flex;
        align-items: center;
    }

    .wrap-nome-famiglia div label {
        margin-left: 20px;
    }

.wrap-nome-prodotto {
    padding: 20px 52px;
    background-color: var(--Grey-Grey-Stroke);
    font-family: "Roboto-bold";
    margin-top: 30px;
}

.wrap-nome-famiglia ul li {
    /*padding: 20px*/
    padding: 6px
}

.wrap-nome-famiglia ul {
    margin-bottom: -10px;
    margin-left: 30px;
    margin-left: 30px;
}

.bg-orange-200 {
    background-color: var(--Primary-Orange-200);
}

.avvolgitore-scroll {
    max-height: 500px;
    overflow-y: auto;
}

.wrap-nome-famiglia ul li {
    display: flex;
}

.wrap-nome-famiglia span {
    margin-left: 10px;
}

.breadcrumbs {
    font-size: 14px;
    color: var(--Grey-text);
    margin-bottom: 30px;
    padding-left: 20px;
}

.breadcrumbs-attivo {
    color: var(--Primary-Orange-500);
    font-family: "Roboto-bold";
}

.gruppo-stagioni {
    margin-top: 25px;
    margin-bottom: 25px;
}

.link-stagioni-attiva {
    font-family: "Roboto-bold";
    background-color: var(--Primary-Orange-200);
    color: var(--Grey-Text-color-default-dark) !important;
}

.link-stagioni {
    background-color: #fff;
    color: var(--Grey-Text-color-default-dark) !important;
    border: 1px solid var(--Grey-Divider);
}

.max-width {
    width: 70%;
}

.top40 {
    top: 40px;
}

.width30 {
    width: 30% !important;
}

.width70 {
    width: 70% !important;
}

.gruppo-fascia-orario {
    display: flex;
    gap: 16px;
}

.link-aggiungi-fascia {
    display: inline-block;
}

.gruppo-valore-fisso {
    margin-top: -22px;
    width: 170px;
}

    .gruppo-valore-fisso p {
        padding-bottom: 21px;
    }

.fasce-di-interdizione {
    font-family: "Roboto-bold";
    background-color: var(--Secondary-Blue-50);
    line-height: 36px;
    padding-left: 16px;
}

.lista-fasce-interdizione {
    margin-top: 16px;
    margin-left: 5px;
}

    .lista-fasce-interdizione li {
        padding-bottom: 20px;
        padding-top: 20px;
        display: flex;
        align-items: center;
        border-bottom: 1px solid var(--Grey-Divider);
        width: 500px;
    }

        .lista-fasce-interdizione li img {
            margin-left: 26px;
        }

.calendario-oggetto {
    border: 1px solid var(--Grey-Divider);
    margin-top: 11px;
    padding: 20px 20px 0 20px;
}

.dettaglio-del-prodotto div {
    width: 100%;
}

.tag-associati {
    width: auto;
    height: 35px;
    background-color: var(--Primary-Orange-100);
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding:5px 10px;
}

    .tag-associati label, .tag-associati input {
        margin: 0;
        color: var(--Primary-Orange-500);
        font-weight: bold;
    }

.wrap-tag-associati {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 30px;
    width: 90%;
}

.relative {
    position: relative;
}

.link-tag-associati {
    bottom: 25px;
    top: auto;
}

.tipologia-clienti {
    margin: 25px 0;
    display: flex;
    gap: 8px;
}

    .tipologia-clienti li {
        height: 35px;
        min-width: 65px;
        border-radius: 8px;
        background-color: var(--Sfondo-tipologia-clienti);
        display: flex;
        justify-content: center;
        align-items: center;
        font-weight: bold;
        padding:0 8px;
    }

.prodotto-larghezza {
    width: 265px;
}

.prodotto-elimina {
    text-align: right;
}

.codice-dettaglio-prodotto {
    width: 180px;
    height:100%;
    min-height:50px;
    padding: 8px 16px 8px 14px;
    border-radius: 4px;
    position: absolute;
    color: #fff;
    right: -90px;
    top: 0px;
    z-index: 99999;
    background-color: var(--Secondary-Blue-900);
    display:none;
}

.codice-tooltip {
    width: 10px;
    height: 32px;
    background-image: url(/img/codice-toltip.png);
    left: -6px;
    top: 0;
    position: absolute;
}

.link-salva-oggetto {
    box-shadow: 5px 5px 38px 0px #8C8C8C;
    right: 0;
}

.center {
    text-align: center;
}

.pd-bottom-5 {
    padding-bottom: 5px;
}

.campo-obbligatorio {
    color: var(--Grey-Button-disable);
    display: block;
    margin-top: 5px;
}

.tag-esistenti {
    margin-top: 30px;
}

.flex {
    display: flex;
    gap: 8px;
    width: 100%;
    align-items: center;
}

.tag-associati-disattivi {
    background-color: transparent;
    border: 1px solid var(--Grey-Text-color-default-dark);
}

    .tag-associati-disattivi label {
        color: var(--Grey-Text-color-default-dark);
        font-weight: normal;
    }

.link-tag {
    background-color: var(--Primary-Orange-500);
    opacity: 1;
    color: #fff !important;
}

/* switch inizio */
.form-switch .form-check-input:checked {
    background-color: var(--Primary-Orange-500);
    border-color:#ddd;
}


.form-switch .form-check-input:focus {
    box-shadow: none;
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e);
    border-color: #ddd;
}

/* Sfera grigia #ddd quando DISATTIVATO (anche al focus) */
.form-switch .form-check-input:not(:checked) ~ .form-check-label::after {
    background-color: #ddd !important;
    border-color: #ddd;
}

/* Focus mantiene lo stesso colore grigio #ddd */
.form-switch .form-check-input:not(:checked):focus ~ .form-check-label::before {
    background-color: #ddd !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ddd'/%3e%3c/svg%3e");
    border-color: #ddd;
}
.form-switch .form-check-input:focus {
    box-shadow: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ddd'/%3e%3c/svg%3e");
    border-color: #ddd;
}
/* Sfera gialla quando ATTIVATO (anche al focus) */
/*.form-switch .form-check-input:checked ~ .form-check-label::after {
    background-color: #ffc107 !important;
    border-color: #ddd;
}*/

/* Focus attivo mantiene giallo */
/*.form-switch .form-check-input:checked:focus ~ .form-check-label::before {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
    border-color: #ddd;
}*/
/* switch fine */