@import '../_global';

// Absolute Header
body {
	&:not(.admin-bar) {
		#{$themePrefix} {
			&-header {
				#{$varPrefix}-t: 0;
			}
		}
	}
}

//Theme CSS

#{$themePrefix} {
	//Absolute Header
	&-header {
		#{$varPrefix}-pos: absolute;
		#{$varPrefix}-t: var(--wp-admin--admin-bar--height);
		#{$varPrefix}-l: 0;
		#{$varPrefix}-r: 0;
		#{$varPrefix}-z-idx: 9;

		//Top header
		&--top {
			#{$themePrefix} {
				&-svg-icon {
					#{$varPrefix}-cl: var(--wp--preset--color--default);
				}
			}
		}
	}

	// Hero Banner
	&-hero {
		&-banner {
			#{$varPrefix}-pos: relative;

			@include respond-above(xxl) {
				min-height: 85vh !important;
			}

			&-content {
				#{$varPrefix}-pos: relative;
				#{$varPrefix}-z-idx: 2;
			}

			.at-svg {
				#{$varPrefix}-cl: var(--wp--preset--color--secondary);
				#{$varPrefix}-pos: absolute;
				max-width: 100%;
			}
		}
	}

	//Global Height & Width
	&-is-h-w {
		&-30 {
			$hw30: 30px;
			#{$varPrefix}-h: $hw30;
			#{$varPrefix}-w: $hw30;
		}
		&-40 {
			$hw40: 40px;
			#{$varPrefix}-h: $hw40;
			#{$varPrefix}-w: $hw40;
		}

		&-60 {
			$hw60: 60px;
			#{$varPrefix}-h: $hw60;
			#{$varPrefix}-w: $hw60;
		}
		&-70 {
			$hw70: 70px;
			#{$varPrefix}-h: $hw70;
			#{$varPrefix}-w: $hw70;
		}
		&-80 {
			$hw80: 80px;
			#{$varPrefix}-h: $hw80;
			#{$varPrefix}-w: $hw80;
		}
	}

	//Global SVG Color and Spacing
	&-svg {
		&-icon {
			#{$varPrefix}-cl: var(--wp--preset--color--primary);
			#{$varPrefix}-m: 0 0 30px 0;
			&-white {
				#{$varPrefix}-cl: var(--wp--preset--color--default);
			}
		}
	}

	//Info
	&-phn-info {
		#{$themePrefix} {
			&-svg-icon {
				#{$varPrefix}-cl: var(--wp--preset--color--default);
			}
		}
	}
}