@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700;900&display=swap');

/* ══════════════════════════════════════════
   DESKTOP — chowamy pasek
   ══════════════════════════════════════════ */
.dr-bottom-nav { display: none; }

/* ══════════════════════════════════════════
   MOBILE
   ══════════════════════════════════════════ */
@media (max-width: 767px) {

  /* Chowaj oryginalne menu Elementora */
  .elementor-nav-menu--main,
  .elementor-widget-nav-menu .elementor-nav-menu,
  .elementor-menu-toggle { display: none !important; }

  /* Chowaj panel mini-koszyka Elementora — tylko konkretne klasy, bez wildcard */
  .elementor-menu-cart__container,
  .elementor-menu-cart__wrapper,
  .elementor-menu-cart__overlay { display: none !important; }

  /* Miejsce na pasek */
  body { padding-bottom: 62px; }

  /* ── Pasek ── */
  .dr-bottom-nav {
    display: flex;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 99999;
    background: #fff;
    border-top: 1px solid rgba(139,26,16,0.10);
    align-items: stretch;
    box-shadow: 0 -2px 16px rgba(26,10,6,0.07);
  }

  /* ── Zakładka ── */
  .dr-bn-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 7px 2px 8px;
    position: relative;
    border: none;
    background: transparent;
    text-decoration: none !important;
    font-family: 'Roboto', system-ui, sans-serif;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
  }
  .dr-bn-item:active { background: rgba(139,26,16,0.04); }

  .dr-bn-item:not(.dr-bn-item--main).dr-active::before {
    content: '';
    position: absolute;
    top: 0; left: 20%; right: 20%;
    height: 2px;
    border-radius: 0 0 3px 3px;
    background: var(--dr-nav-color, #8b1a10);
  }

  /* ── Ikona ── */
  .dr-bn-icon {
    width: 22px; height: 22px;
    position: relative;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
  }
  .dr-bn-icon svg {
    width: 20px; height: 20px;
    fill: none;
    stroke: #c5b5ae;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .dr-bn-item.dr-active .dr-bn-icon svg { stroke: var(--dr-nav-color, #8b1a10); }

  /* ── Label ── */
  .dr-bn-label-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
  }
  .dr-bn-label {
    font-size: 9px;
    font-weight: 700;
    color: #c5b5ae;
    line-height: 1;
    white-space: nowrap;
  }
  .dr-bn-item.dr-active .dr-bn-label { color: var(--dr-nav-color, #8b1a10); }

  /* ── Koszyk — kwota ── */
  .dr-bn-item--cart { flex: 1.25; }
  .dr-bn-price {
    font-size: 8px;
    font-weight: 900;
    color: var(--dr-nav-color, #8b1a10);
    line-height: 1;
    white-space: nowrap;
  }

  /* ── Środkowy przycisk ── */
  .dr-bn-item--main { flex: 1.1; padding-top: 0; padding-bottom: 8px; }
  .dr-bn-item--main::before { display: none !important; }
  .dr-bn-item--main .dr-bn-icon {
    width: 44px; height: 44px;
    border-radius: 14px;
    background: var(--dr-nav-color, #8b1a10);
    margin-top: -12px;
    box-shadow: 0 4px 14px rgba(139,26,16,0.35);
  }
  .dr-bn-item--main .dr-bn-icon svg { width: 20px; height: 20px; stroke: #fff !important; }
  .dr-bn-item--main:active .dr-bn-icon { transform: scale(0.92); }
  .dr-bn-item--main .dr-bn-label,
  .dr-bn-item--main.dr-active .dr-bn-label { color: #c5b5ae !important; font-weight: 400 !important; margin-top: 2px; }

  /* ── Badge ── */
  .dr-bn-badge {
    position: absolute;
    top: -3px; right: -5px;
    min-width: 15px; height: 15px;
    border-radius: 8px;
    background: var(--dr-nav-color, #8b1a10);
    color: #fff;
    font-size: 8px; font-weight: 900;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid #fff;
    padding: 0 2px;
    line-height: 1;
    opacity: 0;
    transform: scale(0);
    pointer-events: none;
  }
  .dr-bn-badge.visible { opacity: 1; transform: scale(1); }

  /* ── Separator ── */
  .dr-bn-sep {
    width: 1px;
    background: rgba(139,26,16,0.07);
    margin: 8px 0;
    flex-shrink: 0;
  }
}