/* Ody's Cuban Cafe - sections added 2026-10-13 (see inc/sections/odys-sections.php).
   Assets are served without ?ver= on this site: rename this file when you change it. */

/* ---------- 1. Photo strip (home, above the footer) ---------- */
.odys-photo-strip {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 6px;
	/* Full bleed: break out of the theme's framed .tst-content-frame (45px / 10px side margins).
	   .tst-app has overflow:hidden, so the scrollbar-width overshoot of 100vw is clipped and
	   never creates a horizontal scroll. */
	width: 100vw;
	max-width: none;
	margin: 0 0 0 calc(50% - 50vw);
	background: #fff;
}
.odys-photo-strip__item {
	position: relative;
	aspect-ratio: 1 / 1; /* square photos (2026-10-15) */
	margin: 0;
	overflow: hidden;
	background: #1a2f33;
}
.odys-photo-strip__item .odys-photo-strip__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center 40%;
	transition: transform 1.1s cubic-bezier(.2, .7, .2, 1), filter 1.1s ease;
}
.odys-photo-strip__item.is-feature .odys-photo-strip__img {
	object-position: center 30%;
}
@media (hover: hover) {
	.odys-photo-strip__item:hover .odys-photo-strip__img {
		transform: scale(1.04);
	}
}
@media (max-width: 767px) {
	.odys-photo-strip {
		grid-template-columns: 1fr 1fr;
		gap: 4px;
	}
	.odys-photo-strip__item.is-feature {
		grid-column: 1 / -1;
		order: -1;
	}
}
@media (prefers-reduced-motion: reduce) {
	.odys-photo-strip__item .odys-photo-strip__img { transition: none; }
	.odys-photo-strip__item:hover .odys-photo-strip__img { transform: none; }
}

/* ---------- 2. FAQ accordion with native <details> ---------- */
.odys-faq__item > summary {
	display: block;
	list-style: none;
	cursor: pointer;
}
.odys-faq__item > summary::-webkit-details-marker { display: none; }
.odys-faq__item > summary:focus-visible {
	outline: 2px solid #831b11;
	outline-offset: 2px;
}
/* Mirror the theme's .tst-faq-item-box.active state */
.odys-faq__item[open] {
	background: #fff;
	border-color: transparent;
	box-shadow: 0 5px 10px 0 rgba(26, 47, 51, .11);
}
.odys-faq__item[open] > summary.name:before { transform: rotate(180deg); }
.odys-faq__item[open] > .text { padding: 0 0 30px 0; }
.odys-faq__item > .text p:last-child { margin-bottom: 0; }
.odys-faq__item > .text a { color: #831b11; text-decoration: underline; }

/* ---------- 3. Service areas + order ahead (FAQ page) ---------- */
.odys-faq-extras {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 30px;
	margin: 0 0 30px;
}
.odys-faq-extras__col {
	padding: 30px;
	border: dotted 2px rgba(26, 47, 51, .2);
	border-radius: 5px;
}
.odys-faq-extras__title {
	margin: 0 0 10px;
	font-size: 22px !important;
	line-height: 1.3;
}
.odys-faq-extras__lead {
	margin: 0 0 18px;
	opacity: .8;
}
.odys-faq-extras__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.odys-faq-extras__tags li {
	padding: 6px 14px;
	border-radius: 999px;
	background: rgba(131, 27, 17, .08);
	color: #831b11;
	font-size: 15px;
}
.odys-faq-extras__list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.odys-faq-extras__list li {
	position: relative;
	padding-left: 22px;
	margin-bottom: 8px;
}
.odys-faq-extras__list li:before {
	content: '';
	position: absolute;
	left: 0;
	top: .6em;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #831b11;
}
.odys-faq-extras__contact {
	margin: 0 0 90px;
	text-align: center;
}
.odys-faq-extras__contact a { color: #831b11; }
@media (max-width: 767px) {
	.odys-faq-extras { grid-template-columns: 1fr; gap: 20px; }
	.odys-faq-extras__col { padding: 22px; }
	.odys-faq-extras__contact { margin-bottom: 60px; }
}

/* ---------- 4. Footer social / ordering icons ---------- */
.odys-ico {
	display: inline-block;
	width: 16px;
	height: 16px;
	vertical-align: middle;
	background-color: currentColor;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}
.odys-ico-facebook { -webkit-mask-image: url(../icons/facebook.svg); mask-image: url(../icons/facebook.svg); }
.odys-ico-instagram { -webkit-mask-image: url(../icons/instagram.svg); mask-image: url(../icons/instagram.svg); }
.odys-ico-tiktok { -webkit-mask-image: url(../icons/tiktok.svg); mask-image: url(../icons/tiktok.svg); }
.odys-ico-google { -webkit-mask-image: url(../icons/google.svg); mask-image: url(../icons/google.svg); }
.odys-ico-doordash { -webkit-mask-image: url(../icons/doordash.svg); mask-image: url(../icons/doordash.svg); width: 20px; }
.odys-ico-ubereats { -webkit-mask-image: url(../icons/ubereats.svg); mask-image: url(../icons/ubereats.svg); }
.tst-social .tst-icon-link { display: inline-flex; align-items: center; }
.tst-social { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
@media (max-width: 767px) {
	/* The footer column is ~175px wide on phones: tighter spacing keeps all 6 icons on one row. */
	.tst-social .tst-icon-link { margin: 0 4px; letter-spacing: 0; }
}
.odys-sr-only {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0);
	white-space: nowrap; border: 0;
}

/* ---------- 5. Home + footer tweaks (2026-10-15) ---------- */
/* FAQ on the home: white like the other sections. (The dark band seen on 2026-10-15 was a stale
   post-997.css without the container's --display:flex, so it rendered inline: fixed with
   `wp elementor flush-css`.) */
.tst-content-frame .elementor-997 > .elementor-element-5ad3a56 { background-color: #fff; }

/* "All Products" button on the home slider: white label. */
.tst-slider-navigation .tst-btn,
.tst-slider-navigation .tst-btn span { color: #fff; }

/* Footer social row: 75% less space above (70+10 -> 20px) and below (10+10+60 -> 20px). */
.tst-app > footer.tst-white { padding-top: 10px; }
.elementor-2051 .elementor-element-85e7e06 .tst-spacer { margin-top: 0; }

/* "Designed byONTOP": the logo's "by" sits on the text baseline. */
.odys-credit-logo { display: inline-block; line-height: 0; margin-left: .25em; }
.odys-credit-logo img {
	display: inline-block;
	height: 2.1em;
	width: auto;
	vertical-align: -.92em;
}

/* Cart icon of the product cards on the home: white like the "All Products" label. */
.elementor-997 .tst-cart-btn svg,
.elementor-997 .tst-cart-btn svg path { fill: #fff; }