/* Hero Section Styles */
.DLSeniorLanding-hero-section {
    background-color: #f3d1ce;
    display: flex;
    flex-direction: row;
    padding: 0;
    margin: 0;
    justify-content: space-between;
    height: 70vh;
    min-height: 600px;
    align-items: stretch;
   
}

.DLSeniorLanding-text-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Vertically centers the content */
    width: 50%;
    height: 100%; /* Ensure the flex container takes up full height */
    box-sizing: border-box;
    position: relative;
    
}

.DLSeniorLanding-brand-logos-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 10px;
    width: 75%;
    margin: 0 auto;
    justify-items: start;
    align-items: center;
    position: absolute;
    bottom: 10%;
    left: 14%;
}

    .DLSeniorLanding-brand-logos-container img {
        max-width: 70%;
        height: auto;
        display: block;
    }

.DLSeniorLanding-image-section {
    width: 50%;
    position: relative;
    height: 100%;
    padding: 2%;
    padding-left: 0;
}

    .DLSeniorLanding-image-section img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.DLSeniorLanding-title {
    text-align: center;
    font-family: 'Open Sans', sans-serif;
}

.DLSeniorLanding-rabatt {
    font-size: 4vw;
    font-weight: 700;
    color: black;
}

.DLSeniorLanding-25 {
    font-size: 10vw;
    font-weight: 900;
    color: black;
    margin-right: 1vw;
}

.DLSeniorLanding-percent {
    font-size: 5vw;
    font-weight: 700;
    color: black;
    font-family: 'Open Sans', sans-serif;
}

.DLSeniorLanding-text {
    font-size: 2vw;
    font-weight: 700;
    color: black;
}

/* Product Section Styles */
.SeniorProduct-container {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px;
    background-color: #f3d1ce;
    border: 5px solid #d78fb8;
    max-width: 1200px;
    margin: 40px auto;
}

.SeniorProduct-image {
    width: 50%;
    padding: 10px;
}

    .SeniorProduct-image img {
        width: 100%;
        object-fit: cover;
        border-radius: 5px;
    }

.SeniorProduct-info {
    width: 50%;
    padding: 20px;
    color: #333;
    text-align: left;
}

    .SeniorProduct-info h2 {
        font-size: 1.8rem;
        color: #333;
        margin-bottom: 20px;
    }

    .SeniorProduct-info p {
        font-size: 1.2rem;
        margin-bottom: 20px;
        line-height: 1.5;
    }

.SeniorOriginal-price {
    text-decoration: line-through;
    color: #333333;
    font-weight: bold;
    font-size: 1.5rem;
}

.senior-price {
    font-size: 1.5rem;
    color: #d9534f;
    font-weight: bold;
}

/* New Section Layout with image on the left */
.DLSeniorLanding-new-section {
    background-color: #d78fb8; /* Similar background color */
    display: flex;
    flex-direction: row;
    padding: 0;
  
    justify-content: space-between;
    height: 40vw; /* Set to 500px */
    align-items: stretch;

}

.DLSeniorLanding-image-section-new {
    width: 50%;
    position: relative;
    height: 100%;
    padding: 2%;
    padding-right: 0;
}

    .DLSeniorLanding-image-section-new img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.DLSeniorLanding-text-wrapper-new {
    display: flex;
    flex-direction: column;
    /*  justify-content: center;*/
    width: 50%;
    height: 100%;
    box-sizing: border-box;
    /*  padding: 0 7%; /* Add padding for some breathing space */
    padding-left: 4%;
    padding-right:4%;
    padding-top:2%;
}

    .DLSeniorLanding-text-wrapper-new.Lindberg {
        padding: 2%;
    }
    .DLSeniorLanding-new-text {
    text-align: center; /* Center text */
    font-size: 10vw; /* Increase font size */
    line-height: 1.5;
    color: white;
}

.DLSeniorLanding-new-button {
    margin-top: 20px;
    font-size: 1.2rem;
    padding: 10px 20px;
    background-color: white;
    border: none;
    color: #d78fb8;
    font-weight: bold;
    border-radius: 5px;
    cursor: pointer;
}


.DLSeniorLanding-new-section-FrameImage {
    width: 90%;
    margin-top: 3vw;
    margin-bottom: 0vw;
}
    .DLSeniorLanding-new-section-FrameImage.ray-ban-zero {
        margin-top: 6vw;
        margin-bottom: 0vw;
        margin-left: 0vw;
    }





.price-tag {
    position: absolute;
    bottom: 5vw;
    right: -3vw;
    background-color: #ffcccc;
    border-radius: 50%;
    padding: 2.5vw;
    text-align: center;
    font-size: 1.3vw;
    transform: rotate(2deg);
    z-index: 1000;
}

    .price-tag.Lindberg {
        bottom:-5vw;
        right: -3vw;
    }




    .price-tag.Andra-Paret {
        bottom: -3vw;
        right: 30vw;
    }

.price-tag.Tom-Ford {
    bottom: -1vw;
    right: 15vw;
}


    .price-tag .original-price {
        text-decoration: line-through;
    }

    .price-tag .discounted-price {
        font-weight: bold;
        font-size: 1.6vw;
    }

.DLSeniorLandingUnderImageText {
    font-size: 1.2vw;
}


.MySwiperContainer {
    padding: 2%
}

 .DLSeniorLanding-column {
    display: flex;
    flex-direction: column;
    justify-content: flex-end; /* This will push the text to the bottom */
}

.DLSeniorLanding-Lindberg-Logo {
    height:5vw
}
.DLSeniorLanding_Lindberg-text {
    font-size: 0.8vw;
}


.DLSeniorLanding-new-section-text-ray-ban-zero {
    margin-left: 5vw;
    margin-right: 5vw;
    margin-top: -3vw;
    font-size: 1.2vw
}


@media (max-width: 768px) {


    .DLSeniorLanding-new-section-text-ray-ban-zero {
        margin-left: 15vw;
        margin-right: 15vw;
        margin-top: -3vw;
        font-size: 3vw
    }



    .DLSeniorLanding-new-section-FrameImage.ray-ban-zero {
        margin-top: -2vw;
        margin-bottom: 0vw;
        margin-left: 0vw;
        width:100%;
    }
    
    
    .MySwiperContainer {
        padding: 5%
    }


    .DLSeniorLanding_Lindberg-text {
        font-size: 2vw;
    }

    .DLSeniorLanding-Lindberg-Logo {
        height: 10vw
    }


    .DLSeniorLanding-hero-section {
            flex-direction: column-reverse;
            height: auto;
            min-height:0px;
        }

        .DLSeniorLanding-text-wrapper {
            width: 100%;
            padding: 5%;
        }




    .DLSeniorLanding-new-section-FrameImage {
       width:90%; 
       margin-top:0vw; 
       margin-bottom:0vw;
    }




    .DLSeniorLanding-brand-logos-container {
        position: static; /* Remove absolute positioning */
        width: 100%; /* Full width */
        margin-top: 20px; /* Add some spacing from the content above */
        grid-template-columns: repeat(2, 1fr); /* Stack logos in two columns */
        grid-gap: 15px; /* Adjust gap for better spacing */
        justify-items: center; /* Center logos */
        display: none;
    }

            .DLSeniorLanding-brand-logos-container img {
                max-width: 50%; /* Adjust logo size */
            }



    




    .DLSeniorLanding-image-section {
        width: 100%;
        padding: 3%;
    }

        .DLSeniorLanding-rabatt {
            font-size: 8vw;
        }

        .DLSeniorLanding-25 {
            font-size: 16vw;
            margin-right: 0.5vw;
        }

        .DLSeniorLanding-percent {
            font-size: 4vw;
        }

        .DLSeniorLanding-text {
            font-size: 4vw;
        }

        /* New Section Responsive */
        .DLSeniorLanding-new-section {
            flex-direction: column;
            height: auto;
        }

    .DLSeniorLanding-text-wrapper-new {
        flex-direction: column;
        height: auto;
    }


    .DLSeniorLanding-image-section-new,
    .DLSeniorLanding-text-wrapper-new {
        width: 100%;
        padding: 5%;
    }

        .DLSeniorLanding-text-wrapper-new.Lindberg {
            padding: 5%;
            padding-top: 1%;
        }

        .DLSeniorLanding-new-text {
            font-size: font-size: 4vw;
            
        }

        .DLSeniorLanding-new-button {
            font-size: 1rem;
            padding: 8px 15px;
        }

        .centered-text-section {
            font-size: 4vw !important;
        }

        



    .price-tag {
       
        bottom: 5vw;
        right: 5vw;
     
   
        padding: 5vw;

        font-size: 2.6vw;
    }


        .price-tag.Lindberg {
            bottom: -7vw;
            right: 5vw;
            font-size: 2.6vw;
            padding: 5vw;
        }


        .price-tag.Tom-Ford {
            bottom: 5vw;
            right: 5vw;
            padding: 5vw;
            font-size: 2.6vw;
        }



        .price-tag .discounted-price {
            font-weight: bold;
            font-size: 3.7vw;
        }

    .DLSeniorLandingUnderImageText {
        font-size: 4vw;
    }

    .Visionary{
        font-size:3vw
    }

    }

    .centered-text-section {
    text-align: center;
    padding: 50px 50px;
    font-size: 1.3rem;
    color: black;
    line-height: 1.4;
    font-size: 1.7vw;
    font-weight: 500;
    color: black;
}

        .centered-text-section.optician {
            margin: 1vw;
            margin-top: 0vh;
            font-size: 1.5vw !important;
            
        }


.optician-p {
    margin-top: 7vh;
    text-align: Left;
    margin-left: 2vw;
    margin-right:2vw
}


.centered-text-section-swiper {
    text-align: center;
    font-size: 1.3rem;
    color: black;
    line-height: 1.4;
    font-size: 2vw;
    font-weight: 500;
    color: black;
}

.Tom-Ford-full-width-section {
 
    text-align: center;
    box-sizing: border-box;
    background-image: linear-gradient(144deg, rgba(0, 0, 0, 0.95), rgba(0, 0, 0, 0.85) 51%, rgba(0, 0, 0, 0.98) 92%);
    pointer-events: none;
}

.Tom-Ford-image-wrapper {
    position: relative;
    display: inline-block;
    padding: 2%;
  

    box-sizing: border-box;
}

.Tom-Ford-full-width-image {
    width: 100%;
    height: auto;
    max-width: 100%;
}

/* Logo overlay */
.Tom-Ford-logo-overlay {
    position: absolute;
    top: 32vW; /* Adjust the top position */
    left: 9vW; /* Adjust the left position */
    width: 25vW; /* Adjust logo size as necessary */
    height: auto;
    z-index: 10; /* Ensure the logo is above the image */
}



.Tom-Ford-UnderImageText {
    color: #efefef;
    margin-top: 10px;
}


.btn.book {
    font-size: 1.1vw;
    padding: 0.7vw 1.3vw;
}



.swiper-button-next, .swiper-button-prev {
    color: black; /* Keep the color you want */
    position: absolute; /* Ensure the buttons are positioned absolutely */
    top: 50%; /* Vertically center the buttons */
    transform: translateY(-50%); /* Adjust to ensure the vertical alignment */
    z-index: 10; /* Make sure the buttons are above other elements */
}

.swiper-button-next {
    right: -10px; /* Push the next button further to the right */
}

.swiper-button-prev {
    left: -10px; /* Push the previous button further to the left */
}





/* Mobile specific styles */
@media only screen and (max-width: 768px) {


    @media (max-width: 768px) {
        .swiper-button-next,
        .swiper-button-prev {
            display: none !important;
        }
    }

    .btn.book {
        font-size: 4vw;
        padding: 2vw 4vw;
    }

    .centered-text-section.optician {
            margin: 1vw;
            margin-top: 0vh;
            font-size: 4vw !important;
        }


    .optician-p {
        margin-top: 7vh;
        font-size: 4vw !important;
    }







        .Tom-Ford-image-wrapper {
            width: 100%;
            height: 80vw; /* Maintain 4:5 aspect ratio by setting height as 80% of viewport width */
            overflow: hidden; /* Ensures that anything outside the aspect ratio is cropped */
            padding: 5%;
        }

        .Tom-Ford-full-width-image {
            width: 100%;
            height: 100%;
            object-fit: cover; /* Ensures the image covers the container while maintaining aspect ratio */
        }

        .Tom-Ford-logo-overlay {
            top: 60vW; /* Adjust the top position */
            left: 9vW; /* Adjust the left position */
            width: 40vW; /* Adjust logo size as necessary */
        }
    }

    .opt-button{

    width:80%;
}



@media (max-width: 768px) {
    .circle-price-tag {
        width: 27vw;
        height: 27vw;
        padding: 3vw;
        bottom: -50vw;
        right: 2vw;
    }

        .circle-price-tag .price-text {
            font-size: 3vw;
            margin-bottom: 8vw
        }

        .circle-price-tag .logo-img {
            width: 24vw; /* Adjust logo size for mobile */
            top: 9vw;
        }

        .circle-price-tag .discounted-price {
            font-size: 4vw;
        }


    .swiper-navigation {
        display: none !important;
    }
}

/* the new container */
.MySwiperContainer {
    position: relative;
    width: 100%;
    padding: 2% 4vW;
}

/* fix the buttons positions */
.swiper-button-prev {
    left: 1vw;
}

.swiper-button-next {
    right: 1vw;
}

.custom-button-right {
    background-color: rgba(240, 240, 240, 1);
    border-radius: 50%;
    border: none;
    width: 2vw;
    height: 2vw;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: opacity 0.2s ease;
    font-size: 1.2rem; /* Size of Material Icon */
    color: black;
    transform: translateX(0.5vw) translateY(-25vw);

}

.material-icons-outlined {
    
    font-size: 1.5vw;
   
}

.custom-button-left {
    background-color: rgba(240, 240, 240, 1);
    border-radius: 50%;
    border: none;
    width: 2vw;
    height: 2vw;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: opacity 0.2s ease;
    font-size: 20vw; /* Size of Material Icon */
    color: black;
    transform: translateX(95.5vw) translateY(-27.5vw);
}


.custom-button.hidden-left {
    display: none !important;
}

.custom-button.hidden-right {
    display: none !important;
}

.swiper-navigation {
    display: flex;
    justify-content: space-between; /* Place the buttons on opposite ends */
    align-items: center;
    width: 100%; /* Ensure it spans the full width of the Swiper container */
    position: relative;
}

.swiper-nav-left,
.swiper-nav-right {
    display: flex;
    align-items: center;
    width: 50%; /* Split space between left and right buttons */
}

.swiper-nav-left {
    justify-content: flex-start; /* Align the left arrow to the start */
}

.swiper-nav-right {
    justify-content: flex-end; /* Align the right arrow to the end */
}


.custom-button-right {
    transform: translate(0.75vw, -25vw);
}
.custom-button-left {
    transform: translate(-0.75vw, -25vw); /* Reset any previous transforms */
}

/* Optional: Add specific styles if the button positioning needs fine-tuning */
.swiper-nav-left .custom-button-right {
    /* Additional styling if needed */
}

.swiper-nav-right .custom-button-left {
    /* Additional styling if needed */
}