/* ============================================================
   NUTS PREMIUM - 07-utilities.css
   Utilitários, Loja, Breadcrumb e Responsividade
   ============================================================ */

/* ============================================================
   UTILITÁRIOS
   ============================================================ */
.np-divider { border: none; height: 1px; background: var(--np-light-grey); margin: var(--np-spacing-lg) 0; }

.np-tag {
  display: inline-block; padding: 4px 12px; background: var(--np-off-white);
  border: 1px solid var(--np-secondary); border-radius: var(--np-radius-pill);
  font-family: var(--np-font-body); font-size: var(--np-fs-xs);
  font-weight: var(--np-fw-medium); color: var(--np-secondary);
}

.np-text-gold  { color: var(--np-secondary) !important; }
.np-text-green { color: var(--np-accent) !important; }
.np-bg-gold    { background-color: var(--np-secondary) !important; }
.np-bg-dark    { background-color: var(--np-primary) !important; }

/* ============================================================
   LOJA - SIDEBAR
   ============================================================ */
.np-shop-sidebar {
  background: var(--np-white); border-radius: var(--np-radius-xl);
  padding: var(--np-spacing-lg); box-shadow: var(--np-shadow-sm);
}
.np-filter-title {
  font-family: var(--np-font-heading); font-size: var(--np-fs-base);
  font-weight: var(--np-fw-bold); color: var(--np-primary);
  margin-bottom: var(--np-spacing-md); padding-bottom: var(--np-spacing-sm);
  border-bottom: 2px solid var(--np-secondary);
}
.np-filter-list { list-style: none; padding: 0; margin: 0; }
.np-filter-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 0; border-bottom: 1px solid var(--np-light-grey);
  font-size: var(--np-fs-sm); font-family: var(--np-font-text);
  cursor: pointer; transition: var(--np-transition);
}
.np-filter-item:hover { color: var(--np-secondary); }
.np-filter-count {
  background: var(--np-off-white); color: var(--np-grey);
  font-size: var(--np-fs-xs); padding: 2px 8px; border-radius: var(--np-radius-pill);
}

/* ============================================================
   BREADCRUMB
   ============================================================ */
.np-breadcrumb {
  padding: var(--np-spacing-md) 0;
  background: var(--np-off-white);
  border-bottom: 1px solid var(--np-light-grey);
}
.np-breadcrumb__list {
  display: flex; align-items: center; gap: 8px;
  list-style: none; margin: 0; padding: 0;
  font-size: var(--np-fs-sm); font-family: var(--np-font-text);
}
.np-breadcrumb__list a        { color: var(--np-secondary); }
.np-breadcrumb__list .separator { color: var(--np-grey); }
.np-breadcrumb__list .current   { color: var(--np-grey); }

/* ============================================================
   RESPONSIVIDADE
   ============================================================ */
@media (max-width: 991px) {
  .np-hero-swiper__caption { width: 60%; padding: var(--np-spacing-md) var(--np-spacing-lg); }
  .np-hero-swiper__title { font-size: var(--np-fs-xl); }
  .np-search { max-width: 100%; order: 3; width: 100%; }
  .np-header__inner { flex-wrap: wrap; }
  .np-header__actions { gap: var(--np-spacing-md); margin-left: auto; }
  .flex-qtd-compra { display: block !important; }
  #btn-comprar { margin: 20px 0; font-size: 12px; }
  .np-product-card__price-old { opacity: .5; }
  .np-product-card__price-wrap { display: flex; flex-direction: column-reverse !important; }
  .np-product-card__add-btn { font-size: 12px; }
}

@media (max-width: 767px) {
  :root {
    --np-fs-hero: 2rem;
    --np-fs-xxl: 1.75rem;
    --np-fs-xl: 1.5rem;
    --np-spacing-xxl: 40px;
  }
  .np-hero { height: auto !important; }
  .np-hero-swiper__caption { width: 80%; left: 5%; padding: var(--np-spacing-md); }
  .np-hero-swiper__title { font-size: 1.3rem; }
  .np-hero-swiper__subtitle { display: none; }
  .np-hero-swiper__prev,
  .np-hero-swiper__next { display: none !important; }
  .np-footer__payment-icons { justify-content: center; }
  .np-newsletter__form {
    flex-direction: column; border-radius: var(--np-radius-md);
    overflow: visible; border: none; gap: var(--np-spacing-sm);
  }
  .np-newsletter__input { border-radius: var(--np-radius-md); border: 2px solid var(--np-secondary); }
  .np-newsletter__btn   { border-radius: var(--np-radius-md); width: 100%; padding: 14px; }
}