/*VARS & CONFIGURATION*/
:where(:root, ::before, ::after) {
    --grid-container-max-width: 90vw;

    --spacing-default: var(--unit-16);

    --color-black-rgb: 40, 41, 39;
    --color-blue: #006BA2;
    --color-yellow: #f8cb00;
    --color-red: #FF3A00;
    --color-red-dark: #B13238;


    /*
    --color-primary: #C94217;
    --color-yellow: #FAB000;
    --color-grey: #676973;
    --color-orange: #EF7D00;
    --color-grey-light: #EBEDF5;
    --color-grey-alternate: #F6F6F6;
    --color-grey-dark: #7F8085;
    --color-blue-dark: #1C1F2E;
    --color-blue: #144066;
    --box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, .1);
    --box-shadow-2: 0px 5px 20px 5px rgba(0, 0, 0, .1);
    --border-radius-medium: var(var(--spacing-default)); */
}

::-moz-selection {
    background: var(--color-red-dark);
    color: var(--color-white);
}

::selection {
    background: var(--color-red-dark);
    color: var(--color-white);
}

@font-face {
    font-family: "Primary";
    font-weight: 400;
    src: url("../fonts/Gotham-Medium.woff2");
}

@font-face {
    font-family: "Primary";
    font-weight: 700;
    src: url("../fonts/Gotham-Bold.woff2");
}

html {
    font-size: 100% !important;
}

body {
    font-size: initial !important;
    font-family: var(--font-primary) !important;
    background-color: var(--color-yellow);
}

main {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    overflow: hidden;
}

.cta {
    display: inline-flex;
    color: var(--color-white);
    background-color: var(--color-black);
    font-size: var(--font-20);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    padding: var(--spacing-default) calc(2 * var(--spacing-default));
}

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

.cta--wider {
    padding: var(--spacing-default) calc(4 * var(--spacing-default));
}

.background-decoration {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.box-info {
    position: relative;
    width: 100%;
    height: 100%;
}

/* .box-info__name,
.box-info__description {
    position: absolute;
    z-index: 1;
    left: 20%;
    font-weight: var(--font-bold);
}

.box-info__name {
    top: 25%;
    color: var(--color-red-dark);
    font-size: var(--font-30);
    text-transform: uppercase;
}

.box-info__description {
    font-size: var(--font-18);
    top: 80%;
}

.box-info__image {
    position: absolute;
    left: 0;
    top: 0;
    object-fit: contain;
} */

.form--1 input,
.form--1 select,
.form--1 .label-file .button {
    border: var(--unit-1) var(--color-black) solid;
    padding: var(--spacing-default) calc(2 * var(--spacing-default));
    font-weight: var(--font-bold);
    width: 100%;
    outline: 0;
    background-color: var(--color-white);
}

.form--1 button[type="submit"] {
    border: 0px;
}

.form--1 .label-file {
    display: block;
}

.form--1 .label-file:has([data-field-invalid]) .button {
    border-color: var(--color-error) !important;
    animation: shake 500ms linear;
}

.form--1 select {
    appearance: none;
    -webkit-appearance: none;
}

.form--1 .label-virtual-cnt:has(.datepicker.active) {
    position: unset;
}

.form--1 .label-virtual-cnt:has(.datepicker[style]) .label-virtual {
    opacity: 1;
    transform: translateY(-105%);
}

.form--1 .label-file .button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-default);
    background-color: var(--color-black);
    color: var(--color-white);
    cursor: pointer;
}

.form--1 .label-file .button>.file-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.form--1 .label-virtual-cnt:has(input[name="receipt_date"]) input {
    cursor: pointer;
}

.footer__disclaimer {
    font-size: var(--font-12);
}

.footer__disclaimer svg,
.footer__responsible svg {
    width: var(--unit-80);
    max-width: var(--unit-80);
    height: auto;
}

.footer__responsible svg path {
    fill: var(--color-red-dark);
}

.footer__responsible {
    font-weight: var(--font-bold);
    text-transform: uppercase;
    color: var(--color-red-dark);
}

.footer__decoration {
    /* position: absolute;
    bottom: calc(1 * var(--spacing-default)); */
    margin: var(--spacing-default) 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: var(--unit-48);
    color: var(--color-blue);
    background-color: var(--color-white);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: var(--unit-1);
}


/*OVERWRITES*/
main {
    transition: all 0.5s ease !important;
}

.menu {
    transition: all 0.5s ease !important;
}

.menu-toggle span {
    transition: all 0.3s ease !important;
}

.menu-main li {
    min-height: 39px;
}

.menu-main a {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

.menu-footer a {
    font-family: 'Open Sans', Arial, sans-serif;
}

.modal--response .modal__wrapper {
    font-weight: var(--font-bold);
    text-align: center;
}

.top-banner {
    background-color: var(--color-red);
    color: var(--color-white);
    padding: var(--spacing-default);
}

/*SMALL ONLY*/
@media (max-width: 63.9375rem) {
    :where(:root, ::before, ::after) {
        --grid-container-max-width: 95vw;
    }

    .modal--response .modal__wrapper,
    .modal--campaign-inactive .modal__wrapper {
        padding: var(--spacing-default);
    }

    .modal--response .modal__wrapper {
        font-size: var(--font-20);
    }

    .main-container {
        padding-top: var(--spacing-default);
    }

    footer {
        margin-top: var(--unit-64);
    }

    .footer__responsible {
        margin-top: var(--spacing-default);
    }

    .small-cta--wider {
        padding: var(--spacing-default) calc(4 * var(--spacing-default));
    }

    .form--1 .label-file svg {
        width: var(--unit-20);
        min-width: var(--unit-20);
        height: auto;
    }

    .form--1 input,
    .form--1 select,
    .form--1 .label-file .button {
        font-size: var(--font-16);
    }
}


/*LARGE ONLY*/
@media (min-width: 64rem) {
    .menu-main a {
        font-size: 26px !important;
    }


    .modal--response .modal__wrapper,
    .modal--campaign-inactive .modal__wrapper {
        padding: var(--unit-32);
    }

    .modal--response .modal__wrapper {
        font-size: var(--font-24);
    }

    .main-container {
        padding: calc(2 * var(--spacing-default));
        height: 100%;
        min-height: 100vh;
    }

    .cta,
    .form--1 .label-file .button,
    .snackbar__item {
        cursor: pointer;
        transition: var(--transition) !important;
    }

    .cta:hover,
    .form--1 .label-file .button:hover {
        background-color: var(--color-red-dark);
        color: var(--color-white);
    }

    .large-cta--wider {
        padding: var(--spacing-default) calc(4 * var(--spacing-default));
    }

    .form--1 input,
    .form--1 select,
    .form--1 .label-file .button {
        font-size: var(--font-16);
    }

    .form--1 .label-file svg {
        width: var(--unit-30);
        min-width: var(--unit-30);
        height: auto;
    }

    .top-banner {
        width: 70%;
    }
}