/*
Buttons
 */

.button {
    color: white;
    transition: var(--transition-hover);
    padding: var(--spacing-2) var(--spacing-4);
    text-transform: uppercase;
    font-size: var(--text-xl);
    line-height: 1;
    font-weight: bold;
    background-color: var(--color-gray-700);
    border: 0;
    border-radius: 0;
}

.button:hover,
.button:focus {
    background-color: var(--color-green);
}

.button--primary {
    background-color: var(--color-red);
}

.button--secondary {
    background-color: var(--color-blue);
}

.button--inverted {
    background-color: white;
    color: var(--color-red);
}

.button--inverted:hover,
.button--inverted:focus {
    background-color: var(--color-gray-100);
}

.button--icon {
    padding: var(--spacing-1);
}

/*
Bootstrap Popover / Popper.js
*/

body.scroll-lock {
    height: 100vh;
    overflow: hidden;
}

.popover-tooltip.popover-modal {
    width: 100vw;
    height: 100vh;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    max-width: none !important;
    background: rgba(0,0,0,0);
    z-index: 9999;
}

.popover-container {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: 0;
    background-color: var(--color-red);
    padding: var(--spacing-2);
    text-align: center;
    width: 90%;
    max-width: 600px;
    box-shadow: 4px 4px 8px 4px rgba(128,128,128,0.5);
}

.popover-title {
    border-radius: 0;
    padding: var(--spacing-2) var(--spacing-10);
    font-size: var(--text-2xl);
    font-weight: bold;
}

.popover-content {
    background-color: white;
    padding: var(--spacing-4);
    color: var(--color-blue);
    font-size: var(--text-xl);
    line-height: 1.25;
}

.popover-footer {
    background-color: white;
    padding: 0 var(--spacing-4) var(--spacing-4);
}

.popover-close.button--icon {
    position: absolute;
    top: var(--spacing-2);
    right: var(--spacing-2);
    padding: 0;
    width: var(--text-3xl);
    font-size: var(--text-3xl);
}

/*********************************/
/**       Spinner  svg          **/
/*********************************/

.noscroll {
    overflow: hidden;
    height: 100%;
}

.lottie-spinner {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    padding: 2.5rem;
    z-index: 9999;
    background-color: rgba(0,0,0,0.8);
    visibility: hidden;
    display: flex;
    opacity: 0;
    transition: opacity .5s linear;
    flex-flow: row wrap;
    align-items: center;
    justify-content: center;
    color: #ffffff;
}

.lottie-spinner--enabled {
    visibility: visible;
    opacity: 1;
}

.lottie-spinner__container {
    width: 100%;
    height: 75%;
}

.lottie-spinner__message {

}

img.gform_ajax_spinner {
    position: fixed !important;
    z-index: 999999;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: block !important;
    overflow: hidden !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(0,0,0);
    /* fall back */
    background-color: rgba(0,0,0,0.7);
url('/wp-content/themes/capitone/assets/spinners/spinner-veuillez-patienter-capitone.gif'); /* fallback GIF spinner */
    background-image: linear-gradient(transparent,transparent), url('/wp-content/themes/capitone/assets/spinners/spinner-veuillez-patienter-capitone.svg'); /* SVG spinner */
    background-repeat: no-repeat;
    /*background-size: 60px 60px;*/
    background-size: 100% 100%;
    background-position: center center;
}