/*
Theme Name:   DN Gaming – Southland Child
Template:     dn-gaming
Description:  Child theme of DN Gaming for Southland Casino.
Version:      1.0.0
Requires PHP: 7.4
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  dn-gaming-southland-child
*/

/* Child theme overrides go below. Loaded after the parent's css/main.css. */

/* ==========================================================================
   Carousels (moved here from the parent templates' inline <style> blocks)
   ========================================================================== */

/* Split carousels use Swiper autoHeight: keep the slide background solid */
.widget__split-carousel .swiper-autoheight,
.widget__split-carousel .swiper-autoheight .swiper-slide {
	height: auto;
	background: var(--primary-color-one);
}

/* Featured rooms */
.widget__featured-rooms .swiper {
	width: 100%;
	height: auto;
}

.widget__featured-rooms .swiper-slide {
	font-size: 18px;
}

/* Side slides nudge toward the active slide during/after a transition (desktop only) */
@media only screen and (min-width: 1201px) {
	.widget__featured-rooms .changing,
	.widget__featured-rooms .changed {
		transform: translateX(-25px);
	}

	.widget__featured-rooms .swiper-slide-active ~ .changing,
	.widget__featured-rooms .swiper-slide-active ~ .changed {
		transform: translateX(25px);
	}

	.widget__featured-rooms .changing.swiper-slide-active,
	.widget__featured-rooms .changed.swiper-slide-active {
		transform: translateX(0);
	}
}

/* ==========================================================================
   Other Dining Options carousel (template-parts/posts-dining)
   Swiper 12 version of the parent's Slick carousel, same look.
   Image on top / copy below on mobile; copy left / image right from 1200px.
   ========================================================================== */

.widget__dining-carousel {
	position: relative;
}

.widget__dining-carousel .one-time-2 {
	overflow: hidden;
	background: var(--primary-color-one);
}

.widget__dining-carousel .swiper-slide {
	display: flex;
	flex-direction: column;
	height: auto;
	background: var(--primary-color-one);
}

.widget__dining-carousel .copy,
.widget__dining-carousel .img {
	width: 100%;
}

.widget__dining-carousel .copy {
	order: 2;
	padding: 80px 0 200px;
	color: #ffffff;
}

.widget__dining-carousel .img {
	order: 1;
}

.widget__dining-carousel .img img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.widget__dining-carousel .__split-carousel_copy-wrapper {
	max-width: 700px;
	width: 100%;
}

/* Arrows */
.widget__dining-carousel .custom-arrow-container {
	position: absolute;
	z-index: 2;
	bottom: 65px;
	left: 40px;
	display: flex;
	gap: 24px;
}

.widget__dining-carousel .custom-arrow-container .slide-arrow {
	padding: 8px 16px;
	border: 2px solid #ffffff;
	border-radius: 100px;
	background: transparent;
	cursor: pointer;
	transition: all ease-in-out 0.4s;
}

.widget__dining-carousel .custom-arrow-container .slide-arrow:hover {
	background: #ffffff;
}

.widget__dining-carousel .custom-arrow-container .slide-arrow span {
	display: block;
	width: 75px;
	height: 30px;
	background-repeat: no-repeat;
	background-position: center;
}

.widget__dining-carousel .next-arrow-2 span {
	background-image: url(/wp-content/uploads/2023/09/SC_Carousel_ArrowWhite-Next_v001.svg);
}

.widget__dining-carousel .next-arrow-2:hover span {
	background-image: url(/wp-content/uploads/2023/09/SC_Carousel_ArrowBlue-Next_v001.svg);
}

.widget__dining-carousel .prev-arrow-2 span {
	background-image: url(/wp-content/uploads/2023/09/SC_Carousel_ArrowWhite-Prev_v001.svg);
}

.widget__dining-carousel .prev-arrow-2:hover span {
	background-image: url(/wp-content/uploads/2023/09/SC_Carousel_ArrowBlue-Prev_v001.svg);
}

/* Dots (Swiper adds width:100% / left:0 to horizontal pagination, so reset) */
.widget__dining-carousel .dining-carousel_dots {
	position: absolute;
	z-index: 2;
	bottom: 64px !important;
	right: 40px;
	left: auto !important;
	top: auto !important;
	display: flex;
	gap: 8px;
	width: auto !important;
}

.widget__dining-carousel .dining-carousel_dots .swiper-pagination-bullet {
	width: 12px;
	height: 12px;
	margin: 3px !important;
	border: 2px solid #ffffff;
	border-radius: 50%;
	background: transparent;
	opacity: 1;
	transition: transform 0.2s linear;
}

.widget__dining-carousel .dining-carousel_dots .swiper-pagination-bullet-active {
	background: var(--primary-color-two);
	border-color: var(--primary-color-two);
}

@media only screen and (max-width: 480px) {
	.widget__dining-carousel .copy {
		padding: 80px 0 250px;
	}

	.widget__dining-carousel .custom-arrow-container {
		bottom: 100px;
		left: 0;
		right: 0;
		justify-content: center;
	}

	.widget__dining-carousel .dining-carousel_dots {
		bottom: 20px !important;
		left: 0 !important;
		right: 0;
		justify-content: center;
	}
}

@media only screen and (min-width: 1200px) {
	.widget__dining-carousel .swiper-slide {
		flex-direction: row;
	}

	.widget__dining-carousel .copy {
		order: 1;
		padding: 300px 0;
	}

	.widget__dining-carousel .img {
		order: 2;
	}

	.widget__dining-carousel .custom-arrow-container {
		bottom: 65px;
		left: 65px;
	}

	.widget__dining-carousel .dining-carousel_dots {
		right: 53%;
	}
}

/* ==========================================================================
   Weather banner offset
   .has-weather-banner is added to <html> by dn_child_weather_banner_script()
   in functions.php when a visible .weather-banner is on the page.
   ========================================================================== */

/*html.has-weather-banner #page {
	margin-top: 50px;
}

html.has-weather-banner #js_topbar-sidebar-1,
html.has-weather-banner .site-overlay {
	top: 144px;
}

html.has-weather-banner .tribe-events .tribe-events-header {
	position: static;
}

@media (max-width: 1024px) {
	html.has-weather-banner #js_topbar-sidebar-1,
	html.has-weather-banner .site-overlay {
		top: 148px;
	}
}*/