.brxe-button{&.bricks-background-primary{&:hover,&:focus{box-shadow:0 .25rem .25rem .125rem rgba(var(--bs-primary-rgb),.1),0 .375rem .75rem -.125rem rgba(var(--bs-primary-rgb),.4)}}&.bricks-background-secondary{&:hover,&:focus{box-shadow:0 .25rem .25rem .125rem color-mix(in srgb,var(--bs-gray-500),transparent 90%),0 .375rem .75rem -.125rem color-mix(in srgb,var(--bs-gray-500),transparent 90%)}}&.bricks-background-dark{&:hover,&:focus{box-shadow:0 .25rem .25rem .125rem rgba(var(--bs-dark-rgb),.1),0 .375rem .75rem -.125rem rgba(var(--bs-dark-rgb),.4)}}&.bricks-background-light{&:hover,&:focus{box-shadow:0 .25rem .25rem .125rem rgba(var(--bs-light-rgb),.1),0 .375rem .75rem -.125rem rgba(var(--bs-light-rgb),.4)}}&.bricks-background-info{&:hover,&:focus{box-shadow:0 .25rem .25rem .125rem rgba(var(--bs-info-rgb),.1),0 .375rem .75rem -.125rem rgba(var(--bs-info-rgb),.4)}}&.bricks-background-success{&:hover,&:focus{box-shadow:0 .25rem .25rem .125rem rgba(var(--bs-success-rgb),.1),0 .375rem .75rem -.125rem rgba(var(--bs-success-rgb),.4)}}&.bricks-background-danger{&:hover,&:focus{box-shadow:0 .25rem .25rem .125rem rgba(var(--bs-danger-rgb),.1),0 .375rem .75rem -.125rem rgba(var(--bs-danger-rgb),.4)}}&.bricks-background-warning{&:hover,&:focus{box-shadow:0 .25rem .25rem .125rem rgba(var(--bs-warning-rgb),.1),0 .375rem .75rem -.125rem rgba(var(--bs-warning-rgb),.4)}}}.brxe-form{.message{--message-color:var(--bs-info);--message-bg:var(--bs-info);--message-border-color:var(--bs-info);color:var(--message-color);background:color-mix(in srgb,var(--message-bg),white 90%);border:1px solid color-mix(in srgb,var(--message-border-color),white 60%);border-radius:var(--bs-border-radius);&.error{--message-color:var(--bs-danger);--message-bg:var(--bs-danger);--message-border-color:var(--bs-danger)}&.success{--message-color:var(--bs-success);--message-bg:var(--bs-success);--message-border-color:var(--bs-success)}.text{padding:1rem}}}.brx-popup{padding:.5rem;.brx-popup-backdrop{transition:.15s;background-color:rgba(var(--bs-dark-rgb),.6)}.brx-popup-content{padding:1.125rem;position:relative;border-radius:.75rem;& .brx-popup-close{display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;position:absolute;top:1rem;right:1rem;cursor:pointer;opacity:.5;transition:opacity .25s ease-in-out;z-index:10;&:hover,&:focus{opacity:.75}&>.brxe-icon{font-size:1rem}}}}