/*
Theme Name: Tequila Jalisco Mexican Cuisine & Cantina
Theme URI: https://searchprosystems.com/
Template: hello-elementor
Author: SearchPro Systems
Author URI: https://searchprosystems.com/
Description: Tequila Jalisco Mexican Cuisine & Cantina is a Custom Child Theme for Hello Elementor Child developed by SearchPro Systems.
Tags: flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 2.4.3
Updated: 2024-12-06 19:01

*/


.menu-category-wrapper .menu-category-item img {
    width: 100%;
    aspect-ratio: 1480 / 320;
    object-fit: cover;
    transition: all ease .4s;
}

.menu-category-wrapper .menu-category-item img:hover{
    transform:scale(1.1);
}

.menu-category-wrapper .menu-category-item .featured-image-grow {
    position: relative;
    overflow: hidden;
    border-radius: 32px;
    font-size: 0;
    width: 100%;
    display: block;
    margin-bottom: 80px;
}

.menu-category-wrapper .menu-category-item h2{
    color:#003D48;
        font-family: var(--e-global-typography-primary-font-family), Sans-serif;
    font-weight: var(--e-global-typography-primary-font-weight);
    text-align:center;
    margin-bottom: 80px;
}

.menu-category-wrapper .menu-category-item p{
	text-align: center;
}

.menu-category-posts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 80px;
    margin-bottom: 80px;
}

.menu-category-posts .menu-category-post {
    padding: 20px;
}

.menu-category-posts .menu-category-post h3 {
    font-size: 24px;
    font-weight: bold;
    text-align: left;
    color: #003D48;
}

.menu-category-posts .menu-category-post p {
    text-align: left;
}

.menu-category-posts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 80px;
    margin-bottom: 80px;
}

.menu-category-posts .menu-category-post {
    padding: 20px;
}

.menu-category-posts .menu-category-post h3 {
    font-size: 24px;
    font-weight: bold;
    text-align: left;
    color: #003D48;
}

.menu-category-posts .menu-category-post p {
    text-align: left;
}

.menu-category-posts .menu-category-post .menu-price {
    text-align: right;
    font-weight: 600;
    color: #003D48;
}

.menu-slider-category-wrapper a {
	color: #fff;
}

.menu-slider-category-wrapper{
	display: flex;
    justify-content: space-around;
	width: 100%;
  	overflow: hidden;
}

.menu-slider-category-wrapper {
    padding: 0 50px;
}

.menu-slider-category-wrapper a {
    font-family: "montserrat", Sans-serif;
    font-weight: 700;
    text-transform: uppercase;
}

.menu-slider-category-wrapper a.active,
.menu-slider-category-wrapper a:hover{
    color: var( --e-global-color-accent );
}

.menu-slider-category-wrapper .swiper-slide {
  text-align: center;
  font-size: 16px;
  padding: 5px 10px;
  color: #fff;
  cursor: pointer;
}

/* Common styles for both navigation buttons */
.menu-slider-category-wrapper .swiper-button-prev,
.menu-slider-category-wrapper .swiper-button-next {
  width: 40px !important;
  height: 40px !important;
  background-color: #fff; /* Red color */
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  transition: transform 0.2s ease;
}

.menu-slider-category-wrapper .swiper-button-prev:hover,
.menu-slider-category-wrapper .swiper-button-next:hover {
  transform: scale(1.1);
}

.menu-slider-category-wrapper .swiper-button-prev::after,
.menu-slider-category-wrapper .swiper-button-next::after {
  font-size: 14px; /* Default size of arrow */
  color: #d52b45; /* White arrow */
}

/* Specific styles for next button */
.menu-slider-category-wrapper .swiper-button-next::after {
  content: "▶" !important; /* Play icon (right arrow) */
  font-size: 16px !important;
}

/* Specific styles for prev button */
.menu-slider-category-wrapper .swiper-button-prev::after {
  content: "◀" !important; /* Left arrow */
  font-size: 16px !important;
}

@media screen and (max-width:1023px){
	.menu-category-posts {
		grid-template-columns: repeat(2, 1fr);
		gap: 40px;
	}
	.menu-category-wrapper .menu-category-item img {
		aspect-ratio: 1480 / 540;
	}
}

@media screen and (max-width:767px){
	.menu-category-posts {
		grid-template-columns: repeat(1, 1fr);
	}
	.menu-category-wrapper .menu-category-item img {
		aspect-ratio: 340 / 220;
	}
}