.shop-container, .product-detail-container {max-width:1400px; margin:40px auto; padding:0 20px;}
.shop-title {font-size:2.5rem; color:var(--dark-blue); margin-bottom:2rem; text-align:center;}
.empty-list-message {text-align:center; color:#666; font-size:1.1rem; padding:40px 0; grid-column:1 / -1;}
.brand-grid {display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:25px;}
.brand-card {border:1px solid #e9ecef; border-radius:8px; text-align:center; padding:20px; transition:transform 0.2s ease, box-shadow 0.2s ease;}
.brand-card:hover {transform:translateY(-5px); box-shadow:0 8px 15px rgba(0,0,0,0.07);}
.brand-card img {max-height:80px; max-width:150px; margin-bottom:15px; object-fit:contain;}
.brand-card h3 {color:var(--dark-blue); font-size:1.2rem;}
.brand-header {display:flex; gap:30px; align-items:center; margin-bottom:3rem; background:#f8f9fa; padding:30px; border-radius:8px; flex-wrap:wrap;}
.brand-header img {height:120px; width:200px; object-fit:contain;}
.brand-header h1 {margin:0; color:var(--dark-blue);}
.product-toolbar {display:flex; justify-content:space-between; align-items:center; margin-bottom:2rem; flex-wrap:wrap; gap:1rem;}
.product-toolbar h2 {color:var(--text-dark); margin:0;}
.product-search-form {display:flex;}
.product-search-form input {border:1px solid #ccc; padding:8px 12px; border-radius:20px 0 0 20px; min-width:200px;}
.product-search-form button {border:1px solid #ccc; border-left:none; background:#f0f0f0; padding:0 15px; border-radius:0 20px 20px 0; cursor:pointer;}
.shop-layout {display:grid; grid-template-columns:280px 1fr; gap:30px; position:relative;}
.shop-sidebar {border-right:1px solid #e9ecef; padding-right:30px;}
.filter-group {margin-bottom:2rem;}
.filter-group h3 {font-size:1.2rem; margin-bottom:1rem; color:var(--dark-blue); border-bottom:1px solid #eee; padding-bottom:0.5rem;}
.filter-group select {width:100%; padding:10px; border-radius:5px; border:1px solid #ccc;}
.checkbox-group {margin-bottom:0.5rem;}
.checkbox-group label {display:inline-flex; align-items:center; cursor:pointer;}
.price-range-inputs {display:flex; align-items:center; gap:5px;}
.price-range-inputs input {width:80px; padding:8px; border:1px solid #ccc; border-radius:4px;}
.price-range-inputs button {padding:8px 12px; border:1px solid var(--medium-blue); background:var(--medium-blue); color:white; border-radius:4px; cursor:pointer;}
.btn-clear-filters {display:block; text-align:center; margin-top:1.5rem; color:var(--orange-accent); font-weight:600;}
.mobile-filter-toggle {display:none; width:100%; padding:12px; background:#f8f9fa; border:1px solid #ddd; border-radius:5px; text-align:center; font-weight:600; margin-bottom:20px; cursor:pointer; align-items:center; justify-content:center; gap:10px; color:var(--dark-blue); transition: background 0.3s ease;}
.mobile-filter-toggle:hover {background: #f0f0f0;}
.mobile-filter-toggle i {font-size:1.1rem;}
.mobile-filter-header {display:none; justify-content:space-between; align-items:center; margin-bottom:20px; border-bottom:1px solid #eee; padding-bottom:15px; position: sticky; top: 0; background: #fff; z-index: 5; padding-top: 10px;}
.mobile-filter-header h3 {margin:0; color:var(--dark-blue); font-size:1.5rem;}
#close-filter-btn {background:none; border:none; font-size:1.5rem; color:var(--text-muted); cursor:pointer; padding: 5px; display: flex; align-items: center;}
#close-filter-btn:hover {color: var(--red);}
.product-grid-shop {display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:25px;}
.product-card-shop {border:1px solid #e9ecef; border-radius:8px; overflow:hidden; transition:box-shadow 0.2s ease; display:flex; flex-direction:column; position:relative;}
.product-card-shop:hover {box-shadow:0 8px 20px rgba(0,0,0,0.08);}
.product-card-link {display:flex; flex-direction:column; flex-grow:1; text-decoration:none;}
.product-card-image {position:relative; height:250px; background:#fff; overflow:hidden;}
.product-card-image img {width:100%; height:100%; object-fit:contain; padding:10px; transition:transform 0.3s ease;}
.product-card-shop:hover .product-card-image img {transform:scale(1.05);}
.product-badges {position:absolute; top:10px; left:10px; display:flex; flex-direction:column; gap:5px; align-items:flex-start; z-index:2;}
.product-badge {padding:4px 8px; border-radius:4px; font-size:0.75rem; font-weight:700; text-transform:uppercase; color:white; box-shadow:1px 1px 3px rgba(0,0,0,0.2); line-height:1;}
.badge-discount {background:var(--orange-accent);}
.badge-bogo {background:var(--color-tag-purple); background:linear-gradient(135deg, #9b59b6, #8e44ad);}
.badge-stock {position:absolute; top:10px; right:10px; background:#555; color:white; padding:4px 8px; border-radius:4px; font-size:0.75rem; font-weight:700; z-index:2;}
.product-card-info {padding:15px; flex-grow:1; display:flex; flex-direction:column;}
.product-brand, .product-brand-detail {font-size:0.8rem; color:#888; display:block; margin-bottom:5px; text-transform:uppercase;}
.product-name {font-size:1.1rem; font-weight:600; color:var(--text-dark); margin:0 0 10px 0; flex-grow:1;}
.product-price {margin-top:auto;}
.product-price .original-price {text-decoration:line-through; color:#999; margin-right:10px;}
.product-price .discounted-price, .product-price span {font-weight:700; color:var(--medium-blue); font-size:1.2rem;}
.product-availability {display:flex; gap:5px; margin-top:10px;}
.product-availability span {font-size:0.75rem; font-weight:bold; color:var(--dark-blue); background-color:#e9ecef; padding:3px 8px; border-radius:4px;}
.product-card-actions {padding:0 15px 15px; display:flex; gap:8px;}
.btn-add-to-cart {flex-grow:1; background-color:var(--medium-blue); color:white; border:none; padding:12px; border-radius:5px; cursor:pointer; font-weight:600; font-size:0.9rem; transition:background-color 0.2s ease; display:inline-flex; align-items:center; justify-content:center; gap:8px;}
.btn-add-to-cart:hover {background-color:var(--dark-blue);}
.btn-add-to-cart:disabled {background-color:#bdc3c7; cursor:not-allowed;}
.btn-icon-compare {flex-shrink:0; width:40px; height:40px; background:#f0f0f0; border:none; padding:0; border-radius:5px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background-color 0.2s; font-size:1.1rem;}
.btn-icon-compare:hover {background:#e0e0e0;}
.btn-icon-compare i {color:#888; transition:color 0.2s;}
.btn-icon-compare.active i {color:var(--orange-accent);}
.product-detail-container {display:grid; grid-template-columns:1fr 1.2fr; gap:40px;}
.product-gallery {position:relative;}
.product-info-main {position:relative;}
.not-available-overlay {position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(255, 255, 255, 0.8); z-index:10; display:flex; align-items:center; justify-content:center; border-radius:8px;}
.not-available-overlay p {background:var(--red); color:white; padding:10px 20px; border-radius:5px; font-weight:700; font-size:1.2rem; box-shadow:0 4px 10px rgba(0,0,0,0.2);}
.product-gallery .main-image {width:100%; border:1px solid #eee; border-radius:8px; cursor:pointer; aspect-ratio:1 / 1; object-fit:contain; height:auto;}
.product-info-main h1 {font-size:2.2rem; color:var(--dark-blue); margin:5px 0 15px 0;}
.product-price-detail {margin-bottom:20px; font-size:1.5rem;}
.product-price-detail .original-price {color:#999; text-decoration:line-through; font-size:1.2rem; margin-right:15px;}
.product-price-detail .discounted-price, .product-price-detail .current-price {color:var(--orange-accent); font-weight:700;}
.product-description {color:#555; line-height:1.7; margin-bottom:25px;}
.product-actions-wrapper {display:flex; flex-direction:column; gap:20px;}
.add-to-cart-form {display:flex; gap:10px;}
.quantity-selector {display:flex; border:1px solid #ccc; border-radius:5px;}
.quantity-btn {background-color:#f0f0f0; border:none; cursor:pointer; width:40px; font-size:1.2rem; font-weight:bold; color:#555;}
.quantity-btn:hover {background-color:#e0e0e0;}
.add-to-cart-form .quantity-input {width:60px; text-align:center; border:none; border-left:1px solid #ccc; border-right:1px solid #ccc; border-radius:0; font-size:1.1rem;}
.add-to-cart-form .quantity-input {-moz-appearance:textfield;}
.add-to-cart-form .quantity-input::-webkit-outer-spin-button, .add-to-cart-form .quantity-input::-webkit-inner-spin-button {-webkit-appearance:none; margin:0;}
.add-to-cart-btn {flex-grow:1; border-radius:5px; border-width:2px;}
.add-to-cart-btn:disabled {background-color:#95a5a6 !important; border-color:#95a5a6 !important; color:white !important; opacity:1;}
.out-of-stock-btn {background-color:#95a5a6 !important; border-color:#95a5a6 !important; color:white !important;}
.btn-animated-cart {position:relative; overflow:hidden; transition:background-color 0.3s ease;}
.cart-icon-base {transition:transform 0.3s ease;}
.cart-icon-animation {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%) scale(0); color:var(--white); transition:transform 0.3s ease, opacity 0.3s ease; opacity:0;}
.btn-animated-cart[data-state="success"] .cart-icon-base {transform:translateX(-100px);}
.btn-animated-cart[data-state="success"] .cart-icon-animation {transform:translate(-50%, -50%) scale(1); opacity:1; animation:cart-fly 1.2s ease-out;}

@keyframes cart-fly {
0% {transform:translate(-50%, -50%) scale(1.5); opacity:1; color:#2ecc71;}
100% {transform:translate(-50%, -50%) scale(0.5); opacity:0;}
}

.user-actions {display:flex; gap:15px;}
.btn-icon {background:#f0f0f0; border:none; padding:10px 15px; border-radius:5px; cursor:pointer; display:flex; align-items:center; gap:8px; transition:background-color 0.2s; font-family:'Poppins';}
.btn-icon:hover {background:#e0e0e0;}
.btn-icon i {color:#888; transition:color 0.2s;}
.btn-icon.active i {color:var(--orange-accent);}
.product-reviews-section {max-width:1400px; margin:60px auto; padding:40px 20px; border-top:1px solid #eee;}
.product-reviews-section h2 {font-size:2rem; color:var(--dark-blue); margin-bottom:30px;}
.review-list {margin-top:30px;}
.review-item {border-bottom:1px solid #eee; padding:20px 0;}
.review-item:last-child {border-bottom:none;}
.review-header {display:flex; align-items:center; gap:15px; margin-bottom:10px;}
.review-header strong {font-weight:600;}
.review-date {color:#777; font-size:0.9rem;}
.review-text {color:#555; line-height:1.7;}
.review-form-container {margin-top:40px; padding:25px; background:#f8f9fa; border-radius:8px;}
.review-form-container h3 {margin-bottom:20px;}
.form-group-review {margin-bottom:15px;}
.form-group-review label {display:block; font-weight:600; margin-bottom:8px;}
.form-group-review textarea {width:100%; padding:10px; border:1px solid #ccc; border-radius:5px; font-family:inherit;}
.star-rating-input {display:inline-flex; flex-direction:row-reverse;}
.star-rating-input input {display:none;}
.star-rating-input label {font-size:2rem; color:#ccc; cursor:pointer; transition:color 0.2s;}
.star-rating-input label:before {content:'\2605';}
.star-rating-input input:checked ~ label, .star-rating-input label:hover, .star-rating-input label:hover ~ label {color:#f39c12;}
.stars {--star-size:20px; --star-color:#ccc; --star-background:#f39c12; letter-spacing:3px; display:inline-block; font-size:var(--star-size); font-family:Times; line-height:1;}
.stars::before {content:'★★★★★'; background:linear-gradient(90deg, var(--star-background) calc(var(--rating) / 5 * 100%), var(--star-color) calc(var(--rating) / 5 * 100%)); -webkit-background-clip:text; -webkit-text-fill-color:transparent;}
.product-rating-summary-brief {display:flex; align-items:center; gap:10px; margin-bottom:15px;}
.product-rating-summary-brief .stars {--star-size:18px;}
.product-rating-summary-brief span {font-size:0.9rem; color:#777;}
.reviews-summary {margin-bottom:30px;}
.average-rating-display .rating-value {font-size:3rem; font-weight:bold; color:var(--dark-blue);}
.average-rating-display .stars {--star-size:24px; vertical-align:middle; margin-left:10px;}
.average-rating-display p {margin-top:5px; color:#777;}
.lightbox-overlay {position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.85); z-index:10000; display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity 0.4s ease, visibility 0.4s ease;}
.lightbox-overlay.active {opacity:1; visibility:visible;}
.lightbox-content {max-width:90%; max-height:85%; transform:scale(0.9); transition:transform 0.4s ease;}
.lightbox-overlay.active .lightbox-content {transform:scale(1);}
.lightbox-close {position:absolute; top:20px; right:35px; color:#fff; font-size:40px; font-weight:bold; cursor:pointer; transition:transform 0.2s ease;}
.lightbox-close:hover {transform:rotate(90deg);}
.product-thumbnails {display:flex; gap:10px; margin-top:15px; flex-wrap:wrap;}
.thumbnail-item {width:80px; height:80px; border:2px solid transparent; border-radius:5px; cursor:pointer; transition:border-color 0.2s; padding:3px;}
.thumbnail-item:hover {border-color:var(--medium-blue);}
.thumbnail-item.active {border-color:var(--orange-accent);}
.thumbnail-item img {width:100%; height:100%; object-fit:contain; background-color:white; border:1px solid #eee; border-radius:3px;}
.clinical-case-card .product-card-image img {object-fit:cover; padding:0;}
.case-content a, .case-references-section a {color:var(--medium-blue); text-decoration:underline; font-weight:600;}
.case-content a:hover, .case-references-section a:hover {color:var(--dark-blue);}
.clinical-case-card .product-card-image {position:relative;}
.clinical-case-card .case-card-video-preview {width:100%; height:100%; object-fit:cover;}
.clinical-case-card .video-play-icon {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:3rem; color:rgba(255, 255, 255, 0.8); background-color:rgba(0, 0, 0, 0.4); border-radius:50%; width:80px; height:80px; display:flex; align-items:center; justify-content:center; pointer-events:none; transition:transform 0.2s, background-color 0.2s;}
.clinical-case-card:hover .video-play-icon {transform:translate(-50%, -50%) scale(1.1); background-color:rgba(0, 0, 0, 0.6);}
.compare-bar-container {position:fixed; bottom:0; left:0; width:100%; background-color:#f7fcff; border-top:2px solid var(--medium-blue); box-shadow:0 -5px 15px rgba(0,0,0,0.1); z-index:9999; transform:translateY(100%); transition:transform 0.3s ease-in-out;}
.compare-bar-container.active {transform:translateY(0);}
.compare-bar-content {max-width:1200px; margin:0 auto; padding:15px 20px; display:flex; align-items:center; justify-content:space-between; gap:20px;}
.compare-count {font-size:1.2rem; font-weight:700; color:var(--dark-blue); flex-shrink:0;}
.compare-product-titles {display:flex; flex-wrap:wrap; gap:10px; flex-grow:1;}
.compare-product-titles span {background:var(--white); padding:5px 10px; border-radius:4px; font-size:0.9rem; border:1px solid #e1e8ed; color:var(--text-dark); max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#compare-action-btn {flex-shrink:0;}
.btn-clear-compare {background:none; border:none; color:var(--text-muted); font-size:1.5rem; cursor:pointer; line-height:1; transition:color 0.2s;}
.btn-clear-compare:hover {color:var(--red);}
.compare-table-container {overflow-x:auto; border:1px solid #e9ecef; border-radius:8px;}
.compare-table {width:100%; border-collapse:separate; border-spacing:0; min-width:700px;}
.compare-table th, .compare-table td {padding:15px; text-align:center; border-bottom:1px solid #eee; border-right:1px solid #eee; font-size:1rem; font-weight:500; vertical-align:top;}
.compare-table th {background-color:#f8f9fa; font-weight:600; text-align:left;}
.compare-table .feature-column {min-width:150px; position:sticky; left:0; background-color:#f8f9fa; z-index:10; border-right:2px solid var(--dark-blue);}
.compare-table tr:last-child th, .compare-table tr:last-child td {border-bottom:none;}
.product-cards-row th, .product-cards-row td {border-top:none; background-color:var(--white); border-bottom:2px solid #eee;}
.product-compare-card {display:flex; flex-direction:column; align-items:center; gap:10px; position:relative;}
.product-compare-card .btn-remove-from-compare {position:absolute; top:0; right:0; background:#e74c3c; color:white; border:none; border-radius:50%; width:25px; height:25px; font-size:1.2rem; line-height:1; cursor:pointer;}
.product-compare-card img {width:100px; height:100px; object-fit:contain;}
.product-compare-card h4 {font-size:1rem; color:var(--dark-blue); margin:0;}
.price-row .current-price {font-size:1.4rem; font-weight:700; color:var(--orange-accent);}
.price-row .original-price {display:block; text-decoration:line-through; color:#999;}
.feature-row .btn-primary {padding:8px 15px; border-radius:5px; font-size:0.85rem; font-weight:600;}
.feature-row td {font-size:0.95rem; color:#555;}
.availability-cell .available, .stock-cell .stock-in {color:var(--green); font-weight:600;}
.availability-cell .unavailable, .stock-cell .stock-out {color:var(--red); font-weight:600;}
.compare-actions-bar {display:flex; justify-content:flex-end; margin-bottom:25px;}

@media (max-width: 1024px) {
    .shop-layout {display:block;}
    .shop-sidebar {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        width: 300px;
        height: 100%;
        z-index: 10005;
        background: #fff;
        padding: 20px;
        overflow-y: auto;
        box-shadow: 2px 0 10px rgba(0,0,0,0.1);
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        visibility: hidden;
    }
    .shop-sidebar.active {
        transform: translateX(0);
        visibility: visible !important;
    }
    .mobile-filter-toggle {display:flex;}
    .mobile-filter-header {display:flex;}
    .compare-bar-content {flex-wrap:wrap;}
    .compare-product-titles {flex-basis:100%;}
    .compare-table .feature-column {min-width:120px;}
}

@media (max-width: 768px) {
.product-grid-shop {grid-template-columns:1fr; gap:25px;}
.product-detail-container {grid-template-columns:1fr;}
.brand-header {flex-direction:column; text-align:center;}
.compare-table {min-width:0; display:block; overflow-x:auto; white-space:nowrap;}
.compare-table th, .compare-table td {padding:10px; font-size:0.9rem;}
.compare-table .feature-column {min-width:100px; font-size:0.85rem;}
.product-compare-card img {width:70px; height:70px;}
.product-compare-card h4 {font-size:0.9rem; white-space:normal;}
.price-row .current-price {font-size:1.1rem;}
.add-to-cart-compare-btn {padding:5px 10px; font-size:0.75rem;}
}

@media (max-width: 576px) {
.product-grid-shop {grid-template-columns:1fr; gap:25px;}
.product-card-image {height:auto; aspect-ratio:1/1; max-height:350px;}
.product-search-form {width:100%;}
.product-search-form input {min-width:0; flex-grow:1;}
.compare-product-titles span {max-width:100%;}
.product-name {font-size:1.1rem; margin-bottom:10px;}
.product-price .discounted-price, .product-price span {font-size:1.2rem;}
.product-card-actions {padding:0 15px 15px; flex-wrap:nowrap; gap:10px;}
.btn-add-to-cart {width:auto; padding:12px; font-size:1rem; flex-grow:1;}
.btn-icon-compare {width:46px; margin-top:0; height:46px; flex-shrink:0;}
}

@keyframes fadeIn {
from {opacity:0; transform:translateY(-10px);}
to {opacity:1; transform:translateY(0);}
}