/* Add custom CSS styles below */ 
body#app {
  background-color: #f0eee8 !important;
}
/* Target the home page only */
.index {
  /* 3. Make the first banner take full width */
  section.s-block.s-block--fixed-banner.wide-placeholder {
    margin-top: 0 !important;
    padding: 0 !important;
  }

  section.s-block.s-block--fixed-banner.wide-placeholder .container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
  }
}

@media (min-width: 1024px) {
 .index .s-user-menu-login-btn svg
  {
  fill: white;  
  }
  .index b.s-cart-summary-total,
.index b.s-cart-summary-total * {
    color: #ffffff !important;
}
  .index {
    /* 1. Adjust header to start after the advertisement */
    header.store-header {
      position: absolute;
      /* If salla-advertisement exists, it stays at the top, and we push the header down */
      top: auto; 
      left: 0;
      width: 100%;
      z-index: 100;
      background-color: transparent !important;
      border: none;
    }

    /* 2. Handle the relative positioning if salla-advertisement is present */
    salla-advertisement + header.store-header {
       /* This ensures if an ad is there, the header follows it correctly */
       top: auto;
    }

    /* 3. Style the navigation bar as before */
    div#mainnav {
      background-color: rgba(0, 0, 0, 0.1) !important;
      backdrop-filter: blur(4px);
    }

    /* 4. Ensure menu text remains white */
    div#mainnav a, 
    div#mainnav span, 
    div#mainnav .s-nav-link-title,
    div#mainnav i {
      color: #ffffff !important;
    }
  }
}
/* 1. Change top-navbar background and general text color */
.top-navbar {
  background-color: #253921 !important;
  color: #ffffff !important;
}

/* 2. Ensure all links and icons in the top-navbar are white */
.top-navbar a, 
.top-navbar span, 
.top-navbar i,
.top-navbar .s-nav-link-title {
  color: #ffffff !important;
}

/* 3. EXCLUDE the search bar: keep its text color (usually dark) */
.top-navbar input,
.top-navbar .s-search-input input,
.top-navbar .s-search-input,
.top-navbar form input {
  color: #333333 !important; /* Standard dark text for input fields */
  background-color: #ffffff !important; /* Ensure input background is white for contrast */
}
/* Use a highly specific selector to override previous rules */
body .top-navbar .s-search-input-wrapper input.s-search-input {
  background-color: rgba(245, 245, 245, 0.2) !important; /* Transparent white/gray */
  color: #ffffff !important; /* Text color */
  border: none !important;
}

/* Update the placeholder color */
body .top-navbar .s-search-input-wrapper input.s-search-input::placeholder {
  color: #ffffff !important;
  opacity: 0.8 !important;
}

/* Update the search icon color */
body .top-navbar .s-search-input-wrapper .s-search-icon-wrap i,
body .top-navbar .s-search-input-wrapper .s-search-icon-wrap svg {
  color: #ffffff !important;
}
.sub-menu ul li span {
  color: #3333 !important;
}
div#mainnav .sub-menu.w-56 a, 
div#mainnav .sub-menu.w-56 span, 
div#mainnav .sub-menu.w-56 .s-nav-link-title, 
div#mainnav .sub-menu.w-56 i {
    color: #000000 !important;
}
/* Targets only the "Add to Cart" buttons */
salla-add-product-button .s-button-element {
  background-color: #466115 !important;
  color: white !important;
  border-color: #466115 !important;
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  border-radius: 50px !important;
}

salla-add-product-button .s-button-element * {
  color: white !important;
}

/* Retaining product card center alignment and removal of description */
.s-product-card-content {
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.s-product-card-content-subtitle {
  display: none !important;
}

.s-product-card-content-footer {
  width: 100% !important;
  display: block !important;
}
/* Apply the "bigger and centered" layout ONLY on desktop */
@media (min-width: 769px) {
  main#main-content > section.s-block.s-block--fixed-banner.wide-placeholder:nth-child(5)
  , main#main-content > section.s-block.s-block--fixed-banner.wide-placeholder:nth-child(7)
  {
    width: 98% !important;
    max-width: 1600px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
  }
}

/* Reset for mobile */
@media (max-width: 768px) {
  main#main-content > section.s-block.s-block--fixed-banner.wide-placeholder:nth-child(5)
  , main#main-content > section.s-block.s-block--fixed-banner.wide-placeholder:nth-child(7)
  {
    width: auto !important;
    max-width: none !important;
    margin-left: unset !important;
    margin-right: unset !important;
  }
}
.index .s-product-card-content-sub {
  justify-content: center !important;
}
/* Center product prices in all cards */
.index .s-product-card-content-sub {
  justify-content: center !important;
}
/* Center product prices in all cards */
.index .s-product-card-content-sub {
  justify-content: center !important;
}

/* Background goes full width */
section.s-block--testimonials,
section.s-block--features {
  background-color: #30442d !important;
  width: 100% !important;
  max-width: none !important;
  display: block !important;
  padding: 40px 0 !important;
  margin: 0 !important;
}

/* Content stays centered at 1280px */
.s-centered-wrapper {
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
  width: 100% !important;
}
.s-reviews-header-wrapper{
  color: white;
}
.s-reviews-display-all-icon svg{
  fill: white;
  margin-left: 8px;
}
.index .s-block--features__item{
  background: #f0eee8;
}
footer.store-footer,
.store-footer__inner {
  background-color: #1e280c !important;
}
/* Hide the original text */
a.flex.items-center.m-0 h3 {
  display: none !important;
}

/* Style the new logo */
.custom-footer-logo {
  max-height: 50px; /* Adjust the size here */
  width: auto;
  display: block;
}
.index footer.store-footer{
  margin-top: 0;
}