/* Styles definition here */
#fbuilder{
	--fbuilder-border: rgba(154, 146, 230, 0.83);
	--fbuilder-bg: rgba(154, 146, 230, 0.1);
	--fbuilder-bg-select: rgba(154, 146, 230, 0.8);
	--fbuilder-border: rgba(106, 185, 157, 0.83);
	--fbuilder-border: #bab7a7;
	--fbuilder-bg: rgba(106, 185, 157, 0.1);
	--fbuilder-bg: #f3f6f5;
	--fbuilder-bg-select: rgba(106, 185, 157, 0.8);
	--fbuilder-bg-select: #80a696;
	--fbuilder-text: rgba(76, 0, 164, 1);
	--fbuilder-text: #346c53;
	--fbuilder-text: #1a5f4b;
	--fbuilder-text: #090C0A;
	--fbuilder-accent: #1a5f4b;
	--fbuilder-accent: #a92c2c;
	--fbuilder-grey-bg: #f1f1f1;
	--fbuilder-grey-text: #888888;
	--fbuilder-bg-2: #f6f5f3;
	--fbuilder-border-2: #d7d2ce;
	--fbuilder-accent-2: #e2a618;
}
@media (min-width: 1025px){
	#fbuilder #field_1-0 {
	  float: left;
	  width: 70.5%;
	  margin-left: initial;
		padding: 30px;
		/*background: whitesmoke;*/
	}
	#fbuilder .fields {
	  /*margin-left: 45%;*/
	  width: 29.5%; /* Adjust the width as needed */
		float: right;
		padding: 10px 30px 10px 0px;
	}
	#fbuilder #field_1-1 {
		margin-top: 20px;
	}
	#fbuilder .pbSubmit{
		/*margin: 10px 30px;*/
	}
}
#fbuilder label{
    font-size: 15px;
}
#fbuilder label[for="fieldname1_1"]{
	display: none;
}
.ahbfield_service { display: none; }


#fbuilder .ui-datepicker-inline{
	box-shadow: initial;
	-moz-box-shadow: initial;
	-webkit-box-shadow: initial;
	max-width: 508px;
	max-width: 610px;
}
.ui-datepicker-header{
	text-shadow: initial;
	box-shadow: initial;
	-moz-box-shadow: initial;
	-webkit-box-shadow: initial;
	background: initial;
    font-size: 18px;
    font-weight: initial;
	color: initial;
    border-radius: 10px;
    margin-bottom: 10px;
    border: 1px solid #eee;
    padding: 5px;
}
.ui-datepicker-prev, .ui-datepicker-next{
	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iNjAiIHZpZXdCb3g9IjAgMCAyNSA2MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguMTQ5NDEgOS4xOTkyMkwxNi44NTA2IDE1LjM2MzJMOC4xNDk0MSAyMC44MDA4IiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTYuODUwNiAzOS4xOTkyTDguMTQ5NDEgNDUuMzYzMkwxNi44NTA2IDUwLjgwMDgiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
}
.ui-datepicker table{
	border: initial;
}
.ui-datepicker thead{
	background-image: initial;
	border-bottom: initial;
	background-color: initial;
}
.ui-datepicker thead tr{
	padding-bottom: 7px;
}
.ui-datepicker th{
	text-transform: initial;
	text-shadow: initial;
	font-weight: normal;
}
span[title="Sunday"]::after {
  content: "n";
}
span[title="Monday"]::after {
  content: "n";
}
span[title="Tuesday"]::after {
  content: "e";
}
span[title="Wednesday"]::after {
  content: "d";
}
span[title="Thursday"]::after {
  content: "u";
}
span[title="Friday"]::after {
  content: "i";
}
span[title="Saturday"]::after {
  content: "t";
}
/*start of mature*/
.ui-datepicker-header{
		border: initial;
}
.ui-datepicker tbody tr:first-child {
    border-top: 1px solid var(--fbuilder-border-2);
}
#fbuilder .ui-datepicker tbody tr {
    border-bottom: 1px solid var(--fbuilder-border-2);
}
#fbuilder .ui-datepicker-calendar td {
    padding: 10px 0;
		border-right: 1px solid var(--fbuilder-border-2);
}
#fbuilder .ui-datepicker-calendar td:first-child {
    border-left: 1px solid var(--fbuilder-border-2);
}

.ui-datepicker-calendar .ui-state-default {
    background: initial;
}
.ui-datepicker-calendar .ui-state-active {
    text-shadow: initial;
    box-shadow: initial;
    -moz-box-shadow: initial;
    -webkit-box-shadow: initial;
    color: white;
		border: initial;
}
.ui-datepicker-unselectable.nonworking {
    background: var(--fbuilder-bg-2);
		background: linear-gradient(to top left, var(--fbuilder-bg-2) calc(50% - 1px), var(--fbuilder-border-2), var(--fbuilder-bg-2) calc(50% + 1px) );
}
.ui-datepicker-calendar .ui-datepicker-unselectable .ui-state-default {
    color: var(--fbuilder-grey-text);
		box-shadow: initial;
		-moz-box-shadow: initial;
		-webkit-box-shadow: initial;
}
.ui-datepicker-current-day {
    background: var(--fbuilder-bg-select);
}
.ui-datepicker td span, .ui-datepicker td a {
    text-shadow: initial;
    font-weight: initial;
    font-size: 15px;
    color: var(--fbuilder-text);
}
.ui-datepicker-today{
    position: relative;
}
.ui-datepicker-today:after{
	content: "";
 	display: block;
 	position: absolute;
 	top: 4px;
 	right: 4px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background-color: var(--fbuilder-accent);
}
/*end of mature*/


#fbuilder .slots{
	margin-top: 30px;
	box-shadow: initial;
	-moz-box-shadow: initial;
	-webkit-box-shadow: initial;
	border: initial;
  margin-left: -5px;
  padding: initial;
}
#fbuilder .slots span:first-child{
	margin:5px;
}
#fbuilder .slots div{
	padding: initial;
  border: 1px solid var(--fbuilder-border);
	border-radius: 3px;
	overflow:hidden;
}
#fbuilder .slots div.htmlUsed{
  border: 1px solid #ccc;
}
#fbuilder .slots .htmlUsed.currentSelection{
	border: 1px solid var(--fbuilder-bg-select);
}
#fbuilder .slots div a{
	background: var(--fbuilder-bg);
  padding: 8px;
  color: var(--fbuilder-text);
}
#fbuilder .slots div.htmlUsed a{
	background: var(--fbuilder-grey-bg);
	color: var(--fbuilder-grey-text);
	background: linear-gradient(to top left, var(--fbuilder-bg-2) calc(50% - 1px), var(--fbuilder-border-2), var(--fbuilder-bg-2) calc(50% + 1px) );
}
#fbuilder .slots div.htmlUsed.currentSelection a{
	background: var(--fbuilder-bg-select);
  color: white;
}
#fbuilder a.cancel {
    color: var(--fbuilder-accent);
}

select.ahbfield_service{
	padding: 10px;
  border-radius: 3px;
}
#fbuilder .dfield input{
	padding: 10px;
  border-radius: 3px;
	width: 100%;
}
#fbuilder .dfield input:focus{
	border-color: var(--fbuilder-border);
}
#fbuilder .dfield input::placeholder{
	color: gray;
}
#fbuilder .required{
	color: initial;
}
#fbuilder span.r {
    color: red;
}
#fbuilder .pbreak .pbPrevious, #fbuilder .pbreak .pbNext, #fbuilder .pbSubmit{
	background: var(--fbuilder-accent);
	color: white;
  border-radius: 5px;
  margin-top: 14px;
	padding: 10px 16px;
  font-weight: bold;
}