/*
Compile-Minify: true
Compile-Area: checkout
Compile-OutputGroup: headtag
Compile-Exports: checkout
Compile-Dependencies: bootstrap
*/

.checkout-user-type-tab {
    margin-bottom: 1.25rem;
    border-bottom: .063rem solid #949494;
}

.checkout-user-type-tab label {
    font-family: 'RefregratorDx', sans-serif;
    font-size: 1.5rem !important;
    line-height: 120%;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .15rem;
    padding-bottom: .625rem;
    padding-right: 0 !important;
    margin-right: 20px;
    cursor: pointer !important;
}

.checkout-user-type-tab label input {
    display: none;
}

.checkout-user-type-tab label {
    cursor: pointer;
    margin-bottom: 0 !important;
    border-bottom: 2px solid transparent;
    transition: border-color 0.3s;
}

.checkout-user-type-tab label:has(input[type="radio"]:checked) {
    border-bottom: 2px solid #383634;
}

.check-out-header-text {
    font-family: 'RefregratorDx', sans-serif;
    font-size: 2.25rem !important;
    font-weight: 800;
    line-height: 120%;
    letter-spacing: .18rem;
    text-transform: uppercase;
    margin-top: 2rem !important;
    margin-bottom: 0 !important;
}

#returningDiv .form-group input[type="email"],
#returningDiv .form-group input[type="password"],
#createDiv .form-group input[type="email"],
#createDiv .form-group input[type="password"],
#guestDiv .form-group input[type="email"],
#guestDiv .form-group input[type="password"] {
    height: 3rem;
    height: 3rem;
    border-radius: .313rem;
    border: .063rem solid #949494;
    line-height: 120%;
    color: #1c1d1f;
    outline: none;
    background-color: #fff !important;
}

#returningDiv .form-group input[type="submit"],
#createDiv .form-group input[type="submit"],
#guestDiv .form-group input[type="submit"],
#guestDiv .form-group button {
    height: 3rem;
    height: 3rem;
    border-radius: .313rem;
    border: .063rem solid var(--brand-accent, #4B5320);
    line-height: 120%;
    color: #fff;
    outline: none;
    background-color: var(--brand-accent, #4B5320);
    cursor: pointer;
}

.border-line {
    display: flex;
    justify-content: center;
    align-items: center;
}

.border-line img {
    width: 75%;
    margin: 0 auto;
}

/* .tab-pane {
    width: 75% !important;
} */
.name-input-con input[type="text"],
.card-input-con input[type="text"] {
    padding: 27px;
}

#CreditCardExpirationMonth,
#CreditCardExpirationYear,
#CreditCardSecurityCode {
    height: 3rem;
}

.btn-success {
    font-family: 'RefregratorDx', sans-serif;
    padding: .625rem 1.25rem;
    border-radius: 4px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .11rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

#section-checkout-login .checkout-form input[type="submit"],
#section-checkout-login .checkout-form button[type="submit"]:not(.btn-link),
#section-checkout-address .checkout-form input[type="submit"],
#section-checkout-address .checkout-form button[type="submit"]:not(.btn-link),
#checkout-shipping .checkout-form input[type="submit"],
#checkout-shipping .checkout-form button[type="submit"]:not(.btn-link),
#section-checkout-payment .checkout-form input[type="submit"],
#section-checkout-payment .checkout-form button[type="submit"]:not(.btn-link),
#paypal-payment-form .btn-link {
    background-color: var(--brand-accent, #4B5320) !important;
    border-color: var(--brand-accent, #4B5320) !important;
    color: #fff !important;
    transition: filter .2s ease, background-color .2s ease, border-color .2s ease;
}

#paypal-payment-form .btn-link {
    font-family: 'RefregratorDx', sans-serif;
    padding: .625rem 1.25rem;
    border-radius: 4px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .11rem;
    text-decoration: none !important;
}

#section-checkout-login .checkout-form input[type="submit"]:hover,
#section-checkout-login .checkout-form button[type="submit"]:not(.btn-link):hover,
#section-checkout-address .checkout-form input[type="submit"]:hover,
#section-checkout-address .checkout-form button[type="submit"]:not(.btn-link):hover,
#checkout-shipping .checkout-form input[type="submit"]:hover,
#checkout-shipping .checkout-form button[type="submit"]:not(.btn-link):hover,
#section-checkout-payment .checkout-form input[type="submit"]:hover,
#section-checkout-payment .checkout-form button[type="submit"]:not(.btn-link):hover,
#paypal-payment-form .btn-link:hover,
#section-checkout-login .checkout-form input[type="submit"]:focus,
#section-checkout-login .checkout-form button[type="submit"]:not(.btn-link):focus,
#section-checkout-address .checkout-form input[type="submit"]:focus,
#section-checkout-address .checkout-form button[type="submit"]:not(.btn-link):focus,
#checkout-shipping .checkout-form input[type="submit"]:focus,
#checkout-shipping .checkout-form button[type="submit"]:not(.btn-link):focus,
#section-checkout-payment .checkout-form input[type="submit"]:focus,
#section-checkout-payment .checkout-form button[type="submit"]:not(.btn-link):focus,
#paypal-payment-form .btn-link:focus,
#section-checkout-login .checkout-form input[type="submit"]:active,
#section-checkout-login .checkout-form button[type="submit"]:not(.btn-link):active,
#section-checkout-address .checkout-form input[type="submit"]:active,
#section-checkout-address .checkout-form button[type="submit"]:not(.btn-link):active,
#checkout-shipping .checkout-form input[type="submit"]:active,
#checkout-shipping .checkout-form button[type="submit"]:not(.btn-link):active,
#section-checkout-payment .checkout-form input[type="submit"]:active,
#section-checkout-payment .checkout-form button[type="submit"]:not(.btn-link):active,
#paypal-payment-form .btn-link:active {
    background-color: var(--brand-accent, #4B5320) !important;
    border-color: var(--brand-accent, #4B5320) !important;
    color: #fff !important;
    filter: brightness(.92);
}

.double-arrow-right {
    background-color: #383634;
    position: absolute;
    right: 0;
    height: 100%;
    padding: 0 1.25rem;
    display: flex;
    align-items: center;
    border-radius: 0 4px 4px 0;
}

.input-group-btn .discount-apply {
    color: #000;
    height: 3rem;
    font-family: 'RefregratorDx', sans-serif;
    font-weight: 800;
    letter-spacing: .11rem;
    text-transform: uppercase;
    background-color: #ccc !important;
    border-radius: 0 .25rem .25rem 0;
    border-color: transparent !important;
}

#apply-coupon input[type="text"] {
    height: 3rem;
    border-radius: .25rem 0 0 .25rem;
}

.form-horizontal .control-label {
    text-align: left;
}

.section-cart {
    display: flex !important;
    gap: 20px;
}

#section-cart-items {
    padding: 0 !important;
}

/* #section-checkout-review {
    width: 34% !important;
} */

.order-complete-title {
    font-family: 'RefregratorDx', sans-serif;
    font-size: 1.5rem !important;
    letter-spacing: .15rem;
    font-weight: 800;
    line-height: 120%;
}

.ordered-item-img {
    margin-right: 7% !important;
}

.ordered-item-img img {
    width: 100% !important;
}

.ordered-item-desc {
    width: 50% !important;
}

.panel-title a {
    font-weight: 600;
    line-height: 59px;
}

.list-group-item-header {
    width: 100% !important;
    /* border: .063rem solid #949494; */
}

.discount-apply-input {
    padding: 27px 47px;
    border-radius: 10px 0 0 10px;
    border: 1px solid #383634;
}

.discount-apply-btn {
    padding: 17px 0;
    width: 100%;
    background-color: green;
    border-radius: 0 10px 10px 0;
}

.name-input-con,
.card-input-con {
    width: 100% !important;
}

#CreditCardholderName,
#CreditCardNumber {   
    border-radius: 4px;
    border: .063rem solid #949494;
}

/* .card-exp-y,
.card-exp-m,
.security-code-input {
    width: 40% !important;
} */

#CreditCardExpirationYear,
#CreditCardExpirationMonth,
#CreditCardSecurityCode {   
    border-radius: 4px;
    border: .063rem solid #949494;
}

.place-order-button {
    padding: 17px 0;
    width: 100% !important;
}

.checkout-review-right {
    background-color: #f3f3f1 !important;
    padding: .5rem 3rem 1.5rem !important;
}

@media (min-width: 992px) and (max-width: 1200px) {
    .listingTemplate {
        width: 80% !important;
    }
    .ordered-item-img {
        margin-right: 4% !important;
    }
}

@media (min-width: 768px) and (max-width: 992px) {
    .listingTemplate {
        width: 80% !important;
    }
    .ordered-item-img {
        margin-right: 4% !important;
    }
}

@media (min-width: 576px) and (max-width: 768px) {
    .listingTemplate {
        width: 80% !important;
    }
    #section-cart-items,
    #section-checkout-review {
        width: 95% !important;
    }
    .section-cart {
        flex-direction: column;
    }
    .ordered-item-img {
        margin-right: 2% !important;
    }
    .tab-pane {
        width: 100% !important;
    }
}

@media screen and (max-width: 576px) {
    .section-cart {
        flex-direction: column;
    }
    #section-cart-items,
    #section-checkout-review {
        width: 100% !important;
    }
    .listingTemplate {
        width: 95.5% !important;
    }
    .ordered-item-img {
        width: 25% !important;
    }
    .border-line {
        width: 90% !important;
    }
    .tab-pane {
        width: 100% !important;
    }

    .checkout-review-right {
        background-color: #f3f3f1 !important;
        padding: 0 !important;
    }
}

#checkout-heading-payment {
    padding: 0 !important;
    background-color: transparent !important;
}
