/* Extracted from hl-hummingbird/assets/css/custom.css — checkout-related sections only */
/* Source project: HL-PS9. Full custom.css is shop-wide and was NOT imported wholesale. */

/* ---- custom.css lines 395-420 ---- */
}

/* ==========================================================================
   7. CHECKOUT PARANDUSED (Trendikas hall valikukast)
   ========================================================================== */
.address-item, body#checkout section.checkout-step .delivery-options .delivery-option, .payment-options .payment-option {
    border: 1px solid var(--fb-grey-border) !important; border-radius: 12px !important; margin-bottom: 10px; padding: 15px; transition: all 0.2s ease; background: #fff;
}
.address-item:hover, body#checkout section.checkout-step .delivery-options .delivery-option:hover, .payment-options .payment-option:hover {
    border-color: var(--fb-grey-text) !important; cursor: pointer;
}
.address-item.selected, body#checkout section.checkout-step .delivery-options input[type="radio"]:checked + label, .payment-options .payment-option input[type="radio"]:checked + label, .payment-option.selected {
    border-color: var(--hl-black) !important;
    background-color: var(--fb-grey-bg) !important;
    box-shadow: 0 0 0 1px var(--hl-black) inset !important;
}

/* ==========================================================================
   8. JOONED JA PISIDETAILID
   ========================================================================== */
.products-section-title { position: relative; text-align: center; padding-bottom: 25px !important; margin-bottom: 40px !important; }
.products-section-title::before { content: ""; position: absolute; bottom: 5px; left: 50%; transform: translateX(-50%); width: 200px; height: 1px; background-color: var(--fb-grey-border); }
.products-section-title::after { content: ""; position: absolute; bottom: 4px; left: 50%; transform: translateX(-50%); width: 40px; height: 3px; background-color: var(--hl-red); border-radius: 2px; }

/* Footeri puhas tume eraldusjoon (asendab vana vikerkaart) */
.footer-container { background-color: var(--header-footer-bg) !important; margin-top: 60px !important; border-top: 3px solid var(--hl-red) !important; }

/* ---- custom.css lines 1224-1280 ---- */
    margin-bottom: 10px !important;       /* Väike vahe järgmise elemendiga */
}
/* ==========================================================================
   CHECKOUT: SAMMUDE NUMBRID JA LINNUKESED (PETROL)
   ========================================================================== */

/* 1. Sammude numbrid (nii aktiivne kui läbitud) */
.checkout-step .step-number,
body#checkout section.checkout-step.-reachable.-current .step-number {
    background-color: var(--brand-petrol) !important;
    color: #ffffff !important;
}

/* 2. Lõpetatud sammude linnukesed (teksti kõrval) */
/* See muudab need rohelised linnukesed Petrol-karva */
#checkout .checkout-step .step-title i.done {
    color: var(--brand-petrol) !important;
}

/* 3. Lõpetatud sammu pealkiri (valikuline, kui soovid sümmeetriat) */
#checkout .checkout-step.-complete .step-title {
    color: var(--brand-petrol) !important;
}


/* ==========================================================================
   CHECKOUT: RAADIONUPPUDE VALIK (SINEPIKOLLANE)
   ========================================================================== */

/* Muudame raadionupu "täpi" või "linnukese", mis tekib valimisel */
/* See sihib nii tarnet kui ka makseviise */

body#checkout input[type="radio"]:checked + span.custom-radio,
body#checkout .custom-radio input[type="radio"]:checked + span,
.delivery-option input[type="radio"]:checked + label .custom-radio {
    background-color: var(--hl-red) !important;
}

/* See osa tagab, et raadionupu sisemine täpp oleks valge ja selge */
body#checkout .custom-radio i {
    background-color: var(--hl-red) !important;
}

/* Kui teema kasutab pseudo-elemente (levinud Classic teemas) */
body#checkout .custom-radio input[type="radio"]:checked + span::after {
    background-color: var(--hl-red) !important;
}

/* Raadionupu raam (kui hiirega peale minna või on valitud) */
.custom-radio:hover,
input[type="radio"]:checked + .custom-radio {
    border-color: var(--hl-red) !important;
}
/* PARANDATUD: Konteineri laiune desktopis, servast servani mobiilis */
.brand-grid-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 tulpa desktopis */

/* ---- custom.css lines 6828-6900 ---- */
}

/* --------------------------------------------------------------------------
   CHECKOUT + OSTUKORV
   -------------------------------------------------------------------------- */
body#checkout section.checkout-step {
    background: #FFFFFF !important;
    border: 1px solid var(--hl-modern-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(17, 24, 39, 0.045) !important;
    overflow: visible !important;
}

.address-item,
body#checkout section.checkout-step .delivery-options .delivery-option,
.payment-options .payment-option {
    border-color: var(--hl-modern-border) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

.address-item:hover,
body#checkout section.checkout-step .delivery-options .delivery-option:hover,
.payment-options .payment-option:hover {
    border-color: #C9CED4 !important;
    background-color: #FAFAFB !important;
}

.address-item.selected,
body#checkout section.checkout-step .delivery-options input[type="radio"]:checked + label,
.payment-options .payment-option input[type="radio"]:checked + label,
.payment-option.selected {
    border-color: #9FA5AC !important;
    background-color: #F7F8FA !important;
    box-shadow: 0 0 0 1px #9FA5AC inset !important;
}

#conditions-to-approve {
    background-color: #F8F9FA !important;
    border-color: var(--hl-modern-border) !important;
    border-radius: 10px !important;
}

.cart-item,
.cart-summary,
.card.cart-summary {
    border-radius: 12px !important;
}

/* --------------------------------------------------------------------------
   KÃœPSISED
   -------------------------------------------------------------------------- */
.cookie-modal {
    border-color: var(--hl-modern-border) !important;
    border-radius: 16px !important;
    box-shadow: 0 20px 55px rgba(17, 24, 39, 0.18) !important;
}

.btn-cookie-primary,
.btn-cookie-secondary {
    border-radius: 10px !important;
}

/* --------------------------------------------------------------------------
   HL FAST AJAX SEARCH – visuaal eraldi CSS-is, mitte JS inline-stiilina
   -------------------------------------------------------------------------- */
.ui-autocomplete,
.search-dropdown,
.iqit-search-results {
    display: none !important;
}

#fd-fast-results,

/* ---- custom.css lines 7445-7520 ---- */
  font-size: .92rem;
}

.hl-free-ship {
  color: #15803d;
  font-weight: 600;
  font-size: .9rem;
  margin-bottom: .75rem;
}

.hl-pay-logos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
}

.hl-pay-logos span {
  border: 1px solid var(--fb-grey-border);
  border-radius: 4px;
  padding: .2rem .45rem;
  font-size: .72rem;
  font-weight: 700;
  color: var(--fb-grey-text);
  background: var(--fb-grey-bg);
}

/* ========== FOOTER ========== */
.footer,
footer.footer,
#footer {
  background: var(--header-footer-bg) !important;
  color: var(--header-footer-text) !important;
  margin-top: 2.5rem;
}

.footer a,
footer.footer a {
  color: var(--header-footer-text) !important;
}

.footer a:hover { color: #fff !important; }

.footer .h3,
.footer .h4,
.footer h3,
.footer h4 {
  color: #fff !important;
  font-weight: 700 !important;
}

/* Cookie modal — closed by default; JS toggles .is-open */
.cookie-overlay {
  position: fixed !important;
  inset: auto auto 20px 20px !important;
  top: auto !important;
  right: auto !important;
  bottom: 20px !important;
  left: 20px !important;
  width: auto !important;
  height: auto !important;
  max-width: calc(100vw - 40px);
  background: transparent !important;
  backdrop-filter: none !important;
  z-index: 999999 !important;
  display: none !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  padding: 0 !important;
}
.cookie-overlay.is-open {
  display: flex !important;
}
.cookie-modal {
  background: #fff !important;
  padding: 1.5rem !important;

/* ---- custom.css lines 7580-7595 ---- */
.cookie-text {
  text-align: left;
}
body#checkout #cookie-overlay,
body#checkout #footer #cookie-overlay {
  /* keep banner usable even when shop footer is compacted on checkout */
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 1000000 !important;
}

/* ==========================================================================
   HL CLS FINAL (2026-09-18) — last rules in custom.css win over earlier card layout
   Category LIST must stay 125px horizontal rows; never flex-column / min-height 300.
   ========================================================================== */
@media (min-width: 768px) {