.elementor-83 .elementor-element.elementor-element-4af2f69{--display:flex;--gap:0rem 0rem;--row-gap:0rem;--column-gap:0rem;--flex-wrap:wrap;--padding-top:2rem;--padding-bottom:0rem;--padding-left:0rem;--padding-right:0rem;}.elementor-83 .elementor-element.elementor-element-4e55028{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;text-align:center;}.elementor-83 .elementor-element.elementor-element-4e55028 > .elementor-widget-container{padding:0em 0em 0em 0em;}.elementor-83 .elementor-element.elementor-element-4e55028 .elementor-heading-title{font-family:"iransans", Sans-serif;line-height:1.5;color:var( --e-global-color-accent );}.elementor-83 .elementor-element.elementor-element-279c015{--display:flex;--padding-top:2rem;--padding-bottom:2rem;--padding-left:0.5rem;--padding-right:0.5rem;}.elementor-83 .elementor-element.elementor-element-61beb68{--display:flex;--padding-top:0rem;--padding-bottom:2rem;--padding-left:0.5rem;--padding-right:0.5rem;}@media(max-width:1024px){.elementor-83 .elementor-element.elementor-element-4e55028 > .elementor-widget-container{padding:0em 0em 3em 0em;}}@media(max-width:767px){.elementor-83 .elementor-element.elementor-element-4e55028 > .elementor-widget-container{padding:0em 0em 0em 0em;}.elementor-83 .elementor-element.elementor-element-279c015{--padding-top:2rem;--padding-bottom:2rem;--padding-left:1rem;--padding-right:1rem;}}/* Start custom CSS for shortcode, class: .elementor-element-72eeea4 */.food-tabs {
    background-color: #f8f9fa;
    padding: 10px 0;
    border-bottom: 1px solid #dee2e6;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    font-family: 'Vazirmatn', sans-serif;
    direction: rtl;
    overflow-x: auto;
    white-space: nowrap;
}


.food-tabs .tabs-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}


.food-tabs .tab-item {
    padding: 12px 25px;
    margin: 0 5px;
    cursor: pointer;
    color: #495057;
    font-size: 16px;
    font-weight: 500;
    border-radius: 8px;
    transition: all 0.3s ease;
    border-bottom: 3px solid transparent;
    margin-block: 0.5rem;
}

.food-tabs .tab-item:hover {
    background-color: #e9ecef;
    color: var( --e-global-color-accent );
}


.food-tabs .tab-item.active {
    font-weight: 700;
    border-bottom-color: var( --e-global-color-accent );
}


@media (max-width: 768px) {
    .food-tabs .tabs-list {
        justify-content: flex-start;
        padding: 0 10px;
    }

    .food-tabs .tab-item {
        font-size: 14px;
        padding: 10px 15px;
    }
}
<script> 

   document.addEventListener('DOMContentLoaded', function() {
    const tabs = document.querySelectorAll('.tab-item');

    // آیتم اول را به صورت پیش‌فرض فعال کن
    if (tabs.length > 0) {
        tabs[0].classList.add('active');
    }

    tabs.forEach(tab => {
        tab.addEventListener('click', function() {
            // حذف کلاس active از تمام تب‌ها
            tabs.forEach(item => item.classList.remove('active'));

            // افزودن کلاس active به تب کلیک شده
            this.classList.add('active');

            // اینجا می‌توانید کدی برای نمایش محتوای مربوط به تب بنویسید
            // const target = this.getAttribute('data-target');
            // console.log('Show content for:', target);
        });
    });
});
</script>/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'iransans';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://majanrestaurant.ir/wp-content/uploads/2025/05/IRANSansWeb.woff2') format('woff2');
}
/* End Custom Fonts CSS */