/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* -------
Index
-------- */

/* 
- GLOBAL STYLES
    - GRAPHICAL VARIABLES
    - GENERAL
        -Bug Fixes
    - GRAPHICAL UTILITY CLASSES
    - BUTTONS / LINKS

- LAYOUT / THEMER
    - HEADER
        - NAVIGATION
        - MOBILE NAVIGATION OPENED
    - FOOTER
    - CARDS
    - TEMPLATE
        - CTA


- PAGE SPECIFIC CSS
    -HOMEPAGE
    -CONTACT

- GRAVITY FORM STYLING
    - CUSTOM GRAVITY FORM STYLE

*/

/* - GLOBAL STYLES ====================================================================== */

/* --------------------
- GRAPHICAL VARIABLES
-------------------- */

:root {
    --gm-transition: 300ms ease-in-out;
    --white: #fdfdfd;
    --ei-sec-content-width: 120rem;
}


/* --------------------
- GENERAL
-------------------- */

ul {
    margin: 0;
}

address {
    font-style: normal;
}


/* --------------------
- GRAPHICAL UTILITY CLASSES
-------------------- */


/* --------------------
BUTTONS / LINKS
-------------------- */

a,
.bricks-button {
    transition: all var(--gm-transition);
}

.btn--action {
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.25);
}

.btn--action.btn--icn a {
    color: var(--white);
    font-weight: 700;
    box-shadow: unset;
}
.btn--action.btn--icn:hover a {
    color: var(--white);
}

/* END - GLOBAL STYLES ====================================================================== */

/* LAYOUT / THEMER ======================================================================  */

/* --------------------
HEADER
-------------------- */

.gm-main-header {
    /* --header-pad-block: var(--space-m); */
    --mobile-item-min-height: 4.4rem;
}

/* NAVIGATION */

.gm-main-header__nav-items > .menu-item,
.gm-main-header__nav-nested > ul .gm-main-header__dropdown {
    height: 100%;
    display: flex;
    justify-content: center;
    font-weight: inherit;
}

.gm-main-header__nav-link a {
    white-space: nowrap;
    font-weight: inherit;
}

/* MOBILE NAVIGATION OPENED */

.gm-main-header__nav-nested.brx-open ul.gm-main-header__nav-items {
    /* start under header*/
    position: absolute;
    top: 100%;
    height: fit-content;    
    min-height: 100%;
    /* -------------- */
    padding: var(--space-m) var(--section-padding-x) 0;
    box-shadow: 0 4px 6px -3px var(--neutral-trans-60);
}

.gm-main-header__nav-nested.brx-open .gm-main-header__nav-items .menu-item a {
    margin-block: auto;
}

.gm-main-header__nav-nested.brx-open ul.gm-main-header__nav-items > li {    
    border-bottom: 1px solid var(--base);
}

.gm-main-header__nav-nested.brx-open ul.gm-main-header__nav-items > li:last-child {
    border: none;
}

.gm-main-header__nav-nested.brx-open ul.gm-main-header__nav-items li {
    display: flex;
    min-height: var(--mobile-item-min-height);
}

.gm-main-header__nav-nested.brx-open .gm-main-header__dropdown .brx-submenu-toggle button[aria-expanded="true"] {
    transform: rotateZ(180deg);
}

.gm-main-header__nav-nested.brx-open .brx-submenu-toggle{
    min-height: var(--mobile-item-min-height);
}

.gm-main-header__nav-nested.brx-open .gm-main-header__dropdown__content {
    min-height: var(--mobile-item-min-height);
    padding-bottom: 1rem;
}

.gm-main-header__nav-nested.brx-open .gm-main-header__dropdown__content li {
    min-height: var(--mobile-item-min-height);
    padding-left: var(--space-m);
}

.gm-main-header__nav-nested.brx-open .gm-main-header__dropdown__content li a {
    font-weight: inherit;    
    opacity: 0.75;
}

.gm-main-header__nav-nested.brx-open .gm-main-header__dropdown__content li:hover a {
    opacity: 1;
}

/* End mobile nav opened*/

/* --------------------
FOOTER
-------------------- */
.ei-copyright__inner a {
    color: var(--base-medium);
}
.ei-copyright__inner a:hover {
    color: var(--base-light);
}

/* stacked address */
.gm-footer__address span {
    display: block;
}

/* inline address */
/* .gm-footer__address span:not(:last-child)::after {
    content: ", ";
} */



/* --------------------
CARDS
-------------------- */

/* --------------------
TEMPLATE
-------------------- */

/* Page standard */

h1 {
    margin-bottom: 0;
}

h2 {
    margin-top: var(--space-m);
}

h3 {
    margin-top: var(--space-m);
}

ol,ul {
    margin-bottom: var(--space-m);
}

li:not(:first-child) {
    margin-top: var(--space-s);
}
/* 
a {
    color: var(--action);
}
a:hover {
    color: var(--action-dark);
} */

/* CTA */

.ei-cta__intro .ei-team__heading {
    font-size: var(--text-xxl);
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: -1.2px;
    margin-top: var(--space-s);
}


/* END - LAYOUT / THEMER ======================================================================  */

/* PAGE SPECIFIC CSS ====================================================================== */

/* Homepage */

/* Contact */
/* END - PAGE SPECIFIC CSS ====================================================================== */

/* CUSTOM GRAVITY FORM STYLING ====================================================================== */

/* GFORM VARIABLES */

:root {
    --gform-col-gap: var(--space-m);
    --gform-row-gap: var(--space-m);
    /* Input */
    --gfield-padding: var(--space-s) var(--space-s) var(--space-s) calc(var(--space-m) + 1.9rem);
    --gfield--min-height: 4.8rem;
    --gfield-font-size: 14px;
    --gfield-line-height: 1.5;
    --gfield-color: var(--base);
    --gfield-placeholder-opacity: 0.60;
    --gfield-border: var(--btn-border-size) solid var(--base-light);
    /* --gfield-border--radius: var(--btn-radius); */
    --gfield-border--radius: none;
    --gfield-border--focus: var(--btn-border-size) solid var(--base);    
    --gfield-bg-color: var(--base-light); /* default transparent */
    --gfield-bg--focus:  var(--base-light);
    --textarea-height: 7rem;
    /* Submit button - Default = Acss action btn*/
    --gfield-submit--align: center;
    --gfield-submit--padding: var(--btn-padding-block) var(--btn-padding-inline);
    --gfield-submit--min-width: 90%;
    --gfield-submit--bg: var(--action);
    --gfield-submit--hov-bg: var(--action-hover);
    --gfield-submit--font-size: var(--text-m);
    --gfield-submit--color: var(--white);
    --gfield-submit--hov-color: var(--white);
    --gfield-submit--weight: 700;
    --gfield-submit--text-transform: var(--btn-text-transform);
    --gfield-submit--border: var(--btn-border-size) solid var(--action);
    --gfield-submit--border-rad: 3em; /*var(--btn-border-radius)*/
    --gfield-submit--hov-border:  var(--btn-border-size) solid var(--action-hover);
}


/* Gravity form defaults styles reset */

@media (max-width:641px) {
    /* Overwrite gravity form default style */
    .gform_wrapper.gravity-theme input:not([type="radio"]):not([type="checkbox"]):not([type="image"]):not([type="file"]) {
        line-height: var(--gfield-line-height)!important;
        min-height: var(--gfield--min-height)!important;
    }
}

/* Hide label over gfields but kept for screen reader */

body .gform_wrapper .gfield_label,
body .gform_wrapper .gform_heading,
body .gform_wrapper .gform_required_legend,
body .gform_wrapper .gfield--type-name legend {
    visibility: hidden;
    position: absolute;
}

body .gform_wrapper .gform_body .gform_fields,
body .gform_wrapper.gravity-theme .ginput_complex {
    column-gap: var(--gform-col-gap);
    row-gap: var(--gform-row-gap);
}

body .gform_wrapper.gravity-theme .ginput_complex span{
    padding-left: 0!important;
    padding-right: 0!important;
    margin-bottom: 0px;
}


/* Gform input fields */

body .gform_wrapper .gform_body .gform_fields .gfield input[type=text],
body .gform_wrapper .gform_body .gform_fields .gfield input[type=tel],
body .gform_wrapper .gform_body .gform_fields .gfield input[type='url'],
body .gform_wrapper .gform_body .gform_fields .gfield input[type='number'],
body .gform_wrapper .gform_body .gform_fields .gfield input[type='password'],
body .gform_wrapper .gform_body .gform_fields .gfield input[type='file'],
body .gform_wrapper .gform_body .gform_fields .gfield input[type=email],
body .gform_wrapper .gform_body .gform_fields .gfield textarea {
    padding: var(--gfield-padding);
    min-height: var(--gfield-min-height);
    background-color: var(--gfield-bg-color);
    font-size: var(--gfield-font-size);
    line-height: var(--gfield-line-height);
    color: var(--gfield-color);
    border: var(--gfield-border);
    border-radius: var(--gfield-border--radius);
    outline: none;    
    transition: all var(--gm-transition);
    /* outline-offset: ; */
    position: relative;
}

body .gform_wrapper .gform_body .gform_fields .gfield textarea {
    height: var(--textarea-height);
    width: 100%;
    resize: none;
}


/*Styling actif*/

body .gform_wrapper .gform_body .gform_fields .gfield input[type='text']:focus,
body .gform_wrapper .gform_body .gform_fields .gfield input[type='url']:focus,
body .gform_wrapper .gform_body .gform_fields .gfield input[type='email']:focus,
body .gform_wrapper .gform_body .gform_fields .gfield input[type='tel']:focus,
body .gform_wrapper .gform_body .gform_fields .gfield input[type='number']:focus,
body .gform_wrapper .gform_body .gform_fields .gfield input[type='password']:focus,
body .gform_wrapper .gform_body .gform_fields .gfield input[type='file']:focus,
body .gform_wrapper .gform_body .gform_fields .gfield textarea:focus {
    border-bottom: var(--gfield-border--focus);
    background-color: var( --gfield-bg--focus);
}

/* ----- END input fields----- */

/* Submit button style */

body .gform_wrapper .gform_footer {
    display: flex;
    justify-content: var(--gfield-submit--align);
    padding: var(--gfield-submit--padding);
}

body .gform_wrapper .gform_footer input[type=submit] {
    min-width: var(--gfield-submit--min-width);
    background-color: var(--gfield-submit--bg);
    padding: var(--gfield-submit--padding);
    border: var(--gfield-submit--border);
    border-radius: var(--gfield-submit--border-rad);
    color: var(--gfield-submit--color);
    font-weight: var(--gfield-submit--weight);
    text-transform: var(--gfield-submit--text-transform);
    text-align: center;
    font-size: var(--gfield-submit--font-size);
    transition: all var(--gm-transition);
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.25);
}

body .gform_wrapper .gform_footer input[type="submit"]:hover {
    background-color: var(--gfield-submit--hov-bg);
    border: var(--gfield-submit--hov-border);
    color: var(--gfield-submit--hov-color);
}


/* ----- END Submit button ------ */


/* Placeholder */

.gform_fields .gfield input::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    font-size: var(--gfield-font-size)!important;
    color: var(--gfield-color);
    opacity: var(--gfield-placeholder-opacity);
}

.gform_fields .gfield input::-moz-placeholder {
    /* Firefox 19+ */
    font-size: var(--gfield-font-size);
    color: var(--gfield-color);
    opacity: var(--gfield-placeholder-opacity);
}

.gform_fields .gfield input:-ms-input-placeholder {
    /* IE 10+ */
    font-size: var(--gfield-font-size);
    color: var(--gfield-color);
    opacity: var(--gfield-placeholder-opacity);
}

.gform_fields .gfield input:-moz-placeholder {
    /* Firefox 18- */
    font-size: var(--gfield-font-size);
    color: var(--gfield-color);
    opacity: var(--gfield-placeholder-opacity);
}

.gform_fields .gfield textarea::placeholder,
.gform_fields .gfield textarea::-webkit-input-placeholder {
    font-size: var(--gfield-font-size);
    color: var(--gfield-color);
    opacity: var(--gfield-placeholder-opacity);
}


/* ------ END placeholder ------ */


/* Error / validation message */

body .gform_wrapper .gform_validation_errors {
    border-radius: 0;
}

body .gform_wrapper .gform_validation_errors>h2 {
    /* color: blueviolet; */
}

body .gform_wrapper .gfield_validation_message,
body .gform_wrapper .validation_message {
    display: none;
}

/* Error fields style */

body .gform_wrapper .gform_validation_errors:focus {
    outline: none;
}

body .gform_wrapper .gform_body .gform_fields .gfield.gfield_error input {
    color: #c02b0a;
    border-color: #c02b0a!important;
  }


/* Input field Icons */

.ei-form__name input {
    background-image: url("./assets/user.svg");
    background-repeat: no-repeat;
    background-position: var(--space-s) 50%;
    background-size: 1.2em;
}
.ei-form__email input {
    background-image: url("./assets/mail.svg");
    background-repeat: no-repeat;
    background-position: var(--space-s) 50%;
    background-size: 1.2em;
}
.ei-form__phone input {
    background-image: url("./assets/phone.svg");
    background-repeat: no-repeat;
    background-position: var(--space-s) 50%;
    background-size: 1.2em;
}
.ei-form__message textarea {
    background-image: url("./assets/chat.svg");
    background-repeat: no-repeat;
    background-position: var(--space-s) calc(var(--space-s) + 0.2em);
    background-size: 1.2em;
}

/* END gravity form styling ====================================================================== */