@charset "UTF-8";

.base-ui {
	--ui-transition: all .2s ease-in-out;
	--ui-button--padding: 10rem 15rem;
	--ui-button--text: #fff;
	--ui-button--background: var(--base-link-color);
	--ui-button--border: 2rem solid var(--base-link-color);
	--ui-button--hover-text: var(--ui-button--text);
	--ui-button--hover-background: var(--base-color-text);
	--ui-button--hover-border: 2rem solid var(--base-color-text);
	--ui-button--secondary--padding: 10rem 15rem;
	--ui-button--secondary--text: var(--base-link-color);
	--ui-button--secondary--background: transparent;
	--ui-button--secondary--border: 2rem solid var(--base-link-color);
	--ui-button--secondary--hover-text: #fff;
	--ui-button--secondary--hover-background: var(--base-link-color);
	--ui-button--secondary--hover-border: var(--ui-button--secondary--border);
	--ui-input--border: 1rem solid var(--base-color-text);
	--ui-input--border-radius: 0;
	--ui-input--padding: calc(var(--base-space) / 2) var(--base-space);
}

.base-ui .ui-button, .base-ui .wp-element-button, .base-ui input[type=submit] {
	display: inline-block;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	margin-bottom: var(--base-space);
	-webkit-transition: var(--ui-transition);
	transition: var(--ui-transition);
	padding: var(--ui-button--padding);
	color: var(--ui-button--text);
	background: var(--ui-button--background);
	border: var(--ui-button--border);
}

.base-ui .ui-button:hover, .base-ui .wp-element-button:hover, .base-ui input[type=submit]:hover {
	color: var(--ui-button--hover-text);
	background: var(--ui-button--hover-background);
	border: var(--ui-button--hover-border);
}

.base-ui .ui-button.is-style-secondary, .base-ui .wp-element-button.is-style-secondary, .base-ui input[type=submit].is-style-secondary {
	padding: var(--ui-button--secondary--padding);
	color: var(--ui-button--secondary--text);
	background: var(--ui-button--secondary--background);
	border: var(--ui-button--secondary--border);
}

.base-ui .ui-button.is-style-secondary:hover, .base-ui .wp-element-button.is-style-secondary:hover, .base-ui input[type=submit].is-style-secondary:hover {
	color: var(--ui-button--secondary--hover-text);
	background: var(--ui-button--secondary--hover-background);
	border: var(--ui-button--secondary--hover-border);
}

.base-ui textarea, .base-ui select, .base-ui input[type="text"], .base-ui input[type="email"], .base-ui input[type="password"], .base-ui input[type="date"], .base-ui input[type="number"], .base-ui input[type="search"], .base-ui input[type="url"], .base-ui input[type="tel"] {
	border-radius: var(--ui-input--border-radius);
	border: var(--ui-input--border);
	padding: var(--ui-input--padding);
}

.base-ui textarea {
	--height: calc(var(--base-space) * 3);
	min-height: var(--height);
	font-family: inherit;
	font-size: inherit;
}

.base-ui ::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 7rem;
}

.base-ui ::-webkit-scrollbar-thumb {
	border-radius: 4rem;
	background-color: rgba(0, 0, 0, .5);
	box-shadow: 0 0 1rem rgba(255, 255, 255, .5);
}

.base-ui select {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
}

.base-ui .flex {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}

.base-ui .grid {
	display: -ms-grid;
	display: grid;
}

.base-ui .block {
	display: block;
}

.base-ui .inline-block {
	display: inline-block;
}

.base-ui .inline {
	display: inline;
}

.base-ui .relative {
	position: relative;
}

.base-ui .absolute {
	position: absolute;
}

.base-ui .alignleft {
	text-align: left;
}

.base-ui .alignright {
	text-align: right;
}

.base-ui .aligncenter {
	text-align: center;
}

.base-ui .mt {
	margin-top: var(--base-space);
}

.base-ui .mb {
	margin-bottom: var(--base-space);
}

.base-ui .pt {
	padding-top: var(--base-space);
}

.base-ui .pb {
	padding-bottom: var(--base-space);
}

.base-ui .m-auto {
	margin-left: auto;
	margin-right: auto;
}

.base-ui .hidden {
	display: none;
}