@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap");

#tranding{width:100%;padding:4rem 0;margin-bottom:20px;}
#tranding .container{max-width:124rem;padding:0 1rem;margin:0 auto;}
#tranding .container .tranding-slide{text-align:center;}
#tranding .container .tranding-slide .youtube-video{max-width:550px;max-height:330px;width:100%;height:auto;border-radius:1rem;}
#tranding .container .tranding-slide .tranding-slide-content{color:#673AB7;padding:0 40px;font-size:10px;position:relative;top:0;left:0;right:0;bottom:0;z-index:-1;}
#tranding .container .tranding-slide .tranding-slide-content h2{margin:10px 0 0 0;width:100%;}

#tranding .container .tranding-slider .tranding-slider-control{width:100%;margin-top:20px;}
#tranding .container .tranding-slider .tranding-slider-control .slider-arrow{background:#fff;width:3.5rem;height:3.5rem;border-radius:50%;left:25.5%;transform:translateX(-42%);filter:drop-shadow(0px 8px 24px rgba(18, 28, 53, 0.1));top:40%;}
#tranding .container .tranding-slider .tranding-slider-control .slider-arrow ion-icon{font-size:2rem;color:#222224;}
#tranding .container .tranding-slider .tranding-slider-control .slider-arrow::after{content:'';}
#tranding .container .tranding-slider .tranding-slider-control .swiper-button-prev{left:0;border:#222224 1px solid;}
#tranding .container .tranding-slider .tranding-slider-control .swiper-button-next{border:#222224 1px solid;}
#tranding .container .tranding-slider .tranding-slider-control .swiper-pagination{position:relative;width:15rem;left:-30px;bottom:0;}
#tranding .container .tranding-slider .tranding-slider-control .swiper-pagination .swiper-pagination-bullet{filter:drop-shadow(0px 8px 24px rgba(18, 28, 53, 0.1));}
#tranding .container .tranding-slider .tranding-slider-control .swiper-pagination .swiper-pagination-bullet-active{background:#ec994b;}

#tranding .container .tranding-slider .swiper-slide img{height:300px;width:100%;object-fit:cover;}
.swiper-slide-active{visibility:visible !important;}

/*
::-webkit-scrollbar{width:1.3rem;}
::-webkit-scrollbar-thumb{border-radius:1rem;background:#797979;transition:all 0.5s ease-in-out;}
::-webkit-scrollbar-thumb:hover{background:#222224;}
::-webkit-scrollbar-track{background:#f9f9f9;}
.tranding-slide-content .food-price{position:absolute;top:2rem;right:2rem;color:#fff;}
.section-heading{font-size:3rem;color:var(--primary);padding:2rem 0;}
.tranding-slide .tranding-slide-img img{width:55rem;height:30rem;border-radius:1rem;object-fit:cover;}
.food-rating{padding-top:1rem;display:flex;gap:1rem;}
.rating ion-icon{color:var(--primary);}
.youtube-caption{width:100%;background-color:rgba(255, 255, 255, 0.6);padding:10px;position:absolute;bottom:0;}
.youtube-title{color:#325AA8;text-align:center;}
.youtube-caption a{text-decoration:none;}
.tranding-slide-content .tranding-slide-content-bottom{margin-top:170px !important;padding-left:0px !important;}

.tranding-slider-control .swiper-button-next{left:88% !important;}
.tranding-slider-control .swiper-button-next{left:50% !important;border:#222224 1px solid;top:60px;}
*/

@media (max-width:767px){
	#tranding .container .tranding-slider .swiper-slide{width:100%;visibility:hidden;}
	#tranding .container .tranding-slide{width:55rem;height:40rem;padding:2.5rem 0;position:relative;}
}

@media (min-width:768px){
	#tranding .container{padding-left:15px;}
	#tranding .container .tranding-slide .youtube-video{width:550px;height:300px;}
	#tranding .container .tranding-slider{width:1170px !important;padding:2.5rem 0;position:relative;}
	#tranding .container .tranding-slider .tranding-slider-control{display:flex;align-items:center;justify-content:center;}
	#tranding .container .tranding-slider .tranding-slider-control .swiper-pagination{left:-12px;}
	#tranding .container .tranding-slider .tranding-slider-control .swiper-button-next{left:74%;transform:translateX(-70%);}
	#tranding .container .tranding-slider .tranding-slider-control .swiper-button-prev{left:26%;transform:translateX(-30%);}
	#tranding .container .swiper-slide-shadow-left,#tranding .container .swiper-slide-shadow-right{background-image:none;}
}

@media (min-width:1024px){
	#tranding{padding:0;}
}