/*
 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
*/

@keyframes spin {
  from {
    rotate:0deg;
  }
  to {
    rotate:360deg;
  }
}

b, strong{
    font-weight:400;
    font-variation-settings: "wght" 650;
}
/** menu nav **/

:where(.brxe-nav-menu) .bricks-nav-menu li{
    overflow: hidden;
}
.brxe-nav-menu ul li a{
    transition:font .35s ease, opacity .5s ease;
    gap: 0.2em;
}
.bricks-nav-menu .current-menu-item > a{
    opacity: 1 !important;
}
.brxe-nav-menu ul li a::before{
    content:"[";
}
.brxe-nav-menu ul li a::after{
    content:"]";
}

/** btn button **/
.submit-button-wrapper .bricks-button span.text::before{
    content: none !important;
}
.submit-button-wrapper .bricks-button span.loading{
    display: none !important;
}
.submit-button-wrapper .bricks-button{
    font: inherit;
}
.bricks-button{
    gap: 0.2em;
    position: relative;
    overflow: hidden;
}

.bricks-button:before{
    content:"[";
}
.bricks-button:after{
    content:"]";
}
/** simple link **/
.brxe-text-basic a,
a.brxe-text-basic {
    display: inline-flex;
    overflow: hidden;
    position: relative;
    gap: 0.2em;
}
.brxe-text-basic a::before,
a.brxe-text-basic::before{
    content:"[";
}
.brxe-text-basic a::after,
a.brxe-text-basic::after{
    content:"]";
}

/** links effect, effet sur les btn button liens nav **/
.brxe-text-basic a > span,
a.brxe-text-basic > span,
.bricks-button span,
.menu-item a > span {
  transition: transform .25s ease;
}

.brxe-text-basic a > span::before,
a.brxe-text-basic > span::before,
.bricks-button span::before,
.menu-item a > span::before {
  content: attr(data-text-before);
  position: absolute;
  transform: translateY(-120%);
  transition: transform .25s ease;
}

.brxe-text-basic a:hover > span,
.brxe-text-basic a:focus > span,

a.brxe-text-basic:hover > span,
a.brxe-text-basic:focus > span,

.bricks-button:hover span,
.bricks-button:focus span,

.menu-item a:hover > span,
.menu-item a:focus > span {
  transform: translateY(102%);
}

.brxe-text-basic a:hover > span::before,
.brxe-text-basic a:focus > span::before,

a.brxe-text-basic:hover > span::before,
a.brxe-text-basic:focus > span::before,

.bricks-button:hover span::before,
.bricks-button:focus span::before,

.menu-item a:hover > span::before,
.menu-item a:focus > span::before {
  transform: translateY(-100%);
}