.main-image-container {
    border: 1px solid var(--border-color);
    border-radius: 1rem;
    overflow: hidden;
}

.thumbnail-container {
    width: 23%;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 0.5rem;
    overflow: hidden;
    transition: border-color 0.3s ease;
}

.thumbnail-container:hover {
    border-color: var(--primary-blue);
}

.product-title {
    font-size: 2.5rem;
    font-weight: 800;
}

.price-display {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-blue);
}

.color-swatch {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 2px solid var(--border-color);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.color-swatch:hover {
    transform: scale(1.1);
    box-shadow: 0 0 0 3px var(--primary-blue);
}

.size-btn {
    min-width: 80px;
    font-weight: 500;
    padding: 0.5rem 1rem;
}

.custom-option {
    background-color: var(--secondary-bg);
    border: 1px solid var(--border-color);
    transition: border-color 0.3s;
}

.custom-option:has(.form-check-input:checked) {
    border-color: var(--primary-blue);
}

.breadcrumb a {
    text-decoration: none;
    color: var(--text-muted);
}

.breadcrumb a:hover {
    color: var(--primary-blue);
}
.form-check-label {
    color: white;
}
.breadcrumb-item.active {
    color: rgb(145 148 150);
}
