:root {
    --bs-blue: #3f80ea;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #e83e8c;
    --bs-red: #d9534f;
    --bs-orange: #fd7e14;
    --bs-yellow: #e5a54b;
    --bs-green: #4bbf73;
    --bs-teal: #20c997;
    --bs-cyan: #1f9bcf;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #020202;
    --bs-gray-100: #f4f7f9;
    --bs-gray-200: #e2e8ee;
    --bs-gray-300: #dee6ed;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #020202;
    --bs-gray-900: #212529;
    --bs-primary: #3f80ea;
    --bs-secondary: #495057;
    --bs-success: #4bbf73;
    --bs-info: #1f9bcf;
    --bs-warning: #e5a54b;
    --bs-danger: #d9534f;
    --bs-light: #eff2f6;
    --bs-dark: #293042;
    --bs-primary-rgb: 63,128,234;
    --bs-secondary-rgb: 73,80,87;
    --bs-success-rgb: 75,191,115;
    --bs-info-rgb: 31,155,207;
    --bs-warning-rgb: 229,165,75;
    --bs-danger-rgb: 217,83,79;
    --bs-light-rgb: 239,242,246;
    --bs-dark-rgb: 41,48,66;
    --bs-white-rgb: 255,255,255;
    --bs-black-rgb: 0,0,0;
    --bs-body-color-rgb: 108,117,125;
    --bs-body-bg-rgb: 247,249,252;
    --bs-font-sans-serif: "Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;
    --bs-font-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
    --bs-gradient: linear-gradient(180deg,hsla(0,0%,100%,0.15),hsla(0,0%,100%,0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.625;
    --bs-body-color: #6c757d;
    --bs-body-bg: #f7f9fc;
}

.bg-soft-success {
    background-color: rgba(75,191,115,.175);
    border-color: rgba(75,191,115,.175);
    color: color-yiq(rgba(75,191,115,.175));
    color: #8cc633;
}

.bg-soft-primary {
    background-color: rgba(63,128,234,.175);
    border-color: rgba(63,128,234,.175);
    color: color-yiq(rgba(63,128,234,.175));
    color: #3f80ea;
}

.bg-soft-warning {
    background-color: rgba(229,165,75,.175);
    border-color: rgba(229,165,75,.175);
    color: color-yiq(rgba(229,165,75,.175));
    color: #e5a54b;
}

.bg-soft-secondary {
    background-color: #576680;
    color: #fff;
}

.btn-sm {
    border-radius: 0.3rem;
}

.illustration {
    background: #6f7f98;
    color: #ffffff;
}

.illustration-text {
    color: #ffffff;
}

.illustration-img {
    max-width: 100%;
    width: 100%;
}


/*body {font-family: 'Lato', sans-serif;}*/
body {background-color: #bec7d5;}
a,
a:hover{ color: unset; text-decoration: none;}

.container-fluid { max-width:1080px;}

.sidebar-brand { text-align:left;}

#ajax-wrapper > div{ transition: opacity .1s ease-in-out; opacity:1;}
#ajax-wrapper.loading > div{ opacity:0; }
#ajax-wrapper.loading > div.loader{ opacity:1;}

.troncamento{ hyphens: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

label{/*font-weight: bold; text-transform: capitalize;*/}
label > small{ font-weight: 300; text-transform: initial;}

.text-center { text-align: center;}
.text-right { text-align: right;}
.text-strike { text-decoration: line-through;}
.text-white,
.text-white *{color:#fff;}

.uppercase { text-transform:uppercase;}

i.rotate-180-on-expand:before{ transition: transform .2s ease-in-out; transform:rotate(0deg);}
a:not(.collapsed) i.rotate-180-on-expand:before{ transform:rotate(-180deg);  }

img { max-width: 100%; height: auto; }

.spinner-sm {
    width: 1rem;
    height: 1rem;
    border-width: 0.15em;
}

button .spinner-border{ display:none;}
button.loading .spinner-border{ display:block; margin: 0 auto;}
button.loading span{ display:none;}

.form-login button { height:50px;}


button#verifica-carrello,
button#aggiusta-carrello,
button#conferma-ordine{ height:60px; width: 100%; line-height: 1.2; margin-bottom: 15px;}

button#svuota-carrello:disabled,
button#verifica-carrello:disabled,
button#aggiusta-carrello:disabled,
button#conferma-ordine:disabled{ display:none;}

/*
.sidebar-link, 
a.sidebar-link {
    font-weight: 400;
    padding: 5px 10px 5px 20px;
    border-bottom: rgba(0,0,0,.3) solid 1px;
}

*/

.sidebar-link, 
a.sidebar-link {
    color: rgba(233,236,239,.4);
    padding: 5px 1.625rem;
}

#sidebar-nav ul.sidebar-dropdown > li:last-child { margin-bottom:1em;}

#sidebar-nav > li > a.sidebar-link { border-top: #3a445a solid 1px;}
#sidebar-nav > li:last-child > a.sidebar-link { border-bottom: #3a445a solid 1px;}

.sidebar-dropdown .sidebar-link {
    color: #adb5bd;
    font-weight: 400;
    padding: 3px 1.5rem 3px 2.7rem;
}

.sidebar-link > span{ padding-left:20px;}

.sidebar-dropdown .sidebar-dropdown .sidebar-link { padding: 0.15rem 1.5rem 0.15rem 3.5rem;}
.sidebar-dropdown .sidebar-dropdown .sidebar-dropdown .sidebar-link { padding: 0.15rem 1.5rem 0.15rem 4.75rem;}

.sidebar [data-bs-toggle=collapse]:before {  right:1rem;}
.sidebar #sidebar-nav > li > [data-bs-toggle=collapse]:before {right:auto; }

.sidebar [data-bs-toggle=collapse]:not(.collapsed):before,
.sidebar [aria-expanded=true]:before,
.sidebar [data-bs-toggle=collapse]:before {
    top: 1rem;
}

.sidebar .sidebar-dropdown [data-bs-toggle=collapse]:not(.collapsed):before,
.sidebar .sidebar-dropdown [aria-expanded=true]:before,
.sidebar .sidebar-dropdown [data-bs-toggle=collapse]:before {
    top: 0.7rem;
}

ul.categorie ul li > a { font-size: 12px; text-transform: uppercase;} 



body[data-theme=colored] .sidebar-item.active > .sidebar-link,
body[data-theme=colored] .sidebar-item.active > .sidebar-link:hover,
body[data-theme=colored] .sidebar-dropdown .sidebar-item.active > .sidebar-link {
    color: #8bc633;
}

    
.btn:focus,
.btn:active{
    box-shadow: none;
}

.logout-wrapper{
    left: 0;
    position: fixed;
    bottom: 0;
    background-color: #191a1c;
    display: block;
    z-index: 10;
    width: 250px;
    padding: 20px;
    margin: 0;
}

.logout-wrapper a,
.logout-wrapper a:hover{ color:#666;}


/* select 2 */

.select2-container--bootstrap4 .select2-selection--multiple .select2-search--inline .select2-search__field {
    padding: 0 15px;
}
.select2-container--bootstrap4 .select2-dropdown {
    min-width: 338px;
    border-color: #ccc;
    margin: 0 1px;
    border-top:#ccc solid 1px;
}

.select2-container--bootstrap4 .select2-results>.select2-results__options {
    max-height: 320px;
}
.select2-container--bootstrap4 .select2-results__option {
    font-size: .825rem;
    border-bottom: #ccc solid 1px;
    margin: 0 !important;
}

.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow b {
    display: none;
}

span.select2-selection.select2-selection--multiple,
span.select2-selection.select2-selection--single {
    height: 38px;
    background-color: #f3f6fa;
    border: 0;
    line-height: 22px;
}

.bootstrap-autocomplete.dropdown-menu{ display:block; padding: 0; border-radius: 0; min-width: 270px;}
.bootstrap-autocomplete.dropdown-menu > li.disabled { padding: 10px;}
.bootstrap-autocomplete.dropdown-menu > li { border-bottom:#ccc solid 1px;}

.select2-container--bootstrap4 .select2-results__option--highlighted[aria-selected],
.bootstrap-autocomplete.dropdown-menu > li:hover { background-color: #f3f6fa; color:#000;}

.select2-container--bootstrap4 .select2-results__option,
.bootstrap-autocomplete.dropdown-menu > li > a { display: block; margin-right: 17px; hyphens: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.select2-results__options img,
.bootstrap-autocomplete.dropdown-menu > li > a > img {width:50px; height:50px; object-fit: cover; mix-blend-mode: darken;}
    

/* Product variations */

.table.variations {margin-top:15px; border:0; table-layout:fixed;}

.table.variations td{position:relative; border-color: #cbd0d9;}
.table.variations .nome-variazione { white-space: nowrap; overflow: hidden;text-overflow: ellipsis; width: calc(100% - 50px); display: block;}
.table.variations tr td { background-color: #eaeef7; box-shadow: none; transition: background-color .3s ease-in-out;}
.table.variations tr:hover td { background-color: #fff; box-shadow: none; }

/*
.table.variations tr.has-color > td:first-child {border-radius: 30px 0 0 30px;}
.table.variations tr > td:last-child {border-radius: 0 10px 10px 0;}
*/

.table.variations td.qty-col {width:150px;}

.table.variations .prodotto-colore { display:inline-block; height:30px; width:30px; border-radius: 50%; margin-right: 15px; float: left; transition: transform .3s ease-in-out;}

.table.variations tr:hover .prodotto-colore { transform: scale(1.5);}


.table.variations tbody > tr:last-child,
.table.variations tbody > tr:last-child td{ border-bottom-width:0 !important;}

    
.prodotto-riga > td { padding-bottom:30px; border-bottom:#000 solid 2px; }

.prodotto-riga .prodotto-foto{width:100%; object-fit:contain; background-color: #fff; aspect-ratio: 2 / 3;}

.prodotto-riga .prodotto-titolo-link{color:#000; text-decoration: none;}

.prodotto-riga .numero-varianti{ position: absolute; top: 10px; left:10px; display:inline-block; background-color:#fff; padding:0 10px; z-index:2;}

.prodotto-riga .color-list{height:10px; width:100%; margin-top:-10px; margin-bottom:10px; image-rendering: pixelated;}



.table.variations.color-variations,
.table.variations.color-variations td{
    border: 0;
    padding: 0 !important;
}
.table.variations.color-variations .prodotto-colore {
    display: inline-block;
    border-radius: 0;
    margin: 0;
    position: absolute;
    width: 100%;
    z-index: 1;
    height: 40px;
    left: 0;
    top: 4px;
}

.table.variations.color-variations tr .nome-variazione {
    position: relative;
    z-index: 2;
    padding: 0 15px;
    line-height: 40px;
    display: inline-block;
    color:#fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.table.variations.color-variations tr.light .nome-variazione {
    color:#000;
}



tr.focus{box-shadow: yellow 0px 0px 20px;}

.carousel-indicators [data-bs-target] {
    background-color: #000;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    opacity: .3;
}

.carousel-indicators [data-bs-target].active{
    opacity: 1;
}

.carousel-control-next-icon, 
.carousel-control-prev-icon {
    background-color: #000;
    border-radius: 50%;
    background-size: 60%;
}

.carousel-control-next-icon {
    background-position: 60%;
}

.carousel-control-prev-icon {
    background-position: 40%;
}



/* QUANTITY */

.inline-group { min-width: 120px; max-width: 140px; padding: 0; }

.inline-group .form-control { text-align: center; height: 40px; font-size: 16px; padding: 0; }

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

.input-group button {border-radius:0 6px 6px 0; background-color: #fff; height: 40px; font-size: 16px;}
.input-group button:hover {color:#000 !important; background-color: #eee;}

.input-group .input-group-prepend button {border-radius:6px 0 0 6px;}

.input-group .form-control[type="number"].fill { border-color: #198754; background-color: #c1e9d6;}
.input-group .form-control[readonly]:not(:disabled):not(.fill) { background-color: #fff;}
.input-group .form-control[type="number"].fill-error { border-color: #ff0000; background-color: #f8d6d6;  }



.gallery .modal-dialog .carousel .carousel-item img {
    height: calc(100vh - 160px);
    object-fit: contain;
}

/*
.modal-backdrop.show {
    opacity: .9;
}
*/

.modal-title {
    font-size: 22px;
}

/* BOOTBOX */

button.bootbox-close-button {
    border: 0;
    background: none;
    font-size: 32px;
    line-height: 33px;
}

/* SIDEBAR LEFT */

.sidebar .sidebar-item{font-size:15px;}
.sidebar i{font-size:1.2rem;}

/* CARRELLO */

.cart-table tbody { }
.cart-table td{border-right: #ccc solid 1px; vertical-align: middle; transition: background .2s ease-in-out;}

.cart-table tbody tr > td.td-remove { padding:0; text-align: center;}
.cart-table tbody tr > td.td-remove .btn.remove { padding:5px;}

.cart-table tbody tr > td.product-img {padding: 0; width: 50px;}

.cart-table tbody tr > td.product-name{ line-height: 1.1; font-size: 14px; padding:5px 5px 5px 0;}
.cart-table tbody tr > td.product-name > div { margin-left: 5px;}
.cart-table tbody tr > td.product-name > div > a{ display:block; text-decoration: none;}
.cart-table tbody tr > td.product-name img {  width:34px; height: 50px; object-fit: contain;}
.cart-table tbody tr > td.product-name span.color { float:left; width: 20px;  min-width: 20px; height: 20px; margin: 5px 5px 0 0; border-radius: 50%; display:inline-block; }
.cart-table tbody tr > td.product-name span.attribute { float: left; margin-top: 10px; font-size: 11px; max-width: calc(100% - 25px);}

.cart-table tbody tr > td.qty { padding:5px 0; width:60px;}
.cart-table tbody tr > td.price { padding:5px 0; max-width:95px;}

.cart-table thead tr > th.price,
.cart-table tfoot tr > th.price,
.cart-table tbody tr > td.price{text-align:right; padding-right: 20px;}

.cart-table tr .qty{ text-align: center; white-space: nowrap;}

.cart-table tr.highlight td{ background: #d0f3e3 !important; }
.cart-table tr.highlight td.qty { font-weight: bold; font-size: 22px;}

#carrello-table-wrapper{ margin-bottom: 10px; }

.carrello-messaggio {line-height:1.2em; }
.carrello-page {max-width: 700px; margin: 0 auto;}
.carrello-page .carrello-page-wrapper { background-color:#283042;}
.carrello-page #carrello-totale-wrapper { padding-bottom: 1rem; }


/* SIDEBAR RIGHT */

#sidebar-right{ left: auto; right: 0; width: 420px; max-width: 100%; min-width: 0; margin-left: 0 !important; transition: width .35s ease-in-out;}
#sidebar-right > div {opacity:1; transition: opacity .5s ease-out; transition-delay: .3s;}

#sidebar-right.collapsed { width:0;}
#sidebar-right.collapsed > div { opacity:0; transition: opacity .1s ease-out; transition-delay: 0;}

#sidebar-right #carrello-table-wrapper{ max-height: calc(100vh - 250px); overflow-x: hidden; }


#sidebar-right.expanded { width:50vw;}


/* TOPBAR */

#topbar{height: 65px;}

#topbar .carrello-subtotale {
    min-width: 80px;
    text-align: right;
}

/*
body.scrolled #header-messages {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1000;
    background-color: #fff;
    padding: 10px;
    box-shadow: rgb(0 0 0 / 50%) 0 0 30px;
}
*/


body.scrolled main{ padding-top: 64px !important;}
body.scrolled main .navbar {
    position: fixed;
    top: 0;
    /*left: 0;
    width:100%;*/
    z-index: 100;
}

.nav-item .indicator {
    
    height: 24px;
    width: 24px;
    top: -7px;
    right: -16px;
    line-height: 22px;
}

.carica-variazioni{ text-align: left; font-weight: bold; text-transform: uppercase; color: #6c757d;}


.col-foto { background-color:#fff;}
.col-variazioni {background-color: #eaeef7; padding: 15px 30px;}
.product-list .prodotto-footer { padding:20px 15px;}

/* GRID VIEW */

.product-list.grid-view .card-body {padding:0;}
.product-list.grid-view .prodotto-foto-wrapper > a { border-radius: 0.25rem 0.25rem 0 0; background: #f3f3f3; background: linear-gradient(176deg, rgb(255 255 255) 0%, rgb(234 238 247) 60%, rgba(243,243,243,0) 60%, rgba(243,243,243,0) 100%);
 display: block; }
.product-list.grid-view .prodotto-riga .prodotto-foto {  mix-blend-mode: darken; }

/* LIST VIEW */

.product-list.list-view .prodotto-riga .col-foto { padding: 0; position: relative;}
.product-list.list-view .prodotto-riga .prodotto-foto-wrapper{width:100%; }
.product-list.list-view .prodotto-riga .prodotto-foto-wrapper a { text-decoration:none; position: relative; display: block;}
.product-list.list-view .prodotto-riga .prodotto-foto-wrapper a:hover:after {
    content: "\F62C";
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10000;
    background-color: #eee;
    height: 40px;
    width: 40px;
    line-height: 40px;
    color: #666;
    display: inline-block;
    font-family: bootstrap-icons !important;
    text-align: center;
    border-radius: 50%;
}



#note{ height:200px;}

#mobile-alert {display:none;}

body[data-theme="colored"] .only-light,
body[data-theme="light"] .only-dark,
body[data-theme="dark"] .only-light{ display:none; }
body[data-theme=colored] .sidebar,

body[data-theme=colored] .sidebar, 
body[data-theme=colored] .sidebar-content {
    background: #293142;
}


.ql-editor h2{
    font-size: 1.44375rem;
    margin-bottom: 0.5rem;
    margin-top: 0;
}
.ql-editor p {
    margin-bottom: 1rem;
    margin-top: 0;
}

/*
#sidebar,
#sidebar .sidebar-content,
body[data-theme=colored] #sidebar,
body[data-theme=colored] #sidebar .sidebar-content{
    background: #293142;
    background: linear-gradient(180deg, rgb(0 0 0) 0%, rgb(41 50 66) 40%);
}
*/


@media(max-width:991px){
    
    #sidebar-right{ display:none;}
}

@media(max-width:767px){
    
    .table.variations tr > td:first-child {
        padding-left: 0;
        padding-right: 10px;
    }

    .table.variations .nome-variazione {
        white-space: break-spaces;
        overflow: visible;
        text-overflow: unset;
        width: calc(100% - 45px);
        font-size: 12px;
        display: block;
        float: left;
    }
}


@media(min-width:768px){
    
    /*
    .table.variations .input-group-prepend, 
    .table.variations .input-group-append {
        opacity: 0;
        transition:opacity .1s ease-in-out;
    }
    
    .table.variations tr:hover .input-group-prepend, 
    .table.variations tr:hover .input-group-append {
        opacity: 1;
    }
    */
    
    .product-list.list-view .prodotto-riga .prodotto-foto-wrapper{position: -webkit-sticky; /* Safari */  position: sticky; top: 0;}
        
    /* CARRELLO PAGE */

    .carrello-page .cart-table tbody tr > td.product-name { font-size:16px; padding: 5px 10px 5px 10px;}
    .carrello-page .cart-table tbody tr > td.product-name span.attribute { font-size:14px; margin-top:9px; }
    .carrello-page .cart-table tbody tr > td.product-name img { width:70px; height: 100px; border-right: #ccc solid 1px; margin-right: 10px; }
}

@media (min-width: 1px) and (max-width: 991.98px){
    
    body:not([data-sidebar-position=right]) .sidebar {
        margin-left: 0;
    }

    body:not([data-sidebar-position=right]) .sidebar.collapsed {
        margin-left: 0;
    }

}

@media (min-width: 1px) and (max-width: 1199px){
    
    body:not([data-sidebar-position=right]) .sidebar {
        margin-left: -260px;
    }

    body:not([data-sidebar-position=right]) .sidebar.collapsed {
        margin-left: 0;
    }

}