/**
Theme Name: Beavivo Form
Author: Sympatient GmbH
Author URI: https://sympatient.com
Description: A child of astra theme. 
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: beavivo-form
Template: astra
*/


/*
 * Custom Fonts
 *
 */

@font-face {
  font-family: "Gilroy";
  src: url("fonts/Gilroy-Regular.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Gilroy";
  src: url("fonts/Gilroy-Bold.otf") format("opentype");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "Adobe Arabic";
  src: url("fonts/Adobe-Arabic-Regular.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}



/*
 * 
 * Theme Colors 
 * 
 */
 :root {
	--beavivo-gradient-neutral-warm: #E1F0EE;
	--beavivo-gradient-neutral-median: #EEE8E2;
	--beavivo-gradient-neutral-cold: #FFF7DF;
	  --beavivo-gradient-light-dawn: #00573d;
	  --beavivo-gradient-dark-dawn: #092b28;
	  --beavivo-functional-midnight: #0E0E23;
	  --beavivo-functional-white: #fff;
	  --beavivo-accent-brave-blue: #ffa742;
	  --beavivo-accent-brave-blue-hover: #dd994b;
	  --beavivo-accent-brandy: #ffa742;
	  --beavivo-accent-desert: #E49430;
	  --beavivo-accent-desert-hover: #edceaa;
	  --beavivo-accent-brey: #6A2530;
  }

:root { 
	--colors-highlight-500-full:  #F1F9FA;
	--colors-highlight-500: #50AFBA14;
	--colors-primary-600: #326673FF;
	--colors-primary-500: #3D7C8BFF;
	--colors-secondary-600: #162429FF;
	--colors-system-white: #FFFFFFFF;
}


  
  html{
  background: linear-gradient(90deg, var(--beavivo-gradient-neutral-warm) 0%,var(--beavivo-gradient-neutral-cold) 100%);
  }
  body{
	  background-color: transparent;
	  font-family: 'Gilroy', sans-serif;
  }
  .entry-header h1.entry-title{
	  font-family: 'Adobe Arabic', serif;
	  font-size:39px;
	  font-weight: normal;
	  margin-top: 0.5em;
	  line-height:0.8;
  }
  .entry-header h1.entry-title span{
	  color: var(--beavivo-accent-brandy);
	  display:block;
  }
  /*
   * 
   * Gravity Forms
   * 
   */
  

  /* gform Footer */
  /* Prev/Next Buttons */
.gform_wrapper input:is([type=button]):focus{
	background-color: var(--beavivo-accent-desert-hover);
}

  .gform_page_footer
  {
	  display: flex;
	  flex-direction: row;
	  justify-content: space-between;
   }

  .gform_page_footer .gform-theme-button,
  .gform_wrapper input[type="submit"]
  {
	  border-radius:100px;
  }
  .gform_wrapper.gravity-theme .gform_page_footer .gform_previous_button{
	  background-color:transparent;
	  box-shadow: inset 0px 0px 0px 2px black;
	  color: black;
	  order: 1;
  }
  .gform_wrapper.gravity-theme .gform_page_footer .gform_next_button,
  .gform_wrapper input[type="submit"]
  {
	  order: 3;
  }
  /* loading spinner */
  .gform_ajax_spinner{
	  width: 40px;
	  order:2;
  }
  /* intro  */

  .screeningform-intro-wrapper{
	  
  }
  .screeningform-intro-wrapper .gform_page_footer{
	  justify-content: right;
  }
  .screeningform-intro-wrapper .gform_page_footer .gform_ajax_spinner{
    position: absolute;
    left: 50%;
  }

  .screeningform-intro-card{
	  display:flex;
	  flex-direction:column;
  }
  .gform_wrapper.gravity-theme .gform_page_fields{
	  min-height:400px;
  }
  /* circle img mask */ 
  .circle-mask {
   clip-path: circle();
  }
  .screeningform-intro-img{
	  align-self: center;
	  width:85%;
	  margin:1em 0;
  }


  /* progress bar */
  .gf_progressbar_title,
  .gform_wrapper.gravity-theme .gf_progressbar_percentage span
  {
	  display:none;
  }
  .gform_wrapper.gravity-theme .gf_progressbar_orange{
    background-color: rgba(9, 43, 40, 0.05);
  }
  .gform_wrapper.gravity-theme .gf_progressbar_percentage.percentbar_orange {
	  background-color: var(--beavivo-accent-brandy);
	  color: #fff;
  }
  .gform_wrapper.gravity-theme .gf_progressbar_percentage{
	  height:11px;
  }
  div.gform_wrapper.gravity-theme .gf_progressbar_percentage:not(.percentbar_100) {
    border-radius: 10.5px;
  }
  /* gf text area styles */
  .gform_wrapper.gravity-theme .gfield textarea
  {
	  border-radius:20px;
	  box-shadow: 3px 3px 10px rgba(0,0,0,0.025);
	  padding:15px;
  }
  
  /* gf checkbox / radio styling */
  
  .gform_wrapper.gravity-theme .gchoice label
   {
	  cursor: pointer;
		background-color: var(--beavivo-functional-white);
	  position: relative;
	  text-align: center;
	  width: 100%;
	  /*line-height: 2.8; */
	  border: 0px;
	  border-radius: 12px;
	  margin: 3px 0;
	  font-weight: bold;
	  max-width: none;
		   margin-bottom: 14px;
	  padding: 10px 10px;
	  box-shadow: 3px 3px 10px rgba(0,0,0,0.025);
	  transition: all 0.3s ease;
	  -webkit-transition: all 0.3s ease;
  }
  .gform_wrapper.gravity-theme .gfield-choice-input{
	display:none;
  }
  .gform_wrapper .gchoice label + label
  {
	margin-left: 15px;
  }
  
  .gform_wrapper  input[type="checkbox"],
  .gform_wrapper  input[type="radio"]
  {
	opacity: 0;  /*hidden but still tabable */
	left: -9999px;
    position: relative;
  }
  
  .gform_wrapper input[type="checkbox"] + span,
  .gform_wrapper input[type="radio"] + span
  {
	color: #B3CEFB;
	border-radius: 50%;
	padding: 12px;
	transition: all 0.4s;
	-webkit-transition: all 0.4s;
  }
  
  .gform_wrapper input[type="checkbox"]:checked + label,
  .gform_wrapper input[type="radio"]:checked + label
   {
	color: var(--beavivo-functional-white);
	background-color: var(--beavivo-gradient-light-dawn);
	  border: 0px solid;
	  border-radius:12px;
	  transition: all 0.3s ease;
	  -webkit-transition: all 0.3s ease;
  }
  
  .gform_wrapper input[type="checkbox"]:focus + span,
  .gform_wrapper input[type="radio"]:focus + span{
	color: #fff;
  }
  .gform-confirmation-icon{
	  width:40px;
	  height:40px;
	  margin-left: 15px;
  }

/* background color */
.ast-plain-container, .ast-page-builder-template {
	background-image: none !important;
	background-color: var(--colors-highlight-500-full);
}

/* heading */
.entry-header h1.entry-title {
	font-family: Poppins, sans-serif;
	font-size: var(--font-sizes-display-1, 43px);
	line-height: 110%;
	letter-spacing: -0.78px;
	font-weight: 600;
	color: var(--colors-secondary-600);
}

/* heading beavivo */
.entry-header h1.entry-title span {
	color: var(--colors-secondary-600);
}

/* progress bar */
.gform_wrapper.gravity-theme .gf_progressbar_percentage {
	background-color: var(--colors-primary-600) !important;
}
.gform_wrapper.gravity-theme .gf_progressbar_orange {
	background-color: var(--colors-highlight-500);
}

/* next button */
.gform_wrapper.gravity-theme .gform_page_footer .gform_next_button,
.gform_wrapper input[type="submit"] {
	width: 148px;
  border-radius: 12px;
	padding: 17.5px 21px;
  background-color: var(--colors-primary-500);
	color: var(--colors-system-white);
	font-size: var(--font-sizes-button-label-1);
	font-weight: 600;
}

/* next button hover */
.gform_wrapper.gravity-theme .gform_page_footer .gform_next_button:hover,
.gform_wrapper input[type="submit"]:hover {
    background-color: var(--colors-primary-600);
   color: var(--colors-system-white);
}

/*Weiter-Button Active */
.gform_wrapper.gravity-theme .gform_page_footer .gform_next_button:active,
.gform_wrapper input[type="submit"]:active {
	background-color: var(--colors-primary-600);
	color: var(--colors-system-white);
}

/* next button not on focus */
.gform_wrapper.gravity-theme .gform_page_footer .gform_next_button:focus,
.gform_wrapper input[type="submit"]:focus {
	background-color: var(--colors-primary-600);
	color: var(--colors-system-white);
}

/* radio buttons */
.gform_wrapper .gfield_radio .gchoice label:hover {
	background-color: var(--colors-primary-500);
	color: var(--colors-system-white);
}
.gform_wrapper .gfield_radio .gchoice input:checked + label {
	background-color: var(--colors-primary-600);
	color: var(--colors-system-white);
}

/* back button */
.gform_wrapper.gravity-theme .gform_page_footer .gform_previous_button {
	width: 148px;
	border-radius: 12px;
	padding: 17.5px 21px;
	border: 2px var(--colors-secondary-600);
	background-color: var(--colors-system-white);
	color: var(--colors-secondary-600);
	font-weight: 600;
}
.gform_wrapper.gravity-theme .gform_page_footer .gform_previous_button:hover {
	background-color: var(--colors-secondary-600);
	color: var(--colors-system-white);
}

/* check boxes */
.gform_wrapper .gfield_checkbox .gchoice label:hover {
	background-color: var(--colors-primary-500);
color: var(--colors-system-white);
}
.gform_wrapper .gfield_checkbox .gchoice input:checked + label {
	background-color: var(--colors-primary-600);
color: var(--colors-system-white);
}


  /* Desktop Media Queries */
@media screen and (min-width:38.75em) {
  .screeningform-intro-img{
	  width:55%;
  }
}
@media screen and (min-width:48.75em) {
  .screeningform-intro-img{
	  width:35%;
  }
}