* {
    --clr1: rgb(254, 215, 170);
    --clr2: #fff7ed;
    --clr3: #f14a24;
    --clr4: #4b5563;
    --clr5: #fbb03b;
    --clr6: #e5e7eb;
    --clr7: #f9fafb;
    --clr8: #e4e4e4;
    --clr9: #8394abff;
    --clr10: #c7c7c7;
    --clr11: #f15a24;
    --clr12: #eceff1;
}
.wf_calculator__totals__submit {
    position: relative;
    color: white;
    font-weight: 700;
    padding: 1.4rem;
    width: 100%;
    font-size: 2rem;
}

.wf_calculator__totals__submit > span {
    position: relative;
    z-index: 20;
}

.wf_calculator__totals__submit:after,
.wf_calculator__totals__submit:before {
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.wf_calculator__totals__submit:after {
    z-index: 0;
    background: var(--clr3);
    width: 100%;
}

.wf_calculator__totals__submit:before {
    z-index: 10;
    background: var(--clr5);
    width: 0;
    transition: width 0.4s ease;
}

.wf_calculator__totals__submit:hover:before {
    width: 100%;
}

.wf_calculator__totals__submit > * {
    margin: 0;
}

.wf_calculator__popup {
    position: fixed;
    z-index: 500;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    visibility: hidden;
    opacity: 0;
    transition: all 0.5s;
}

.wf_calculator__popup.show {
    visibility: visible;
    opacity: 1;
}

.wf_calculator__popup__cover {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    cursor: pointer;
}

.wf_calculator__popup__cont {
    position: absolute;
    z-index: 50;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 2rem);
    max-width: 35rem;
    max-height: calc(100% - 2rem);
    background: white;
    overflow: auto;
    padding: 4rem 1.5rem 1.5rem 1.5rem;
}

.wf_calculator__popup__cont h2 {
    text-align: center;
}

.wf_calculator__popup__cont p {
    text-align: center;
}

.wf_calculator__popup__cont__form {
    display: flex;
    flex-flow: column;
    gap: 1rem;
    margin-bottom: 2rem;
}

.wf_calculator__popup__cont__form.loading {
    opacity: 0.5;
    pointer-events: none;
}

.wf_calculator__popup__cont__form input[type=text] {
    border: 1px solid #c7c7c7;
    background-color: transparent;
    height: 6rem;
    padding: 2rem 2rem;
    width: 100%;
    transition: border-color .3s, opacity .5s;
    width: 100%;
}

.wf_calculator__popup__cont__form input[type=text]:focus {
    border-color: #000;
}

.wf_calculator__popup__cont__form input[type=submit] {
    background-color: var(--clr11);
    color: #fff;
    border: none;
    height: 6rem;
    padding: 0 4rem;
    background: linear-gradient(135deg, var(--clr11) 0, var(--clr11) 40%, var(--clr12) 50%, var(--clr11) 60%, var(--clr11) 100%);
    background-repeat: no-repeat;
    background-size: 300%;
    animation: light 4s 0s linear infinite;
    width: 100%;
}

.wf_calculator__popup__cont__form input[type=submit]:hover {
    opacity: 0.8;
}

.wf_calculator__popup__cont__close {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 50;
    display: block;
    width: 3.5rem;
    height: 3.5rem;
    cursor: pointer;
}

.wf_calculator__popup__cont__close:before,
.wf_calculator__popup__cont__close:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 3rem;
    height: 0.5rem;
    background: rgba(0,0,0,0.6);
    transform: translate(-50%, -50%) rotate(var(--rot));
}

.wf_calculator__popup__cont__close:before {
    --rot: 45deg;
}
.wf_calculator__popup__cont__close:after {
    --rot: -45deg;
}

.wf_calculator__error {
    font-size: 1.5rem;
    font-weight: 500;
    color: red;
    margin: 0;
}

.wf_dropdown {
    position: relative;
    z-index: calc(100 + var(--z-index));
    margin-bottom: 1rem;
}

.wf_dropdown__head {
    min-width: 25rem;
    padding: 0 1rem;
    font-weight: 600;
    height: 4.5rem;
    font-size: 1.6rem;
    display: flex;
    align-items: center;
    border: solid 0.1rem black;
    cursor: pointer;
}

.wf_dropdown__open {
    display: none;
}

.wf_dropdown__values {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    max-height: 40rem;
    overflow: hidden;
    border: solid 0.1rem black;
    display: flex;
    flex-flow: column;
    align-items: stretch;
    gap: 0.5rem;
    background: white;
}

.wf_dropdown__open:not(:checked) + .wf_dropdown__head + .wf_dropdown__values
{
    display: none;
}

.wf_dropdown__value {
    display: none;
}

.wf_dropdown__value_label {
    font-size: 1.6rem;
    padding: 0.5rem;
}

.wf_dropdown__value_label:hover {
    background: var(--clr11);
}

.wf_dropdown__value:checked + .wf_dropdown__value_label {
    background: var(--clr11);
    color: white;
}

.special_offer .pack_variation .wf_calculator__totals__submit {
    display: block;
    max-width: 20rem;
    margin: 0 auto;
}

.special_offer .shell .wf_calculator__totals__submit {
    display: block;
    max-width: 30rem;
    margin: 0 auto;
}

.wf_calculator__popup--complex_offer .wf_dropdown__head {
    height: 6rem;
    border: solid 0.1rem var(--clr10);
    color: var(--clr4);
    font-weight: 400;
    padding: 0 4rem 0 2rem;
    position: relative;
    min-width: 20rem;
}

.wf_calculator__popup--complex_offer .wf_dropdown__head:before {
    content: "";
    display: block;
    width: 1rem;
    height: 1rem;
    border-right: solid 0.3rem var(--clr4);
    border-bottom: solid 0.3rem var(--clr4);
    transform: translate(50%, -50%) rotate(45deg);
    position: absolute;
    top: 50%;
    right: 2.5rem;
}

.wf_calculator__popup--complex_offer .wf_dropdown__open:not(:checked) + .wf_dropdown__head:before {
    transform: translate(50%, -50%) rotate(-135deg);
}

.wf_make_offer_form {
    margin-bottom: 3rem;
}

.wf_make_offer_form .wf_calculator__totals__submit {
    display: block;
    max-width: 30rem;
    margin: 0 auto;
}