/* HL Autoosad — Hummingbird visual bridge (match classic-child look, keep HB base).
   Fonts load from head.tpl — do not @import Google Fonts here (render-blocking). */

:root {
  --hl-red: #d71920;
  --hl-red-hover: #b51218;
  --hl-black: #18191a;
  --hl-bg: #ffffff;
  --fb-grey-bg: #f8f9fa;
  --fb-grey-border: #e4e6eb;
  --fb-grey-hover: #d8dadf;
  --fb-grey-text: #65676b;
  --header-footer-bg: #30343b;
  --header-footer-text: #f3f4f6;
  --header-footer-line: #3a3b3c;
  --bs-primary: #d71920;
  --bs-primary-rgb: 215, 25, 32;
  --primary: #d71920;
}

html, body {
  font-family: "Mulish", sans-serif !important;
  background: var(--hl-bg) !important;
  color: var(--hl-black) !important;
}

a { color: var(--hl-black); transition: color .2s ease; }
/* Exclude .btn — Bootstrap outline-primary hover is blue; a:hover red text = ugly clash */
a:hover:not(.btn) { color: var(--hl-red); }

/* Bootstrap theme hardcodes outline-primary as #0b69f6 — force HL red site-wide */
.btn-outline-primary {
  --bs-btn-color: var(--hl-red);
  --bs-btn-border-color: var(--hl-red);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--hl-red);
  --bs-btn-hover-border-color: var(--hl-red);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--hl-red-hover);
  --bs-btn-active-border-color: var(--hl-red-hover);
  --bs-btn-disabled-color: var(--hl-red);
  --bs-btn-disabled-border-color: var(--hl-red);
  color: var(--hl-red) !important;
  -webkit-text-fill-color: var(--hl-red) !important;
  border-color: var(--hl-red) !important;
  background-color: transparent !important;
  text-decoration: none !important;
}
body a.btn.btn-outline-primary:hover:not(.hl-bc-btn-continue),
body a.btn.btn-outline-primary:focus:not(.hl-bc-btn-continue),
body a.btn.btn-outline-primary:active:not(.hl-bc-btn-continue),
.btn-outline-primary:hover:not(.hl-bc-btn-continue),
.btn-outline-primary:focus:not(.hl-bc-btn-continue),
.btn-outline-primary:active:not(.hl-bc-btn-continue),
a.btn-outline-primary:hover:not(.hl-bc-btn-continue),
a.btn-outline-primary:focus:not(.hl-bc-btn-continue),
a.btn-outline-primary:active:not(.hl-bc-btn-continue) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background-color: var(--hl-red) !important;
  border-color: var(--hl-red) !important;
  text-decoration: none !important;
}

/* ========== HEADER ========== */
.header-top {
  background: var(--header-footer-bg) !important;
  border-bottom: 1px solid var(--header-footer-line) !important;
  padding: .35rem 0 !important;
}

.header-top,
.header-top a,
.header-top .header-block__title,
.header-top .header-block__icon,
.header-top .ps-contactinfo__email {
  color: var(--header-footer-text) !important;
}

.header-top .ps-shoppingcart .header-block,
.header-top .blockcart,
.header-top .header-block.blockcart {
  background: var(--hl-red) !important;
  border-radius: 6px !important;
  padding: .35rem .85rem !important;
}

.header-top .ps-shoppingcart .header-block__title,
.header-top .ps-shoppingcart .header-block__icon,
.header-top .ps-shoppingcart .header-block__badge {
  color: #fff !important;
}

.header-top .ps-shoppingcart .header-block__badge {
  background: rgba(0,0,0,.2) !important;
  border-radius: 999px !important;
  min-width: 1.25rem;
  font-weight: 700;
}

.header-bottom {
  background: #fff !important;
  box-shadow: 0 4px 20px rgba(0,0,0,.05) !important;
  padding: .75rem 0 .5rem !important;
}

.header-bottom__logo .logo,
.navbar-brand .logo {
  max-height: 52px !important;
  width: auto !important;
  height: auto !important;
  max-width: 220px !important;
  object-fit: contain !important;
}

/* Prefer theme SVG if BO still serves tiny placeholder */
.header-bottom__logo .navbar-brand {
  display: inline-flex !important;
  align-items: center;
  min-height: 52px;
}

.ps-searchbar__input,
.ps-searchbar .form-control {
  background: var(--fb-grey-bg) !important;
  border: 1px solid var(--fb-grey-border) !important;
  border-radius: 8px !important;
  min-height: 46px !important;
  padding-left: 2.75rem !important;
}

.ps-searchbar__magnifier { color: var(--fb-grey-text) !important; }

/* Main menu like old light grey strip */
.ps-mainmenu--desktop,
.header .ps-mainmenu__desktop {
  background: var(--fb-grey-bg) !important;
  border: 1px solid var(--fb-grey-border) !important;
  border-radius: 10px !important;
  padding: .35rem .75rem !important;
  margin-top: .5rem;
}

.ps-mainmenu__desktop a,
.ps-mainmenu .nav-link,
.ps-mainmenu__link {
  font-weight: 700 !important;
  text-transform: uppercase !important;
  font-size: .82rem !important;
  letter-spacing: .02em;
  color: var(--hl-black) !important;
}

.ps-mainmenu__desktop a:hover,
.ps-mainmenu .nav-link:hover {
  color: var(--hl-red) !important;
}

/* Content width owned by hl-site-layout.css (--hl-container-max). */

/* ========== HOMEPAGE DEMO CLEANUP ========== */
#custom-text,
.custom-text,
.ps_customtext,
.ps-customtext,
section.ps-customtext {
  display: none !important;
}

/* Hide clothes promo banner until real assets */
#banner,
.ps_banner,
.banner {
  display: none !important;
}

.carousel-caption,
#carousel .carousel-caption {
  background: rgba(24, 25, 26, .72) !important;
  border-radius: 10px;
  max-width: 36rem;
}

.carousel,
#carousel {
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 2rem;
}

.featured-products .h2,
.products-section-title,
.featured-products h2,
#content-wrapper h2 {
  text-align: center !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;
  letter-spacing: .04em;
  color: var(--hl-black) !important;
  margin: 1.5rem 0 1.25rem !important;
}

/* ========== PRODUCT CARDS ========== */
.product-miniature,
article.product-miniature {
  background: #fff !important;
  border: 1px solid var(--fb-grey-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.04) !important;
  overflow: hidden;
  height: 100%;
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}

.product-miniature:hover {
  box-shadow: 0 8px 20px rgba(0,0,0,.08) !important;
  border-color: var(--fb-grey-hover) !important;
  transform: translateY(-2px);
}

.product-miniature__inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: .5rem .5rem .85rem;
}

.product-miniature__quickview-button,
.product-miniature__quickview-touch {
  display: none !important;
}

.product-flags .badge.new,
.product-flags .badge {
  background: var(--hl-red) !important;
  color: #fff !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
}

.product-miniature__title {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 3.6em;
  font-size: .9rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: var(--hl-black) !important;
  text-decoration: none !important;
  line-height: 1.25 !important;
  margin: .5rem 0 .35rem !important;
}

.product-miniature__title:hover { color: var(--hl-red) !important; }

.product-miniature__price {
  color: var(--hl-red) !important;
  font-weight: 800 !important;
  font-size: 1.15rem !important;
}

.product-miniature__regular-price {
  color: var(--fb-grey-text) !important;
  text-decoration: line-through !important;
  font-size: .9rem !important;
  font-weight: 500 !important;
}

.product-miniature__actions {
  margin-top: auto;
  padding-top: .5rem;
}

.product-miniature__form {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  width: 100%;
}

/* Old shop: no qty on listing cards */
.product-miniature .quantity-button,
.product-miniature .js-quantity-button {
  display: none !important;
}

.product-miniature__add,
.product-miniature__add.btn-primary,
.product-miniature__add.btn-square-icon {
  width: 100% !important;
  background: #fff !important;
  color: var(--hl-red) !important;
  border: 1.5px solid var(--hl-red) !important;
  border-radius: 6px !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  font-size: .78rem !important;
  letter-spacing: .03em;
  padding: .55rem .75rem !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  box-shadow: none !important;
}

.product-miniature__add .material-icons,
.product-miniature__add-text {
  color: var(--hl-red) !important;
}

.product-miniature__add:hover {
  background: var(--hl-red) !important;
  color: #fff !important;
}

.product-miniature__add:hover .material-icons,
.product-miniature__add:hover .product-miniature__add-text {
  color: #fff !important;
}

@media (max-width: 767px) {
  .products,
  .featured-products .products,
  .product-list,
  #products .products {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px 10px !important;
  }
}

/* ========== BUTTONS / PRODUCT PAGE ========== */
/* Exclude listing miniatures — same-specificity later rule was painting them solid red. */
.btn-primary:not(.product-miniature__add),
button.add-to-cart:not(.product-miniature__add),
[data-button-action="add-to-cart"].btn-primary:not(.product-miniature__add) {
  background: var(--hl-red) !important;
  border-color: var(--hl-red) !important;
  color: #fff !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 10px rgba(215, 25, 32, .2) !important;
}

.btn-primary:hover,
button.add-to-cart:hover {
  background: var(--hl-red-hover) !important;
  border-color: var(--hl-red-hover) !important;
}

.product__price,
.current-price,
.product-prices .current-price,
#product .product-price {
  color: var(--hl-red) !important;
  font-weight: 800 !important;
}

#product .h1,
.product__name,
#main .h1 {
  font-weight: 800 !important;
  text-transform: uppercase !important;
  color: var(--hl-black) !important;
}

/* Delivery / payment helper block (injected on product page) */
.hl-commerce-box {
  margin-top: 1.25rem;
  padding: 1rem;
  border: 1px solid var(--fb-grey-border);
  border-radius: 12px;
  background: #fff;
}

.hl-delivery-status {
  display: flex;
  align-items: center;
  gap: .5rem;
  background: #f0f3f5;
  border-radius: 8px;
  padding: .65rem .85rem;
  font-weight: 600;
  margin-bottom: .85rem;
}

.hl-delivery-status::before {
  content: none !important;
  display: none !important;
}

.hl-shipping-list {
  list-style: none;
  padding: 0;
  margin: 0 0 .75rem;
}

.hl-shipping-list li {
  display: flex;
  justify-content: space-between;
  padding: .35rem 0;
  border-bottom: 1px solid #f0f0f0;
  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 (from child footer) */
.cookie-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 99999;
  display: flex; align-items: center; justify-content: center;
}
.cookie-modal {
  background: #fff; padding: 1.5rem; max-width: 450px; width: 90%;
  border-radius: 12px; border: 1px solid var(--fb-grey-border);
  box-shadow: 0 15px 40px rgba(0,0,0,.15);
}
.btn-cookie-primary {
  background: var(--hl-red) !important; color: #fff !important;
  border: 0; border-radius: 6px; padding: .55rem 1rem; font-weight: 700;
}
.btn-cookie-secondary {
  background: var(--fb-grey-bg) !important; color: var(--hl-black) !important;
  border: 1px solid var(--fb-grey-border); border-radius: 6px; padding: .55rem 1rem;
}
