/*
Theme Name: Holospace
Description: WordPress theme wrapping the Holospace one-page Angular app. Main styles load from the bundled CSS shipped with the theme.
Version: 1.0.0
Author: Holospace
Text Domain: holospace
*/

/* Core styles are loaded from styles.4c7b4063d9b252c6e4de.bundle.css via functions.php */

/*
 * App shell: before Angular boots, <app-root> has no intrinsic height. Without a flex column layout,
 * the PHP footer (a sibling) sits directly under the top of the body and appears above the fold first.
 */
body.holospace-body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	margin: 0;
}

.holospace-page-wrap {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: 0;
}

.holospace-page-wrap app-root {
	display: block;
	flex: 1 1 auto;
	width: 100%;
	min-height: 0;
}

.holospace-site-footer {
	flex-shrink: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

/*
 * PHP footer (holospace-site-footer): mirrors Angular component styles that used _ngcontent encapsulation.
 */
.holospace-site-footer .ovrflow-hide {
	overflow: hidden;
}

.holospace-site-footer .company-copyrite {
	color: #d8942e;
	text-decoration: none;
}

.holospace-site-footer .company-copyrite:hover {
	color: #f7b044;
}

.holospace-site-footer .anchor-tag {
	cursor: pointer;
	outline: 0;
	display: block;
}

.holospace-site-footer .anchor-tag a {
	color: #d8942e;
	text-decoration: none;
	line-height: inherit;
}

.holospace-site-footer .anchor-tag a:hover {
	color: #f7b044;
}

.holospace-site-footer a.company {
	line-height: inherit;
	color: #fff;
}

.holospace-site-footer .botomtriangle {
	width: 32%;
	height: 86%;
	position: absolute;
	right: -27%;
	bottom: -28%;
	background-color: #d8942e;
	-webkit-transform: rotate(22deg);
	transform: rotate(22deg);
}

.holospace-site-footer .container.txt-aling-center-sm {
	position: relative;
}

.holospace-site-footer .copyright {
	text-align: center;
}

.holospace-site-footer .anchor-tag + .anchor-tag {
	margin-top: 8px;
}

.holospace-site-footer .holospace-footer-email-line span {
	margin-right: 0.25em;
}

/* Gravity Forms submit: skewed gold bar + counter-skewed label (matches Angular .submit-form-div / .submit-form) */
.contctfomclass .holospace-gf-wrap .holospace-gf-submit-wrap {
	background-color: #d8942c;
	border: none;
	-webkit-transform: skewX(-145deg);
	transform: skewX(-145deg);
	display: inline-block;
	height: 55px;
	min-width: 200px;
	text-align: center;
	position: relative;
	margin-left: auto;
	margin-right: auto;
}

.contctfomclass .holospace-gf-wrap .holospace-gf-submit-wrap input[type="submit"],
.contctfomclass .holospace-gf-wrap .holospace-gf-submit-wrap input.button {
	-webkit-transform: skewX(145deg);
	transform: skewX(145deg);
	border: none !important;
	background: transparent !important;
	background-color: transparent !important;
	color: #fff !important;
	padding: 11px 28px 0 !important;
	height: 55px;
	width: 100%;
	cursor: pointer;
	font-size: 21px;
	font-family: inherit;
	line-height: 1.2;
	box-shadow: none !important;
	border-radius: 0 !important;
	text-shadow: none !important;
}

.contctfomclass .holospace-gf-wrap .holospace-gf-submit-wrap input[type="submit"]:hover,
.contctfomclass .holospace-gf-wrap .holospace-gf-submit-wrap input.button:hover {
	color: #fff !important;
	background: transparent !important;
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* Contact form: fix mobile layout — force columns to stack and add padding */
@media (max-width: 767px) {
	.contctfomclass {
		max-width: 100vw;
		box-sizing: border-box;
		padding-left: 15px !important;
		padding-right: 15px !important;
		overflow-x: hidden;
	}

	.contctfomclass .row {
		flex-wrap: wrap !important;
	}

	.contctfomclass .row > [class*="col-"] {
		flex: 0 0 100% !important;
		max-width: 100% !important;
		padding-left: 15px !important;
		padding-right: 15px !important;
	}

	.contctfomclass .row > .col-12.pl-0,
	.contctfomclass .row > .col-md-6.pl-0 {
		padding-left: 0 !important;
	}

	.contctfomclass .bigger-press {
		font-size: 3rem;
		word-break: break-word;
	}

	.contctfomclass .cont-wid {
		padding: 0 5px;
	}
}

/* Mobile header nav: keep the menu toggle icon visible on dark backgrounds. */
@media (max-width: 991.98px) {
	.navbar-toggler,
	.navbar-toggler:focus,
	.navbar-toggler:hover {
		color: #fff !important;
		border-color: #fff !important;
	}

	.navbar-toggler-icon-custom,
	.navbar-toggler-icon-custom::before,
	.navbar-toggler-icon-custom::after {
		background-color: #fff !important;
		color: #fff !important;
	}
}
