@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');
@import url('app-variables.css');
@import url('app-media.css?v1');


/* BASE */
::selection {
    background-color: #181a1b;
    color: #fff;
}


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #939393;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #939393;
    :: -ms-input-placeholder
}

{ /* Microsoft Edge */
    color: #939393;
}

*,
*::before,
*::after {
    border: none;
    outline: none;
    list-style: none;
    box-sizing: border-box;
    border-collapse: inherit;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent;
}

html, body {
    scroll-behavior: smooth;
    /* overflow-x: hidden; */
    height: 100%;
}

    html.js-hidden-layout {
        overflow-y: hidden;
    }

body {
    margin: 0;
    font-size: 16px;
    line-height: 1.6667;
    background-color: #fff;
    color: #222;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: "Figtree", sans-serif;
    overflow-x: hidden;
}

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

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

h1, h2, h3,
h4, h5, h6 {
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
    line-height: inherit;
}

p {
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}

button, input {
    box-shadow: none;
    outline: none !important;
    margin: 0;
    padding: 0;
    background-color: transparent;
    box-shadow: none;
}

[type="button"], [role="button"] {
    -webkit-appearance: none;
    border-radius: 0;
}

.btn {
    padding: 8px 36px;
    border-radius: 8px;
    transition: .15s background-color ease, .15s color ease, .15s transform ease, .15s border-color ease;
    will-change: background-color, color, transform, border-color;
}

.btn-xs {
    padding: 6px 12px
}

.btn-sm {
    padding: 6px 16px !important
}

.btn-main {
    font-weight: 600;
}

.btn-white {
    background-color: var(--light-100)
}

    .btn-white:hover {
        background-color: var(--light-200)
    }

.btn-blue {
    background-color: var(--primary);
    color: #fff;
}

    .btn-blue:hover {
        background-color: var(--primary-darker);
        color: #fff;
    }

    .btn-blue.btn-bordered {
        background: transparent;
        border: 1px solid var(--primary);
        color: var(--primary);
    }

        .btn-blue.btn-bordered:hover {
            background-color: var(--primary);
            color: #fff;
        }

ul, ol, li {
    list-style-type: none;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
    padding-inline-start: 0;
}

p {
    margin: 0
}

textarea {
    resize: none;
}

img[data-image-type="icon"] {
    width: 100%;
    height: auto;
    cursor: pointer
}

img[data-layout-type="cover-w"] {
    width: 100%;
    height: auto
}

img[data-layout-type="cover-h"] {
    width: auto;
    height: 100%
}

img[data-layout-type="cover-f"] {
    width: 100%;
    height: 100%;
    object-fit: cover
}

img[data-layout-type="contain-w"] {
    width: 100%;
    object-fit: contain
}

img[data-layout-type="contain-h"] {
    height: 100%;
    object-fit: contain
}

img[data-layout-type="contain-f"] {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.p10 {
    padding: 10px;
}

.glightbox-open {
    height: 100% !important;
}

.hide-scroll {
    overflow-y: hidden; /* Hide vertical scrollbar */
    overflow-x: hidden; /* Hide horizontal scrollbar */
}

body.hidescroll {
    overflow: hidden;
}

.invalid-feedback-custom {
    width: 100%;
    margin-top: 0.25rem;
    font-size: 1em;
    color: var(--bs-form-invalid-color);
}

.formHata {
    background: #e98484;
    padding: 10px 20px;
    color: #fff;
}

h2#swal2-title {
    font-size: 1.3em !important;
}

.swal2-icon {
    font-size: 0.8em !important;
}


.pt-25 {
    padding-top: 25px;
}

.pt-50 {
    padding-top: 50px;
}

.pt-75 {
    padding-top: 75px;
}

.pt-100 {
    padding-top: 100px;
}

.pb-25 {
    padding-bottom: 25px;
}

.pb-50 {
    padding-bottom: 50px;
}

.pb-75 {
    padding-bottom: 75px;
}

.pb-100 {
    padding-bottom: 100px;
}

.mt-25 {
    margin-top: 25px;
}

.mt-50 {
    margin-top: 50px;
}

.mt-75 {
    margin-top: 75px;
}

.mt-100 {
    margin-top: 100px;
}

.mb-25 {
    margin-bottom: 25px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-75 {
    margin-bottom: 75px;
}

.mb-100 {
    margin-bottom: 100px;
}
/* END BASE*/

/* MASTER */

section.breadcrumb-wrapper {
    /* padding: 20px 0; */
}

    section.breadcrumb-wrapper .breadcrumb .breadcrumb-item a {
        font-size: 14px;
    }

header {
    /* position: fixed; */
    width: 100%;
    z-index: 1000;
}

    header .top {
        height: 100px;
        border-bottom: 3px solid var(--primary);
    }

        header .top .container .logo {
            height: 100%;
            display: flex;
            align-items: center;
        }

            header .top .container .logo img {
                height: 80%;
                display: block;
            }

        header .top .container .right-container {
            display: flex;
            gap: 40px;
        }

            header .top .container .right-container .user-account-container {
                display: flex;
                align-items: center;
                border: 1px solid var(--black-alpha-500);
                border-radius: 6px;
            }


                header .top .container .right-container .user-account-container .user-box {
                    color: #333;
                    font-size: 13px;
                    padding: 10px 55px 10px 65px;
                    border: 1px solid #ffffff52;
                    position: relative;
                    font-family: "Arial", sans-serif;
                    border-radius: 5px;
                    cursor: pointer;
                }

                    header .top .container .right-container .user-account-container .user-box::before {
                        content: "\f007"; /* Font Awesome user */
                        font-family: "Font Awesome 7 Free";
                        font-weight: 900;
                        position: absolute;
                        left: 18px;
                        top: 50%;
                        transform: translateY(-50%);
                        font-size: 26px;
                    }

                    header .top .container .right-container .user-account-container .user-box::after {
                        content: "\f078"; /* Font Awesome chevron-down */
                        font-family: "Font Awesome 7 Free";
                        font-weight: 700;
                        position: absolute;
                        right: 15px;
                        top: 50%;
                        transform: translateY(-50%);
                        font-size: 16px;
                    }

                    header .top .container .right-container .user-account-container .user-box .title {
                        font-weight: 700;
                        font-size: 14px;
                    }


            header .top .container .right-container .basket-container {
                position: relative;
                display: flex;
                align-items: center;
            }

                header .top .container .right-container .basket-container .basket-box {
                    background: var(--primary);
                    color: #fff;
                    padding: 9px 11px;
                    border-radius: 6px;
                    font-size: 17px;
                }

                header .top .container .right-container .basket-container .count {
                    position: absolute;
                    top: 6px;
                    right: -11px;
                    background: #fff;
                    color: #222;
                    font-size: 11px;
                    min-width: 22px;
                    height: 22px;
                    line-height: 22px;
                    text-align: center;
                    border-radius: 50%;
                    font-weight: bold;
                    border: 1px solid var(--black-alpha-500);
                }
header .search {
    width: 40%;
}

header .search .wrapper input[type="text"] {
    background: #fff;
    padding: 10px 30px;
    width: 84%;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    border: 1px solid var(--black-alpha-500);
}

    header .search .wrapper button {
        background: var(--primary);
        padding: 10px 30px;
        color: #FFF;
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
        border: 1px solid var(--primary);
    }

    header .nav-bar {
        width: 100%;
        border-bottom: 1px solid var(--light-grey);
        background: #fff;
        /* padding: 15px 0; */
        height: 55px;
        display: flex;
        align-items: center;
    }

        header .nav-bar ul {
            display: flex;
            gap: 30px;
            height: 55px;
        }

            header .nav-bar ul li {
                height: 100%;
            }

                header .nav-bar ul li a {
                    font-size: 16px;
                    font-weight: 500;
                    padding: 0px 20px;
                    height: 100%;
                    display: inline-block;
                    align-content: center;
                }

                header .nav-bar ul li:hover a {
                    background-color: var(--primary);
                    color: #fff;
                }
/* END MASTER */

.page-home {
    /* margin-top: 155px; */
    display: inline-block;
    width: 100%;
}

    .page-home section.banner {
        padding: 50px 0;
    }

        .page-home section.banner .container {
            display: flex;
            gap: 50px;
        }

            .page-home section.banner .container .wrapper {
                width: 100%;
                aspect-ratio: 21/9;
                border-radius: 10px;
                overflow: hidden;
            }

                .page-home section.banner .container .wrapper .swiper .swiper-wrapper .swiper-slide {
                    border-radius: 10px;
                    overflow: hidden;
                }

                    .page-home section.banner .container .wrapper .swiper .swiper-wrapper .swiper-slide a {
                        display: block;
                        border-radius: 10px;
                        overflow: hidden;
                        height: 100%;
                        width: 100%;
                    }

                        .page-home section.banner .container .wrapper .swiper .swiper-wrapper .swiper-slide a img {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                            object-position: top left;
                            border-radius: 10px;
                            -webkit-border-radius: 11px;
                            -moz-border-radius: 10px;
                            overflow: hidden;
                        }

                .page-home section.banner .container .wrapper .swiper .swiper-pagination-bullet {
                    width: 18px !important;
                    height: 18px !important;
                    background: #fff !important;
                    border: 1px solid #333 !important;
                    opacity: .8
                }

                .page-home section.banner .container .wrapper .swiper .swiper-pagination-bullet-active {
                    opacity: 1;
                }

            

                /*promotions*/

    .page-home section.promotions {
        /* padding: 50px 0; */
    }

        .page-home section.promotions .wrapper {
            display: flex;
            gap: 20px;
        }

            .page-home section.promotions .wrapper .item {
                width: calc((100% - 100px) / 6);
            }

                .page-home section.promotions .wrapper .item .image {
                    aspect-ratio: 1;
                }

                    .page-home section.promotions .wrapper .item .image img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }

                .page-home section.promotions .wrapper .item .text {
                    text-align: center;
                    font-size: 14px;
                    margin-top: 10px;
                }


    /* featured */
    .page-home section.featured-products,
    .page-home section.new-products,
    .page-home section.brands {
        padding: 50px 0;
    }

.page-home section.new-products {
    background: var(--primary);
    margin-top: 50px;
}

    .page-home section.featured-products h2,
    .page-home section.brands h2 {
        padding-bottom: 20px;
    }
       
    .page-home section.new-products h2
    {
        padding-bottom: 20px;
        text-align:center;
        color:#fff;
    }

    .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide,
    .page-home section.new-products .products-wrapper .newSwiper .swiper-slide,
    .page-home section.brands .products-wrapper .brandsSwiper .swiper-slide {
        /* width: calc((100% - 90px) / 4); */
        transition: .5s;
        padding: 10px;
        border: 1px solid #22222224;
        background: #FFF;
        border-radius: 6px;
    }




    .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide,
    .page-home section.new-products .products-wrapper .newSwiper .swiper-slide,
    .page-home section.brands .products-wrapper .brandsSwiper .swiper-slide {
        display: flex;
        flex-direction: column;
        height: 100%;
        font-size: 0.9em;
    }

        .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide .image,
        .page-home section.new-products .products-wrapper .newSwiper .swiper-slide .image
         {
            height: 220px;
            width: 100%;
        }

        .page-home section.brands .products-wrapper .brandsSwiper .swiper-slide .image {
            height: 100px;
            width: 100%;
        }

            .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide .image img,
            .page-home section.new-products .products-wrapper .newSwiper .swiper-slide .image img
             {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }
            .page-home section.brands .products-wrapper .brandsSwiper .swiper-slide .image img {
                width: 100%;
                height: 100%;
                object-fit: contain;
                /* filter: grayscale(100%); */
            }
        .page-home section.brands .products-wrapper .brandsSwiper .swiper-slide .image img:hover {
            
            filter: none;
        }
        

        .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide .title,
        .page-home section.new-products .products-wrapper .newSwiper .swiper-slide .title {
            font-weight: 500;
            text-align: center;
            /* padding-top: 10px; */
            margin-bottom: 20px;
            flex-grow: 1;
        }
            .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide .price,
            .page-home section.new-products .products-wrapper .newSwiper .swiper-slide .price {
                font-size: 20px;
                font-weight: 700;
            }

            .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide .bottom,
            .page-home section.new-products .products-wrapper .newSwiper .swiper-slide .bottom {
                display: flex;
                justify-content: space-between;
                flex-direction: row;
                width: 100%;
                margin-top: 20px;
            }

            .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide .fav,
            .page-home section.new-products .products-wrapper .newSwiper .swiper-slide .fav {
                position: absolute;
                top: 20px;
                right: 20px;
                width: 35px;
                height: 35px;
                border-radius: 50%;
                background: #f7f7f7;
                display: flex;
                align-items: center;
                justify-content: center;
                border: 1px solid #bbbbbb;
            }
                .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide .fav.active i,
                .page-home section.new-products .products-wrapper .newSwiper .swiper-slide .fav.active i {
                    color: #ff5757;
                }


            .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide .bottom .btn-incele,
            .page-home section.new-products .products-wrapper .newSwiper .swiper-slide .bottom .btn-incele {
                border: 1px solid #dddddd;
                padding: 5px 13px;
                border-radius: 6px;
                background: #ffffff;
                color: #000000;
            }
            .page-home section.featured-products .products-wrapper .featuredSwiper .swiper-slide .bottom .btn-sepete-ekle,
            .page-home section.new-products .products-wrapper .newSwiper .swiper-slide .bottom .btn-sepete-ekle {
                border: 1px solid #dddddd;
                padding: 5px 13px;
                border-radius: 6px;
                background: var(--primary);
                color: #fff;
            }

    .page-home section.featured-products .header,
    .page-home section.new-products .header,
    .page-home section.brands .header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 15px;
        position: relative;
    }

            .page-home section.featured-products .header .pagination-featured,
            .page-home section.new-products .header .pagination-new,
            .page-home section.brands .header .pagination-brands {
                position: static; /* artık absolute olmasına gerek yok */
                width: auto;
            }


                .page-home section.featured-products .header .pagination-featured span.swiper-pagination-bullet,
                .page-home section.new-products .header .pagination-new span.swiper-pagination-bullet,
                .page-home section.brands .header .pagination-brands span.swiper-pagination-bullet {
                    height: 15px;
                    width: 15px;
                    background: #222;
                    border: 1px solid;
                    padding: 2px;
                    margin: 2px;
                }

    .page-home section.ads {
        padding: 50px 0;
    }

        .page-home section.ads .wrapper {
            display: flex;
            gap: 20px;
            flex-wrap: wrap;
        }

    section.ads .wrapper .item {
    width: calc((100% - 20px) / 2);
}
        .page-home section.ads .wrapper .item a {
            aspect-ratio:16/9;
        }
            .page-home section.ads .wrapper .item a img {
                width:100%;
                height:100%;
                object-fit:cover;
            }

.page-product-list {
    /* margin-top: 155px; */
    display: inline-block;
    width: 100%;
    padding: 50px 5%;
}

    .page-product-list .page-wrapper {
        display: flex;
        gap: 50px;
    }

        .page-product-list .page-wrapper .left {
            width: 340px;
        }

            .page-product-list .page-wrapper .left  .accordion-button:focus {
                outline: none;
                box-shadow: none;
            }

.page-product-list .page-wrapper .left .accordion-button {
    outline: none;
    box-shadow: none;
    padding:10px 20px;
}
.page-product-list .page-wrapper .left .accordion-button:not(.collapsed) {
    color: #333;
    background-color: #f5f5f5;
    outline: none;
    box-shadow: none;
}

            .page-product-list .page-wrapper .left .accordion-item .accordion-body ul li {
                display: flex;
                align-items: center;
            }

            .page-product-list .page-wrapper .left .accordion-item .accordion-body input[type=checkbox] {
                width: 14px;
                height: 14px;
            }

            .page-product-list .page-wrapper .left .accordion-item .accordion-body label {
                font-size: 14px;
                margin-left: 10px;
            }


            .page-product-list .page-wrapper .left .accordion-item .accordion-body input[type=number] {
                width: calc(50% - 8px);
                border: 1px solid #d5d5d5;
                border-radius: 5px;
                padding: 5px 10px;
                font-size: 1rem;
            }





        .page-product-list .page-wrapper .right {
            width: calc(100% - 390px);
        }

            .page-product-list .page-wrapper .right section.list-header .title {
                display: flex;
                align-items: center;
                gap: 15px;
            }

                .page-product-list .page-wrapper .right section.list-header .title h1 {
                    font-size: 24px;
                    font-weight: 500;
                    line-height: 1;
                }

                .page-product-list .page-wrapper .right section.list-header .title small {
                    font-size: 17px;
                    font-weight: 600;
                    color: var(--primary);
                    line-height: 1;
                }

section.product-list {padding-top: 50px;}
    
    .page-product-list section.product-list .wrapper {
        display: flex;
        gap: 30px;
        flex-wrap: wrap;
    }

        .page-product-list section.product-list .wrapper .item {
            width: calc((100% - 90px) / 4);
            transition: .5s;
            padding: 20px;
            border: 1px solid #22222224;
            background: #FFF;
            border-radius: 6px;
            position: relative;
        }

            .page-product-list section.product-list .wrapper .item .image {
                aspect-ratio: 1;
                width: 100%;
            }

                .page-product-list section.product-list .wrapper .item .image img {
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                }
.page-product-list section.product-list .wrapper .item .brand {
    text-align: center;
}
            .page-product-list section.product-list .wrapper .item .title {
                font-weight: 500;
                text-align: center;
                /* padding-top: 10px; */
                margin-bottom: 20px;
                font-size: 18px;
            }

            .page-product-list section.product-list .wrapper .item .short-desc {
                font-size: 14px;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }

            .page-product-list section.product-list .wrapper .item .fav {
                position: absolute;
                top: 20px;
                right: 20px;
                width: 35px;
                height: 35px;
                border-radius: 50%;
                background: #f7f7f7;
                display: flex;
                align-items: center;
                justify-content: center;
                border: 1px solid #bbbbbb;
            }

                .page-product-list section.product-list .wrapper .item.fav.active i {
                    color: #ff5757;
                }

            .page-product-list section.product-list .wrapper .item .bottom {
                display: flex;
                justify-content: space-between;
                border-top: 1px solid #22222224;
                padding: 20px 10px 0;
                margin-top: 20px;
            }

                .page-product-list section.product-list .wrapper .item .bottom .price {
                    font-size: 18px;
                    font-weight: 700;
                }

                .page-product-list section.product-list .wrapper .item .bottom .btn-sepete-ekle {
                    font-size: 18px;
                    color: var(--primary)
                }

.detail {
    display:flex;
    width: 70%;
    flex-direction: column;
}
.detail .title {
    font-size: 17px;
    font-weight: 700;
}
.product-quantity .bottom {
    margin-top: auto;
    text-align: right;
    color: var(--light-blue);
}

    .product-quantity .bottom .fav {
        padding: 10px;
        border: 1px solid var(--light-grey);
        border-radius: 6px;
    }

        .product-quantity .bottom .fav.active {
            color: red;
        }

    .product-quantity .bottom .basket {
        background-color: var(--light-blue);
        color: #fff;
        padding: 10px 20px;
        border-radius: 6px;
    }

        .product-quantity .bottom .basket i {
            margin-right: 20px;
        }

.product-info .detail .bottom {
    margin-top: auto;
    text-align: right;
    font-size: 24px;
    color: var(--light-blue);
}

.page-product-detail {
    margin-top: 155px;
    display: inline-block;
    width: 100%;
}

    .page-product-detail .product-detail-main {
        display: flex;
        gap: 30px;
        margin-bottom: 50px;
        align-items: flex-start;
    }
    .page-product-detail .product-detail-main section.product-info-container {
        /* display: flex; */
        /* gap: 30px; */
        /* align-items: flex-start; */
        /* display: flex; */
        /* gap: 30px; */
        width: calc(((100% - 30px) / 3) * 2);
    }

    .page-product-detail .product-detail-main section.product-info-container .product-info-wrapper {
        display: flex;
        gap: 30px;
        /* width: calc(((100% - 30px) / 3) * 2); */
    }
        .page-product-detail .product-detail-main section.product-info-container .product-info-wrapper .image {
            border: 1px solid var(--light-grey);
            border-radius: 6px;
            padding: 30px;
            width: 50%;
        }

            .page-product-detail .product-detail-main section.product-info-container .product-info-wrapper .image .wrapper .gallery-container .slick-slide img {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }

            .page-product-detail .product-detail-main section.product-info-container .product-info-wrapper .image .wrapper .gallery-container .slider-galeria-thumbs img {
                width: 100%;
                height: 100px;
                object-fit: contain;
            }

            .page-product-detail .product-detail-main section.product-info-container .product-info-wrapper .image .wrapper .gallery-container .slider-galeria-thumbs {
                margin-top: 20px;
            }

        .page-product-detail .product-detail-main section.product-info-container .product-info-wrapper .product-info {
            width: 100%;
            border: 1px solid var(--light-grey);
            border-radius: 6px;
            padding: 30px;
            display: flex;
            flex-direction: column;
        }
            .page-product-detail .product-detail-main section.product-info-container .product-info-wrapper .product-info .info-card {
                display: grid;
                grid-template-columns: 50% 50%;
                grid-auto-flow: column;
                line-height: 4;
            }
            .page-product-detail .product-detail-main section.product-info-container .product-info-wrapper .product-info .bottom {
                margin-top: auto;
                width: 100%;
            }

                .page-product-detail .product-detail-main section.product-info-container .product-info-wrapper .product-info .bottom .icon a {
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    border: 1px solid var(--light-grey);
                    padding: 10px;
                }

    .page-product-detail section.basket-container {
        width: calc(((100% - 30px) / 3) * 1);
        position: sticky;
        top: 185px;
    }

        .page-product-detail section.basket-container .basket-wrapper {
            width: 100%;
            border: 1px solid var(--light-grey);
            border-radius: 6px;
            padding: 30px;
            line-height: 3;
        }

            .page-product-detail section.basket-container .basket-wrapper .info-card {
                display: grid;
                grid-template-columns: 50% 50%;
                grid-auto-flow: column;
            }


            .page-product-detail section.basket-container .basket-wrapper .quantity-picker {
                display: inline-flex;
                align-items: center;
                border: 1px solid #ddd;
                border-radius: 8px;
                overflow: hidden;
                font-family: Arial, sans-serif;
                line-height: 1;
            }

                .page-product-detail section.basket-container .basket-wrapper .quantity-picker input {
                    width: 63%;
                    text-align: center;
                    border: none;
                    font-size: 16px;
                    background: #fff;
                    pointer-events: none;
                }

            .page-product-detail section.basket-container .basket-wrapper .qty-btn {
                width: 40px;
                height: 40px;
                border: none;
                background: #f5f5f5;
                font-size: 20px;
                cursor: pointer;
                transition: background 0.2s;
            }

                .page-product-detail section.basket-container .basket-wrapper .qty-btn:hover {
                    background: #e0e0e0;
                }

                .page-product-detail section.basket-container .basket-wrapper .qty-btn:active {
                    background: #d0d0d0;
                }


        .page-product-detail section.basket-container .price-container{
            border:1px solid var(--light-grey);
            padding: 20px;
            margin-bottom:30px;
            border-radius:6px;
            position: relative;
        }

        .page-product-detail section.basket-container .price-container .price-box {
            display: grid;
            grid-template-columns: 50% 50%;
            grid-auto-flow: column;
            line-height: 3;
        }

  .page-product-detail section.basket-container .price-container .price-box  span.price-value {
    text-align: right;
}
.page-product-detail section.basket-container .price-container h2 {
    font-size: 21px;
    /* color: var(--light-blue); */
    font-weight: 500;
}
            .page-product-detail section.basket-container .price-container .price-box .old-price {
                position: relative;
                color: #bbbbbb;
                font-weight: 700;
            }

                .page-product-detail section.basket-container .price-container .price-box .old-price::after {
                    content: "";
                    position: absolute;
                    left: 0;
                    top: 50%;
                    width: 100%;
                    height: 1.5px;
                    background: #e3e3e3;
                }

    .discount {
    position: absolute;
    top: 0;
    right: 0;
    padding: 5px 20px;
    background: #00c919;
    border-top-right-radius: 6px;
    color: #fff;
}

.page-product-detail section.basket-container .basket-wrapper  .basket {
    background-color: var(--light-blue);
    color: #fff;
    padding: 0px 20px;
    border-radius: 6px;
    width: 60%;
}

    .page-product-detail section.basket-container .basket-wrapper  .basket i {
        margin-right: 20px;
    }

.page-product-detail section.basket-container .basket-wrapper table.basket-price {
    width: 100%;
    margin-top: 40px;
}

    .page-product-detail section.basket-container .basket-wrapper table.basket-price th {
        font-size: 14px;
        border: 1px solid var(--light-grey);
        padding: 5px 10px;
        text-align: center;
    }

    .page-product-detail section.basket-container .basket-wrapper table.basket-price td {
        font-size: 14px;
        border: 1px solid var(--light-grey);
        padding: 5px 10px;
        text-align: right;
    }

.page-product-detail section.product-detail-container {
    PADDING: 20px;
    border: 1px solid var(--light-grey);
    margin-top: 30px;
    border-radius: 6px;
}

    .page-product-detail section.product-detail-container h2 {
        font-size: 21px;
        padding-bottom: 20px;
    }

.page-product-detail section.product-detail-container .detail table td:first-child {
    font-weight: bold;
    line-height: 4;
}

.product-detail-main .product-info h1 {
    font-size: 24px;
}

.page-product-detail .ads {
    width: 100%;
    margin-top: 30px;
}

    .page-product-detail .ads img {
        width: 100%;
        border-radius: 6px;
    }


.page-checkout {
    margin-top: 155px;
    display: inline-block;
    width: 100%;
}
    .page-checkout .container {
        display: flex;
        gap:30px;
        padding: 50px 0;
        align-items: flex-start;
    }

        .page-checkout .container .left {
            width: 70%;
        }

        .page-checkout .container .right {
            width: 30%;
            position: sticky;
            top: 185px;
        }

        .page-checkout .container .left .menu ul {
            display: flex;
            gap: 30px;
            /* justify-content: space-around; */
        }

            .page-checkout .container .left .menu ul li a {
                display: inline-block;
                padding: 10px 30px;
                border-radius: 6px;
                background: #f5f5f5;
                cursor:pointer;
            }

                .page-checkout .container .left .menu ul li a.active {
                    background: #222;
                    color: #FFF;
                }

        .page-checkout .container .left .basket-info{
                        margin-top:30px;
        
        }
        .page-checkout .container .left .basket-info .cart-items {
            /* border: 1px solid var(--light-grey); */
        }
   .page-checkout .container .left .basket-info .cart-items  table {
    width: 100%;
}

            .page-checkout .container .left .basket-info .cart-items table td {
                padding: 20px;
                border: 1px solid var(--light-100);
            }

            .page-checkout .container .left .basket-info .cart-items img {
                height: 150px;
            }

            .page-checkout .container .left .basket-info .cart-items .quantity-picker {
                display: inline-flex;
                align-items: center;
                border: 1px solid #ddd;
                border-radius: 8px;
                overflow: hidden;
                font-family: Arial, sans-serif;
            }

                .page-checkout .container .left .basket-info .cart-items .quantity-picker input {
                    width: 50px;
                    text-align: center;
                    border: none;
                    font-size: 16px;
                    background: #fff;
                    pointer-events: none;
                }

                .page-checkout .container .left .basket-info .cart-items .quantity-picker .qty-btn {
                    width: 40px;
                    height: 40px;
                    border: none;
                    background: #f5f5f5;
                    font-size: 20px;
                    cursor: pointer;
                    transition: background 0.2s;
                }

                    .page-checkout .container .left .basket-info .cart-items .quantity-picker .qty-btn:hover {
                        background: #e0e0e0;
                    }

                    .page-checkout .container .left .basket-info .cart-items .quantity-picker .qty-btn:active {
                        background: #d0d0d0;
                    }

            .page-checkout .container .left .basket-info .cart-items .stock{
                margin-top:30px;
            }

            .page-checkout .container .left .basket-info .cart-items .info-card {
                display: flex;
                justify-content: space-between;
                border-bottom: 1px solid var(--light-grey);
                padding: 10px 0;
                line-height: 1.2;
            }

                .page-checkout .container .left .basket-info .cart-items .info-card:last-child {
                    border: none;
                }

                .page-checkout .container .left .basket-info .cart-items .info-card span:last-child {
                    font-weight: bold;
                }

                .page-checkout .container .left .basket-info .cart-items .info-card span small {
                    font-size: 12px;
                    color: #898989;
                }

        .page-checkout .container .right .title {
            font-size: 24px;
            font-weight: 500;
            border-bottom: 1px solid #37688338;
            padding-bottom: 10px;
        }

        .page-checkout .container .right .order-summary {
            padding: 20px;
            background: #3768830d;
            border-radius: 6px;
            border: 1px solid var(--light-blue);
        }

            .page-checkout .container .right .order-summary .item {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
                padding: 10px 0px;
                align-items: center;
            }

                .page-checkout .container .right .order-summary .item .param {
                    font-size: 18px;
                }

                .page-checkout .container .right .order-summary .item .value {
                    font-size: 21px;
                    font-weight: 500;
                }

     .page-checkout .container .right .order-summary .item.total .param {
                    font-size: 24px;
                    font-weight: 700;
                }
                .page-checkout .container .right .order-summary .item.total .value {
                    font-size: 24px;
                    font-weight: 700;
                }

            .page-checkout .container .right .order-summary .buttons {
                border-top: 1px solid #37688338;
                padding-top: 20px;
                display: flex;
                gap: 30px;
                margin-top: 10px;
            }

                .page-checkout .container .right .order-summary .buttons .btn-back {
                    width: calc((100% - 30px) / 2);
                    text-align: center;
                    border: 1px solid #a3a3a3;
                    border-radius: 6px;
                    padding: 5px;
                    font-size: 18px;
                }

                .page-checkout .container .right .order-summary .buttons .btn-submit {
                    width: calc((100% - 30px) / 2);
                    text-align: center;
                    border: 1px solid #a3a3a3;
                    border-radius: 6px;
                    padding: 5px;
                    background: var(--light-blue);
                    color: #fff;
                    font-size: 18px;
                }

       

            footer section.newsletter {
                position: relative;
                height: 255px;
                border-bottom: 5px solid var(--primary);
            }

footer section.newsletter video {
    height: 250px;
    width: 100%;
    object-fit: cover;
}

footer section.newsletter .overlay {
    height: 100%;
    width: 100%;
    position: absolute;
    background: #0000008a;
    top: 0;
    left: 0;
}

footer section.newsletter .container {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    color: #fff;
}

    footer section.newsletter .container .right {
        width: 50%;
    }

    footer section.newsletter .container .right input[type="email"] {
        background: #fff;
        padding: 10px 30px;
        width: 70%;
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
    }

        footer section.newsletter .container .right button {
            background: var(--primary);
            padding: 10px 30px;
            color: #FFF;
            border-top-right-radius: 6px;
            border-bottom-right-radius: 6px;
        }

footer section.main {
    background: #fff;
    padding: 100px 0 0;
}
footer section.main .wrapper {
    display:flex;
    gap:75px;
}
    footer section.main .column .title {
        font-size: 24px;
        color: #333;
        padding-bottom: 20px;
    }

    footer section.main .column ul li a {
        font-size: 16px;
        color: #333;
        line-height: 2;
    }

    footer section.main .column ul.social-media {
        display: flex;
        gap: 20px;
        padding-bottom: 20px;
    }

        footer section.main .column ul.social-media li a {
            font-size: 21px !important;
        }

    footer section.main .column .contact-info {
        color: #333;
    }

     footer section.main .column  {
    width: calc((100% - 225px)/4);
}

footer section.main .column .contact-info .text {padding-bottom:20px;}

footer .bottom {
    display: flex;
    justify-content: space-between;
    padding: 20px 0;
    border-top: 1px solid #ffffff57;
    margin-top: 50px;
}

    footer .bottom .copyright {
        font-size: 15px;
        font-weight: 400;
        color: #333;
    }

    footer .bottom .lizbon {
        display: flex;
        height: 15px;
    }

        footer .bottom .lizbon img {
          
        }
