/*
 * Premium Ecológica
 * Shared Catalog Card R1
 *
 * IMPORTANTE:
 * este arquivo NÃO controla quantidade de colunas,
 * largura da PLP, sidebar ou filtros.
 *
 * Apenas:
 * - custom options inline
 * - CTA
 * - estados de escolha
 */


/* =========================================================
   INLINE PRODUCT OPTIONS
========================================================= */

body.catalog-category-view
.premium-card-config {
    margin: 8px 0 3px;
    padding-top: 8px;

    border-top:
        1px solid #edf1ee;
}


body.catalog-category-view
.premium-card-config__fieldset {
    margin: 0;
    padding: 0;

    border: 0;
}


body.catalog-category-view
.premium-card-config__fieldset legend {
    margin:
        0 0 6px;

    padding: 0;

    color:
        #40594f;

    font-size:
        10px;

    font-weight:
        750;

    line-height:
        1.2;
}


body.catalog-category-view
.premium-card-config__choices {
    display: flex;
    flex-wrap: wrap;

    gap: 5px;
}


body.catalog-category-view
.premium-card-config__choice {
    position: relative;

    display: inline-flex;

    margin: 0;

    cursor: pointer;
}


body.catalog-category-view
.premium-card-config__choice input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
}


body.catalog-category-view
.premium-card-config__choice span {
    min-width:
        58px;

    min-height:
        29px;

    padding:
        6px 9px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap: 3px;

    border:
        1px solid #d8e3dc;

    border-radius:
        999px;

    background:
        #fff;

    color:
        #25483c;

    font-size:
        9.5px;

    font-weight:
        720;

    line-height:
        1;

    transition:
        .15s ease;
}


body.catalog-category-view
.premium-card-config__choice
input:checked + span {
    border-color:
        #087044;

    background:
        #e8f7ef;

    color:
        #07583f;

    box-shadow:
        inset 0 0 0 1px #087044;
}


body.catalog-category-view
.premium-card-config__choice
input:focus-visible + span {
    outline:
        2px solid #f0b429;

    outline-offset:
        2px;
}


body.catalog-category-view
.premium-card-config__choice:hover span {
    border-color:
        #75a98e;
}


body.catalog-category-view
.premium-card-config__choice small {
    font-size:
        8px;

    font-weight:
        600;
}


/* =========================================================
   PRODUCTS WITH ADDITIONAL REQUIRED OPTIONS
========================================================= */

body.catalog-category-view
.premium-card-config__special small {
    margin-bottom:
        7px;

    display:
        block;

    color:
        #667c73;

    font-size:
        8.5px;

    line-height:
        1.35;
}


body.catalog-category-view
.premium-card-config__choose {
    width: 100%;
    min-height: 39px;

    padding:
        0 12px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid #07583f;

    border-radius:
        999px;

    background:
        #07583f;

    color:
        #fff !important;

    text-decoration:
        none;

    font-size:
        10px;

    font-weight:
        760;

    line-height:
        1.1;

    transition:
        .15s ease;
}


body.catalog-category-view
.premium-card-config__choose:hover {
    border-color:
        #0b6a4d;

    background:
        #0b6a4d;

    color:
        #fff !important;
}


/*
 * Quando há outras opções obrigatórias além da
 * voltagem, o Add to Cart direto não é seguro.
 */
body.catalog-category-view
.product-item:has(.premium-card-config--choose)
[data-addto="cart"] {
    display:
        none !important;
}


/* =========================================================
   NATIVE HYVA ADD TO CART — PREMIUM VISUAL
========================================================= */

body.catalog-category-view
.product-item
[data-addto="cart"] {
    min-height:
        39px !important;

    border:
        1px solid #07583f !important;

    border-radius:
        999px !important;

    background:
        #07583f !important;

    color:
        #fff !important;

    font-weight:
        750 !important;

    box-shadow:
        none !important;

    transition:
        .15s ease !important;
}


body.catalog-category-view
.product-item
[data-addto="cart"]:hover {
    border-color:
        #0b6a4d !important;

    background:
        #0b6a4d !important;

    color:
        #fff !important;
}


body.catalog-category-view
.product-item
[data-addto="cart"]:focus-visible {
    outline:
        2px solid #f0b429 !important;

    outline-offset:
        2px !important;
}


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

@media (max-width: 767px) {

    body.catalog-category-view
    .premium-card-config__fieldset legend {
        font-size:
            8.5px;
    }


    body.catalog-category-view
    .premium-card-config__choice span {
        min-width:
            47px;

        min-height:
            25px;

        padding:
            5px 6px;

        font-size:
            8px;
    }


    body.catalog-category-view
    .premium-card-config__choose {
        min-height:
            34px;

        padding:
            0 7px;

        font-size:
            8px;
    }

}