/* ============================================
   BREADCRUMB - 1 linia domyslnie, stack pionowy jesli sie nie miesci

   UWAGA: selektor .woocommerce-breadcrumb to domyslna klasa WooCommerce
   (wrap_before w funkcji woocommerce_breadcrumb()). Jesli Basel renderuje
   breadcrumb w inny sposob (inna klasa/ID w tym konkretnym theme), ten
   CSS trzeba bedzie przypisac do wlasciwego selektora - daj znac jaki
   jest faktyczny wrapper (DevTools -> zaznacz pasek z breadcrumbem ->
   sprawdz klase), to poprawie w 2 minuty.
============================================ */

.woocommerce-breadcrumb {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.woocommerce-breadcrumb a,
.woocommerce-breadcrumb > * {
    white-space: nowrap;
}

/* Klasa dodawana przez JS gdy tresc nie miesci sie w 1 linii */
.woocommerce-breadcrumb.ntt-breadcrumb-stacked {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    row-gap: 4px;
}

.woocommerce-breadcrumb.ntt-breadcrumb-stacked a,
.woocommerce-breadcrumb.ntt-breadcrumb-stacked > * {
    white-space: normal;
}