.product-photo,
.detail-photo,
.thumb-photo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.product-photo {
    padding: 22px;
    transition: transform .25s;
}

.product-card:hover .product-photo {
    transform: scale(1.04);
}

.detail-photo {
    padding: 36px;
    filter: drop-shadow(0 25px 40px rgba(17, 24, 39, .18));
}

.thumb-photo {
    padding: 6px;
}

.detail-actions {
    flex-wrap: wrap;
}

.detail-actions .btn small {
    margin-left: 3px;
    opacity: .78;
    font-size: 9px;
}

.product-reviews-section {
    background: #f7f8fb;
}

.review-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 24px;
    align-items: start;
}

.user-review {
    padding: 17px 0;
    border-top: 1px solid #edf0f3;
}

.user-review:first-of-type {
    border-top: 0;
}

.user-review > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.user-review b {
    font-size: 12px;
}

.user-review span {
    color: #a16b00;
    font-size: 10px;
    font-weight: 800;
}

.user-review p {
    margin: 9px 0;
    color: #5e6876;
    font-size: 12px;
    line-height: 1.7;
}

.user-review small,
.review-form small {
    color: #939dad;
    font-size: 8px;
}

.review-empty,
.review-success,
.review-error {
    padding: 13px;
    border-radius: 10px;
    font-size: 10px;
    line-height: 1.5;
}

.review-empty {
    color: #6f7887;
    background: #f6f7f9;
}

.review-success {
    margin-bottom: 14px;
    color: #087759;
    border: 1px solid #bdebdc;
    background: #eafaf5;
}

.review-error {
    margin-bottom: 12px;
    color: #a63b2e;
    border: 1px solid #ffd0ca;
    background: #fff3f1;
}

.review-form h3 {
    margin: 8px 0 18px;
    font-size: 20px;
    letter-spacing: -.5px;
}

.review-form label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-bottom: 14px;
}

.review-form label span {
    color: #4e5968;
    font-size: 9px;
    font-weight: 800;
}

.review-form input,
.review-form select,
.review-form textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #dfe3e8;
    border-radius: 10px;
    outline: 0;
    background: white;
    font: inherit;
    font-size: 11px;
}

.review-form input:focus,
.review-form select:focus,
.review-form textarea:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(91, 108, 255, .1);
}

@media (max-width: 780px) {
    .review-grid {
        grid-template-columns: 1fr;
    }
}
