/* ============================================================
   KWIATKI THEME — FlowersLove.pl
   Child of: hummingbird (PrestaShop 9.1.4)
   ============================================================ */

/* Google Fonts loaded via <link> in _partials/stylesheets.tpl */

/* ── Design tokens ── */
:root {
  --kw-bg:            #faf9f5;
  --kw-text:          #2d2d2d;
  --kw-accent:        #a0735a;
  --kw-accent-hover:  #8a5e47;
  --kw-border:        #e8e0d8;
  --kw-badge-bg:      #ffffff;
  --kw-font-serif:    'Cormorant Garamond', Georgia, serif;
  --kw-font-sans:     system-ui, -apple-system, sans-serif;
}

/* ── Base ── */
body {
  background-color: var(--kw-bg);
  color: var(--kw-text);
  font-family: var(--kw-font-sans);
}

h1, h2, h3 {
  font-family: var(--kw-font-serif);
  font-weight: 500;
  color: var(--kw-text);
}

/* ── Buttons ── */
.kw-btn {
  background-color: var(--kw-accent);
  border: 1px solid var(--kw-accent);
  color: #fff;
  border-radius: 2px;
  font-family: var(--kw-font-sans);
  font-size: 1rem;
  letter-spacing: 0.04em;
  padding: 0.9rem 2.5rem;
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  display: inline-block;
  transition: background-color 0.2s;
}
.kw-btn:hover {
  background-color: var(--kw-accent-hover);
  border-color: var(--kw-accent-hover);
  color: #fff;
}

/* Override Bootstrap 5 button vars so all states (disabled, active, focus) use accent */
.btn-primary {
  --bs-btn-bg: var(--kw-accent);
  --bs-btn-border-color: var(--kw-accent);
  --bs-btn-hover-bg: var(--kw-accent-hover);
  --bs-btn-hover-border-color: var(--kw-accent-hover);
  --bs-btn-active-bg: var(--kw-accent-hover);
  --bs-btn-active-border-color: var(--kw-accent-hover);
  --bs-btn-disabled-bg: var(--kw-accent);
  --bs-btn-disabled-border-color: var(--kw-accent);
  border-radius: 2px;
}

/* ── Hero section ── */
.kw-hero {
  display: grid;
  grid-template-columns: 45% 55%;
  min-height: min(90vh, 720px);
  overflow: hidden;
}
.kw-hero__text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 4rem 3rem;
  gap: 1.5rem;
}
.kw-hero__eyebrow {
  font-size: 0.75rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--kw-accent);
  margin: 0;
}
.kw-hero__headline {
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.15;
  margin: 0;
}
.kw-hero__body {
  font-size: 1rem;
  line-height: 1.7;
  color: #555;
  margin: 0;
  max-width: 480px;
}
.kw-hero__text .kw-btn {
  align-self: flex-start;
}
.kw-hero__image {
  position: relative;
  overflow: hidden;
}
.kw-hero__image::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #faf9f5 0%, transparent 45%);
  z-index: 1;
  pointer-events: none;
}
.kw-hero__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ── "Dostępne teraz" product section ── */
.kw-products {
  padding: 2rem 0 4rem;
}
.kw-products__header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 0 0 1rem;
  border-bottom: 1px solid var(--kw-border);
  margin-bottom: 1.5rem;
}
.kw-products__title {
  font-size: 2rem;
  margin: 0;
}
.kw-products__count {
  font-size: 0.85rem;
  color: #888;
}
.kw-products__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

/* ── Product card (miniature) ── */
.product-miniature {
  background: #fff;
  border: 1px solid var(--kw-border);
  position: relative;
}
.product-miniature__image-wrapper {
  aspect-ratio: 1;
  overflow: hidden;
}
.product-miniature__image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s;
}
.product-miniature:hover .product-miniature__image-wrapper img {
  transform: scale(1.03);
}
.product-miniature__info {
  padding: 0.75rem;
}
.product-miniature__name {
  font-family: var(--kw-font-serif);
  font-size: 1rem;
  text-decoration: none;
  color: var(--kw-text);
  display: block;
  margin-bottom: 0.25rem;
}
.product-miniature__price {
  font-weight: 600;
  color: var(--kw-text);
}

/* ── Badges ── */
.kw-badge {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  background: var(--kw-badge-bg);
  border: 1px solid var(--kw-border);
  color: var(--kw-text);
  font-size: 0.65rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.2rem 0.5rem;
  font-family: var(--kw-font-sans);
}

.kw-badge--inline {
  position: static;
  display: inline-block;
  margin-bottom: 1rem;
}

/* ── Logo text block ── */
.kw-logo-text {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
}
.kw-logo-text__name {
  font-family: var(--kw-font-serif);
  font-style: italic;
  font-size: 1.45rem;
  font-weight: 500;
  color: var(--kw-text);
  white-space: nowrap;
}
.kw-logo-text__subtitle {
  font-size: 0.6rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--kw-accent);
  white-space: nowrap;
}

/* ── Single-row header ── */
/* Search and login are suppressed via module template overrides (ps_searchbar.tpl, ps_customersignin.tpl) */
/* Hide "Strona główna" nav item — type-index is the homepage controller */
.ps-mainmenu__tree-item.type-index { display: none; }

/* ── Product detail page ── */
/* Hide quantity input — every item is qty=1; target only the +/- controls, not the whole container */
.page-product .product__quantity,
.page-product .product-add-to-cart .qty {
  display: none !important;
}

/* Hide PS default "Ostatnie sztuki w magazynie" warning — replaced by kw-avail in product.tpl */
.page-product .product__availability {
  display: none !important;
}

/* Custom availability indicator */
.kw-avail {
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 0.75rem;
  font-weight: 500;
}
.kw-avail--yes { color: #5a7a5a; }
.kw-avail--no  { color: #a04040; }

/* Product page layout tweaks */
.product__container {
  gap: 3rem;
  padding: 2rem 0;
}

/* Kolor/Podstawa Feature display */
.product__specs {
  margin: 0.5rem 0 1rem;
}
.product__spec {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #444; /* darker than .kw-sold-notice__text's #666 on purpose — not a warning tone */
  margin: 0 0 0.25rem;
}

/* ── Sold-out product page notice ── */
.kw-sold-notice {
  margin-bottom: 1.5rem;
}
.kw-sold-notice__text {
  font-size: 0.95rem;
  color: #666;
  line-height: 1.6;
  margin: 0.5rem 0 1.25rem;
}
.kw-sold-notice__actions {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.kw-btn--outline {
  background-color: transparent;
  border-color: var(--kw-accent);
  color: var(--kw-accent);
}
.kw-btn--outline:hover {
  background-color: var(--kw-accent);
  color: #fff;
}

/* ── 09 — btn-outline-primary → brand accent (Filtr button, sort dropdown) ── */
.btn-outline-primary {
  --bs-btn-color: var(--kw-accent);
  --bs-btn-border-color: var(--kw-accent);
  --bs-btn-hover-bg: var(--kw-accent);
  --bs-btn-hover-border-color: var(--kw-accent);
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: var(--kw-accent);
  --bs-btn-active-border-color: var(--kw-accent);
  --bs-btn-active-color: #fff;
  border-radius: 2px;
}

/* ── Category sidebar: hide "Strona główna" title link ── */
/* ps_categorytree's own title link always points to the shop's root/home
   category (named "Strona główna" for this PL install) — redundant next to
   the header logo + top nav home links. Scoped to .ps-categorytree so it
   doesn't affect facets.tpl's "Filtruj według" title, which shares the same
   .left-block__title class. */
.ps-categorytree > .left-block__title {
  display: none;
}

/* ── 11 — newsletter block: homepage + category only; hide on product & 404 ── */
.page-product .ps-emailsubscription,
.page-not-found .ps-emailsubscription {
  display: none;
}

/* ── 12 — category pages in main nav: shown in homepage circle strip instead ── */
.ps-mainmenu__tree-item.type-category {
  display: none;
}

/* ── 14 — product thumbnail active state: brand accent instead of Bootstrap blue ── */
.product__thumbnail.active {
  --bs-primary-rgb: 160, 115, 90;
  outline-color: var(--kw-accent) !important;
}

/* ── PS product-flag "Nowy" — actual markup: <li class="badge new">
   Theme uses RGBA(var(--bs-primary-rgb),...) !important, so we override the
   variable rather than the property. #a0735a = 160,115,90 ── */
.product-flags .badge.new {
  --bs-primary-rgb: 160, 115, 90;
  border-radius: 0;
}

/* ── Responsive ── */
@media (max-width: 768px) {
  .kw-hero {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .kw-hero__text {
    padding: 2.5rem 1.5rem;
  }
  .kw-hero__image {
    height: 50vw;
  }
  .kw-products__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  /* 08 — "Dostępne teraz" header: stack on mobile to avoid side-by-side wrap */
  .kw-products__header {
    flex-direction: column;
    gap: 0.25rem;
  }
  .kw-products__title {
    font-size: 1.5rem;
  }

  /* 13 — mobile header: hide tagline to save ~20 px; hamburger/logo/cart already inline */
  .kw-logo-text__subtitle {
    display: none;
  }

  /* 18 — breadcrumb: clip long product name so it doesn't overflow viewport */
  .breadcrumb-item:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 60vw;
  }

  /* 03 — hide category sidebar; mobile filtering via native "Filtr" toolbar button.
     #search-filters is deliberately NOT listed here: Hummingbird's JS moves that
     same node into the #offcanvas-faceted mobile panel when "Filtr" is tapped, so
     hiding it by id also hid the mobile filter offcanvas (price, Kolor, Podstawa —
     everything). The desktop sidebar wrapper already carries Bootstrap's own
     d-none d-md-block, so .left-block alone is enough to hide it on mobile. */
  .left-block {
    display: none !important;
  }

  /* 05 — product image: hide thumbnail strip, expand main cover to full width */
  .product-images,
  .product__thumbnails {
    display: none !important;
  }
  .images-container,
  .product__cover {
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 480px) {
  .kw-products__grid {
    grid-template-columns: 1fr;
  }
}

/* Checkout — individual vs company purchase toggle */
.js-company-field,
.js-company-copy {
  display: none;
}

.js-address-form.is-company-mode .js-company-field {
  display: block;
}

.js-address-form.is-company-mode .js-company-field .form-text {
  display: none;
}

.js-address-form.is-company-mode .js-individual-copy {
  display: none;
}

.js-address-form.is-company-mode .js-company-copy {
  display: block;
}

.js-gus-lookup {
  margin-top: 0.5rem;
}

/* NIP + "Pobierz dane z GUS" share a row; align the button with the input,
   not the label above it, and keep it from shrinking its text. */
.kw-nip-row {
  align-items: flex-end;
}

.kw-nip-row .js-gus-lookup {
  margin-top: 0;
  flex-shrink: 0;
}

.js-invoice-save-error {
  display: none;
  font-size: 0.875em;
}

.js-invoice-save-error:not(:empty) {
  display: block;
}

.js-gus-message {
  display: none;
  font-size: 0.875em;
  color: var(--kw-text);
}

.js-gus-message.is-visible {
  display: block;
}

/* Checkout — paired fields in one row (Imię/Nazwisko on step 1, Kod pocztowy/Miasto on step 2) */
.kw-field-row {
  display: flex;
  gap: 1rem;
}

.kw-field-row > .mb-3 {
  flex: 1;
  min-width: 0;
}

@media (max-width: 480px) {
  .kw-field-row {
    flex-direction: column;
    gap: 0;
  }
}

/* Cookie consent banner (RODO/ePrivacy) */
.kw-cookie-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1080;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.5rem;
  background: var(--kw-bg);
  border-top: 1px solid var(--kw-border);
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.12);
}

.kw-cookie-banner__text {
  flex: 1 1 320px;
  margin: 0;
  font-size: 0.9em;
  color: var(--kw-text);
}

.kw-cookie-banner__text a {
  color: var(--kw-accent);
}

.kw-cookie-banner__actions {
  display: flex;
  gap: 0.75rem;
  flex-shrink: 0;
}

.kw-cookie-banner__btn {
  white-space: nowrap;
}

@media (max-width: 576px) {
  .kw-cookie-banner {
    flex-direction: column;
    align-items: stretch;
  }

  .kw-cookie-banner__actions {
    justify-content: flex-end;
  }
}

.kw-cookie-settings-trigger {
  position: fixed;
  left: 1rem;
  bottom: 1rem;
  z-index: 1070;
  padding: 0.4rem 0.75rem;
  font-size: 0.75em;
  color: var(--kw-text);
  background: var(--kw-bg);
  border: 1px solid var(--kw-border);
  border-radius: 999px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
  cursor: pointer;
}

.kw-cookie-settings-trigger:hover {
  border-color: var(--kw-accent);
  color: var(--kw-accent);
}