/**
 * Copyright (c) 2020 - present, DITDOT Ltd. - MIT Licence
 *     https://github.com/ditdot-dev/vue-flow-form
 *     https://www.ditdot.hr/en
 *
 * @format
 */

/* This theme can also be added via CDN: https://cdnjs.cloudflare.com/ajax/libs/vue-flow-form/1.1.1/vue-flow-form.theme-green.min.css */

:root {
	--bg-color: #3eaf7c;
	--main-text-color: #fff;
	--secondary-text-color: #b5ebd3;
	--tertiary-text-color: #52b789;
	--main-accent-color: #111;
	--secondary-accent-color: #ecf80d;
	
	--color-teal: #007f7b;
	--color-gray: #808285;
	--color-black: #000;
	--color-brown: #77511e;
	--color-accent: #00b4ff;
}

.original_content_area h1 {
	text-align: center;
}
.bpress-search {
	text-align: center;
}

body,
textarea,
input,
select,
select option {
	font-family: "Poppins", sans-serif;
}

body {
	background-color: var(--bg-color);
	color: var(--main-text-color);
}

/*header*/

header {
	background-color: transparent;
}

header svg.logo {
	fill: var(--main-accent-color);
}

/* footer */

.f-footer .footer-inner-wrap {
	background-color: none;
}

.v-form textarea,
.v-form input,
.v-form select option {
	color: var(--main-accent-color);
}

.v-form input[type="text"],
.v-form input[type="number"],
.v-form input[type="tel"],
.v-form input[type="email"],
.v-form input[type="url"],
.v-form input[type="password"],
.v-form textarea,
.v-form span.faux-form {
	border-bottom-color: var(--secondary-text-color);
}

a,
a:active {
	color: var(--main-text-color);
}

/*placeholder*/

::-webkit-input-placeholder {
	/* Chrome/Opera/Safari */
	color: var(--secondary-text-color);
	opacity: 1;
	font-weight: 300;
}

::-moz-placeholder {
	/* Firefox 19+ */
	color: var(--secondary-text-color);
	opacity: 1;
	font-weight: 300;
}

:-ms-input-placeholder {
	/* IE 10+ */
	color: var(--secondary-text-color) !important;
	opacity: 1 !important;
	font-weight: 300 !important;
}

:-moz-placeholder {
	/* Firefox 18- */
	color: #999;
	opacity: 1;
	font-weight: 300;
}

/*field-multiplechoicetype*/

ul.f-radios li {
	border: 1px solid var(--secondary-text-color);
	font-weight: 900;
}

ul.f-radios li.f-other.f-selected input {
	color: inherit;
}

ul.f-radios li.f-selected,
ul.f-radios li:active {
	border-color: var(--main-text-color);
	color: var(--main-text-color);
	background-color: #929292;
}

.f-key {
	color: #007f7b;
	font-weight: 300;
}

/*field-dropdowntype*/

span.f-empty {
}

span.f-answered {
	color: var(--main-text-color);
}

.f-arrow-down svg {
	fill: var(--main-text-color);
}

/*buttons*/

.o-btn-action {
	color: var(--bg-color);
	background-color: var(--color-teal);
}

.o-btn-action:hover,
.o-btn-action:focus {
	background-color: var(--main-text-color);
	opacity: 0.9;
}

/* progress bar */

.f-footer .f-prev svg,
.f-footer .f-next svg {
	fill: #007f7b;
}

.f-progress {
	color: var(--secondary-text-color);
}

.f-progress-bar {
	background-color: var(--secondary-text-color);
}

.f-progress-bar-inner {
	background-color: none;
}

.f-prev:hover,
.f-next:hover {
	background-color: rgba(0, 0, 0, 0.07);
}

/*text-muted*/

span.f-tagline,
span.f-sub,
p.description,
.text-muted {
	color: black;
}

.text-alert,
.f-invalid {
	color: red;
}

p.text-success {
	color: #ecf80d;
}

@media screen and (max-width: 479px), (max-height: 420px) {
	.f-footer .footer-inner-wrap {
		background-color: none;
	}
}

/*
    dark mode styles
  */

@media (prefers-color-scheme: dark) {
	:root {
		--bg-color: #313640;
		--main-text-color: #fff;
		--secondary-text-color: #aeb6bf;
		--tertiary-text-color: #41464f;
		--main-accent-color: #41b883;
		--secondary-accent-color: #a0dbc1;
	}
	header {
		background-color: transparent;
	}
	header svg.logo {
		fill: #007f7b;
	}
	.v-form textarea,
	.v-form input,
	.v-form select option {
		color: #007f7b;
	}
	span.f-answered {
		color: #007f7b;
	}
	.f-arrow-down svg {
		fill: #007f7b;
	}
	.text-success {
		color: #007f7b;
	}
	/*footer*/
	.f-footer .footer-inner-wrap {
		background-color: none;
	}
	.f-footer .f-prev svg,
	.f-footer .f-next svg {
		fill: #007f7b;
	}
	.f-footer .f-prev.f-disabled svg,
	.f-footer .f-next.f-disabled svg {
		fill: #232323;
	}
	.f-footer .footer-inner-wrap {
		background-color: none;
	}
	.f-prev:hover,
	.f-next:hover {
		background-color: rgba(0, 0, 0, 0.2);
	}
	.f-progress-bar {
		background-color: var(--secondary-text-color);
		filter: brightness(1);
	}
	.f-progress-bar-inner {
		background-color: #007f7b;
	}
	/*field-multiplechoicetype*/
	ul.f-radios li {
	}
	.f-key {
		color: #007f7b;
		font-weight: 300;
	}
}
