*{
    box-sizing: border-box;
    color: var(--testo-default);
    font-size: var(--regular);
    font-weight: 400;
    font-family: 'Archivo', sans-serif;
}

.logo-login{display: none;}


.logo{
    /* position: fixed;
    top: 1%;
    left: 1%;
    z-index: 0; */
}
.logo img{
    max-width: 120px;

}

html,body{
    margin:0;
    padding:0;
    background: var(--bg-default);
}


@media screen and (max-width:979px) {
    .no-mobile-tabella,
    .desktop{
        display:none
    }

}

@media screen and (min-width:980px) {
    .mobile{
        display:none;
    }
}


:root{
    --bg-default:#F8F8F8;

    --ordini:#19A97B;
    --prodotti:#6FCF97;
    --btn-globali:#333333;
    --utenti:#2F80ED;
    --classi:#99CCFF;
    --salva:#6FCF97;
    --bordo:#4F4F4F;
    --rosso:#EB5757;
    --grigio:#F2F2F2;
    --bianco:#fff;
    --nero:#000;

    --testo-default:#52555B;
    --testo-bianco:#FFFFFF;
    --testo-grigio:var(--bordo);
    --testo-blu:#2F80ED;
    --testo-verde:var(--ordini);
    --testo-verde-chiaro:var(--prodotti);

    --margine-s:15px;
    --margine-m:30px;
    --margine-l:60px;
    --margine-xl:100px;

    --h1:48px;
    --h2:36px;
    /* edited */
    --h3:16px;
    --h4:16px;
    --regular:14px;
    --mini-title:12px;
    --mini-title-regular:12px;
    --xxs-title:8px;
    --tabella-testo-xxl:10px;
    --titolo-tabella:14px;
}


 /*** Responsive Styles Tablet Only ***/
 @media all and (min-width: 768px) and (max-width: 980px) {

}

/*** Responsive Styles Tablet And Below ***/
@media all and (max-width: 980px) {
}

@media all and (min-width:981px){
    :root{
        --h1:48px;
        --h2:36px;
        --h3:24px;
        --h4:20px;
        --regular:16px;
        --mini-title:12px;
        --mini-title-regular:12px;
        --xxs-title:8px;
        --tabella-testo-xxl:10px;
        --titolo-tabella:14px;
    }
}

/*** Responsive Styles Tablet And Below ***/
@media all and (min-width: 980px) {}

/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 1100px) and (max-width: 1405px) {}

/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1405px) {}



.verde{
    color: var(--testo-verde);
}

.verde-chiaro{
    color: var(--testo-verde-chiaro);
}

.blu{
    color: var(--testo-blu);
}

.rosso{
    color: var(--rosso);
}

.bianco{
    color:var(--bianco)
}

/* testi */

.h1,
.h2,
.h3,
.h4,
.h5,
.h6{
    margin:0;
}

.h1{
    font-size: var(--h1);
    font-weight: 600;
}

.h2{
    font-size: var(--h2);
    font-weight: 600;
}

.h3{
    font-size: var(--h3);
    font-weight: 600;
}

.h4{
    font-size: var(--h4);
    font-weight: 500;
}

.regular{
    font-size: var(--regular);
    font-weight: 400;
}

.mini-title{
    font-size: var(--mini-title);
    font-weight: 500;
}

.mini-title-regular{
    font-size: var(--mini-title);
    font-weight: 400;
}

.xxs-title{
    font-size: var(--xxs-title);
    font-weight: 600;
}

.xxs-title-regular{
    font-size: var(--xxs-title);
    font-weight: 400;
}

.tabella-xxl{
    font-size: 10px;
    font-weight: 400;
}

.titolo-tabella{
    font-size: var(--titolo-tabella);
    font-size:var(--mini-title);
    font-weight: 600;
}

.titolo-tabella-regular{
    font-size: var(--titolo-tabella);
    font-weight: 400;
}


/* margini */

.s-top{
    margin-top:var(--margine-s);
}

.s-bottom{
    margin-bottom:var(--margine-s);
}

.m-top{
    margin-top:var(--margine-m);
}

.m-bottom{
    margin-bottom:var(--margine-m);
}

.l-top{
    margin-top:var(--margine-l);
}

.l-bottom{
    margin-bottom:var(--margine-l);
}

.xl-top{
    margin-top:var(--margine-xl);
}

.xl-bottom{
    margin-bottom:var(--margine-xl);
}


/* info pagina */
.info-pagina-titolo{
    display: flex;
    align-items: center;
}

/* button btn default */

.btn-icona{
    border:none!important;
    background: none!important;
}

@media screen and (max-width:980px) {
    a.btn.btn-ordini.btn-doppio{
        line-height: 2.8em!important;
    }
}

.btn{
    border-radius: 50px;
    line-height: 2.8em;
    padding: 0 var(--margine-m);
    color: var(--testo-default);
    background: transparent;
    border:1px solid var(--bordo);
    transition: .3s ease-out;
    width:100%
}

.btn-verde{
    background: var(--ordini);
    color:var(--testo-bianco);
    font-size: var(--regular);
    border:none;
}

.btn-indietro{
    background:var(--rosso);
    color:var(--bianco);
    font-size: var(--regular);
    border:none;
}

.btn-verde:hover{
    background: var(--ordini);
    filter: brightness(1.1);
    color: var(--testo-bianco);
}


.btn-modifica{
    border-radius: 10px;
    padding: .1em .5em;
    line-height: 2em;
}


.btn-modifica:hover{
    background: var(--bordo)!important;
    color: var(--testo-bianco);
}

.btn-bianco{
    background: var(--bianco);
    color: var(--testo-default);
    border: none;
}

.btn-bianco:hover{
    filter: brightness(.8);
    background: var(--bianco);
    color: var(--testo-default);
}

.btn-bianco-outline{
    border:1px solid var(--bianco);
    color: var(--bianco);
    background: none;
}

.btn-bianco-outline:hover{
    filter: brightness(.8);
    background: var(--bianco);
    color: var(--testo-default);
}


.btn-grigio-outline{
    border:1px solid var(--btn-globali);
    color: var(--btn-globali);
    background: none;
}

.btn-grigio-outline:hover{
    filter: brightness(.8);
    background: var(--bianco);
    color: var(--testo-default);
}

.btn-ordini,
.btn-prodotti,
.btn-utenti-classi,
.btn-classi,
.btn-modifica-2,
.btn-globale{
    width: 100%;
    padding: 0;
    line-height: 2.3em;
    border:none!important;
}

.btn-ordini *,
.btn-prodotti *,
.btn-utenti-classi *,
.btn-classi *,
.btn-globale *,
.btn-indietro,
.btn-indietro *{
    color:var(--testo-bianco);
}



.btn-modifica-2{
    background: none;
}

.btn-modifica-2 *{
    color:var(--testo-blu);
}


@media screen and (min-width:980px) {

    .btn{
        padding:0 var(--margine-l);
    }

    .sub-col-panoramica-classe .btn,
    .sub-col-panoramica-utente .btn{
        padding: 0 var(--margine-s);
    }

    .btn-indietro{
        background: var(--rosso)!important;
    }

    .btn-ordini{
        background: var(--ordini)!important;
    }
    
    .btn-prodotti{
        background: var(--prodotti)!important;
    }
    
    .btn-utenti-classi{
        background: var(--utenti)!important;
    }

    .btn-classi{
        background: var(--classi)!important;
    }

    .btn-globale{
        background: var(--btn-globali)!important;
    }

    .btn-globale:hover{
        background: var(--btn-globali)!important;
        filter: brightness(1.1);
        color: var(--testo-bianco);
    }

    .btn-ordini:hover{
        background: var(--ordini)!important;
        filter: brightness(1.1);
        color: var(--testo-bianco);
    }
    
    .btn-prodotti:hover{
        background: var(--prodotti)!important;
        filter: brightness(1.1);
        color: var(--testo-bianco);
    }  
    
    .btn-utenti-classi:hover{
        background: var(--utenti)!important;
        filter: brightness(1.1);
        color: var(--testo-bianco);
    }

    .btn-classi:hover{
        background: var(--classi)!important;
        filter: brightness(1.1);
        color: var(--testo-bianco);
    }

    .btn-indietro:hover{
        background: var(--rosso)!important;
        filter: brightness(1.1);
        color: var(--testo-bianco);
    }

}


@media screen and (min-width:1400px) {
    .btn{
        padding:0 var(--margine-l);
    }
}


/* <a> */

.chiamata{
    color: var(--testo-default);
}

/* input */

/* input outline */

.input-outline{
    border: none;
    border-bottom: 2px solid var(--bordo);
    border-radius: 0;
    box-shadow: none!important;
}

.form-floating>.floating-form-no-padding:not(:placeholder-shown){
    padding-top: 2rem;
    padding-bottom: .625rem;
}

.floating-form-wrapper>label{
    padding: 1rem 0rem;
}



/* modal */

.modal{
    padding-bottom:200px;
}

.modal-header,
.modal-footer{
    border: none!important;
}

.modal-elimina{
    margin-right: 1%;
    margin-top: 1%;
}

.modal-dialog.modal-elimina .modal-content{
    background: var(--rosso);
}

.modal-pulsanti-gestione{
    position: relative;
    width: fit-content;
    display: flex;
    justify-content: flex-end;
    margin-left: auto;
}

.modal-crea-utente{
    height: fit-content;
    display: flex;
    /* align-items: center; */
    min-height: fit-content;
    padding-bottom:300px
}


/* ISTITUTI */

.accordion-header{
    padding: 0 1.25rem;
    position: relative;
    display: flex;
    align-items: center;
}

.gestione-istituto{
    position: absolute;
    display: flex;
    align-items:center;
    right: 0;  
}

.nome-istituto,.freccia-istituto{
    width: fit-content;
    box-shadow: none!important;
    background: none!important;
}

.nome-istituto{
    top:5px;
    padding:1rem 0rem;
}

.nome-istituto:after{
    display:none!important;
}

.freccia-istituto{
    width:fit-content;
    background: none;
    box-shadow: none;
}

.istituto-wrapper{
    background: var(--testo-bianco);
    border-radius: 8px!important;
    box-shadow: 0px 0px 4px rgb(0 0 0 / 10%);
    padding: .5em 0em;
}

.accordion-collapse{
    padding: 0.5rem 0px;
}


/* sedi */

.sede-wrapper,
.accordion-header{
    padding:0 .8rem;
}

.sede-opzioni{
    height: fit-content;
    padding: .1rem .2rem;
    background: var(--grigio);
    border-radius: 12px;
}

.sede-opzioni .row{
    position: relative;
    align-items:center;
    height: 100%;
    padding: .3rem;
    width: 100%;
    margin: 0;
}

.col-nome-sede{
    position: relative;
    height: 100%;
    background: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding:.6rem 0;

    /* solo mobile */
    /* margin-bottom:.5rem; */
}

.container-opzioni{
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.btn-doppio{
    border:none;
    padding:0 .1rem;
}

@media screen and (max-width:980px) {
    .btn-doppio{
        border-radius:0!important;
    }
}

.sede-opzioni .btn-doppio .btn-mobile img{
    height:20px
}

.btn-doppio .btn-mobile .btn-mobile-testo,
.help-label{
    color: var(--testo-grigio);
    line-height: 1em;
    font-size: 8px;
    padding:0 .25rem
}

.container-opzioni .btn-doppio .btn-desktop{
    display:none;
}

.accordion-body{
    padding:0
}


.container-opzioni{
    padding-left: .8rem;
    padding-right: 0;
}

.container-opzioni .btn{
    padding: 0;
}

@media screen and (min-width:768px) {
    .container-opzioni{
        padding: 0 4rem;
    }
}

@media all and (min-width:980px){

    .container-opzioni{
        padding:0 3rem!important;
    }
    
    .container-opzioni .btn-doppio .btn-desktop{
        display:block;
    }

    .container-opzioni .btn-doppio .btn-mobile{
        display:none;
    }

    .btn-doppio{
        padding:0 2rem
    }

    .btn-doppio.btn-modifica-2{
        border: 1px solid var(--testo-blu)!important;
    }

}

/* configura sede step 6/6 nuovo istituto */

.configura-sede{
    padding:10px;
    border-radius: 10px;
    background:var(--grigio);
    margin-top:var(--margine-s);
}

/* istituto inserito con successo */

.istituto-inserito-successo-wrapper{
    padding: 2rem;
}

.istituto-inserito-successo-container{
    justify-content: center;
    padding: var(--margine-l) var(--margine-m);
    background: var(--btn-globali);
    border-radius: 10px;
    color:var(--bianco);
}

.istituto-inserito-successo-resoconto-sedi{
    display: flex;
    justify-content: center;
}

.istituto-inserito-successo-resoconto-sedi .btn-modifica{
    background: var(--bianco);
    pointer-events: none;
    width: fit-content!important;
    margin: 0 1vw;
}


/* modifica istituto */


.sedi-attiva-singola,
.manager-attivo-singolo{
    display: flex;
    align-items: center;
}

.btn-sede-attiva{
    border: 1px solid var(--utenti);
    background: var(--btn-globali);
    color: var(--testo-bianco);
    font-size: var(--mini-title);
    text-decoration: none;
    padding: .2rem 1rem;
    border-radius: 50px;
}

.btn-manager-attivo,
.ruolo-utente{
    border: 1px solid var(--utenti);
    background: transparent;
    color: var(--utenti);
    font-size: var(--mini-title);
    text-decoration: none;
    padding: .2rem 1rem;
    border-radius: 50px;
}

.btn-manager-attivo b,
.ruolo-utente b{
    color: var(--utenti);
    font-size: var(--mini-title);
    font-weight: 600;
}


@media screen and (min-width:980px) {

    .istituto-inserito-successo-resoconto-sedi{
        display: flex;
    }
    

}


/* UTENTI */

/* panoramica utenti */
.panoramica-utente-singolo,
.panoramica-classe-singola,
.prodotto-wrapper{
    border-radius: 5px;
    background:var(--bianco);
    padding: 10px 5px;
    margin-top: 10px;
    justify-content: space-between;
    align-items: flex-end;
    width:100%;
}

.panoramica-classe-singola{
    align-items: center;
}

.col-panoramica-utente,
.col-panoramica-classe{
    width: fit-content;
}



.col-panoramica-utente .ruolo-utente{
    width: fit-content;
    margin: auto;
}

.col-panoramica-utente .titolo-tabella{
    font-weight: 500;
}

.col-nome-utente,
.col-nome-classe{
    width: 57%;
}

@media screen and (max-width:979px) {
    .sub-col-panoramica-utente,
    .sub-col-panoramica-classe{
        padding:0!important;
        margin:0 .3rem
    }
}

@media screen and (min-width:980px){

    .panoramica-utente-singolo,
    .panoramica-classe-singola{
        padding: 20px 15px;
    }

    .col-panoramica-utente,
    .col-panoramica-classe{
        padding: 0 .3rem;
    }

    .col-gestione{
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: auto;
    }

    .col-nome-utente,
    .col-email-utente{
        width: 16%;
    }

    .col-tel-utente{
        width: 13%;
    }

    .col-ruolo-utente{
        width: 15%;
    }

    .col-istituto-utente{
        width: 11%;
    }

    .col-sede-utente{
        width: 7%;
    }
    
    .col-istituto-utente .istituto-utente,
    .col-sede-utente .sede-utente,
    .col-classe-utente .sede-utente{
        font-size: var(--tabella-testo-xxl);
    }


    /* classe */

    .col-nome-classe{
        width: 8%!important;
    }

    .col-istituto-classe{
        width:15%;
    }

    .col-sede-classe{
        width: 10%;
    }

    .col-rap-istituto-classe,
    .col-rap-classe-classe{
        width: 15%;
    }

    .col-vedi-ordini-classe{
        width: 12%;
        text-align: center;
    }

    .col-panoramica-classe.col-gestione{
        width: auto;
    }

}

/* aggiunta rappresentante */
.aggiunta-singolo-rappresentante,
.aggiunta-singola-classe{
    border-radius: 5px;
    background:var(--bianco);
    padding: 20px 15px;
    margin-top: 10px;
}


.col-campo .form-floating>.form-control{
    padding: 1rem .75rem .1rem .75rem;
    height: auto;
}

.col-campo .form-floating>label{
    padding:.6rem .75rem
}

.col-cestina{
    display: flex;
    align-items: center;
}

@media screen and (max-width:979px) {
    .col-cestina{
        display: flex;
        align-items: center;
        justify-content: end;
        padding-top: 15px;
    }
}



@media screen and (min-width:980px) {
    
    .aggiunta-singolo-rappresentante .col-campo{
        width: 16%;
    }

        
    .aggiunta-singola-classe .col-campo{
        width: 19%;
    }

    .aggiunta-singolo-rappresentante,
    .aggiunta-singola-classe{
        padding: 10px;
    }

    .aggiunta-singolo-rappresentante .col-cestina{
        width: 4%;
    }

    .aggiunta-singola-classe .col-cestina{
        width: 5%;
        justify-content: center;
    }



    .aggiunta-singolo-rappresentante .col-cestina img,
    .aggiunta-singola-classe .col-cestina img{
        transform:translateY(4px)
    }

}


/* Sviluppo damiano dal 3 gennaio */

/* Finestre di vendita */

.btn-sync:hover{
    background: #c0bcbc;
}

.btn-sync-default{
    background:#ddd;
}

.btn-sync-incompleto{
    background:#ffe277!important;
}

.btn-sync-completato{
    background: var(--prodotti)!important;
}

@media screen and (max-width:980px) {
    .btn-sync{
        width: fit-content;
        height: fit-content;
        border-radius: 10px!important;
        padding: 0 10px;
    }

    .btn-sync .mobile{
        padding: 0 10px;
    }

    .col-switch-pagamenti,
    .col-date-finestra{
        display: none!important;
    }
}


/* modal con sync qta */

/* .modal-sync-qta-heading{
    border:none
} */

.th-sync-qta{
    font-size: var(--xxs-title);
    text-transform: uppercase;
}

.sync-qta-nome-prodotto{
    border:none;
    
}

.sync-qta-nome-variante{
    font-size:var(--mini-title-regular)
}

.sync-qta-qta{
    text-align:center;
    font-size: var(--mini-title-regular);
}

.opzioni-modal-sync-qta{
    display: flex;
    align-items: baseline;
    width: 100%;
    margin-left: auto;
    justify-content: flex-end;
}

.opzioni-modal-sync-qta .btn-sync{
    max-width: 40%;
    margin:0 10px
}


/* pagamenti effettuati switch di controllo */

.col-switch-pagamenti{
    display: flex;
    align-items: center;
    justify-content: space-around;
}

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

.switch-pagamento-label{
    width: 40px;
    height: 40px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.switch-pagamento-icon{
    width: 50%
}

/* fin.vendita switch apertura */

.form-check-input:checked{
    background-color:var(--prodotti);
    border-color:var(--prodotti);    
}

.btn-check:checked+.btn{
    background-color:var(--prodotti);
}


/* CATALOGO PRODOTTI GLOBALE */

/*prodotto-wrapper, style a 771, insieme a: .panoramica-utente-singola */

.catalogo-container{
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.prodotto-wrapper{
    align-items: center;
    width: 100%;
}

.col-img-prodotto .img-prodotto{
    max-height: 60px;
    border-radius: 5px;
}

.prezzo-prodotto{
    display: flex;
    align-items: center;
    background: var(--prodotti);
    padding: 5px var(--margine-s);
    border-radius: 50px;
}

.prezzo-prodotto *{
    color: var(--bianco);
}

.prezzo-prodotto .label-prezzo-prodotto{
    margin-right: 5px;
}

.prezzo-prodotto-valore{
    font-size: var(--mini-title);
}


.col-nome-prodotto{
    /* max-width: 50%; */
    width: 50%;
}

.col-cat-prodotto{
    width: 20%;
}

.col-sku-prodotto,
.col-prezzo-prodotto{
    width: 10%;
}

.col-prezzo-prodotto{
    display: flex;
    justify-content: center;
}


@media screen and (max-width:979px) {
    .prodotto-wrapper .col-panoramica-classe{
        display: flex;
        align-items: center;
        padding: 0;
    }
}



@media screen and (min-width:980px){
    .col-nome-prodotto{
        width: 30%;
    }
}



/* con questo codice aggiungo titolo pagina + step del progresso, un esempio: agg. prodotto cat. Globale */
.info-pagina-step{
    flex-direction: column;
    align-items: baseline;
}

.aggiungi-attributo{
    display: flex;
}

.row-aggiunta-prodotto-step-2{
   justify-content: space-between;
}

.col-aggiungi-attributo{
    display: flex;
    align-items: flex-end;
}

.col-aggiungi-attributo img{
    margin-right: 5px;
}

.variante-prodotto,
#attributo-principale,
.singola-variante-qta-sku,
.modifica-img,
.modifica-dettagli,
.modifica-variante-qta-sku{
    padding: 10px;
    border-radius: 5px;
    background: var(--grigio);

}


.aggiunta-prodotto-step-0{
    justify-content: center;
    display: flex;
    align-items: center;
    height: 50vh;
}

.prodotto-step-0-container{
    justify-content: center;
}


/* modifica giacenze */

.intestazione-modifica-giacenza,
.modifica-singola-variante,
.importa-singola-variante{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.btn-modifica-giacenza-wrapper{
    padding: 0;
    width: fit-content;
}

@media screen and (max-width:980px) {
    .btn-modifica-giacenza-wrapper .btn-mobile{
        display: flex;
    }
}

.btn-modifica-giacenza{
    padding: 0 8px;
}

.modifica-singola-variante{
    padding: 10px 5px;
    background-color: var(--bianco);
    border-radius: 5px;
}

.importa-singola-variante{
    padding: 10px 5px;
    background-color: var(--grigio);
    border-radius: 5px;
}

/* aggiunta prodotto dentro una sede */

.vista-singolo-prodotto-globale{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    background: var(--grigio);
    padding: 10px;
}

/* PUSH FINALE ORDINI */



.vista-riepilogo-prodotto-ordinato,
.vista-carrello-prodotto-ordinato{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    background: var(--grigio);
    padding: 10px;
    position: relative;
}

.vista-carrello-prodotto-ordinato{
    padding:2px 10px;
}

.totale-ordine-singolo{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    background: var(--ordini);
    padding: 10px;
}

.cestino-carrello-prodotto{
    position: absolute;
    top: -10px;
    right: -10px;
    width: 20px;
    height: 20px;
    background: var(--rosso);
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cestino-carrello-prodotto img{
    width: 8px;
}

.col-totale-prodotto-live{
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    width: 100%;
    padding:5px
}

.col-totale-ordine-singolo{
    padding:0
}



/* NUOVO CSS NOVEMBRE 24 */

/* .e-prodotto-wrapper{
    padding: 0;
}

.e-prodotto-wrapper:hover{
    transform:scale(1)!important;
}

.e-prodotto{
    box-shadow: none;
    padding: 0;
    border:none;
    background:none
}

.e-img-prodotto{
    width: 100%;
    height: 350px !important;
    object-fit: contain;
}

.e-nome-prodotto {
    line-height: 1em;
    max-width: 100%;
    font-size: 12px;
    font-family: 'Gravity', sans-serif;
}

@media (min-width: 1100px) {
    .e-nome-prodotto {
        line-height: 1.2em;
        font-size: 16px;

    }
}

.e-mini-desc-prodotto{
    font-family: "Libre Caslon Text", serif;
    font-weight: 400;
} */