body {
  margin: 0;
  padding: 0;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  background-color: #f5f0e8;
  background-image: url("data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23d4a373' stroke-width='1' opacity='0.15'%3E%3Cpath d='M60 20c8 12 20 14 30 6-6 14-2 26 10 30-14 4-18 16-10 30-10-8-22-6-30 6-8-12-20-14-30-6 6-14 2-26-10-30 14-4 18-16 10-30 10 8 22 6 30-6z'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat;
}

/* Matching Breadcrumb Design */
.breadcrumb-section {
    background-color: #f5f0e8;
  background-image: url("data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23d4a373' stroke-width='1' opacity='0.15'%3E%3Cpath d='M60 20c8 12 20 14 30 6-6 14-2 26 10 30-14 4-18 16-10 30-10-8-22-6-30 6-8-12-20-14-30-6 6-14 2-26-10-30 14-4 18-16 10-30 10 8 22 6 30-6z'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat;
    margin: 0;
    padding: 25px 0;
    border: none;
}

.breadcrumb-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.95rem;
}

.breadcrumb-nav a {
    color: black;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s ease;
    padding: 5px 12px;
    border-radius: 6px;
}

.breadcrumb-nav a:hover {
    background: rgba(255, 255, 255, 0.15);
    transform: translateY(-1px);
}

.breadcrumb-separator {
    color: black;
    font-size: 1.2rem;
}

.breadcrumb-nav .current {
    color: black;
    font-weight: 600;
    padding: 5px 12px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 6px;
}

/* Ensure no default bootstrap styles interfere */
.breadcrumb-section .container {
    max-width: 1320px;
}


.product-image-container {
  position: relative;
}

.main-image-wrapper {
  height: 500px;
  cursor: crosshair;
}

.main-image {
  height: 100%;
  object-fit: contain;
  background: linear-gradient(45deg, #f8f9fa, #e9ecef);
}

.image-zoom-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: 200%;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}

.thumbnail-item {
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.thumbnail-item:hover {
  transform: translateY(-2px);
  border-color: #dee2e6;
}

.active-thumbnail {
  border-color: #d4a373 !important;
  box-shadow: 0 4px 12px rgba(13, 110, 253, 0.2);
}

.product-card {
  transition: transform 0.3s ease;
}

.product-card:hover {
  transform: translateY(-8px);
}

.hover-shadow {
  transition: box-shadow 0.3s ease;
}

.hover-shadow:hover {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
}

.transition-all {
  transition: all 0.3s ease;
}

.section-title {
  position: relative;
  padding-bottom: 15px;
}

.section-title:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, #0d6efd, #20c997);
  border-radius: 2px;
}

.star-rating-input i {
  cursor: pointer;
  transition: transform 0.2s;
}

.star-rating-input i:hover {
  transform: scale(1.2);
}

.nav-tabs .nav-link {
  border: none;
  color: #6c757d;
  font-weight: 500;
  padding: 12px 24px;
  border-radius: 8px 8px 0 0;
  transition: all 0.3s;
}

.nav-tabs .nav-link.active {
  color: #d4a373;
  background: rgba(13, 110, 253, 0.1);
  border-bottom: 3px solid #d4a373;
}

.nav-tabs .nav-link:hover:not(.active) {
  background: rgba(13, 110, 253, 0.05);
}

.product-badges .badge {
  font-weight: 500;
  letter-spacing: 0.5px;
}

.price-section {
  background: linear-gradient(135deg, #f8f9fa, #e9ecef);
}

.quick-features .bg-white {
  transition: transform 0.3s ease;
}

.quick-features .bg-white:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1) !important;
}

.btn-lg {
  border-radius: 12px;
  font-weight: 500;
}

.tab-content {
  padding: 20px 0;
}

.cart-action,
.cart-action:hover {
  background: #d4a373;
}

.wishlist-action,
.wishlist-action:hover {
  border-color: #d4a373;
}

/* Wishlist active state */
.wishlist-active .wishlist-icon {
  color: #dc3545; /* Bootstrap danger red */
}

.wishlist-icon {
  transition: color 0.3s ease, transform 0.2s ease;
  margin-left: 2px;
}

.wishlist-active .wishlist-icon {
  transform: scale(1.15);
}

.wishlist-active i {
  color: #dc3545; /* red */
  transform: scale(1.15);
  transition: color 0.3s ease, transform 0.2s ease;
}

.view-btn,
.view-btn:hover,
.view-btn:active {
  background: #d4a373;
}


.related-product-image{
  height: 240px;          /* fixed height */
  object-fit: contain;    /* keep full book visible */
  background: #f8f9fa;    /* nice neutral background */
  padding: 15px;
}