/*
Theme Name: Strömsö
Version: 1.0.0
Template: pro
*/

/**
 * Global adjustments
 */

/* Top margin */
@media (min-width: 768px) {
	.x-container.offset {
		margin-top: 80px;
	}
}

/* Navigation and footer container width */
.x-navbar > .x-navbar-inner > .x-container.max,
.x-colophon > .x-container.max {
	max-width: 960px;
}

/* Remove double container width */
.x-container.width .x-container.width {
	width: 100%;
}

/* Remove entry wrap borders */
.entry-wrap {
	border-radius: 0px;
	padding: 0px;
	box-shadow: none;
}

/* Increase margin to page title */
.entry-content {
	margin-top: 2em;
}

/* Content link hover */
.x-main a:not(.x-anchor-button):not(.x-div):hover {
	text-decoration: underline;
}


/**
 * Navigation
 */


/* Remove navbar top border */
.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a {
	box-shadow: none !important;
}

/* Navbar submenu */
.desktop .sub-menu {
	padding: 25px 30px;
	min-width: 100px;
	font-size: 16px;
	font-weight: 700;
	border-radius: 0px;
}

.desktop .sub-menu .x-active > a,
.desktop .sub-menu .current-menu-item > a {
	background-color: transparent;
}

.x-navbar .desktop .sub-menu a {
	padding: 0px;
}

.x-navbar .desktop .sub-menu a:hover {
	background-color: transparent;
}

/* Front page navigation adjustments */
.home .x-navbar {
	box-shadow: none;
	border-bottom: 0px;
}

/**
* Footer
*/
.x-colophon {
	box-shadow: none;
	border-top: none;
	background-color: #967448;
	background-image: url('assets/footer-background-480.png');
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
}

@media (min-width: 481px) {
	.x-colophon {
		background-image: url('assets/footer-background-960.png');
	}
}

@media (min-width: 961px) {
	.x-colophon {
		background-image: url('assets/footer-background-2560.png');
	}
}

.footer-bar {
	width: 100%;
	color: #fff;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0px;
	margin-bottom: 30px;
}

.footer-bar a,
.footer-bar a:hover {
	color: inherit;
}

.footer-bar-item {
	padding: 0;
	margin: 0;
}

img.footer-bar-item {
	max-width: 150px;
}

.footer-bar--secondary {
	margin-top: -5px;
}

@media (min-width: 1070px) {
	img.footer-bar-item {
		max-width: 160px;
		padding-right: 10px;
	}

	.footer-bar {
		display: table;
	}

	.footer-bar-item {
		display: table-cell;
		vertical-align: middle;
	}
}

.footer-bar-item-list {
	list-style-type: none;
	margin-top: 20px;
}

@media (min-width: 481px) {
	.footer-bar-item-list li {
		display: inline-block;
	}

	.footer-bar-item-list li:not(:last-child):after {
		content: "|";
		margin: 0px 8px;
	}
}

/**
 * Sticky footer
 */
.site {
	height: 100vh;
	display: flex;
	flex-direction: column;
}

.admin-bar .site {
	height: calc(100vh - 32px);
}

@media (max-width: 782px) {
	.admin-bar .site {
		height: calc(100vh - 46px);
	}
}

.site > .x-container.max.width.offset,
.site > .x-main.full {
	flex: 1 0 auto;
}

.x-colophon.bottom {
	flex-shrink: 0;
}

/**
 * Product category
 */
.product-category-content {
	--gap: 30px;
	margin: 2em 0 1em;
	display: flex;
	flex-flow: row wrap;
	gap: var(--gap);
	align-items: center;
}

.product-category-content > div {
	flex: 0 0 100%;
}

.product-category-content .entry-content {
	margin-top: 0;
	order: 2;
}

.product-category-content .entry-featured {
	box-shadow: none;
	border-bottom: none;
	order: 1;
}

.product-category-content .entry-thumb {
	background: transparent;
}

.product-category-content .entry-featured img {
	border-radius: 10px;
}

@media (min-width: 640px) {
	.product-category-content > div {
		flex-basis: calc(50% - (var(--gap) / 2));
		order: 0 !important;
	}
}

@media (min-width: 900px) {
	.product-category-content .entry-content {
		flex-basis: calc(33.33333% - (var(--gap) / 2));
	}

	.product-category-content .entry-featured {
		flex-basis: calc(66.66667% - (var(--gap) / 2));
	}
}

/**
 * Product styles.
 */
.product-spacer {
	margin: 31px 0px;
	border-top: 1px solid var(--theme-color-primary);
}

.product .entry-title {
	margin-top: 0px;
	font-size: 24px;
	font-size: 1.5rem;
}

.product {
	margin-top: 0px;
}

.product .entry-featured {
	margin-bottom: 1em;
	box-shadow: none;
	border-bottom: none;
}

.product .entry-featured a {
	cursor: zoom-in;
}

.product .entry-featured img {
	border-radius: 10px;
}

.product-gallery img {
	width: 68px;
	margin-right: 0.4em;
	margin-top: 0.4em;
}

.product-details {
	margin-top: 1em;
}

.product-details h4 {
	margin: 0px;
	font-size: 16px;
}

.product-details ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

.product-details li {
	display: block;
}

@media (min-width: 768px) {
	.product {
		display: table;
	}

	.product .entry-featured,
	.product .entry-wrap {
		display: table-cell;
		vertical-align: top;
	}

	.product .entry-featured {
		padding-right: 30px;
		width: 295px;
	}

	.product:last-child {
		margin-bottom: 40px;
	}
}

/**
 * Reseller table
 */

.reseller-table {
	margin-top: 2em;
	display: table;
	width: 100%;
	margin-bottom: -2em;
}

.reseller-table-row {
	display: table-row;
}

.reseller-table .reseller {
	text-align: center;
	vertical-align: middle;
	display: table-cell;
	width: 25%;
	padding-bottom: 2em;
}

@media (max-width: 767px) {
	.reseller-table,
	.reseller-table-row {
		width: 100%;
		display: block;
	}

	.reseller-table .reseller {
		float: left;
		display: block;
		width: 50%;
		padding-left: 10px;
		padding-right: 10px;
	}

	.reseller-table-row:after {
		content: "";
		display: table;
	}
}

@media (max-width: 480px) {
	.reseller-table .reseller {
		float: none;
		width: 100%;
	}
}

/**
 * Typography
 */
h2, .h2 {
	font-size: 200%;
}

/**
 * Forms
 */
body .gform_wrapper .gform_heading {
	display: none;
}

.gform-theme {
	--gf-color-primary: var(--theme-color-primary) !important;
	--gf-color-primary-darker: var(--theme-color-primary) !important;
	--gf-ctrl-btn-font-weight: 700 !important;
	--gf-ctrl-btn-padding-y: 8px !important;
	--gf-ctrl-btn-padding-x: 32px !important;
}

.x-btn:hover,
.button:hover,
[type="submit"]:hover {
	text-shadow: none !important;
}

/**
 * Leaf graphics
 */
@media (min-width: 768px) {
	:root {
		--leaf-size: 400px;
		--content-size: 800px;
		--allowance: 110px;
		--leaf-space: calc((100vw - var(--content-size)) / 2 + var(--allowance));
		--leaf-position-x: min(calc(var(--leaf-space) - var(--leaf-size)), 0px);
	}

	.page:not(.home) .site {
		background-image: url('assets/leaves-top-mirror.png');
		background-repeat: no-repeat;
		background-size: var(--leaf-size);
		background-position-y: top 91px;
		background-position-x: right var(--leaf-position-x);
	}

	.home .primary-content {
		background-image: url('assets/leaves-top.png'), url('assets/leaves-bottom.png');
		background-repeat: no-repeat;
		background-size: var(--leaf-size);
		background-position-y: top 0px, bottom 0px;
		background-position-x: left var(--leaf-position-x), right var(--leaf-position-x);
	}
}
