/**
 * Frontend mobile layout fixes (home + inner pages).
 * Loaded after typography-uniform.css — overrides template breakpoints where needed.
 */

/* —— Base: no horizontal scroll —— */
.mex-shell {
	overflow-x: clip;
}

.mex-shell img,
.mex-shell video {
	max-width: 100%;
	height: auto;
}

/* —— Tablet / mobile (≤991px) —— */
@media (max-width: 991px) {
	.mex-shell .navbar > .container {
		position: relative;
		align-items: center;
	}

	.mex-shell .navbar-brand img {
		max-height: 50px;
		width: auto;
	}

	.mex-shell .header-btn {
		margin-right: 52px;
	}

	.mex-shell .slicknav_menu {
		width: 100%;
		box-sizing: border-box;
	}

	.mex-shell .hero-images {
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
		max-width: 100% !important;
	}

	.mex-shell .about-us-image,
	.mex-shell .our-ingredients-image,
	.mex-shell .daily-offer-image {
		max-width: 100% !important;
	}
}

/* —— Phone (≤767px) —— */
@media (max-width: 767px) {
	.mex-shell .container {
		padding-left: 16px;
		padding-right: 16px;
	}

	/* Hero */
	.mex-shell .hero,
	.mex-shell .hero.hero-slider-layout .hero-slide {
		padding: 112px 0 36px !important;
	}

	.mex-shell .hero-content {
		margin-bottom: 20px;
		text-align: left;
	}

	.mex-shell .hero-content .section-title {
		margin-bottom: 20px !important;
	}

	.mex-shell .hero-images {
		padding: 0 8px !important;
	}

	.mex-shell .hero-circle-img-1,
	.mex-shell .hero-circle-img-2 {
		display: none;
	}

	.mex-shell .hero-btn {
		flex-direction: column;
		align-items: stretch;
		gap: 12px !important;
	}

	.mex-shell .hero-btn .btn-default {
		width: 100%;
		justify-content: center;
		text-align: center;
		box-sizing: border-box;
	}

	.mex-shell .home-menu-cta.hero-btn {
		align-items: stretch;
	}

	/* Hashtag ticker */
	.tm-hashtag-ticker__viewport {
		padding-block: 0.55rem;
	}

	.tm-hashtag-ticker__group {
		font-size: 0.92rem;
		letter-spacing: 0.04em;
	}

	/* About */
	.mex-shell .about-us,
	.mex-shell .our-menu,
	.mex-shell .daily-offer,
	.mex-shell .our-ingredients,
	.mex-shell .our-testimonial,
	.mex-shell .reserve-table,
	.mex-shell .page-menu,
	.mex-shell .page-contact-us,
	.mex-shell .page-services,
	.mex-shell .page-header {
		overflow-x: clip;
	}

	.mex-shell .about-us-image {
		padding: 0 4px !important;
	}

	.mex-shell .about-content-btn {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
	}

	.mex-shell .about-content-btn .btn-default {
		width: 100%;
	}

	.mex-shell .about-detail-box {
		margin-top: 28px;
		padding-top: 28px;
		gap: 20px !important;
	}

	.mex-shell .about-detail-item {
		width: 100% !important;
		align-items: flex-start !important;
	}

	.mex-shell .about-detail-content {
		width: calc(100% - 75px) !important;
		min-width: 0;
	}

	.mex-shell .about-detail-content p {
		display: block;
		overflow: visible;
		-webkit-line-clamp: unset;
		max-height: none;
		min-height: 0;
	}

	.mex-shell .company-experience {
		right: 8px;
		top: 16px;
	}

	/* Home menu tabs: horizontal scroll instead of crushed labels */
	.mex-shell .home-menu-tabs-pill {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		justify-content: flex-start;
		padding: 6px 10px;
		border-radius: 14px;
	}

	.mex-shell .home-menu-tabs-pill::-webkit-scrollbar {
		display: none;
	}

	.mex-shell .home-menu-tabs-pill .home-menu-tabs {
		flex-wrap: nowrap;
		width: max-content;
		min-width: 100%;
		justify-content: flex-start;
		gap: 2px;
	}

	.mex-shell .home-menu-tabs-pill .home-menu-tabs li {
		flex: 0 0 auto;
		min-width: max-content;
	}

	.mex-shell .home-menu-tabs-pill .home-menu-tabs a {
		padding: 8px 14px;
		font-size: 11px !important;
		white-space: nowrap;
	}

	/* Featured / category menu grids */
	.mex-shell .special-menu-list {
		gap: 24px 14px !important;
		justify-content: center;
	}

	.mex-shell .special-menu-item {
		width: calc(50% - 7px) !important;
		max-width: calc(50% - 7px);
		flex: 0 0 calc(50% - 7px);
	}

	.mex-shell .special-menu-img figure {
		max-width: 110px;
		margin: 0 auto;
	}

	.mex-shell .special-menu-item .special-menu-img {
		margin-bottom: 12px;
	}

	/* Daily offer + orange card */
	.mex-shell .daily-offer-image {
		margin-right: 0;
		padding-bottom: 0;
	}

	.mex-shell .daily-offer-img {
		margin-bottom: 16px;
	}

	.mex-shell .delicious-burger-box {
		position: relative;
		right: auto;
		bottom: auto;
		left: auto;
		transform: none;
		width: 100%;
		max-width: 100%;
		margin-top: 16px;
		padding: 16px;
		box-sizing: border-box;
	}

	.mex-shell .daily-offer-btn {
		flex-direction: column;
		align-items: stretch;
		gap: 12px !important;
		margin-top: 24px;
	}

	.mex-shell .daily-offer-btn .btn-default {
		width: 100%;
	}

	/* Intro video */
	.mex-shell .intro-video-box {
		padding: 90px 0 !important;
		min-height: 0;
	}

	.mex-shell .intro-video .container-fluid {
		padding-left: 0;
		padding-right: 0;
	}

	.mex-shell .video-play-button a {
		width: 64px;
		height: 64px;
		font-size: 13px;
	}

	/* Ingredients */
	.mex-shell .our-ingredients-list {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 16px !important;
	}

	.mex-shell .ingredients-list-item {
		width: 100% !important;
		flex: 1 1 100% !important;
		max-width: 100% !important;
	}

	.mex-shell .ingredients-list-item::before {
		display: none;
	}

	.mex-shell .our-ingredients-btn {
		margin-top: 20px;
	}

	.mex-shell .our-ingredients-btn .btn-default {
		width: 100%;
	}

	.mex-shell .happy-customer-box {
		width: min(210px, 58%);
		left: 10px;
		bottom: 16px;
		padding: 12px;
	}

	.mex-shell .ingredient-counter-list {
		gap: 16px !important;
	}

	/* Testimonials */
	.mex-shell .testimonial-slider .swiper {
		margin: 0 !important;
		padding: 0 8px 52px;
	}

	.mex-shell .testimonial-content p {
		font-size: 1.05rem !important;
		line-height: 1.5 !important;
		padding: 0 4px;
	}

	.mex-shell .testimonial-btn-prev {
		left: calc(50% - 38px) !important;
	}

	.mex-shell .testimonial-btn-next {
		right: calc(50% - 38px) !important;
		left: auto !important;
	}

	/* Reserve table + contact forms */
	.mex-shell .reserve-table-content {
		margin-bottom: 24px;
	}

	.mex-shell .reserve-table-form,
	.mex-shell .contact-form {
		padding: 24px 16px !important;
	}

	.mex-shell .reserve-table-form .row > [class*="col-md"],
	.mex-shell .contact-form .row > [class*="col-md"] {
		flex: 0 0 100%;
		max-width: 100%;
	}

	/* Inner page hero */
	.mex-shell.is-inner .page-header {
		padding: 118px 0 48px !important;
	}

	.mex-shell .page-header-box {
		text-align: left;
	}

	/* Footer */
	.mex-shell .main-footer .row > [class*="col-"] {
		margin-bottom: 28px;
	}

	.mex-shell .footer-content,
	.mex-shell .footer-links,
	.mex-shell .footer-contact-info {
		text-align: center;
	}

	.mex-shell .footer-logo img {
		margin-left: auto;
		margin-right: auto;
	}

	.mex-shell .footer-social-icon ul {
		justify-content: center;
	}

	/* Hours & locations */
	.mex-shell .hours-locations-page .hl-card {
		padding: 20px 16px;
	}

	.mex-shell .mex-crumb-strip__inner {
		flex-wrap: wrap;
	}

	.mex-shell .mex-crumb-strip .breadcrumb {
		font-size: 13px;
	}

	/* Full menu listing rows */
	.mex-shell .our-menu-item {
		width: 100% !important;
		flex-wrap: wrap;
	}

	.mex-shell .our-menu-image {
		margin-right: 12px !important;
		flex: 0 0 auto;
	}

	.mex-shell .our-menu-image figure {
		max-width: 72px !important;
	}

	.mex-shell .menu-item-body {
		width: calc(100% - 84px) !important;
		min-width: 0;
	}

	.mex-shell .menu-item-title h3 {
		font-size: 15px;
		flex-wrap: wrap;
	}

	.mex-shell .menu-item-title hr {
		display: none;
	}

	.mex-shell .food-menu-sidebar {
		margin-bottom: 20px;
	}

	.mex-shell .food-menu-sidebar .section-title h2 {
		font-size: 1.35rem;
	}

	/* Catering / events content */
	.mex-shell .catering-page .row > [class*="col-"],
	.mex-shell .events-page .row > [class*="col-"] {
		margin-bottom: 20px;
	}

	.mex-shell .google-map-iframe,
	.mex-shell .google-map-iframe iframe {
		height: 280px !important;
		min-height: 240px;
	}

	/* Readable body copy (remove desktop line clamps) */
	.mex-shell .hero-content .section-title p,
	.mex-shell .about-us-content .section-title > p,
	.mex-shell .daily-offer-content .section-title > p,
	.mex-shell .our-ingredients-content .section-title > p,
	.mex-shell .our-dish-content p {
		display: block;
		overflow: visible;
		-webkit-line-clamp: unset;
		max-height: none;
	}

	/* Section spacing */
	.mex-shell .section-row {
		margin-bottom: 28px;
	}

	.mex-shell .section-title {
		margin-bottom: 18px;
		text-align: center;
	}

	.mex-shell .section-title.text-start,
	.mex-shell .about-us-content .section-title,
	.mex-shell .hero-content .section-title {
		text-align: left;
	}
}

/* —— Small phones (≤480px) —— */
@media (max-width: 480px) {
	.mex-shell .special-menu-item {
		width: calc(50% - 6px) !important;
		flex: 0 0 calc(50% - 6px);
	}

	.mex-shell .special-menu-img figure {
		max-width: 96px;
	}

	.mex-shell a.btn-default,
	.mex-shell .btn-default {
		padding: 13px 18px 13px 14px;
		font-size: 14px;
	}

	.mex-shell .header-toast-order img {
		max-height: 38px;
		max-width: min(130px, 40vw);
	}

	.mex-shell .navbar-brand img {
		max-height: 42px;
	}
}

/* —— Very narrow (≤360px) —— */
@media (max-width: 360px) {
	.mex-shell .special-menu-item {
		width: 100% !important;
		flex: 0 0 100%;
		max-width: 100%;
	}

	.mex-shell .home-menu-tabs-pill .home-menu-tabs a {
		padding: 8px 10px;
		font-size: 10px !important;
	}
}