[data-bs-theme=light] {
   --bs-primary: #01645b;
   --bs-primary-rgb: 1, 100, 91;
   --bs-primary-subtle: #01534c;
   --banner-bg: #58595b;
   --card-bg: #e6e7e8;
   --card-color: #262626;
   --navbar-bg: #01645b;
}



[data-bs-theme=dark] {
   --bs-primary: #01645b;
   --bs-primary-rgb: 1, 100, 91;
   --bs-primary-subtle: #01534c;
   --banner-bg: #404041;
   --card-bg: #333333;
   --card-color: #e6e7e8;
   --navbar-bg: #1a1a1a;
}

.btn-primary {
   --bs-btn-bg: var(--bs-primary);
   --bs-btn-border-color: var(--bs-primary);
   --bs-btn-hover-bg: var(--bs-primary-subtle);
   --bs-btn-hover-border-color: var(--bs-primary-subtle);
   --bs-btn-active-bg: var(--bs-primary-subtle);
   --bs-btn-active-border-color: var(--bs-primary-subtle);
   --bs-btn-disabled-bg: var(--bs-primary);
   --bs-btn-disabled-border-color: var(--bs-primary);
}

a {
   color: currentColor;
}

.hero-banner,
.hero-banner .carousel-item {
   background-color: var(--banner-bg);
}

.card {
   background-color: var(--card-bg);
   color: var(--card-color);
   border-radius: 0;
   border-width: 0;
   padding: 1.5rem;
}

nav .active {
   font-weight: bold !important;
   font-family: 'HelveticaNeue Bold';
}

.inset-article {
   background-image: linear-gradient(to top, var(--bs-body-bg), transparent);
}

nav[aria-label="main-navigation"] {
   background-color: var(--navbar-bg);
}

/* Button Navigation Styles */
.btn-nav-signin,
.btn-nav-register {
   display: inline-block;
   padding: 0.4rem 1.2rem;
   text-decoration: none;
   font-size: 0.9rem;
   font-weight: 500;
   transition: all 0.3s ease;
   border-radius: 2px;
}

.btn-nav-signin {
   color: #ffffff;
   background-color: transparent;
   border: 1px solid rgba(255, 255, 255, 0.3);
}

.btn-nav-signin:hover {
   background-color: #1a1a1a;
   border-color: #1a1a1a;
   color: #ffffff;
}

.btn-nav-register {
   color: #ffffff;
   background-color: transparent;
   border: 1px solid rgba(255, 255, 255, 0.3);
}

.btn-nav-register:hover {
   background-color: #1a1a1a;
   border-color: #1a1a1a;
   color: #ffffff;
}

/* Navigation Divider */
.nav-divider {
   position: relative;
   padding-right: 1.5rem;
   margin-right: 1.5rem;
}

.nav-divider::after {
   content: '';
   position: absolute;
   right: -0.5rem;
   top: 50%;
   transform: translateY(-50%);
   height: 30px;
   width: 1px;
   background-color: #fcfafaee;
}

.fs-reset {
   font-size: inherit;
}

body {
   min-height: 100dvh;
   display: flex;
   flex-direction: column;
}

body>main {
   flex-grow: 1;
}

body>footer {
   background-color: #333333;
   color: white;
}

body>footer .copyright {
   background-color: #1a1a1a;
}

nav[aria-label="Social media navigation"]>a {
   width: 32px;
   height: 32px;
}

nav[aria-label="Social media navigation"]>a>svg {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%) scale(1);
}


@media (max-width: 575.98px) {

   html,
   body {
      font-size: small;
   }
}


@media (min-width: 992px) {
   body>footer address {
      max-width: 14.5em;
   }
}

.minimize-text-3 {
   display: -webkit-box;
   -webkit-line-clamp: 5;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
}

.form-check {
   display: flex;
   flex-wrap: nowrap;
   align-items: center;
   text-transform: capitalize;
}

.form-check-input:checked {
   background-color: #01534c;
   border-color: #01534c;
}

.form-check-input[type=radio] {
   border-radius: 0%;
}

.form-check-input[type=checkbox] {
   border-radius: 0%;
}

/* Cart Page Styles */
.bg-primary {
   background-color: var(--bs-primary) !important;
}

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

.cart-item-img {
   width: 80px;
   object-fit: contain;
}

.fs-7 {
   font-size: 0.75rem;
}

.fs-8 {
   font-size: 0.65rem;
}

.quantity-control {
   width: 100px;
}