/*-------------------------------------------------------
  Author: AtenaSoft
--------------------------------------------------------*/

/*=============================================================
RESET STYLES
===============================================================*/
/* Box sizing rules */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
    margin-block-end: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul,
ol {
    list-style: none;
}

/* Set core root defaults */
html:focus-within {
    scroll-behavior: smooth;
}

/* Set core body defaults */
body {
    min-height: 100vh;
    text-rendering: optimizeSpeed;
    line-height: 1.5;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
    text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img,
picture {
    max-width: 100%;
    display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
    font: inherit;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    background: none;
    border: none;
    font: inherit;
    outline: inherit;
}

/* .bootstrap-select>.dropdown-toggle.bs-placeholder,
.bootstrap-select>.dropdown-toggle.bs-placeholder:active,
.bootstrap-select>.dropdown-toggle.bs-placeholder:focus,
.bootstrap-select>.dropdown-toggle.bs-placeholder:hover {
    padding: 0px 20px;

} */


.bootstrap-select>.dropdown-toggle {
    min-height: 40px;
    height: auto !important;

}

.form-control {
    border-radius: 0;
}

/*=============================================================
Variáveis
===============================================================*/

:root {
    --client-theme: #0057bd;
    --client-theme2: #00242e;
    --client-theme3: #88d14d;
    --transparent-client-theme: #0057bd84;
    --transparent-client-theme2: #00242ecc;
    --transparent-client-theme3: #88d14d84;
    /*  */
    --light-theme: white;
    --midtone-theme: #f8f8f8;
    --midtone-theme2: #99a5aa;
    --midtone-theme3: #355159;
    --dark-theme: #00242e;

    /*  */
    --transparent-light-theme: #FFFFFF33;
    --transparent-midtone-theme: #F8f8f833;
    --transparent-midtone-theme2: #99a5aa33;
    --transparent-midtone-theme3: #404f54cc;
    --transparent-dark-theme: #2b2b2bcc;
    /*  */

    /* outras cores */
    --instagram: #d33070;
    --facebook: #1973eb;
    --linkedin: #0d63bc;
    --whatsapp: #46c355;
    --email: #ce493c;
    --messenger: #027ff7;
    --youtube: #f60004;
    --twitter: #1e96e9;
    --snapchat: #f8f400;
    --pinterest: #c41f25;


    --font-size-xxs: 0.6rem;
    /* 9px */
    --font-size-xs: 0.7rem;
    /* 10px */
    --font-size-sm: 0.8rem;
    /* 14px */
    --font-size-md: 1rem;
    /* 16px */
    --font-size-lg: 1.1rem;
    /* 18px */
    --font-size-xl: 1.25rem;
    /* 20px */
    --font-size-2xl: 1.5rem;
    /* 24px */
    --font-size-3xl: 1.9rem;
    /* 30px */
    --font-size-4xl: 2.5rem;
    /* 40px */
    --font-size-5xl: 3.5rem;
    /* 50px */

    /* outros estilos */
    --border-theme: 10px;

}



h1 {
    font-size: var(--font-size-4xl);
}

h2 {
    font-size: var(--font-size-3xl);
}

h3 {
    font-size: var(--font-size-3xl);
}

h4 {
    font-size: var(--font-size-2xl);
}

h5 {
    font-size: var(--font-size-xl);
}

h6 {
    font-size: var(--font-size-lg);
}


/*=============================================================
GENERAL STYLES
===============================================================*/

html,
body {
    font-family: 'Montserrat', sans-serif;
    overflow-x: hidden;
}

*:hover {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.text-client {
    color: var(--client-theme2);
}

.text-client2 {
    color: var(--client-theme);
}

.text-client3 {
    color: var(--client-theme3);
}


.btn-client {
    font-family: 'Montserrat', sans-serif;
    color: white;
    border-radius: 0;
}


.btn-client {
    background-color: var(--client-theme);
    color: var(--light-theme);
    border-radius: var(--border-theme);
    font-weight: 600;

    &:hover {
        background-color: var(--midtone-theme3);
        color: white;
    }
}


.btn-client:first-child:active {
    background-color: var(--midtone-theme3);
    color: white;
}



.theme-title {

    & h1 {
        font-weight: 800;
        font-size: var(--font-size-5xl);
        color: var(--client-theme);
    }

    & h2 {
        font-weight: 700;
        color: var(--client-theme2);
        font-size: var(--font-size-3xl);
    }

    & h3 {
        font-size: var(--font-size-md);
        font-weight: 600;
        color: var(--client-theme3);
    }

    & h4 {
        font-size: var(--font-size-2xl);
        font-weight: 500;
        color: var(--dark-theme);
    }

    & h5 {
        font-weight: 600;
        font-size: var(--font-size-xl);
        font-style: italic;
        color: var(--dark-theme);
    }

    &h6 {
        font-weight: 300;
        font-size: var(--font-size-lg);
        color: var(--dark-theme);
    }
}

.logged {
    color: var(--client-theme3) !important;
}

/*=============================================================
TOPBAR
===============================================================*/
.topbar {
    padding: 5px 0;
    background-color: var(--client-theme2);
    color: white;


    .topbar__social-icons {
        color: var(--light-theme);
        padding: 0 40px 3px 0;

        & svg {
            height: 25px;
            fill: white;
        }
    }

    .topbuttons {

        & span {
            color: white;
        }

        & i {
            color: white;
        }

        & .dropdown-toggle::after {
            color: white;
        }
    }

    .langs {
        & img {
            height: 25px;
        }
    }

}

.langs {
    .dropdown-menu{
        background-color: lightblue;
    }
}

/*=============================================================
HEADER
===============================================================*/

/* -------------------------------------------------------------
 header*/
.header {

    .header__logo {
        & img {
            height: 90px;
            width: 217px;
        }
    }


    .header__contacts-carrinho {
        .header__info-cart__cart-text {
            font-size: var(--font-size-xl);
            font-weight: 700;
            color: #02607a;
        }

        .header__info-cart__count {
            font-size: var(--font-size-sm);
            font-weight: 400;
            color: #02607a;
        }
    }
}

/* -------------------------------------------------------------
nav */
.nav-mobile-wrap {
    background-color: var(--client-theme2);
}

/* mobile */




/*=============================================================
BANNER
===============================================================*/
.banner_main {

    height: 600px;

    @media (min-width: 1800px) {
        height: 800px;
    }

    @media (max-width: 992px) {
        height: 400px;
    }

}


.banner {

    --swiper-pagination-color: var(--client-theme);
    --swiper-pagination-bullet-size: 15px;
    --swiper-pagination-bullet-width: 15px;
    --swiper-pagination-bullet-height: 15px;
    --swiper-pagination-bullet-inactive-color: #fff;
    --swiper-pagination-bullet-inactive-opacity: 0.6;


    .navbar {
        z-index: 200;
        position: relative;
        background-color: var(--transparent-midtone-theme2);
        font-weight: 600;
        font-size: var(--font-size-lg);

        .nav-item a {
            color: var(--midtone-theme2);

            &:hover {
                color: var(--light-theme);
            }

            &.active {
                color: var(--light-theme);
            }
        }
    }

    .banner__background_main {
        height: inherit;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        z-index: 100;
        /* box-shadow: inset 10000px 10000px var(--transparent-client-theme2); */
        margin-top: -75px;

        @media (max-width: 992px) {
            margin-top: 0px;
        }

        /*box-shadow: inset 10000px 10000px var(--transparent-client-theme2);*/
    }

    .banner__background {
        height: inherit;
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        z-index: 100;
        box-shadow: inset 10000px 10000px var(--transparent-client-theme2);
        margin-top: -75px;

        @media (max-width: 992px) {
            margin-top: 0px;
        }
    }

    & h1 {
        position: relative;
        font-size: var(--font-size-4xl);
        color: var(--light-theme);
        font-weight: 300;
        font-style: italic;
        top: 30%;



        @media(max-width:992px) {
            font-size: var(--font-size-xl);
            top: 4%;
        }

        .highlight-light {
            font-weight: 400;

        }

        .highlight-box {
            font-weight: 400;
            background: linear-gradient(180deg, rgba(135, 209, 77, 1) 0%, rgba(3, 97, 121, 1) 100%);
            transform: skew(-20deg);
            border-radius: var(--border-theme);
            font-style: initial;

            .highlight-box__text {
                transform: skew(20deg);
            }
        }

        .highlight-bold {
            font-weight: 800;
            font-style: initial;
            font-size: var(--font-size-5xl);
        }
    }

    .banner-titles {
        .btn-client {
            width: max-content;
            padding: 20px 50px;
        }
    }

}



/*=============================================================
MAPA
===============================================================*/
.mapa {
    filter: grayscale();
}

/*=============================================================
SWIPER CAROUSEL
===============================================================*/






/*=============================================================
BANNER-SMALL
===============================================================*/
.small-banner {
    height: min-content;

    .banner__background {
        height: min-content;
    }

    &.small-banner-search {
        & h1 {

            font-size: var(--font-size-2xl);
            font-style: inherit;

            & span {
                &:nth-child(1) {
                    text-transform: uppercase;
                }

                &:nth-child(2) {
                    font-weight: 800;
                    font-size: var(--font-size-4xl);
                }
            }
        }
    }

    &.small-banner-detail {
        & h1 {

            font-size: var(--font-size-4xl);
            font-style: inherit;

            & span {
                &:nth-child(1) {
                    text-transform: uppercase;
                    font-weight: 800;
                }
            }
        }

        & h2 {
            color: var(--midtone-theme2);
            font-size: var(--font-size-sm);
        }

        .rating {
            color: white;
        }

    }


    &.small-banner-main {
        & h1 {

            font-size: var(--font-size-4xl);
            font-style: inherit;

            & span {
                &:nth-child(1) {
                    text-transform: uppercase;
                    font-weight: 800;
                }
            }
        }

        & h2 {
            color: var(--midtone-theme2);
            font-size: var(--font-size-sm);
        }

    }

}

/*=============================================================
BREADCRUMBS
===============================================================*/
.breadcrumb {
    & li {
        color: white;
        font-size: var(--font-size-md);
    }

    .breadcrumb-item {
        text-transform: uppercase;
        color: var(--midtone-theme2);
        font-weight: 600;

        &+.breadcrumb-item {
            color: var(--midtone-theme2);

            &::before {
                font-family: "FontAwesome";
                content: "\f061";
                color: var(--midtone-theme2);
            }
        }
    }

    .active {
        color: white !important;
    }
}

/*=============================================================
HERO
===============================================================*/

/*=============================================================
CARDS
===============================================================*/

.card-theme {
    position: relative;
    /*  border: 1px solid var(--midtone-theme); */
    text-align: center;
    border-radius: var(--border-theme);
    border: none;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 6px;

    .badge {
        position: absolute;
        font-size: var(--font-size-sm);
        font-weight: 600;
        color: var(--light-theme);
        border-radius: var(--border-theme);
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        width: 120px;
        right: -13px;
        transform: skew(20deg);

        & span {
            transform: skew(-20deg);
        }

        &.badge-new {
            color: white;
            background-color: var(--client-theme);
            top: 15px;
            height: 40px;
        }

        &.badge-discount {
            background-color: #d2f4ea;
            color: #13795b;
            top: 55px;
            height: 40px;
            font-weight: 600;
            font-size: var(--font-size-md);
        }
    }

    .card-image {
        height: 230px;
        margin-bottom: 0;
        margin: -1px -1px -1px;

        & img {
            height: 100%;
            object-fit: cover;
            border-radius: 0;
        }
    }

    .card-body {
        padding: 15px 15px 15px 15px;

        .card-title {
            font-size: var(--font-size-lg);
            font-weight: 600;
            margin: 0;
            text-align: left;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            overflow: hidden;
        }

        .card-model {
            font-size: var(--font-size-xs);
            color: var(--dark-theme);
            font-weight: 400;
            margin-bottom: 0;
            text-align: left;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            overflow: hidden;
        }
    }


    .card-footer {
        border-top: none;
        background-color: white;
        padding-top: 10px;

        .price-tag {
            color: var(--client-theme2);
            font-size: var(--font-size-2xl);
            font-weight: 600;
            line-height: 0.2;
        }

        .tax-tag {
            font-size: var(--font-size-xxs);
            /* font-style: italic; */
            font-weight: 300;
            color: var(--client-theme2);
            font-style: italic;
        }

        .old-price-tag {
            font-size: var(--font-size-sm);
            color: var(--midtone-theme2);
            text-decoration: line-through;
        }

        .card-footer__discount {
            font-size: var(--font-size-sm);
            background-color: #d2f4ea;
            color: #13795b;
            width: max-content;
            padding: 5px 10px;
            border-radius: 3px;
        }
    }
}


/*=============================================================
PARTES CARDS
===============================================================*/
.parts {

    .parts__wrap {

        & .parts__wrap__title {
            margin: 15px 0;


            @media (min-width:992px) {
                width: 45%;
                padding: 0 20px;
            }
        }

        .parts__wrap_group {
            position: relative;
            color: white;
            height: clamp(230px, 270px, 300px);
            padding: 20px;
            border-radius: var(--border-theme);
            margin: 15px 0;
            background-size: cover;
            background-position: center;
            transition: background 1s ease-in-out;

            .part-shadow {
                position: absolute;
                width: 100%;
                height: 100%;
                top: 0;
                left: 0;
                z-index: 0;
                border-radius: var(--border-theme);
                background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
                opacity: 50%;
                transition: all 0.3s ease-in-out;
            }

            &:hover {
                .part-shadow {
                    opacity: 80%;
                }
            }

            @media (min-width:992px) {
                margin: 15px;
            }



            .parts__single-title {
                font-size: var(--font-size-3xl);
                font-weight: 800;
                color: white;
                position: relative;
                z-index: 1;
            }

            .parts__single-list {
                font-size: var(--font-size-md);
                position: relative;
                z-index: 1;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 6;
                overflow: hidden;

                & a {
                    &:hover {
                        text-decoration: underline;
                    }
                }
            }

            .parts__single-more {
                font-size: var(--font-size-sm);
                font-weight: 400;
                position: relative;
                z-index: 1;
            }

            &.parts__wrap__eletrica {

                background-image: url(../../images/img/eletrica.png);

                @media (min-width:992px) {
                    width: 35%;
                }
            }

            &.parts__wrap__interior {
                background-image: url(../../images/img/interior.png);

                @media (min-width:992px) {
                    width: 25%;
                }
            }



            &.parts__wrap__airbags {
                background-image: url(../../images/img/airbags.png);

                @media (min-width:992px) {
                    width: 25%;
                }
            }

            &.parts__wrap__mecanica {
                background-image: url(../../images/img/mecanica.png);

                @media (min-width:992px) {
                    width: 45%;
                }
            }

            &.parts__wrap__chaparia {
                background-image: url(../../images/img/chaparia.png);

                @media (min-width:992px) {
                    width: 30%;
                }
            }
        }
    }
}


/*=============================================================
SEARCH
===============================================================*/
.search__wrap_main {

    & row {
        overflow: hidden;
    }

    .search-single-filter {

        &.search-livre {
            & input {
                width: 100%;
                height: 100%;
                border: none;
                padding: 22px;
                background-color: rgb(227, 227, 227);

                @media (max-width:992px) {
                    border-radius: var(--border-theme);
                    border: none;
                    padding: 24px;
                }
            }
        }

        & button {
            padding: 20px;
            border: none;
            border-radius: 0;
            border-right: 1px solid var(--midtone-theme2);

            @media (max-width:992px) {
                border-radius: var(--border-theme);
            }


            &:nth-child(1) {
                border-top-right-radius: var(--border-theme);
                border-bottom-right-radius: var(--border-theme);
                border: none;
            }

        }

        &.search-first {
            & button {
                border-top-left-radius: var(--border-theme);
                border-bottom-left-radius: var(--border-theme);
            }
        }

        &.search-last {
            & button {
                border-top-right-radius: var(--border-theme);
                border-bottom-right-radius: var(--border-theme);
            }
        }



    }
}

.search__wrap {

    & row {
        overflow: hidden;
    }

    .search-single-filter {

        &.search-livre {
            & input {
                width: 100%;
                height: 100%;
                border: none;
                padding: 22px;
                background-color: rgb(227, 227, 227);

                @media (max-width:992px) {
                    border-radius: var(--border-theme);
                    border: none;
                    padding: 24px;
                }
            }
        }

        & button {
            padding: 20px;
            border: none;
            border-radius: 0;
            border-right: 1px solid var(--midtone-theme2);

            @media (max-width:992px) {
                border-radius: var(--border-theme);
            }


            &:nth-child(1) {
                border-top-right-radius: var(--border-theme);
                border-bottom-right-radius: var(--border-theme);
                border: none;
            }

        }

        &.search-first {
            & button {
                border-top-left-radius: var(--border-theme);
                border-bottom-left-radius: var(--border-theme);
            }
        }



    }
}



/*=============================================================
CTA
===============================================================*/

/*=============================================================
NEWSLETTER
===============================================================*/
.newsletter {


    background-color: var(--midtone-theme2);
    color: var(--light-theme);

    .btn-client {
        padding: 20px;
    }

    .form-control {
        padding: 20px;
        border-radius: var(--border-theme);
        font-family: montserrat, sans-serif, FontAwesome;
        color: var(--midtone-theme2);

        &::placeholder {
            color: var(--midtone-theme2);
        }
    }

    .newsletter__title {
        position: relative;

        & img {
            position: absolute;
            bottom: -30px;
        }

        & h3 {
            font-size: var(--font-size-5xl);
            font-weight: 800;
            position: relative;

            @media (max-width: 992px) {
                font-size: var(--font-size-3xl);
            }
        }
    }

    .newsletter__caption {
        font-size: var(--font-size-xl);
        font-weight: 300;
    }

    .newsletter__terms {
        font-size: var(--font-size-sm);
        font-weight: 300;
    }

    .form-control:focus,
    .input-group>.form-floating:focus-within,
    .input-group>.form-select:focus {
        z-index: 1;
    }
}









/*=============================================================
FOOTER
===============================================================*/
.footer {
    background-color: var(--dark-theme);
    color: white;

    & h5 {
        font-weight: 700;
    }

    .nav-item {
        font-weight: 300;
        font-size: var(--font-size-sm);
    }

    .footer__logo {
        &img {
            height: 90px;
            width: 217px;
        }
    }


}

.whatsapp-button {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 300;

    @media (max-width:992px) {
        bottom: 80px;
        right: 10px;
    }

    & img {
        width: 50px;
        height: 100%;
    }
}



/*=============================================================
FLOOR
===============================================================*/
.floor {
    background-color: var(--midtone-theme3);
    color: var(--light-theme);
    font-size: var(--font-size-xxs);

}

/*=============================================================
MARCAS
===============================================================*/
.marcas {
    background-color: var(--midtone-theme);


    .marcas__wrap {
        filter: grayscale();
        opacity: 60%;

        .marcas__wrap__img-wrap {
            display: flex;
            justify-content: center;
            align-items: center;
        }

        & img {
            height: auto;
        }
    }
}


/*=============================================================

===============================================================*/

/*=============================================================
AMBIENTE
===============================================================*/

/*=============================================================
FEATURES
===============================================================*/

.features {
    color: var(--client-theme23);

    & h6 {
        font-size: var(--font-size-md);
    }

    & span {
        font-size: var(--font-size-sm);
    }
}

/*=============================================================
STOCK DETAIL
===============================================================*/

.stock-detail {

    .swiper {
        width: 100%;
        height: 100%;
    }

    .swiper-slide {
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .swiper {
        width: 100%;
        height: 300px;
        margin-left: auto;
        margin-right: auto;
    }

    .swiper-slide {
        background-size: cover;
        background-position: center;
    }

    .stock-detail__big {
        max-height: 65%;
        width: 100%;
    }

    .stock-detail__thumbs {
        margin-top: 20px;
        height: 100px;
        box-sizing: border-box;
        padding: 10px 0;
    }

    .stock-detail__thumbs .swiper-slide {
        width: 25%;
        height: 100%;
        opacity: 0.4;
    }

    .stock-detail__thumbs .swiper-slide-thumb-active {
        opacity: 1;
    }

    .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }


    .stock-detail__big {
        border-radius: var(--border-theme);

        & img {
            border-radius: var(--border-theme);
        }
    }

    .stock-detail__thumbs {
        border-radius: var(--border-theme);

        & img {
            border-radius: var(--border-theme);
        }
    }

    .stock-detail__title {
        & h2 {
            font-size: var(--font-size-xl);
            font-weight: 700;
            text-transform: uppercase;
        }

        & h3 {
            font-size: var(--font-size-md);
            font-weight: 400;
            color: var(--midtone-theme2);
        }
    }

    .rating {
        color: orange;
    }

    .rating__state {
        font-size: var(--font-size-sm);
        color: var(--midtone-theme2);
    }


    .stock-detail__pricing-wrap {

        .price-tag {
            color: var(--client-theme2);
            font-size: var(--font-size-3xl);
            font-weight: 800;
            line-height: 0.6;
        }

        .tax-tag {
            font-size: var(--font-size-xxs);
            font-weight: 300;
            color: var(--client-theme2);
            font-style: italic;
        }

        .old-price-tag {
            font-size: var(--font-size-sm);
            color: var(--midtone-theme2);
            text-decoration: line-through;
        }

        .discount {
            font-size: var(--font-size-sm);
            background-color: #d2f4ea;
            color: #13795b;
            width: max-content;
            padding: 5px 10px;
            border-radius: 3px;
        }

        & button {
            padding: 20px;
            text-transform: uppercase;
        }
    }

    .stock-detail__table-container {

        .stock-detail__table-title {
            font-weight: 300;
            color: var(--midtone-theme2);
        }

        .stock-detail__table-sub {
            font-weight: 600;
            color: var(--client-theme2);
        }

    }


}

/*=============================================================
OUTRAS PEÇAS DA VIATURA
===============================================================*/
.pecas-viatura {

    .pecas-viatura__bg {
        background-color: var(--midtone-theme);
    }

    .pecas-viaturas__spec-title {
        font-size: var(--font-size-md);
        color: var(--midtone-theme2);
    }

    .pecas-viaturas__spec {
        font-size: var(--font-size-md);
        font-weight: 600;
    }

    .swiper {
        width: 100%;
        height: 100%;
    }

    .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .swiper {
        width: 100%;
        height: 300px;
        margin: 20px auto;
    }

    .pecas-viatura__list-header {
        & input {
            padding: 10px 15px;
            border-radius: var(--border-theme);
            border: 1px solid var(--midtone-theme2);
        }
    }

    .pecas-viatura__table {
        .pecas-viatura__table-titles {
            & th {
                background-color: var(--midtone-theme);
                font-weight: 300;
                font-size: var(--font-size-sm);
            }
        }

        & td {
            vertical-align: middle;
        }

        .pecas-viatura__table__thumbnail {
            height: 70px;
            width: 70px;
            padding: 5px;
        }

        .pecas-viatura__table__thumbnail img {
            height: 100%;
            object-fit: cover;
        }

        .pecas-viatura__table__reference {
            font-size: var(--font-size-sm);
            font-weight: 600;
            color: var(--dark-theme);
            width: 20%;
        }

        .pecas-viatura__table__part {
            font-size: var(--font-size-sm);
            font-weight: 600;
            color: var(--dark-theme);

        }

        .pecas-viatura__table__price {
            font-size: var(--font-size-sm);
            width: 10%;
            font-weight: 600;
        }

    }


}


/*=============================================================
CONTACTOS
===============================================================*/
.contactos {
    .contact-title {
        font-size: var(--font-size-md);
        font-weight: 400;
        color: var(--midtone-theme2);
    }

    .contact-info {
        font-size: var(--font-size-md);
        font-weight: 700;
    }

    .contact-social {
        & svg {
            fill: var(--client-theme3);
        }
    }
}

.contactos__form {
    background-color: var(--midtone-theme);

    & input,
    textarea {
        padding: 20px;
        border-radius: var(--border-theme);

        &::placeholder {
            color: var(--midtone-theme2);
        }
    }

    .form-check {
        .form-check-input {
            padding: 0;
        }

        & label {
            color: var(--midtone-theme2);
        }
    }

    & button {
        padding: 20px;
    }

}

/*=============================================================
salvados
===============================================================*/

/*=============================================================
Pagination
===============================================================*/

.pagination {
    --bs-pagination-disabled-bg: transparent;
    --bs-pagination-disabled: transparent;
    font-family: Lato;
    font-size: var(--font-size-md);
}

.pagination .page-link {
    padding: 5px 15px;
    color: var(--dark-theme);
    border-color: rgba(128, 128, 128, 0.24);
    background-color: transparent;
    border-radius: 5px;
}

.page-link:hover {
    background-color: var(--client-theme);
    color: var(--light-theme)
}

.active>.page-link,
.page-link.active {
    color: var(--light-theme);
    background-color: var(--client-theme2);
    border-color: var(--midtone-theme);
}

.page-item:first-child .page-link,
.page-item:last-child .page-link {
    font-weight: 600;
}

.navigation__custom-next,
.navigation__custom-prev {
    font-family: "Font Awesome 5 free";
    font-weight: 900;
}

/*=============================================================
STOCK ASSORTENT / ORDENAÇÃO
===============================================================*/
.stock-assortment {
    .stock-assortment__order {
        & button {
            background-color: white;
        }
    }

}

/*=============================================================
SOBRE NOS
===============================================================*/

.section-sobre {
    .sobre-image {
        height: 350px;

        & img {
            height: 350px;
            width: 100%;
            object-fit: cover;
        }
    }

}




/*=============================================================
VFV
===============================================================*/
.section-vfv {

    .btn-client {
        padding: 20px;
    }

    & p {
        color: var(--midtone-theme3);
    }
}

.section-vfv__form-wrap {

    .section-vfv__text {
        color: var(--midtone-theme2);
    }

    & input,
    textarea {
        padding: 20px;
        border-radius: var(--border-theme);
    }

    .btn-client {
        padding: 20px;
    }

    .section-vfv__form__title {
        font-size: var(--font-size-xl);
        font-weight: 600;
        margin: 0 0 50px 0;
    }

    @media (max-width:992px) {
        .btn-client {
            width: 100%;
        }
    }


}



/*  ------------------------------------------------------------
upload de fotos drop-zone*/
.section-vfv__form-wrap__drop-wrap {
    background-color: white;
    padding: 10px;
    border-radius: 10px;
    border: 1px dashed var(--midtone-theme2);
}

.section-vfv__form-wrap .drop-zone {
    /* max-width: 700px; */
    height: 185px;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--midtone-theme);
    font-size: var(--font-size-sm);
    font-weight: 300;
    cursor: copy;
    border: 1px dashed var(--midtone-theme);
    border-radius: 10px;
}

.section-vfv__form-wrap .drop-zone:hover {
    border: 1px dashed var(--midtone-theme);
    background-color: #ffffffbb;
}

.section-vfv__form-wrap .drop-zone--over {
    border-style: solid;
}

.section-vfv__form-wrap .drop-zone__prompt {
    color: rgba(0, 0, 0, 0.6);
}

.section-vfv__form-wrap .drop-zone__input {
    display: none;
}

.section-vfv__form-wrap .drop-zone__thumb {
    width: 100%;
    height: 100%;
    margin-left: 0.3rem;
    margin-right: 0.3rem;
    border-radius: 10px;
    overflow: hidden;
    background-color: #cccccc;
    background-size: cover;
    background-position: center;
    position: relative;
}

.section-vfv__form-wrap .drop-zone__thumb::after {
    content: attr(data-label);
    position: absolute;
    color: var(--midtone-theme);
    font-size: var(--font-size-sm);
    font-weight: 300;
    text-align: center;
}

/*=============================================================
LISTA DE PARTES
===============================================================*/
.section-list {

    .list-item {
        &:before {
            position: relative;
            font-family: "Font Awesome 5 Free";
            font-weight: 100;
            content: "\f111";
            font-size: 7px;
            color: var(--client-theme3);
            padding: 0 7px;
            top: -3px;
            display: inline-block;
        }

        &:hover {
            color: var(--client-theme);

            &:before {
                font-weight: 900;
            }
        }
    }

    .list {
        -webkit-column-count: 4;
        -moz-column-count: 4;
        column-count: 4;
        -webkit-column-width: 200px;
        -moz-column-width: 200px;
        column-width: 200
    }

}


/*=============================================================
black friday counter
===============================================================*/

.blackfriday {


    /* general styling */

    /*  body {
        align-items: center;
        background-color: #ffd54f;
        display: flex;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    } */

    .container {
        color: #333;
        margin: 0 auto;
        text-align: center;
    }

    h1 {
        font-weight: bold;
        letter-spacing: 0.125rem;
        text-transform: uppercase;
        font-size: 1.3rem;
    }

    li {
        display: inline-block;
        list-style-type: none;
        padding: 1em;
        text-transform: uppercase;

        span {
            display: block;
            font-size: 1.5rem;
            font-weight: bold;
            color: var(--client-theme3);
        }
    }

    &.bf-mobile {
        h1 {
            font-weight: bold;
            letter-spacing: 0.1rem;
            text-transform: uppercase;
            font-size: 1rem;
        }

        li {
            display: inline-block;
            list-style-type: none;
            padding: 0.4em;
            text-transform: uppercase;
            font-size: 0.7rem;

            span {
                display: block;
                font-size: 1.1rem;
                font-weight: bold;
            }
        }
    }

}




/*=============================================================
BLACK WEEKEND COLORS
===============================================================*/
.layout-black-friday .small-banner-main {
    background-color: #00242e;
    color: #FFFFFF;
}
.layout-black-friday .banner__background {
/*    background-image: url(../../images/main/blackFriday-small.png) !important;*/
    box-shadow: inset 10000px 10000px #00242e6b;
    height: 340px;
}
/*.layout-black-friday .banner__background > .container {
    display: none;
}*/
.layout-black-friday .faqs {
    line-height: 2;
}
.layout-black-friday .faqs h2 {
    font-size: 1.9rem;
    color: #FFFFFF;
}
.layout-black-friday .faqs p {
    margin-bottom: 30px;
}
/*.card-theme .badge-discount:after {
    content: url(../../images/img/badge-BlackFriday.png);
    display: block;
    object-fit: cover;
    height: 100%;
    width: 100%;
    position: absolute;
    right: -15px;
    top: -50px;
    transform: skew(-20deg);
}*/