/***
	Button
***/
.glammy-button {
    box-sizing: border-box;
    position: relative;
    display: block;

    width: fit-content;

    padding: 15px 45px;

    border: 0;
    transition: ease-in-out .3s filter;
}

.glammy-button:hover {
    text-decoration: none;
    transition: ease-in-out .3s filter;
}

.glammy-button[data-style="blue"]:hover {
    filter: drop-shadow(1px 1px 20px var(--color-gold-dark));
}

.glammy-button[data-style="gold"]:hover {
    filter: drop-shadow(1px 1px 20px var(--color-main));
}

.glammy-button-background {
    box-sizing: border-box;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.glammy-button[data-style="blue"] .glammy-button-background {
    background: linear-gradient(to right, var(--color-alt) 0%, var(--color-main) 40%, var(--color-main) 60%, var(--color-alt) 100%);
}

.glammy-button[data-style="gold"] .glammy-button-background {
    background: linear-gradient(to right, var(--color-gold-dark), var(--color-gold-light), var(--color-gold-dark));
}

.glammy-button-text {
    display: block;
    margin: 0 auto;

    color: var(--color-white);

    font-size: 24px;
    font-family: "Montserrat";
    text-align: center;
}

.glammy-button[data-style="blue"] .glammy-button-text {
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: -webkit-linear-gradient(180deg, var(--color-gold-dark), var(--color-gold-light), var(--color-gold-dark));
}

.glammy-button[data-style="gold"] .glammy-button-text {
    color: var(--color-main);
}

@media screen and (max-width: 768px) {
    .glammy-button {
        width: 100%;
    }
}