/* Color Palette */
:root {
  --PrimaryColor: #5f8369; /* Buttons, highlights, logo */
  --SupportingColorWhite: #f8f6f0; /* Backgrounds */
  --SupportingColorGray: #a8b2a1; /* Backgrounds */
  --SupportingColorSlate: #2e2e2e; /* Body text, footer */
  --AccentColorRose: #c27664; /* Accent buttons, sections, icons */
  --AccentColorGold: #d4b483; /* Accent buttons, sections, icons */
  --HighlightColorGrace: #afcfea; /* Quotes, testimonials, spiritual touchpoints */
}

.text-primary-custom {
  color: var(--PrimaryColor) !important;
}

.w-40 {
  width: 40%;
}

.w-60 {
  width: 60%;
}

.text-success-primary {
  color: var(--PrimaryColor);
}

.titlebar-custom {
  background-color: var(--SupportingColorWhite) !important;
  box-shadow: 0 0 3px var(--SupportingColorSlate);
  height: 3.5em;
}

.titlebar-header {
  color: var(--SupportingColorSlate);
  text-decoration: none;
}

.titlebar-logo-custom {
  height: 1.8em;
}

.titlebar-link {
  color: var(--PrimaryColor);
}

.page-content {
  background-color: rgb(235, 230, 215) !important;
  min-height: 100vh;
}

#backBtnNavReturn {
  position: absolute;
  top: 1.7rem;
  left: 1rem;
}

@media screen and (min-width: 410px) {
  .card-title-custom {
    font-size: 9pt !important;
  }

  .category-card:hover {
    transform: none !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  }
}

@media screen and (min-width: 768px) {
  .page-content {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .titlebar-custom {
    height: 2.8em;
  }

  .card {
    height: 20em !important;
  }

  .card-body-custom {
    height: 8em !important;
  }

  .category-card:hover {
    transform: none !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  }
  #backBtnNavReturn {
    position: absolute;
    top: 1.3rem;
    left: 1rem;
  }
}

.card {
  height: 18m !important;
}

.card-img-top {
  height: 12em !important;
  object-fit: cover !important;
}

.card-body-custom {
  height: 6em !important;
}

.navbar-item-custom {
  color: var(--SupportingColorSlate);
}

.card-header-custom {
  height: 4em !important;
}

.card-title-custom {
  font-size: 8pt;
  color: var(--SupportingColorSlate);
  width: max-content;
}

.card-main-custom {
  height: 2em !important;
  display: flex;
}

.card-text-custom {
  font-size: 9pt;
  color: var(--SupportingColorSlate);
  font-weight: 500;
}

.return-shopping {
  color: #5f8369;
}

.bg-light-custom {
  background-color: var(--SupportingColorWhite) !important;
}

.titlebar-return-shopping {
  color: var(--SupportingColorSlate);
}

.card-face-button {
  text-decoration: none;
  color: var(--SupportingColorSlate);
  margin: auto;
}

.card-header-custom > small {
  font-size: 6pt !important;
  color: var(--SupportingColorSlate);
}

.carousel-item {
  background-color: var(--SupportingColorWhite) !important;
}

.favourite-btn.active i {
  color: red;
}
.favourite-product {
  border: 1px solid #ccc;
  padding: 1rem;
  margin-bottom: 1rem;
}