.cnsl-prod-revbar {
            animation: shimmer 3.5s infinite;
            border-radius: 0.25rem;
            background: linear-gradient(270deg, rgba(243, 159, 0, 0.2), rgba(0, 112, 243, 0.04));
            background-size: auto;
            background-size: 200% 100%;
        }

        .cnsl-prod-revbar-pcnt {
            height: 100%;
            background: linear-gradient(270deg, rgb(243, 182, 0), rgba(243, 216, 0, 0.31));
            border-radius: 0.25rem;
        }

        .product-description {
            display: flex;
            flex-flow: column;
            gap: 1rem
        }
        
        @media (min-width: 1024px) {
         .cnsl\:flex-bs-imge {
             flex-basis: 66.666667%;
         }
     }

     @media (min-width: 1024px) {
         .cnsl\:flex-bs-dtls {
             flex-basis: 33.333333%;
         }
     }

     @media (min-width: 768px) {
         .cnsl\:setpad-3 {
             padding: 3rem;
         }
     }

     @media (min-width: 1024px) {
         .cnsl\:relprod-data-cntnr {
             width: 20%;
         }
     }

     @media (min-width: 768px) {
         .cnsl\:relprod-data-cntnr {
             width: 25%;
         }
     }

     @media (min-width: 640px) {
         .cnsl\:relprod-data-cntnr {
             width: 33.333333%;
         }
     }

     @media (min-width: 475px) {
         .cnsl\:relprod-data-cntnr {
             width: 50%;
         }
     }

     .review-summary {
         margin-bottom: 20px;
     }

     .star-label {
         width: 60px;
     }

     .percentage {
         width: 40px;
         text-align: right;
     }

     .star-rating {
         display: inline-flex;
         flex-direction: row-reverse;
         font-size: 0;
     }

     .star-rating input {
         display: none;
     }

     .star-rating label {
         cursor: pointer;
     }

     .star-rating svg {
         width: 30px;
         height: 30px;
         fill: #E0E0E0;
         transition: fill 0.2s;
     }

     .star-rating input:checked~label svg,
     .star-rating label:hover svg,
     .star-rating label:hover~label svg {
         fill: #FFC800;
     }
 
     @media (min-width: 768px) {
         .cnsl\:grid-rspnsv-2 {
             grid-template-columns: repeat(2, 1fr);
         }
     }

     @media (max-width: 768px) {
         .cnsl\:grid-rspnsv {
             grid-template-columns: 1fr;
         }
     }
     
     .product-gallery {
         max-width: 100%;
         margin: 0 auto;
         position: relative;
     }

     .main-image-container {
         display: flex;
         justify-content: center;
         align-items: center;
         margin-bottom: 1rem;
         cursor: pointer;
     }

     .primary-image {
         max-width: 100%;
         height: auto;
         object-fit: contain;
         border-radius: 0.5rem;
     }

     .gallery-controls {
         display: flex;
         justify-content: space-between;
     }

     .gallery-control {
         background-color: rgba(0, 0, 0, 0.5);
         color: white;
         border: none;
         border-radius: 50%;
         width: 40px;
         height: 40px;
         display: flex;
         justify-content: center;
         align-items: center;
         cursor: pointer;
         transition: background-color 0.3s;
     }

     .gallery-control:hover {
         background-color: rgba(0, 0, 0, 0.7);
     }

     .thumbnail-container {
         display: flex;
         justify-content: center;
         flex-wrap: wrap;
         gap: 0.5rem;
         list-style: none;
         padding: 0;
         margin: 0;
     }

     .thumbnail-button {
         cursor: pointer;
         background: none;
         border: 2px solid transparent;
         padding: 0;
         border-radius: 0.5rem;
         overflow: hidden;
         transition: transform 0.2s ease-in-out, border-color 0.2s ease-in-out;
     }

     .thumbnail-button:hover {
         transform: scale(1.05);
     }

     .thumbnail-button.active {
         border-color: rgba(255, 255, 255, 0.15);
         transform: scale(1.1);
     }

     .thumbnail-image {
         width: 80px;
         height: 80px;
         object-fit: cover;
     }

     /* Lightbox styles */
     .lightbox {
         display: none;
         position: fixed;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         background-color: rgba(0, 0, 0, 0.9);
         justify-content: center;
         align-items: center;
         z-index: 1000;
     }

     .lightbox-content {
         position: relative;
         max-width: 90%;
         max-height: 90%;
     }

     .lightbox-image {
         max-width: 100%;
         max-height: 80vh;
         object-fit: contain;
     }


     .lightbox-prev {
         left: 10px;
     }

     .lightbox-next {
         right: 10px;
     }

     .skeleton-loader {
         background: inherit;
         border-radius: 4px;
         margin-bottom: 8px;
         overflow: hidden;
     }

     .skeleton-icon {
         width: 16px;
         height: 16px;
         background: linear-gradient(270deg, rgba(0, 112, 243, 0.2), rgba(0, 112, 243, 0.04));
         background-size: 200% 100%;
         animation: shimmer 1.5s infinite;
         border-radius: 50%;
     }

     .skeleton-text {
         height: 16px;
         width: 70%;
         background: linear-gradient(270deg, rgba(0, 112, 243, 0.2), rgba(0, 112, 243, 0.04));
         background-size: 200% 100%;
         animation: shimmer 2.5s infinite;
         border-radius: 4px;
     }

     @keyframes shimmer {
         0% {
             background-position: 200% 0;
         }

         100% {
             background-position: -200% 0;
         }
     }