/* =============================================================
   Bargainbedstore — homepage section width normalisation
   -------------------------------------------------------------
   Target: every homepage section 1600px, except the top hero and
   the Sonno-style cream-card hero, which stay full-bleed.

   THE KEY CONSTRAINT
   Woodmart wraps page content in main#main-content.container,
   which is capped near 1200px. Sections carrying a full-bleed
   class break out of it; the rest are trapped inside and cannot
   be widened by any plugin setting. So the container is lifted
   first, then each section is set to 1600px inside it.
   ============================================================= */

:root {
	--bbs-section-width: 1400px;
	--bbs-mobile-gutter: 16px;
}

/* -------------------------------------------------------------
   1. Lift the theme container on the homepage only
   1600px of content + Woodmart's own 15px side padding.
   Other pages keep the theme's normal width.
   ------------------------------------------------------------- */
.home #main-content.container,
.home main.wd-content-layout.container {
	max-width: 1430px !important;
	width: 100% !important;
}

.home .wd-content-area,
.home .site-content {
	max-width: 100% !important;
}

/* -------------------------------------------------------------
   2. Woodmart container blocks used inside the page
   ------------------------------------------------------------- */
.home .wp-block-wd-container {
	max-width: var(--bbs-section-width) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* -------------------------------------------------------------
   3. Section inner containers
   No side padding here: the theme container already supplies it,
   so every section lands on exactly the same edges.
   ------------------------------------------------------------- */
.luxury-categories-wrapper,    /* [luxury_categories]  Popular Categories */
.lt-section-inner,             /* [luxury_trending]    New & Trending     */
.wdbf-inner,                   /* [dream_bed_finder]   Find your dream bed*/
.wsb-inner,                    /* [sleep_school_blog]  Sleep school       */
.hbg-section .hbg-inner,       /* [happy_bed_gallery]  Feel inspired      */
.lf-section .lf-section-inner, /* [lux_faq]            FAQ                */
.steps-container,              /* 3 Easy Steps HTML block                 */
[id^="rlv-instance-"] {        /* [rlv_videos]         In Real Life       */
	max-width: var(--bbs-section-width) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 0;
	padding-right: 0;
	box-sizing: border-box;
}

/* -------------------------------------------------------------
   Mobile / tablet gutter
   Every section gets breathing room from the screen edge so
   nothing hugs the border. The two hero sections are excluded
   and stay edge to edge.
   ------------------------------------------------------------- */
@media (max-width: 1024px) {
	.luxury-categories-wrapper,
	.lt-section-inner,
	.wdbf-inner,
	.wsb-inner,
	.hbg-section .hbg-inner,
	.lf-section .lf-section-inner,
	.steps-container,
	[id^="rlv-instance-"] {
		padding-left: var(--bbs-mobile-gutter) !important;
		padding-right: var(--bbs-mobile-gutter) !important;
	}

	.home .wp-block-wd-container {
		padding-left: var(--bbs-mobile-gutter) !important;
		padding-right: var(--bbs-mobile-gutter) !important;
	}

	/* These two read their side padding from a variable */
	.ts-section {
		--ts-section-ph: var(--bbs-mobile-gutter);
	}

	.bss-section {
		--bss-section-ph: var(--bbs-mobile-gutter);
	}

	/* Heroes stay full-bleed */
	.lb-wrap,
	.sh-hero,
	.sh-hero .sh-hero-bg {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
}

/* -------------------------------------------------------------
   4. Sections exposing width as a CSS variable
   ------------------------------------------------------------- */
.hbg-section {
	--hbg-section-width: var(--bbs-section-width);
}

.ts-section {
	--ts-max-width: var(--bbs-section-width);
}

/* -------------------------------------------------------------
   Slider behaviour (paired with slider-fixes.js)
   ------------------------------------------------------------- */
.wdbf-track,
.rlv-track,
[data-bbs-slider-fixed] {
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
}

[data-bbs-slider-fixed]:not(.wdbf-track) {
	cursor: grab;
}

.bbs-dragging {
	cursor: grabbing !important;
	scroll-behavior: auto !important;
	scroll-snap-type: none !important;
	user-select: none;
}

/* -------------------------------------------------------------
   5. Full-bleed sections — excluded on purpose
   ------------------------------------------------------------- */
.lb-wrap,                      /* [luxury_banner] top hero   */
.sh-hero,                      /* [sonno_hero]    cream card */
.sh-hero .sh-hero-bg {
	max-width: none !important;
	padding-left: 0;
	padding-right: 0;
}
