/*
Theme Name:   Minimog Child
Theme URI:    https://minimog.thememove.com
Description:  Child theme for Minimog. Add custom CSS below this header.
Author:       ThemeMove
Author URI:   https://thememove.com
Template:     minimog
Version:      1.0.0
Requires at least: 5.0
Tested up to: 6.8
License:      GNU General Public License v2 or later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  minimog-child
*/

/* Add your custom styles below. */

/* =========================================================
   SPINAL REST — MATTRESS CATEGORY SHOWROOM CTA
   ========================================================= */

   .sr-mattress-showroom {
	width: 100%;
	margin: 24px 0 34px;
	padding: 26px 30px;

	background: #f4edfb;
	border: 1px solid #efefef;
	border-radius: 10px;

	font-family: 'Inter Tight', -apple-system, BlinkMacSystemFont,
		'Segoe UI', Arial, sans-serif;
}

.sr-mattress-showroom__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 40px;
}


/* Content */

.sr-mattress-showroom__title {
	margin: 0 0 6px;

	color: #1a1830;
	font-family: inherit;

	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.sr-mattress-showroom__text {
	margin: 0;
	max-width: 720px;

	color: #888898;
	font-family: inherit;

	font-size: 14.5px;
	font-weight: 400;
	line-height: 1.6;
}


/* CTA */

.sr-mattress-showroom__action {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.sr-mattress-showroom__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 46px;
	padding: 13px 24px 13px 28px;

	background: #8c57b4;
	border: 1px solid #8c57b4;
	border-radius: 30px;

	color: #ffffff !important;
	text-decoration: none !important;

	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;

	white-space: nowrap;

	transition:
		background-color 0.2s ease,
		border-color 0.2s ease;
}

.sr-mattress-showroom__button:hover {
	background: #6b3d91;
	border-color: #6b3d91;
	color: #ffffff !important;
}


/* Button arrow animation */

.sr-mattress-showroom__button-arrow {
	display: inline-flex;
	align-items: center;

	width: 0;
	margin-left: 0;

	opacity: 0;
	overflow: hidden;

	transform: scale(0.7);

	transition:
		width 0.35s ease,
		margin-left 0.35s ease,
		opacity 0.25s ease,
		transform 0.35s ease;
}

.sr-mattress-showroom__button:hover
	.sr-mattress-showroom__button-arrow {
	width: 15px;
	margin-left: 9px;

	opacity: 1;
	transform: scale(1);
}

.sr-mattress-showroom__button-arrow svg {
	display: block;
	flex-shrink: 0;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

	.sr-mattress-showroom__inner {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.sr-mattress-showroom__action {
		justify-content: flex-start;
	}
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.sr-mattress-showroom {
		margin: 20px 0 28px;
		padding: 22px 20px;
	}

	.sr-mattress-showroom__title {
		font-size: 18px;
	}

	.sr-mattress-showroom__text {
		font-size: 14px;
	}

	.sr-mattress-showroom__action {
		width: 100%;
	}

	.sr-mattress-showroom__button {
		width: 100%;
	}
}

/* =========================================================
   SPINAL REST — PRODUCT DETAIL SHOWROOM CTA
   Mattress / Base / Pillow PDPs
   ========================================================= */

.sr-pdp-showroom {
	width: 100%;
	margin: 24px 0;
	padding: 22px 24px;

	background: #f8f7fb;
	border: 1px solid #efefef;
	border-radius: 10px;

	font-family: 'Inter Tight', -apple-system, BlinkMacSystemFont,
		'Segoe UI', Arial, sans-serif;
}

.sr-pdp-showroom__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 28px;
}


/* Content */

.sr-pdp-showroom__title {
	margin: 0 0 6px;

	color: #1a1830;
	font-family: inherit;

	font-size: 18px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -0.01em;
}

.sr-pdp-showroom__text {
	margin: 0;
	max-width: 380px;

	color: #888898;
	font-family: inherit;

	font-size: 14px;
	font-weight: 400;
	line-height: 1.65;
}


/* CTA */

.sr-pdp-showroom__action {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.sr-pdp-showroom__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 44px;
	padding: 12px 20px 12px 24px;

	background: #8c57b4;
	border: 1px solid #8c57b4;
	border-radius: 30px;

	color: #ffffff !important;
	text-decoration: none !important;

	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;

	white-space: nowrap;

	transition:
		background-color 0.2s ease,
		border-color 0.2s ease;
}

.sr-pdp-showroom__button:hover {
	background: #6b3d91;
	border-color: #6b3d91;
	color: #ffffff !important;
}


/* Button arrow */

.sr-pdp-showroom__button-arrow {
	display: inline-flex;
	align-items: center;

	width: 0;
	margin-left: 0;

	opacity: 0;
	overflow: hidden;

	transform: scale(0.7);

	transition:
		width 0.35s ease,
		margin-left 0.35s ease,
		opacity 0.25s ease,
		transform 0.35s ease;
}

.sr-pdp-showroom__button:hover
	.sr-pdp-showroom__button-arrow {
	width: 15px;
	margin-left: 9px;

	opacity: 1;
	transform: scale(1);
}

.sr-pdp-showroom__button-arrow svg {
	display: block;
	flex-shrink: 0;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

	.sr-pdp-showroom__inner {
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.sr-pdp-showroom__action {
		justify-content: flex-start;
	}
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.sr-pdp-showroom {
		margin-top: 20px;
		padding: 20px;
	}

	.sr-pdp-showroom__title {
		font-size: 17px;
	}

	.sr-pdp-showroom__text {
		font-size: 14px;
	}

	.sr-pdp-showroom__action {
		width: 100%;
	}

	.sr-pdp-showroom__button {
		width: 100%;
	}
}