.GiftSection {
    background: #fff;
    color: var(--eld-navy);
}

.needs-validation {
    /*border:2px solid #c21725;*/
    border-radius: 7px;
    box-shadow: 0px 0px 18px gray;
}

.GiftCertificateTitle {
    text-align: center;
}

.GiftCart {
    box-shadow: 0px 0px 10px gray;
}

.GiftCartTitle {
}

.GiftCartItemCounter {
    font-size: clamp(12px,3vw,16px);
}

#mobileCartDrawer {
    top: 30px;
}

.GiftCartClose {
    filter: none;
}

.GC-dropdown li a {
    color: var(--eld-burgundy);
}

#giftToSection textarea {
    color: #000 !important;
}

.btn-addtocart {
    color: var(--eld-navy);
    background-color: #ffffff;
    border-color: var(--eld-brass);
    font-size: clamp(14px, 4vw, 16px) !important;
    height: 45px;
}

.GC-card-header {
    background-color: var(--eld-navy);
    color: #fff;
}

.GiftPayNowBtn {
    background-color: #fff;
    color: var(--eld-navy);
    border: 1px solid var(--eld-brass);
}

    .GiftPayNowBtn:hover {
        background-color: var(--eld-brass-soft);
        color: var(--eld-navy);
        transition: 0.3s ease-in-out;
        border: 1px solid var(--eld-brass);
    }

.GiftPayOptBtn {
    background-color: #fff;
    color: var(--eld-navy);
    border: 1px solid var(--eld-brass);
}

    .GiftPayOptBtn:hover {
        background-color: var(--eld-brass-soft);
        color: var(--eld-navy);
        border: 1px solid var(--eld-brass);
    }

.GC-dropdown {
    color: #000 !important;
    background-color: #fff !important;
}

.btn-outline-danger {
    color: var(--eld-navy);
    border-color: var(--eld-brass);
    background-color: #fff;
}

    .btn-outline-danger:hover,
    .btn-outline-danger:focus,
    .btn-outline-danger:active,
    .btn-outline-danger.show {
        color: var(--eld-navy) !important;
        background-color: var(--eld-brass-soft) !important;
        border-color: var(--eld-brass) !important;
    }

.GC-dropdown .dropdown-item:hover,
.GC-dropdown .dropdown-item:focus,
.GC-dropdown .dropdown-item:active,
.GC-dropdown .dropdown-item.active {
    background-color: var(--eld-brass-soft) !important;
    color: var(--eld-navy) !important;
}

.form-control:focus {
    box-shadow: none;
}

.btn:focus {
    box-shadow: none;
}

.bg-lightgrey {
    background: #ecedef9c;
}

.btn-addtocart:hover {
    transition: 0.5s ease-in-out;
    color: var(--eld-navy);
    background-color: var(--eld-brass-soft);
    border-color: var(--eld-brass);
}

hr {
    color: #092441;
}

/* Scoped on 2026-09-07 to just the "Select a message" button (the only
   .dropdown-toggle this rule was actually meant for) instead of the bare
   .dropdown-toggle::after selector. The unscoped version was also matching
   the "Catering"/"More" nav dropdown links (they share the Bootstrap
   dropdown-toggle class), and its position:absolute/right/top pulled their
   arrow out of normal text flow - overriding the sitewide nav-arrow spacing
   from ELD-StyleSheet.css and making it sit tight against the label on any
   page that loads this stylesheet (Gift Certificate, its invoice, etc.),
   while other pages that don't load GiftCertificate.css looked correct. */
.dropdown-toggle.btn-outline-danger::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    position: absolute;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
    right: 0.5rem;
    top: 1rem;
}

.dropdown-item {
    border-top: 1px dotted darkgray;
}

.blockquote-footer::before {
    content: "— ";
    display: none;
}

@media (max-width:576px) {
    .g-recaptcha {
        margin-left: -10px;
        zoom: 0.9;
    }
}

.h-10 {
    height: 10rem;
}

p {
    font-size: 14px;
}

.GiftInvoiceSection {
    background-color: #fff;
    color: var(--eld-navy);
}

.headerHSOTInvoiceBG {
    background: var(--eld-navy);
    color: #fff !important;
}