/* =========================================================
   KOMIKSAN STEP 13 REPLACE
   Aktivní kolečka kroků košíku/objednávky: Komiksan růžová + bílý text
   Soubor: komiksan-step13-replace-cart-step-circles-pink-white.css
   FTP: /upload/komiksan-step13-replace-cart-step-circles-pink-white.css
   WEB: /user/documents/upload/komiksan-step13-replace-cart-step-circles-pink-white.css

   Nahrazuje starý soubor:
   komiksan-step13-cart-remove-icon-clean-black.css

   Důležité:
   - Řeší jen aktivní kolečka/čísla kroků košíku.
   - Neřeší tlačítka.
   - Nesahá na mazací křížek / trash ikonu produktu.
   - Platí pro desktop i mobil.
   ========================================================= */

:root {
  --ks-step13-pink: #FF00D8;
  --ks-step13-white: #FFFFFF;
}

/* Aktivní číslované kolečko v košíku / objednávce */
.cart-steps .active .step-number,
.cart-steps .active .number,
.cart-steps .active .circle,
.cart-steps li.active > span:first-child,
.cart-steps li.active > a:first-child,
.cart-header .active .step-number,
.cart-header .active .number,
.cart-header .active .circle,
.cart-header .step.active .step-number,
.cart-header .step.active .number,
.cart-header .step.active .circle,
.checkout-steps .active .step-number,
.checkout-steps .active .number,
.checkout-steps .active .circle,
.checkout-steps li.active > span:first-child,
.checkout-steps li.active > a:first-child,
.ordering-process .cart-steps .active .step-number,
.ordering-process .cart-steps .active .number,
.ordering-process .cart-steps .active .circle,
.ordering-process .cart-steps li.active > span:first-child,
.ordering-process .cart-steps li.active > a:first-child,
.ordering-process .steps .active .step-number,
.ordering-process .steps .active .number,
.ordering-process .steps .active .circle,
.ordering-process .steps li.active > span:first-child {
  background: var(--ks-step13-pink) !important;
  background-color: var(--ks-step13-pink) !important;
  border-color: var(--ks-step13-pink) !important;
  color: var(--ks-step13-white) !important;
  fill: var(--ks-step13-white) !important;
  stroke: var(--ks-step13-white) !important;
  box-shadow: none !important;
}

/* Číslo/text uvnitř aktivního kolečka */
.cart-steps .active .step-number *,
.cart-steps .active .number *,
.cart-steps .active .circle *,
.cart-steps li.active > span:first-child *,
.cart-steps li.active > a:first-child *,
.cart-header .active .step-number *,
.cart-header .active .number *,
.cart-header .active .circle *,
.checkout-steps .active .step-number *,
.checkout-steps .active .number *,
.checkout-steps .active .circle *,
.checkout-steps li.active > span:first-child *,
.checkout-steps li.active > a:first-child *,
.ordering-process .cart-steps .active .step-number *,
.ordering-process .cart-steps .active .number *,
.ordering-process .cart-steps .active .circle *,
.ordering-process .steps .active .step-number *,
.ordering-process .steps .active .number *,
.ordering-process .steps .active .circle * {
  color: var(--ks-step13-white) !important;
  fill: var(--ks-step13-white) !important;
  stroke: var(--ks-step13-white) !important;
}

/* Pojistka pro Shoptet varianty, kde je aktivní krok přímo kulatý element */
.cart-steps .active,
.checkout-steps .active,
.ordering-process .cart-steps .active,
.ordering-process .steps .active {
  --color-primary: var(--ks-step13-pink);
}