/* ============================================================
   FONITEX — COMPONENTS
   Homepage sections, product cards, badges, slider, modules
   ============================================================ */

/* === CONTAINER WIDTH === */
@media (min-width: 1280px) {
  .container { max-width: 1240px; }
}

/* === BODY / MAIN AREA === */
body { background: var(--fx-bg-alt); }
#main, #wrapper, #content-wrapper { background: transparent; }
.page-home { background: transparent; padding-top: 16px; }

/* ============================================================
   SECTION TITLES (.products-section-title, h2.h2, etc.)
   ============================================================ */
.products-section-title,
h2.products-section-title,
.featured-products .h2,
.featured-products h2 {
  font-size: 22px !important;
  font-weight: var(--fx-fw-bold) !important;
  color: var(--fx-text) !important;
  text-align: left !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  margin: 0 0 24px !important;
  padding-bottom: 10px;
  position: relative;
  border: 0 !important;
  display: block;
}
.products-section-title::after,
h2.products-section-title::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 80px;
  height: 3px;
  background: var(--fx-primary);
  border-radius: 2px;
}

/* ============================================================
   SLIDER (Bootstrap carousel from ps_imageslider)
   ============================================================ */
#carousel,
.carousel {
  border-radius: var(--fx-radius-lg);
  overflow: hidden;
  margin-bottom: 32px;
  box-shadow: var(--fx-shadow);
  background: #fff;
}
#carousel .carousel-item img,
.carousel .carousel-item img {
  width: 100%;
  height: auto;
  display: block;
}
#carousel .carousel-item figure,
.carousel .carousel-item figure {
  margin: 0;
  position: relative;
}
#carousel .carousel-item figcaption.caption,
.carousel .carousel-item figcaption.caption {
  position: absolute;
  bottom: 24px;
  left: 24px;
  right: 24px;
  background: rgba(255,255,255,.92);
  padding: 16px 20px;
  border-radius: var(--fx-radius);
  max-width: 60%;
}
#carousel .carousel-item .caption h2,
.carousel .carousel-item .caption h2 {
  font-size: 22px;
  margin: 0 0 6px;
  color: var(--fx-text);
  text-transform: none;
  font-weight: var(--fx-fw-bold);
}
#carousel .carousel-item .caption h3 {
  font-size: 13px;
  color: var(--fx-primary);
  text-transform: uppercase;
  letter-spacing: .5px;
  margin: 0 0 6px;
}
#carousel .carousel-item .caption p {
  font-size: 13px;
  color: var(--fx-text-muted);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (max-width: 767.98px) {
  #carousel .carousel-item figcaption.caption,
  .carousel .carousel-item figcaption.caption {
    position: static;
    max-width: 100%;
    margin: 0;
    border-radius: 0;
  }
}
#carousel .carousel-indicators li,
.carousel .carousel-indicators li {
  background: rgba(255,255,255,.6);
  border: 2px solid #fff;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin: 0 4px;
}
#carousel .carousel-indicators li.active,
.carousel .carousel-indicators li.active {
  background: var(--fx-accent);
  border-color: var(--fx-accent);
}
#carousel .carousel-control-prev,
#carousel .carousel-control-next {
  width: 44px;
  background: rgba(0,0,0,.2);
  border-radius: 0;
  opacity: .9;
}

/* ============================================================
   FEATURED / SPECIALS / NEW / BESTSELLERS SECTION
   ============================================================ */
.featured-products,
section.featured-products {
  background: #fff;
  padding: 24px 16px 28px;
  border-radius: var(--fx-radius-lg);
  margin-bottom: 24px;
  box-shadow: var(--fx-shadow-sm);
}

.featured-products .all-product-link {
  display: inline-block;
  margin-top: 16px;
  padding: 10px 22px;
  border: 2px solid var(--fx-primary);
  color: var(--fx-primary);
  border-radius: var(--fx-radius-pill);
  font-weight: var(--fx-fw-medium);
  font-size: 13px;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .3px;
  transition: var(--fx-transition);
}
.featured-products .all-product-link:hover,
.featured-products .all-product-link:focus {
  background: var(--fx-primary);
  color: #fff;
  text-decoration: none;
}

/* ============================================================
   PRODUCT MINIATURE
   ============================================================ */
.products .product-miniature,
.product-miniature,
article.product-miniature,
.js-product .product-miniature {
  background: #fff;
  border: 1px solid var(--fx-border-light);
  border-radius: var(--fx-radius);
  padding: 0;
  transition: var(--fx-transition);
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  margin-bottom: 16px;
}

.products .product-miniature:hover,
.product-miniature:hover,
article.product-miniature:hover,
.js-product .product-miniature:hover {
  border-color: var(--fx-primary);
  box-shadow: var(--fx-shadow);
  transform: translateY(-2px);
}

.product-miniature .thumbnail-container,
.product-miniature .product-thumbnail {
  position: relative;
  overflow: hidden;
  background: #fff;
  width: 100%;
  height: auto;
  display: block;
}
.product-miniature .thumbnail-top {
  position: relative;
  overflow: hidden;
  background: var(--fx-bg-alt);
}
.product-miniature .thumbnail-container img,
.product-miniature .product-thumbnail img,
.product-miniature .thumbnail-top img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform .3s ease;
}
.product-miniature:hover .thumbnail-container img,
.product-miniature:hover .product-thumbnail img,
.product-miniature:hover .thumbnail-top img {
  transform: scale(1.04);
}

/* === PRODUCT FLAGS / BADGES === */
.product-flags,
ul.product-flags {
  position: absolute;
  top: 8px;
  left: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  z-index: 2;
}
.product-flags li,
.product-flags .product-flag {
  display: inline-block;
  padding: 4px 12px;
  border-radius: var(--fx-radius-pill);
  font-size: 11px;
  font-weight: var(--fx-fw-bold);
  text-transform: uppercase;
  letter-spacing: .3px;
  color: #fff;
  background: var(--fx-primary);
  border: 0;
}
.product-flags .product-flag.discount,
.product-flags .product-flag.discount-percentage,
.product-flags .product-flag.discount-amount,
.product-flags .product-flag.on-sale {
  background: var(--fx-accent);
}
.product-flags .product-flag.new,
.product-flags .new {
  background: var(--fx-primary);
}
.product-flags .product-flag.online-only {
  background: var(--fx-info);
}

/* === HIGHLIGHTED INFORMATIONS (quick view, etc.) === */
.product-miniature .highlighted-informations {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(255,255,255,.95);
  padding: 8px 12px;
  text-align: center;
  transform: translateY(100%);
  transition: transform .25s ease;
  z-index: 1;
  border-top: 1px solid var(--fx-border-light);
}
.product-miniature:hover .highlighted-informations {
  transform: translateY(0);
}
.product-miniature .highlighted-informations a.quick-view,
.product-miniature .quick-view {
  color: var(--fx-primary);
  font-size: 13px;
  font-weight: var(--fx-fw-medium);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.product-miniature .highlighted-informations a.quick-view:hover {
  color: var(--fx-primary-dark);
}

/* === PRODUCT INFO AREA === */
.product-miniature .product-description {
  padding: 12px;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.product-miniature .product-title,
.product-miniature h2.h3.product-title,
.product-miniature h3.product-title,
.product-miniature .h3.product-title {
  font-size: 14px;
  font-weight: var(--fx-fw-medium);
  margin: 0 0 8px;
  line-height: 1.3;
  min-height: 36px;
  text-transform: none;
}
.product-miniature .product-title a {
  color: var(--fx-text);
  text-decoration: none;
}
.product-miniature .product-title a:hover { color: var(--fx-primary); }

/* === PRICE === */
.product-miniature .product-price-and-shipping {
  margin-top: auto;
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.product-miniature .product-price-and-shipping .price,
.product-miniature .price {
  font-size: 18px;
  font-weight: var(--fx-fw-bold);
  color: var(--fx-accent);
}
.product-miniature .regular-price {
  font-size: 13px;
  color: var(--fx-text-muted);
  text-decoration: line-through;
  font-weight: var(--fx-fw-regular);
}
.product-miniature .discount,
.product-miniature .discount-percentage,
.product-miniature .discount-amount {
  font-size: 12px;
  color: #fff !important;
  background: var(--fx-accent);
  padding: 2px 8px;
  border-radius: var(--fx-radius-sm);
  font-weight: var(--fx-fw-bold);
}

/* === WISHLIST BUTTON ON MINIATURE === */
.product-miniature .wishlist-button-product,
.product-miniature .wishlist-button {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 3;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--fx-border);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: var(--fx-transition);
  box-shadow: var(--fx-shadow-sm);
}
.product-miniature .wishlist-button:hover,
.product-miniature .wishlist-button-product:hover {
  border-color: var(--fx-accent);
}
.product-miniature .wishlist-button .material-icons,
.product-miniature .wishlist-button-product .material-icons {
  color: var(--fx-text-muted);
  font-size: 20px;
}
.product-miniature .wishlist-button.active .material-icons,
.product-miniature .wishlist-button-product.active .material-icons {
  color: var(--fx-accent);
}

/* ============================================================
   BANNER (ps_banner)
   ============================================================ */
.block-banner,
.ps-banner {
  margin-bottom: 24px;
  border-radius: var(--fx-radius-lg);
  overflow: hidden;
}
.block-banner img,
.ps-banner img {
  width: 100%;
  height: auto;
  display: block;
}

/* ============================================================
   CUSTOM TEXT BLOCK (ps_customtext)
   ============================================================ */
#custom-text,
.ps_custom_text {
  background: #fff;
  padding: 24px;
  border-radius: var(--fx-radius-lg);
  margin-bottom: 24px;
  box-shadow: var(--fx-shadow-sm);
  text-align: center;
}
#custom-text h2,
.ps_custom_text h2 {
  font-size: 20px;
  color: var(--fx-text);
  text-transform: none;
}

/* ============================================================
   BLOCKREASSURANCE (trust badges)
   ============================================================ */
.block-reassurance {
  background: #fff;
  border-radius: var(--fx-radius-lg);
  margin-bottom: 24px;
  padding: 16px 0;
  box-shadow: var(--fx-shadow-sm);
}
.block-reassurance ul { padding: 0; margin: 0; }
.block-reassurance li {
  border: 0 !important;
  padding: 12px 16px !important;
}
.block-reassurance .block-reassurance-item {
  display: flex;
  align-items: center;
  gap: 12px;
}
.block-reassurance img,
.block-reassurance svg {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
}
.block-reassurance span {
  font-size: 13px;
  color: var(--fx-text);
  font-weight: var(--fx-fw-medium);
}

/* ============================================================
   CATEGORY PAGE — left column + product list
   ============================================================ */
#left-column,
.left-column {
  padding-right: 12px;
}

/* Block categories sidebar */
.block-categories {
  background: #fff;
  padding: 16px;
  border-radius: var(--fx-radius);
  margin-bottom: 16px;
  box-shadow: var(--fx-shadow-sm);
}
.block-categories .category-top-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.block-categories .category-top-menu > li > a {
  font-weight: var(--fx-fw-bold);
  font-size: 14px;
  color: var(--fx-text);
  text-transform: none !important;
  text-decoration: none;
  display: block;
  padding: 4px 0;
  border-bottom: 2px solid var(--fx-primary);
  margin-bottom: 8px;
}
.block-categories .category-sub-menu,
.block-categories ul.category-sub-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.block-categories .category-sub-menu li {
  position: relative;
  padding: 4px 0;
  border: 0;
}
.block-categories .category-sub-menu li a {
  color: var(--fx-text);
  font-size: 13px;
  text-decoration: none;
  display: inline-block;
  padding: 4px 0;
  transition: var(--fx-transition);
}
.block-categories .category-sub-menu li a:hover,
.block-categories .category-sub-menu li.current a {
  color: var(--fx-primary);
  padding-left: 4px;
}
.block-categories .category-sub-link {
  font-size: 13px !important;
}
.block-categories .navbar-toggler {
  position: absolute;
  right: 0;
  top: 4px;
  background: transparent;
  border: 0;
  padding: 0;
  color: var(--fx-text-muted);
  cursor: pointer;
}
.block-categories .navbar-toggler .material-icons { font-size: 18px; }

/* Search filters / facets */
#search_filters,
#search_filters_wrapper {
  background: #fff;
  padding: 16px;
  border-radius: var(--fx-radius);
  margin-bottom: 16px;
  box-shadow: var(--fx-shadow-sm);
}
#search_filters .facet {
  border-bottom: 1px solid var(--fx-border-light);
  padding: 12px 0;
}
#search_filters .facet:last-child { border-bottom: 0; }
#search_filters .facet-title,
#search_filters .h6.facet-title {
  font-size: 14px;
  font-weight: var(--fx-fw-bold);
  color: var(--fx-text);
  text-transform: uppercase;
  letter-spacing: .3px;
  margin: 0 0 10px;
}
#search_filters .facet-label {
  font-size: 13px;
  color: var(--fx-text);
  margin-bottom: 4px;
}
#search_filters .custom-checkbox input[type=checkbox] + span.color {
  width: 20px; height: 20px;
  border-radius: var(--fx-radius-sm);
  border: 1px solid var(--fx-border);
}
#search_filters .magnitude { color: var(--fx-text-muted); font-size: 11px; }

/* Page header (category cover/banner) */
#category #wrapper #js-product-list-header,
.block-category {
  background: #fff;
  padding: 24px;
  border-radius: var(--fx-radius-lg);
  margin-bottom: 16px;
  box-shadow: var(--fx-shadow-sm);
}
.block-category .category-cover {
  text-align: center;
  margin-bottom: 16px;
}
.block-category .category-cover img {
  max-width: 100%;
  height: auto;
  border-radius: var(--fx-radius);
}
#category h1.h1,
.page-header h1 {
  font-size: 24px;
  font-weight: var(--fx-fw-bold);
  color: var(--fx-text);
  margin: 0 0 8px;
  text-transform: none;
}
.category-description,
#category-description {
  font-size: 14px;
  color: var(--fx-text-muted);
}

/* Top bar of product list (count + sort) */
#js-product-list-top {
  background: #fff;
  padding: 12px 16px;
  border-radius: var(--fx-radius);
  margin-bottom: 16px;
  box-shadow: var(--fx-shadow-sm);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
#js-product-list-top .total-products p {
  font-size: 13px;
  color: var(--fx-text-muted);
  margin: 0;
}
#js-product-list-top .sort-by-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.products-sort-order .select-title,
.products-sort-order .btn-unstyle {
  background: var(--fx-bg-alt);
  border: 1px solid var(--fx-border);
  border-radius: var(--fx-radius);
  padding: 8px 14px;
  font-size: 13px;
  color: var(--fx-text);
}
.products-sort-order .dropdown-menu {
  border: 1px solid var(--fx-border);
  border-radius: var(--fx-radius);
  box-shadow: var(--fx-shadow);
}
.products-sort-order .dropdown-menu a {
  padding: 8px 14px;
  font-size: 13px;
  color: var(--fx-text);
  display: block;
  text-decoration: none;
}
.products-sort-order .dropdown-menu a:hover {
  background: var(--fx-bg-alt);
  color: var(--fx-primary);
}

/* Product list grid wrapper */
#js-product-list,
.product-list-wrapper {
  background: transparent;
}
#js-product-list .products,
.product-list .products {
  margin: 0 -8px;
}
#js-product-list .products > .js-product,
#js-product-list .products > div {
  padding: 0 8px;
}

/* Pagination */
.pagination {
  background: #fff;
  padding: 12px 16px;
  border-radius: var(--fx-radius);
  margin-top: 16px;
  box-shadow: var(--fx-shadow-sm);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.pagination .page-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 4px;
}
.pagination .page-list li a,
.pagination .page-list li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 8px;
  border-radius: var(--fx-radius-sm);
  border: 1px solid var(--fx-border);
  color: var(--fx-text);
  text-decoration: none;
  font-size: 13px;
  transition: var(--fx-transition);
}
.pagination .page-list li a:hover {
  background: var(--fx-bg-alt);
  color: var(--fx-primary);
  border-color: var(--fx-primary);
}
.pagination .page-list li.current a,
.pagination .page-list li.current span {
  background: var(--fx-primary);
  color: #fff;
  border-color: var(--fx-primary);
}

/* Active filters */
#js-active-search-filters {
  background: #fff;
  padding: 8px 12px;
  border-radius: var(--fx-radius);
  margin-bottom: 16px;
  box-shadow: var(--fx-shadow-sm);
}
.active-filter-title { font-weight: var(--fx-fw-medium); }
.filter-block {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--fx-bg-alt);
  padding: 4px 10px;
  border-radius: var(--fx-radius-pill);
  font-size: 12px;
  margin: 2px;
  color: var(--fx-text);
}
.filter-block .close { color: var(--fx-accent); cursor: pointer; }

/* ============================================================
   PRODUCT PAGE
   ============================================================ */
#product #content {
  background: #fff;
  border-radius: var(--fx-radius-lg);
  padding: 24px;
  box-shadow: var(--fx-shadow-sm);
  margin-bottom: 24px;
}

/* Image gallery */
#product .product-images {
  position: relative;
}
#product .product-cover {
  border-radius: var(--fx-radius);
  overflow: hidden;
  border: 1px solid var(--fx-border-light);
  background: #fff;
  margin-bottom: 12px;
}
#product .product-cover img {
  width: 100%;
  height: auto;
  display: block;
}
#product .layer-image {
  position: absolute;
  top: 12px;
  right: 12px;
  background: rgba(0,0,0,.5);
  color: #fff;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
#product .product-images-thumbs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
#product .product-images-thumbs .thumb-container,
#product .product-images-thumbs .product-images > li {
  border: 2px solid transparent;
  border-radius: var(--fx-radius-sm);
  overflow: hidden;
  cursor: pointer;
  transition: var(--fx-transition);
}
#product .product-images-thumbs .selected,
#product .product-images-thumbs .thumb.selected {
  border-color: var(--fx-primary);
}
#product .product-images-thumbs img {
  width: 64px; height: 64px;
  object-fit: cover;
  display: block;
}

/* Product information */
#product .h1.product-title,
#product .product-title,
#product h1.h1 {
  font-size: 24px;
  font-weight: var(--fx-fw-bold);
  color: var(--fx-text);
  text-transform: none;
  margin: 0 0 12px;
}
#product .product-reference {
  font-size: 12px;
  color: var(--fx-text-muted);
  margin-bottom: 12px;
}
#product .product-prices {
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
  padding: 16px 0;
  border-top: 1px solid var(--fx-border-light);
  border-bottom: 1px solid var(--fx-border-light);
  margin-bottom: 16px;
}
#product .current-price {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
}
#product .current-price-value,
#product .current-price span:first-child,
#product span.current-price-value,
#product .price {
  font-size: 28px;
  font-weight: var(--fx-fw-bold);
  color: var(--fx-accent);
}
#product .regular-price {
  font-size: 16px;
  color: var(--fx-text-muted);
  text-decoration: line-through;
}
#product .discount {
  background: var(--fx-accent);
  color: #fff;
  padding: 4px 10px;
  border-radius: var(--fx-radius-sm);
  font-size: 12px;
  font-weight: var(--fx-fw-bold);
}
#product .tax-shipping-delivery-label {
  font-size: 12px;
  color: var(--fx-text-muted);
  display: block;
  margin-top: 4px;
}

/* Product flags on product page */
#product .product-flags {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
}

/* Product actions: add to cart, qty */
#product .product-actions {
  margin-top: 16px;
}
#product .product-quantity {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
#product .qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--fx-border);
  border-radius: var(--fx-radius-pill);
  overflow: hidden;
  background: #fff;
}
#product .qty .input-group-btn-vertical .btn,
#product .qty button {
  width: 36px;
  height: 44px;
  background: var(--fx-bg-alt);
  border: 0;
  color: var(--fx-text);
  font-size: 18px;
  cursor: pointer;
  transition: var(--fx-transition);
}
#product .qty .input-group-btn-vertical .btn:hover,
#product .qty button:hover { background: var(--fx-primary); color: #fff; }
#product input[name="qty"],
#product .qty input {
  width: 60px;
  height: 44px;
  border: 0;
  text-align: center;
  font-weight: var(--fx-fw-bold);
  color: var(--fx-text);
  background: #fff;
}
#product .add-to-cart,
#product .add,
#product .product-add-to-cart .add-to-cart {
  flex: 1 1 auto;
  height: 48px;
  background: var(--fx-primary) !important;
  border: 2px solid var(--fx-primary) !important;
  border-radius: var(--fx-radius-pill) !important;
  color: #fff !important;
  font-weight: var(--fx-fw-bold) !important;
  text-transform: uppercase;
  letter-spacing: .5px;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: var(--fx-transition);
  min-width: 200px;
  cursor: pointer;
}
#product .add-to-cart:hover,
#product .add:hover {
  background: var(--fx-primary-dark) !important;
  border-color: var(--fx-primary-dark) !important;
}
#product .add-to-cart .material-icons,
#product .add-to-cart i { font-size: 18px; }

/* Variants */
#product .product-variants {
  margin: 16px 0;
}
#product .product-variants > .product-variants-item {
  margin-bottom: 12px;
}
#product .product-variants > .product-variants-item .control-label {
  font-weight: var(--fx-fw-bold);
  display: block;
  margin-bottom: 6px;
}
#product .input-color { border-radius: var(--fx-radius-sm); }
#product .product-variants-item .color {
  border: 2px solid var(--fx-border);
  border-radius: var(--fx-radius-sm);
  width: 36px;
  height: 36px;
}
#product .input-color:checked + span,
#product input[type=radio]:checked + span.color {
  border-color: var(--fx-primary);
}

/* Tabs */
#product .tabs {
  background: #fff;
  border-radius: var(--fx-radius);
  padding: 16px;
  margin-bottom: 24px;
  box-shadow: var(--fx-shadow-sm);
}
#product .nav-tabs {
  border-bottom: 2px solid var(--fx-border);
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin-bottom: 16px;
  padding: 0;
  list-style: none;
}
#product .nav-tabs .nav-link,
#product .nav-tabs .nav-item .nav-link {
  border: 0;
  background: transparent;
  color: var(--fx-text-muted);
  padding: 10px 18px;
  font-weight: var(--fx-fw-medium);
  font-size: 14px;
  border-bottom: 3px solid transparent;
  transition: var(--fx-transition);
  text-decoration: none;
}
#product .nav-tabs .nav-link.active,
#product .nav-tabs .nav-item .nav-link.active {
  color: var(--fx-primary);
  border-bottom-color: var(--fx-primary);
  background: transparent;
}
#product .nav-tabs .nav-link:hover { color: var(--fx-primary); }

/* Description content */
#product .product-description {
  font-size: 14px;
  line-height: 1.7;
  color: var(--fx-text);
}
#product .product-description img { max-width: 100%; height: auto; }

/* Wishlist button on product page */
#product .wishlist-button-product {
  border: 2px solid var(--fx-border);
  border-radius: var(--fx-radius-pill);
  background: #fff;
  padding: 10px 16px;
  font-size: 13px;
  cursor: pointer;
  transition: var(--fx-transition);
  color: var(--fx-text);
}
#product .wishlist-button-product:hover { border-color: var(--fx-accent); color: var(--fx-accent); }
#product .wishlist-button-product.active { border-color: var(--fx-accent); color: var(--fx-accent); }
#product .wishlist-button-product .material-icons { font-size: 16px; vertical-align: middle; }