/* ============================================================
   ForNails — Gratisy od progów koszyka (fn-gift-threshold)
   Zakres: pasek postępu w koszyku (/koszyk/) i mini-koszyku (drawer),
   plus oznaczenie pozycji-gratisu w obu miejscach.
   Paleta identyczna z resztą serwisu (fn-design-cart.css / brand.css).

   Wersja 2026-07-30: obsługa TRZECH progów (lista progów pod paskiem,
   znaczniki progów na skali).

   ZASADA: zero animacji i zero przejść na opacity/visibility — na tej stronie
   zewnętrzny skrypt w kontenerze GTM klienta potrafi zamrozić przejścia CSS
   w stanie startowym (historia projektu: toast, mini-koszyk, menu mobilne).
   Wszystkie stany paska są renderowane serwerowo i statycznie.
   ============================================================ */

:root{
  --fng-primary: #A34B65;
  --fng-secondary: #2E2321;
  --fng-accent: #C9A15A;
  --fng-bg-soft: #F3E9E5;
  --fng-border-light: #E7DAD4;
  --fng-success: #6B8F71;
  --fng-muted: #756A65;
  --fng-font-body: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ------------------------------------------------------------
   1. Pasek postępu — wspólny szkielet (koszyk + mini-koszyk)
   ------------------------------------------------------------ */
.fn-gift-progress-bar{
  background: #fff;
  border: 1px solid var(--fng-border-light);
  padding: 14px 18px;
  font-family: var(--fng-font-body);
}

.fn-gift-progress-bar--cart{
  margin-bottom: 24px;
}

.fn-gift-progress-bar--mini_cart{
  margin: 0 0 12px;
  padding: 10px 14px;
}

.fn-gift-progress-bar--empty{
  display: none;
}

.fn-gift-progress-msg p{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 10px;
  font-size: 13.5px;
  line-height: 1.4;
  color: var(--fng-secondary);
}

.fn-gift-progress-bar--mini_cart .fn-gift-progress-msg p{
  font-size: 12.5px;
  margin-bottom: 8px;
}

.fn-gift-progress-bar.is-unlocked .fn-gift-progress-msg p{
  color: var(--fng-success);
  font-weight: 500;
}

.fn-gift-progress-msg strong{
  color: var(--fng-primary);
  font-weight: 600;
}

.fn-gift-next-name{
  font-weight: 600;
  color: var(--fng-primary);
}

.fn-gift-emoji{
  font-size: 15px;
  line-height: 1;
  flex-shrink: 0;
}

/* ------------------------------------------------------------
   2. Skala paska + znaczniki progów pośrednich
   ------------------------------------------------------------ */
.fn-gift-progress-area{
  position: relative;          /* punkt odniesienia dla znaczników .fn-gift-tick */
  height: 8px;
  background: var(--fng-bg-soft);
  overflow: hidden;
  border-radius: 0;
}

.fn-gift-progress-fill{
  height: 100%;
  background-color: var(--fng-accent);
  /* celowo bez transition — patrz nagłówek pliku */
}

.fn-gift-progress-bar.is-unlocked .fn-gift-progress-fill{
  background-color: var(--fng-success);
}

/* Pionowa kreska w miejscu progu pośredniego (100 zł, 200 zł...). Ostatni próg leży na końcu
   paska, więc PHP go nie rysuje. */
.fn-gift-tick{
  position: absolute;
  top: 0;
  width: 2px;
  height: 100%;
  margin-left: -1px;
  background: #fff;
}

.fn-gift-tick.is-passed{
  background: rgba(255,255,255,.65);
}

/* ------------------------------------------------------------
   3. Lista progów pod paskiem (czytelna przy trzech progach)
   ------------------------------------------------------------ */
.fn-gift-tiers{
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
}

.fn-gift-tier{
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 4px 0;
  font-size: 12.5px;
  line-height: 1.35;
  color: var(--fng-secondary);
  border-top: 1px solid #F1E7E2;
}

.fn-gift-tier:first-child{
  border-top: 0;
}

.fn-gift-tier-state{
  flex: 0 0 auto;
  width: 14px;
  font-weight: 700;
  color: var(--fng-muted);
}

.fn-gift-tier.is-got .fn-gift-tier-state{
  color: var(--fng-success);
}

/* Próg osiągnięty, ale gratis nieprzyznany — wystepuje TYLKO przy FN_GIFT_STACKING = false. */
.fn-gift-tier.is-superseded{
  color: var(--fng-muted);
}
.fn-gift-tier.is-superseded .fn-gift-tier-amount{
  color: var(--fng-muted);
}

.fn-gift-tier-amount{
  flex: 0 0 auto;
  font-weight: 600;
  color: var(--fng-primary);
  min-width: 62px;
}

.fn-gift-tier-name{
  flex: 1 1 140px;
  min-width: 0;
}

.fn-gift-tier-note{
  flex: 0 0 auto;
  margin-left: auto;
  font-size: 11.5px;
  color: var(--fng-muted);
  white-space: nowrap;
}

.fn-gift-tier.is-got .fn-gift-tier-note{
  color: var(--fng-success);
  font-weight: 600;
}

/* Kwoty renderowane przez wc_price() dziedziczą kolor/rozmiar z rodzica. */
.fn-gift-tier .amount,
.fn-gift-tier-note .amount{
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}

/* Mini-koszyk jest wąski — lista bez wcięć, drobniejsza. */
.fn-gift-progress-bar--mini_cart .fn-gift-tiers{
  margin-top: 8px;
}

.fn-gift-progress-bar--mini_cart .fn-gift-tier{
  font-size: 11.5px;
  padding: 3px 0;
}

.fn-gift-progress-bar--mini_cart .fn-gift-tier-name{
  flex-basis: 100%;
  padding-left: 20px;
  color: var(--fng-muted);
}

.fn-gift-progress-bar--mini_cart .fn-gift-tier-note{
  font-size: 11px;
}

/* ------------------------------------------------------------
   4. Oznaczenie pozycji-gratisu na /koszyk/ (WooCommerce Blocks Cart)
      Znacznik wstrzykiwany filtrem woocommerce_get_item_data (fn-gift-marker).
   ------------------------------------------------------------ */
.fn-gift-marker .wc-block-components-product-details__name{
  display: none;
}
.fn-gift-marker .wc-block-components-product-details__value{
  font-size: 11px;
  font-weight: 600;
  color: var(--fng-success);
}

/* Ukrycie przycisku "Usuń" dla wiersza-gratisu na /koszyk/ (przeglądarki ze wsparciem :has(),
   praktycznie wszystkie na dzień wdrożenia). Serwerowa synchronizacja (fn-gift-threshold.php,
   FN_Gift_Threshold::sync()) jest niezależną, ostateczną warstwą zabezpieczenia — nawet gdyby
   klient usunął gratis mimo ukrytego przycisku (np. bardzo stara przeglądarka bez :has()), wraca
   on automatycznie przy najbliższym przeliczeniu koszyka, dopóki próg jest spełniony. */
.wc-block-cart-item__wrap:has(.fn-gift-marker) .wc-block-cart-item__remove-link{
  display: none !important;
}
.wc-block-cart-item__wrap:has(.fn-gift-marker) a.wc-block-components-product-name{
  color: var(--fng-primary) !important;
}

/* ------------------------------------------------------------
   5. Mini-koszyk — plakietka zamiast linku "usuń" (×) dla gratisu
      (woocommerce_cart_item_remove_link, fn-gift-threshold.php)
   ------------------------------------------------------------ */
.fn-gift-locked{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  opacity: .85;
  cursor: default;
}

/* ------------------------------------------------------------
   6. Mobile
   ------------------------------------------------------------ */
@media (max-width: 600px){
  .fn-gift-progress-bar{
    padding: 12px 14px;
  }
  .fn-gift-tier-name{
    flex-basis: 100%;
    padding-left: 20px;
    color: var(--fng-muted);
  }
  .fn-gift-tier-note{
    margin-left: 0;
    padding-left: 20px;
  }
}

/* ============================================================
   KONIEC fn-gift-threshold.css
   ============================================================ */
