/*---------------------------------------------------------------------------
03-04 Forms (BSF) - Gravity Forms Integrated Disable theme - FRAMEWORK 2024-05-05
---------------------------------------------------------------------------*/

/* Form Variables
-----------------------------------------------*/
:root { 
    /* Base Fields */
    --form_field-margin_bottom: 0.3rem;
    --form_field-text_color: var(--clr-2);
    --form_field-placeholder_color: var(--clr-1);
    --form_field-background_color: rgba(0, 0, 100, 0.02);
    --form_field-border_thickness: 2px;
    --form_field-border_color: var(--clr-1);
    --form_field-border_radius: ;
    
    /* Base Fields FOCUS */
    --form_field-focus-text_color: var(--clr-2);
    --form_field-focus-background_color: var(--clr-white);
    --form_field-focus-border_color: var(--clr-2);

    /* Labels */
    --form_field-lable_color: var(--clr-2);
    --form_field-lable_option_color: var(--clr-2);

    /* Radio & Checkbox Field */
    --form_radiocheckbox-fontsize: 1.1rem; 
    --form_radiocheckbox-field_left_space: 2.25rem;
    --form_radiocheckbox-field_size: 1.75rem; 
    --form_radiocheckbox-field_border_radius: .35rem; 
    --form_radiocheckbox-field_border_thickness: 3px; 
    --form_radiocheckbox-field_color: var(--clr-1); 

    /* Radio & Checkbox Cheked */
    --form_radiocheckbox-input_size: 1.9rem; 
    --form_radiocheckbox-input_color: var(--clr-2);
}

/* Form Resets
------------------------------------------*/
/* Button Resets */
textarea, input, select { outline: none; }

/* Form Typography
------------------------------------------*/
form p  { margin-bottom: 15px; font-size: 1rem; color: var(--clr-2); box-sizing: border-box; font-family: var(--bodyfont); font-weight: var(--bodyfont-weight); font-style: var(--bodyfont-style); }
form label, form legend {
    font-family: var(--headingfont); font-weight: var(--headingfont-weight); font-style: var(--headingfont-style);
    line-height: .75;
    letter-spacing: 0.05em;
    color: var(--form_field-lable_color); 
    margin: 0;
}

/* Input Fields
------------------------------------------*/
input[type="text"], input[type="email"], input[type="url"],input[type="password"],input[type="search"],input[type="number"],input[type="tel"],input[type="range"], 
input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea ,
    
    /* Vendors Fields */
        /* Login Form */
        .xoo-aff-group input[type="text"], 
        .xoo-aff-group input[type="password"], 
        .xoo-aff-group input[type="email"], 
        .xoo-aff-group input[type="number"], 
        .xoo-aff-group select, 
        .xoo-aff-group select + .select2, 
        .xoo-aff-group input[type="tel"]
{ 
    width: 100%; padding: .5rem 1rem !important; 
    margin-bottom: var(--form_field-margin_bottom); 
    border-radius: var(--form_field-border_radius) !important; 
    border: none;
    border-bottom:  solid var(--form_field-border_thickness) var(--form_field-border_color);
    box-sizing: border-box;
    font-family: var(--bodyfont); font-weight: var(--bodyfont-weight); font-style: var(--bodyfont-style);
    font-size: 1.2rem !important;
    color: var(--form_field-text_color); 
    background-color: var(--form_field-background_color);
    box-shadow: none !important;
    transition: var(--transitions);
}

/* Input Focus
------------------------------------------*/
input[type="text"]:focus,input[type="email"]:focus,input[type="url"]:focus,input[type="password"]:focus,input[type="search"]:focus,input[type="number"]:focus,input[type="tel"]:focus,input[type="range"]:focus, input[type="date"]:focus,
input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus 
{ 
    background-color: var(--form_field-focus-background_color); 
    border: none;
    border-bottom: solid var(--form_field-border_thickness) var(--form_field-focus-border_color); 
    color: var(--form_field-focus-text_color);  }

/* Select Field
------------------------------------------*/
select { 
    border-radius: var(--form_radiocheckbox-field_border_radius);  
    border: solid var(--form_field-border_thickness) var(--form_field-border_color); 
    font-family: var(--bodyfont) !important; font-weight: var(--bodyfont-weight-bold) !important; font-style: var(--bodyfont-style);
    font-size: 1.2rem !important;
    color: var(--form_field-text_color); 
}
select:focus, select:focus-visible { 
    border-radius: var(--form_radiocheckbox-field_border_radius);
    border: solid var(--form_field-border_thickness) var(--form_field-focus-border_color) !important;
    box-shadow: none; }

/* Placeholder Text
------------------------------------------*/
::placeholder { color: var(--form_field-placeholder_color); font-family: var(--headingfont); font-weight: var(--headingfont-weight); font-style: var(--headingfont-style); letter-spacing: 0.03em; text-transform: uppercase; }

/* Gravity Forms Integration
------------------------------------------*/
.gform_wrapper .gfield_label,
.gform_wrapper .gfield_radio label,
.gform_wrapper .gfield_checkbox label {
    font-weight: var(--bodyfont-weight-bold);
    color: var(--clr-2);
    font-size: 1.2rem !important;
    font-family: var(--headingfont) !important;
    font-style: var(--headingfont-style) !important;
    margin-bottom: 0 !important;
}

.gform_wrapper input[type=submit] {
    display: block;
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    border: none;
    padding: .7em 1.2em;
    line-height: auto;
}

/*  Gravity Forms Theme Styling - Hide Defaults */ 
.gform_wrapper input[type=radio], .gform_wrapper input[type=checkbox], 
.gfield_radio input[type=radio], .gfield_checkbox input[type=checkbox]
{ position: absolute; visibility: hidden; opacity: 0; height: 0; width: 0; }

/*  Gravity Forms Theme Styling - Spacing Resets */
.gform_wrapper.gravity-theme fieldset { border: none; display: block; margin: 0 0 var(--form_field-margin_bottom) 0; }
.gform_wrapper.gravity-theme fieldset, .gform_wrapper.gravity-theme legend { background: none; padding: 0; }
.gform_wrapper .ginput_container_radio, .gform_wrapper .ginput_container_checkbox { padding: 0; }

/* Radio & Checkbox
------------------------------------------*/

/* Radio & Checkbox Globals, Grid & Input Spacing */
.gform_wrapper .ginput_container_radio .gfield_radio,
.gform_wrapper .ginput_container_checkbox .gfield_checkbox 
{ display: grid !important; grid-gap: 0.5rem 1rem; grid-template-columns: repeat( auto-fit, minmax(250px, 1fr) ) ; margin-top: 1rem; }
.gform_wrapper .gfield_radio div.gchoice, .gform_wrapper .gfield_checkbox div.gchoice
{ position: relative; cursor: pointer; display: block !important; padding: 0 0 0 var(--form_radiocheckbox-field_left_space) !important;  }
.gform_wrapper input[type=checkbox] + label,  .gform_wrapper input[type=radio] + label {
    font-size: var(--form_radiocheckbox-fontsize) !important;  
    color: var(--form_field-lable_option_color) !important;
    line-height: 1.4;
    vertical-align: top !important;
}

/* Radio & Checkbox Borders */
.gform_wrapper input[type=radio] + label:before, .gform_wrapper input[type=checkbox] + label:before { 
    display: block; content: ''; position: absolute; top: 0; left: 0; 
    height: var(--form_radiocheckbox-field_size); width: var(--form_radiocheckbox-field_size); 
    border: var(--form_radiocheckbox-field_border_thickness) solid var(--form_radiocheckbox-field_color);
}

/* Checkboxes */
.gform_wrapper input[type=checkbox]:checked + label:before { background: transparent;}
.gform_wrapper input[type=checkbox] + label:before { border-radius: var(--form_radiocheckbox-field_border_radius); }
.gform_wrapper input[type=checkbox] + label svg { display: none; }
.gform_wrapper input[type=checkbox] + label:after {
    content: ''; display: none; position: absolute; top: .2em; left: .05em;
    transform: translate(10%, -27%);
    width: var(--form_radiocheckbox-input_size);
    height: var(--form_radiocheckbox-input_size);
    background-color: var(--form_radiocheckbox-input_color);
    mask-image:             url("data:image/svg+xml;utf8,<?xml version='1.0' encoding='utf-8'?><svg aria-hidden='true' focusable='false' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M501.29,87.73c14.28,14.28,14.28,37.48,0,51.77L208.75,432.03c-14.28,14.28-37.48,14.28-51.77,0L10.71,285.76c-14.28-14.28-14.28-37.48,0-51.77,14.28-14.28,37.48-14.28,51.77,0l120.44,120.33L449.64,87.73c14.28-14.28,37.48-14.28,51.77,0h-.11Z'></path></svg>"); 

}
.gform_wrapper input[type=checkbox]:checked + label:after { visibility: visible; display:block; }

/* Radios */
.gform_wrapper input[type=radio] + label:before { border-radius: 100%; }
.gform_wrapper input[type=radio]:checked + label:before { background: transparent; }
.gform_wrapper input[type=radio] + label:after {
    border-radius: 100%;
    display: block; position: absolute; top: 0; left: 0; content: '';
    height: var(--form_radiocheckbox-field_size);
    width: var(--form_radiocheckbox-field_size);
    transform: scale(0.5);
    background: var(--form_radiocheckbox-input_color);
    visibility: hidden;
}
.gform_wrapper input[type=radio]:checked + label:after {  visibility: visible; }

/* FORM 2 - Secondary Form Styling
------------------------------------------*/

/* Dark Form Inputs */
.form-2 input[type="text"], .form-2 input[type="email"], .form-2 input[type="url"], .form-2 input[type="password"], .form-2 input[type="search"], .form-2 input[type="number"], .form-2 input[type="tel"], .form-2 input[type="range"], 
.form-2 input[type="date"], .form-2 input[type="month"], .form-2 input[type="week"], .form-2 input[type="time"],  .form-2 input[type="datetime"],  .form-2 input[type="datetime-local"],  .form-2 input[type="color"],  .form-2 textarea 
{ color: var(--clr-3); background-color: var(--clr-2-dark-op); }
.form-2 form p { color: #fff !important; }

/* Dark Form Focus */
.form-2 input[type="text"]:focus, .form-2 input[type="email"]:focus, .form-2 input[type="url"]:focus, .form-2 input[type="password"]:focus, .form-2 input[type="search"]:focus, .form-2 input[type="number"]:focus,  .form-2 input[type="tel"]:focus,  .form-2 input[type="range"]:focus,  .form-2 input[type="date"]:focus,
.form-2 input[type="month"]:focus,  .form-2 input[type="week"]:focus,  .form-2 input[type="time"]:focus,  .form-2 input[type="datetime"]:focus,  .form-2 input[type="datetime-local"]:focus,  .form-2 input[type="color"]:focus,  .form-2 textarea:focus 
{ background-color: rgba(0, 0, 0, 0.3);border-color: var(--clr-white); }

.form-2 form label { font-weight: 700; color: var(--clr-white); }
.form-2 ::placeholder { color: var(--clr-3) ;}

.form-2 input[type="button"], .form-2 input[type="reset"], .form-2 input[type="submit"] 
{ border: none; background-color: white; color: var(--clr-white) !important; }
.form-2 input[type="button"]:hover, .form-2 input[type="reset"]:hover, .form-2 input[type="submit"]:hover, .form-2 input[type="button"]:focus, .form-2 input[type="reset"]:focus, .form-2 input[type="submit"]:focus 
{ background-color: rgba(255, 255, 255, 0.5); color: #fff !important; }
.form-2 .wpcf7-not-valid-tip { color: var(--clr-white); }
.gform_wrapper input[type=checkbox]:checked + label:after { visibility: visible; }

/* Form Variables
-----------------------------------------------*/
:root { 
    /* Base Fields */
    --form_field-margin_bottom: 0.3rem;
    --form_field-text_color: var(--clr-2);
    --form_field-placeholder_color: var(--clr-1);
    --form_field-background_color: rgba(0, 0, 100, 0.02);
    --form_field-border_thickness: 2px;
    --form_field-border_color: var(--clr-1);
    --form_field-border_radius: ;
    
    /* Base Fields FOCUS */
    --form_field-focus-text_color: var(--clr-2);
    --form_field-focus-background_color: var(--clr-white);
    --form_field-focus-border_color: var(--clr-2);

    /* Labels */
    --form_field-lable_color: var(--clr-2);
    --form_field-lable_option_color: var(--clr-2);

    /* Radio & Checkbox Field */
    --form_radiocheckbox-fontsize: 1.1rem; 
    --form_radiocheckbox-field_left_space: 2.25rem;
    --form_radiocheckbox-field_size: 1.75rem; 
    --form_radiocheckbox-field_border_radius: .35rem; 
    --form_radiocheckbox-field_border_thickness: 3px; 
    --form_radiocheckbox-field_color: var(--clr-1); 

    /* Radio & Checkbox Cheked */
    --form_radiocheckbox-input_size: 1.9rem; 
    --form_radiocheckbox-input_color: var(--clr-2);
}

/* Form Resets
------------------------------------------*/
/* Button Resets */
textarea, input, select { outline: none; }

/* Form Typography
------------------------------------------*/
form p  { margin-bottom: 15px; font-size: 1rem; color: var(--clr-2); box-sizing: border-box; font-family: var(--bodyfont); font-weight: var(--bodyfont-weight); font-style: var(--bodyfont-style); }
form label, form legend {
    font-family: var(--headingfont); font-weight: var(--headingfont-weight); font-style: var(--headingfont-style);
    line-height: .75;
    letter-spacing: 0.05em;
    color: var(--form_field-lable_color); 
    margin: 0;
}

/* Input Fields
------------------------------------------*/
input[type="text"], input[type="email"], input[type="url"],input[type="password"],input[type="search"],input[type="number"],input[type="tel"],input[type="range"], 
input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea ,
    
    /* Vendors Fields */
        /* Login Form */
        .xoo-aff-group input[type="text"], 
        .xoo-aff-group input[type="password"], 
        .xoo-aff-group input[type="email"], 
        .xoo-aff-group input[type="number"], 
        .xoo-aff-group select, 
        .xoo-aff-group select + .select2, 
        .xoo-aff-group input[type="tel"]
{ 
    width: 100%; padding: .5rem 1rem !important; 
    margin-bottom: var(--form_field-margin_bottom); 
    border-radius: var(--form_field-border_radius) !important; 
    border: none;
    border-bottom:  solid var(--form_field-border_thickness) var(--form_field-border_color);
    box-sizing: border-box;
    font-family: var(--bodyfont); font-weight: var(--bodyfont-weight); font-style: var(--bodyfont-style);
    font-size: 1.2rem !important;
    color: var(--form_field-text_color); 
    background-color: var(--form_field-background_color);
    box-shadow: none !important;
    transition: var(--transitions);
}

/* Input Focus
------------------------------------------*/
input[type="text"]:focus,input[type="email"]:focus,input[type="url"]:focus,input[type="password"]:focus,input[type="search"]:focus,input[type="number"]:focus,input[type="tel"]:focus,input[type="range"]:focus, input[type="date"]:focus,
input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus 
{ 
    background-color: var(--form_field-focus-background_color); 
    border: none;
    border-bottom: solid var(--form_field-border_thickness) var(--form_field-focus-border_color); 
    color: var(--form_field-focus-text_color);  }

/* Select Field
------------------------------------------*/
select { 
    border-radius: var(--form_radiocheckbox-field_border_radius);  
    border: solid var(--form_field-border_thickness) var(--form_field-border_color); 
    font-family: var(--bodyfont) !important; font-weight: var(--bodyfont-weight-bold) !important; font-style: var(--bodyfont-style);
    font-size: 1.2rem !important;
    color: var(--form_field-text_color); 
}
select:focus, select:focus-visible { 
    border-radius: var(--form_radiocheckbox-field_border_radius);
    border: solid var(--form_field-border_thickness) var(--form_field-focus-border_color) !important;
    box-shadow: none; }

/* Placeholder Text
------------------------------------------*/
::placeholder { color: var(--form_field-placeholder_color); font-family: var(--headingfont); font-weight: var(--headingfont-weight); font-style: var(--headingfont-style); letter-spacing: 0.03em; text-transform: uppercase; }

/* Gravity Forms Integration
------------------------------------------*/
.gform_wrapper .gfield_label,
.gform_wrapper .gfield_radio label,
.gform_wrapper .gfield_checkbox label {
    font-weight: var(--bodyfont-weight-bold);
    color: var(--clr-2);
    font-size: 1.2rem !important;
    font-family: var(--headingfont) !important;
    font-style: var(--headingfont-style) !important;
    margin-bottom: 0 !important;
}

.gform_wrapper input[type=submit] {
    display: block;
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    border: none;
    padding: .7em 1.2em;
    line-height: auto;
}


/*  Gravity Forms Theme Styling - Hide Defaults */ 
.gform_wrapper input[type=radio], .gform_wrapper input[type=checkbox], 
.gfield_radio input[type=radio], .gfield_checkbox input[type=checkbox]
{ position: absolute; visibility: hidden; opacity: 0; height: 0; width: 0; }

/*  Gravity Forms Theme Styling - Spacing Resets */
.gform_wrapper.gravity-theme fieldset { border: none; display: block; margin: 0 0 var(--form_field-margin_bottom) 0; }
.gform_wrapper.gravity-theme fieldset, .gform_wrapper.gravity-theme legend { background: none; padding: 0; }
.gform_wrapper .ginput_container_radio, .gform_wrapper .ginput_container_checkbox { padding: 0; }

/* Radio & Checkbox
------------------------------------------*/

/* Radio & Checkbox Globals, Grid & Input Spacing */
.gform_wrapper .ginput_container_radio .gfield_radio,
.gform_wrapper .ginput_container_checkbox .gfield_checkbox 
{ display: grid !important; grid-gap: 0.5rem 1rem; grid-template-columns: repeat( auto-fit, minmax(250px, 1fr) ) ; margin-top: 1rem; }
.gform_wrapper .gfield_radio div.gchoice, .gform_wrapper .gfield_checkbox div.gchoice
{ position: relative; cursor: pointer; display: block !important; padding: 0 0 0 var(--form_radiocheckbox-field_left_space) !important;  }
.gform_wrapper input[type=checkbox] + label,  .gform_wrapper input[type=radio] + label {
    font-size: var(--form_radiocheckbox-fontsize) !important;  
    color: var(--form_field-lable_option_color) !important;
    line-height: 1.4;
    vertical-align: top !important;
}

/* Radio & Checkbox Borders */
.gform_wrapper input[type=radio] + label:before, .gform_wrapper input[type=checkbox] + label:before { 
    display: block; content: ''; position: absolute; top: 0; left: 0; 
    height: var(--form_radiocheckbox-field_size); width: var(--form_radiocheckbox-field_size); 
    border: var(--form_radiocheckbox-field_border_thickness) solid var(--form_radiocheckbox-field_color);
}

/* Checkboxes */
.gform_wrapper input[type=checkbox]:checked + label:before { background: transparent;}
.gform_wrapper input[type=checkbox] + label:before { border-radius: var(--form_radiocheckbox-field_border_radius); }
.gform_wrapper input[type=checkbox] + label svg { display: none; }
.gform_wrapper input[type=checkbox] + label:after {
    content: ''; display: none; position: absolute; top: .2em; left: .05em;
    transform: translate(10%, -27%);
    width: var(--form_radiocheckbox-input_size);
    height: var(--form_radiocheckbox-input_size);
    background-color: var(--form_radiocheckbox-input_color);
    mask-image:             url("data:image/svg+xml;utf8,<?xml version='1.0' encoding='utf-8'?><svg aria-hidden='true' focusable='false' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><path d='M501.29,87.73c14.28,14.28,14.28,37.48,0,51.77L208.75,432.03c-14.28,14.28-37.48,14.28-51.77,0L10.71,285.76c-14.28-14.28-14.28-37.48,0-51.77,14.28-14.28,37.48-14.28,51.77,0l120.44,120.33L449.64,87.73c14.28-14.28,37.48-14.28,51.77,0h-.11Z'></path></svg>"); 

}
.gform_wrapper input[type=checkbox]:checked + label:after { visibility: visible; display:block; }

/* Radios */
.gform_wrapper input[type=radio] + label:before { border-radius: 100%; }
.gform_wrapper input[type=radio]:checked + label:before { background: transparent; }
.gform_wrapper input[type=radio] + label:after {
    border-radius: 100%;
    display: block; position: absolute; top: 0; left: 0; content: '';
    height: var(--form_radiocheckbox-field_size);
    width: var(--form_radiocheckbox-field_size);
    transform: scale(0.5);
    background: var(--form_radiocheckbox-input_color);
    visibility: hidden;
}
.gform_wrapper input[type=radio]:checked + label:after {  visibility: visible; }

/* FORM 2 - Secondary Form Styling
------------------------------------------*/

/* Dark Form Inputs */
.form-2 input[type="text"], .form-2 input[type="email"], .form-2 input[type="url"], .form-2 input[type="password"], .form-2 input[type="search"], .form-2 input[type="number"], .form-2 input[type="tel"], .form-2 input[type="range"], 
.form-2 input[type="date"], .form-2 input[type="month"], .form-2 input[type="week"], .form-2 input[type="time"],  .form-2 input[type="datetime"],  .form-2 input[type="datetime-local"],  .form-2 input[type="color"],  .form-2 textarea 
{ color: var(--clr-3); background-color: var(--clr-2-dark-op); }
.form-2 form p { color: #fff !important; }

/* Dark Form Focus */
.form-2 input[type="text"]:focus, .form-2 input[type="email"]:focus, .form-2 input[type="url"]:focus, .form-2 input[type="password"]:focus, .form-2 input[type="search"]:focus, .form-2 input[type="number"]:focus,  .form-2 input[type="tel"]:focus,  .form-2 input[type="range"]:focus,  .form-2 input[type="date"]:focus,
.form-2 input[type="month"]:focus,  .form-2 input[type="week"]:focus,  .form-2 input[type="time"]:focus,  .form-2 input[type="datetime"]:focus,  .form-2 input[type="datetime-local"]:focus,  .form-2 input[type="color"]:focus,  .form-2 textarea:focus 
{ background-color: rgba(0, 0, 0, 0.3);border-color: var(--clr-white); }

.form-2 form label { font-weight: 700; color: var(--clr-white); }
.form-2 ::placeholder { color: var(--clr-3) ;}

.form-2 input[type="button"], .form-2 input[type="reset"], .form-2 input[type="submit"] 
{ border: none; background-color: white; color: var(--clr-white) !important; }
.form-2 input[type="button"]:hover, .form-2 input[type="reset"]:hover, .form-2 input[type="submit"]:hover, .form-2 input[type="button"]:focus, .form-2 input[type="reset"]:focus, .form-2 input[type="submit"]:focus 
{ background-color: rgba(255, 255, 255, 0.5); color: #fff !important; }
.form-2 .wpcf7-not-valid-tip { color: var(--clr-white); }
.gform_wrapper input[type=checkbox]:checked + label:after { visibility: visible; }