/* =========================================================
   DIVA COMBINATIONS
   FRONT CSS - VERSIONE DEFINITIVA
   PrestaShop 8 / Tema Diva - LeoTheme
   ========================================================= */


/* =========================================================
   CONTENITORE
   ========================================================= */

.diva-combinations {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    margin: 8px 0 7px !important;
    padding: 0 !important;

    position: relative !important;
    clear: both !important;

    box-sizing: border-box !important;

    z-index: 10 !important;

    overflow: visible !important;
}


/* =========================================================
   TENDINA PRINCIPALE
   ========================================================= */

.diva-combinations__select {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    height: 38px !important;
    min-height: 38px !important;

    margin: 0 !important;

    padding: 0 38px 0 13px !important;

    box-sizing: border-box !important;

    border: 1px solid #d8d8d8 !important;
    border-radius: 5px !important;

    background-color: #ffffff !important;
    background-image: none !important;

    color: #333333 !important;

    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;

    line-height: 36px !important;

    text-align: left !important;

    cursor: pointer !important;

    opacity: 1 !important;
    visibility: visible !important;

    box-shadow: none !important;

    transition:
        border-color 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease !important;

    appearance: auto !important;
    -webkit-appearance: menulist !important;
    -moz-appearance: auto !important;
}


/* =========================================================
   HOVER
   ========================================================= */

.diva-combinations__select:hover {
    border-color: #bcbcbc !important;

    background-color: #fdfdfd !important;

    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
}


/* =========================================================
   FOCUS
   ========================================================= */

.diva-combinations__select:focus {
    outline: none !important;

    border-color: #999999 !important;

    background-color: #ffffff !important;

    box-shadow:
        0 0 0 2px rgba(0, 0, 0, 0.045) !important;
}


/* =========================================================
   ACTIVE
   ========================================================= */

.diva-combinations__select:active {
    border-color: #999999 !important;
}


/* =========================================================
   OPTION
   ========================================================= */

.diva-combinations__select option {
    color: #333333 !important;

    background-color: #ffffff !important;

    font-family: inherit !important;
    font-size: 12px !important;
}


/* =========================================================
   NASCONDE I VECCHI CONTROLLI DIVA / LEOTHEME
   ========================================================= */

.product-miniature.diva-combinations-active .highlighted-informations,

.product-miniature .diva-legacy-hidden,

.product-miniature .variant-links.diva-legacy-hidden,

.product-miniature .product-variants.diva-legacy-hidden,

.product-miniature .product-variants-item.diva-legacy-hidden,

.product-miniature .product-variant.diva-legacy-hidden,

.product-miniature .leo-product-variants.diva-legacy-hidden,

.product-miniature .product-combinations.diva-legacy-hidden {
    display: none !important;

    visibility: hidden !important;

    width: 0 !important;
    height: 0 !important;

    min-width: 0 !important;
    min-height: 0 !important;

    max-width: 0 !important;
    max-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;
}


/* =========================================================
   CARD PRODOTTO
   Permette alla tendina di essere completamente visibile
   ========================================================= */

.product-miniature.diva-combinations-active,
.product-miniature.diva-combinations-active .thumbnail-container,
.product-miniature.diva-combinations-active .product-description,
.product-miniature.diva-combinations-active .product-meta {
    overflow: visible !important;
}


/* =========================================================
   EVITA RESTRINGIMENTI DEL CONTENITORE
   ========================================================= */

.product-miniature.diva-combinations-active .diva-combinations {
    width: 100% !important;
    max-width: 100% !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .diva-combinations {
        width: 100% !important;

        margin-top: 6px !important;
        margin-bottom: 6px !important;
    }


    .diva-combinations__select {
        width: 100% !important;

        height: 36px !important;
        min-height: 36px !important;

        padding-left: 8px !important;
        padding-right: 8px !important;

        font-size: 12px !important;

        line-height: 34px !important;

        border-radius: 4px !important;
    }


    .diva-combinations__select option {
        font-size: 11px !important;
    }
}


/* =========================================================
   SMARTPHONE PICCOLI
   ========================================================= */

@media (max-width: 400px) {

    .diva-combinations {
        margin-top: 5px !important;
        margin-bottom: 5px !important;
    }


    .diva-combinations__select {
        height: 34px !important;
        min-height: 34px !important;

        padding-left: 10px !important;
        padding-right: 30px !important;

        font-size: 10.5px !important;

        line-height: 32px !important;
    }


    .diva-combinations__select option {
        font-size: 10.5px !important;
    }
}


/* =========================================================
   SICUREZZA CONTRO SOVRAPPOSIZIONI
   ========================================================= */

.product-miniature.diva-combinations-active
.product-description {

    overflow: visible !important;
}


.product-miniature.diva-combinations-active
.product-title {

    overflow: visible !important;
}

/* =========================================================
   MOBILE 2 COLONNE - CARD STRETTA
   Card reale ~175px
   ========================================================= */

@media (max-width: 767px) {

    .product-miniature.diva-combinations-active .product-meta {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        padding-left: 0 !important;
        padding-right: 0 !important;

        box-sizing: border-box !important;
    }

    .product-miniature.diva-combinations-active .diva-combinations {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        padding-left: 0 !important;
        padding-right: 0 !important;

        box-sizing: border-box !important;
    }

    .product-miniature.diva-combinations-active
    .diva-combinations__select {
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        height: 36px !important;
        min-height: 36px !important;

        padding: 0 24px 0 8px !important;

        box-sizing: border-box !important;

        font-size: 10px !important;
        line-height: 34px !important;

        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;

        border-radius: 4px !important;
    }

  .product-miniature.diva-combinations-active
.product-price-and-shipping {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    margin: 5px 0 0 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;

    text-align: left !important;

    overflow: hidden !important;
}
}
    }

    .product-miniature.diva-combinations-active
    .product-price-and-shipping .price {
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;

        font-size: 13px !important;

        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;

        text-align: left !important;
    }
}
/* =========================================================
   MOBILE 2 COLONNE - PREZZO NELLA CARD
   ========================================================= */

@media (max-width: 767px) {

    .product-miniature.diva-combinations-active
    .product-price-and-shipping .price {
        position: absolute !important;

        left: 0 !important;
        right: auto !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;

        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}
/* =========================================================
   PREZZO CENTRATO SOTTO LA TENDINA
   MOBILE 2 COLONNE
   ========================================================= */

@media (max-width: 767px) {

    .product-miniature.diva-combinations-active
    .thumbnail-container
    .product-price-and-shipping
    .price {
        left: 0 !important;
        right: auto !important;

        width: 100% !important;
        max-width: 100% !important;

        padding: 0 !important;
        margin: 0 !important;

        box-sizing: border-box !important;

        text-align: center !important;

        justify-content: center !important;

        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}
/* =========================================================
   DIVA COMBINATIONS
   TESTO COMPATTO MOBILE
   ========================================================= */

.diva-combinations__mobile-label {
    display: none !important;
}
/* =========================================================
   MOBILE - TESTO COMPLETO NELLA TENDINA
   ========================================================= */

@media (max-width: 767px) {

    .diva-combinations__select {
        font-size: 9px !important;
        padding-left: 6px !important;
        padding-right: 18px !important;
    }
}


/* =========================================================
   SMARTPHONE MOLTO PICCOLI
   ========================================================= */

@media (max-width: 400px) {

    .diva-combinations__select {
        font-size: 9px !important;
        padding-left: 6px !important;
        padding-right: 18px !important;
    }
}


/* =========================================================
   FINE
   ========================================================= */