/* Main product image - product details page */
/* Main product image - product details page */
.product-main-image {
    position: relative;
    width: 100%;
    max-width: 450px; /* Limits the maximum size on larger screens */
    margin: 0 auto; /* Centers the image container if it has a max-width */
    height: auto;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 12px;
    background: #f8f8f5;
}

    .product-main-image img#mainProductImage {
        display: block;
        width: 100%;
        height: 100% !important;
        aspect-ratio: auto;
        object-fit: cover;
    }

.image-counter {
    position: absolute;
    right: 12px;
    bottom: 12px;
    padding: 5px 10px;
    border-radius: 20px;
    background: rgba(0, 0, 0, 0.65);
    color: white;
    font-size: 0.85rem;
}

/* Product image thumbnails - details page */
.product-thumbnails {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding: 3px 2px 10px;
}

.product-thumbnail {
    flex: 0 0 80px;
    width: 80px;
    height: 80px;
    padding: 3px;
    border: 2px solid transparent;
    border-radius: 9px;
    background: white;
    cursor: pointer;
    overflow: hidden;
    transition: border-color 0.2s, opacity 0.2s;
}

    .product-thumbnail img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        border-radius: 5px;
    }

    .product-thumbnail:hover {
        opacity: 0.8;
    }

    .product-thumbnail.active {
        border-color: #198754;
    }

    .product-thumbnail:focus-visible {
        outline: 2px solid #198754;
        outline-offset: 3px;
    }

/* Product cards - main catalog page */
.product-image {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.alert-info {
    white-space: pre-line;
}