/* eco Grade — tokens extras (Bootstrap, links, toast) após assets base */
:root {
  --font-primary: var(--font-poppins), system-ui, sans-serif;
  --font-secondary: var(--font-league-spartan), system-ui, sans-serif;
  --bs-primary: #a2c523;
  --bs-primary-rgb: 162, 197, 35;
  --bs-secondary: #283655;
  --bs-secondary-rgb: 40, 54, 85;
  --bs-success: #7a9e2a;
  --bs-warning: #ee693f;
  --bs-info: #283655;
  --bs-link-color: #a2c523;
  --bs-link-hover-color: #8aad1c;
}

.btn-primary {
  --bs-btn-bg: #a2c523;
  --bs-btn-border-color: #a2c523;
  --bs-btn-hover-bg: #8aad1c;
  --bs-btn-hover-border-color: #8aad1c;
  --bs-btn-active-bg: #7a9e2a;
  --bs-btn-active-border-color: #7a9e2a;
  --bs-btn-disabled-bg: #a2c523;
  --bs-btn-disabled-border-color: #a2c523;
}

.btn-outline-primary {
  --bs-btn-color: #a2c523;
  --bs-btn-border-color: #a2c523;
  --bs-btn-hover-bg: #a2c523;
  --bs-btn-hover-border-color: #a2c523;
  --bs-btn-active-bg: #8aad1c;
  --bs-btn-active-border-color: #8aad1c;
}

.Toastify__progress-bar {
  background: #a2c523;
}

.Toastify__toast-icon--success svg {
  fill: #a2c523;
}

body {
  font-family: var(--font-poppins), system-ui, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.banner-one-inner .title,
.banner-two-inner .title,
.banner-three .title,
.banner-four .title,
.banner-five .title,
.footer-title,
.title,
.subtitle {
  font-family: var(--font-league-spartan), system-ui, sans-serif;
}

.font-garet {
  font-family: var(--font-garet), system-ui, sans-serif;
}

/* Logo eco — um pouco menor só na página principal (.demo-one em page.tsx) */
.demo-one .rts-header-one-area-one .logo-area img.logo {
  max-height: 60px;
  max-width: 200px;
  width: auto;
  height: auto;
  object-fit: contain;
}

/* Desktop search row (HeaderOne): wishlist beside marketplace search (≥992px only — row hidden below) */
.search-header-area-main
  .logo-search-category-wrapper
  .category-search-wrapper {
  flex: 1;
  min-width: 0;
}

.search-header-area-main
  .logo-search-category-wrapper
  .ec-header-desktop-actions {
  flex-shrink: 0;
}

/*
 * Narrow header bar: theme hides the inline search <992px so only the magnifying-glass
 * control shows (matches real devices). Do not force the inline field back on — DevTools
 * mobile emulation would then show both the icon and the input.
 */
@media only screen and (max-width: 991px) {
  .rts-header-nav-area-one
    .logo-search-category-wrapper.after-md-device-header {
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
  }

  .rts-header-nav-area-one
    .logo-search-category-wrapper.after-md-device-header
    .logo-area
    img.logo {
    max-height: 44px;
    max-width: 110px;
    width: auto;
    height: auto;
    object-fit: contain;
  }

  .rts-header-nav-area-one
    .logo-search-category-wrapper.after-md-device-header
    .main-wrapper-action-2 {
    flex-shrink: 0;
    gap: 6px;
  }

  .rts-header-nav-area-one
    .logo-search-category-wrapper.after-md-device-header
    .accont-wishlist-cart-area-header {
    gap: 6px;
  }
}

/* Top promo bar — avoid squeezed two-column text on narrow screens */
@media only screen and (max-width: 575px) {
  .header-top-area .bwtween-area-header-top {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 8px;
  }

  .header-top-area .bwtween-area-header-top p {
    font-size: 12px;
    line-height: 1.35;
  }
}

/* Marketplace toolbar — stack sooner than theme’s 575px breakpoint */
@media only screen and (max-width: 767px) {
  .filter-select-area .top-filter {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
}

/* Marketplace list cards — image + metadata column */
@media only screen and (max-width: 767px) {
  .product-area-wrapper-shopgrid-list.with-list
    .single-shopping-card-one.discount-offer
    .thumbnail-preview {
    max-width: 100%;
    width: 100%;
  }

  .product-area-wrapper-shopgrid-list.with-list .body-content .title-area-left {
    flex-basis: 100%;
  }

  .product-area-wrapper-shopgrid-list.with-list .body-content {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
}