/* ============================================================
   CMS ShopperApproved Reviews - v1.1.0 | 2026-11-05
   1.1.0: Bootstrap .container removed - on the homepage / department pages the content lines up with the
   header (--container-max / --container-gutter, corsetmaking.css b70+); elsewhere it fills its column.
   The ShopperApproved rotating slider is contained (it ran past the window: 5px at 360, 44px at 992).
   Wrapper styles for ShopperApproved rotating review widget
   ============================================================ */

/* -- Section Wrapper ---------------------------------------- */
.cms-sa-reviews {
	width: 100%;
	box-sizing: border-box;
	/* Contain the vendor slider (div.sa-slide / .sa-rotating-slider-*) - clip sideways only */
	overflow-x: clip;
}

/* -- Inner Container ---------------------------------------- */
.cms-sa-reviews__inner {
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	overflow-x: clip;
}

/* Homepage / department pages (body#SFNT - full-width column): content lines up with the header -
   capped at --container-max and padded by --container-gutter (same as .cms-container). Elsewhere it fills its column. */
body#SFNT .cms-sa-reviews__inner {
	width: 100%;
	max-width: var(--container-max);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--container-gutter);
	padding-right: var(--container-gutter);
	box-sizing: border-box;
}

/* -- Widget centering --------------------------------------- */
.cms-sa-reviews .SA__wrapper {
	display: inline-block;
	max-width: 100%;
}

/* -- Background presets (1.0.2) -------------------------------
   Light surfaces only - the ShopperApproved widget text is dark
   and vendor-styled, so dark backgrounds are not offered.      */
.cms-sa-reviews--bg-white {
	background-color: var(--color-white);
}

.cms-sa-reviews--bg-subtle {
	background-color: var(--surface-subtle);
}

.cms-sa-reviews--bg-muted {
	background-color: var(--surface-muted);
}
