/* === Editorial Review === */
.review-article {
    margin-top: 2rem;
    padding: 1.5rem;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e8eaed;
}
.review-article h2 {
    font-size: 1.2rem;
    margin-bottom: 1rem;
    color: #202124;
}
.review-content {
    line-height: 1.7;
    color: #3c4043;
    margin-bottom: 1rem;
}
.review-content p { margin-bottom: 0.75rem; }

.review-pros, .review-cons {
    padding: 1rem;
    border-radius: 6px;
    margin-bottom: 0.75rem;
}
.review-pros {
    background: #e6f4ea;
    border-left: 4px solid #137333;
}
.review-cons {
    background: #fce8e6;
    border-left: 4px solid #c5221f;
}
.review-pros h3, .review-cons h3 {
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.review-pros h3 { color: #137333; }
.review-cons h3 { color: #c5221f; }
.review-pros ul, .review-cons ul {
    margin: 0;
    padding-left: 1.25rem;
    line-height: 1.6;
}
.review-meta {
    font-size: 0.8rem;
    color: #9aa0a6;
    margin-top: 0.5rem;
}

/* === Comments Section === */
.comments-section {
    margin-top: 2rem;
    padding: 1.5rem;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e8eaed;
}
.comments-section h2 {
    font-size: 1.2rem;
    margin-bottom: 1rem;
    color: #202124;
}

/* Rating summary */
.rating-summary {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
    padding: 0.75rem;
    background: #f8f9fa;
    border-radius: 6px;
}
.rating-text { font-weight: 600; font-size: 1rem; }
.rating-count { color: #9aa0a6; font-size: 0.85rem; }

/* Stars */
.star { color: #dadce0; font-size: 1.1rem; }
.star.filled { color: #f9a825; }
.rating-stars .star { font-size: 1.3rem; }

/* Comment cards */
.comments-list { margin-bottom: 1.5rem; }
.comment-card {
    padding: 1rem 0;
    border-bottom: 1px solid #f1f3f4;
}
.comment-card:last-child { border-bottom: none; }
.comment-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
    flex-wrap: wrap;
}
.comment-author { font-weight: 600; font-size: 0.9rem; }
.comment-stars .star { font-size: 0.9rem; }
.comment-date { color: #9aa0a6; font-size: 0.8rem; margin-left: auto; }
.comment-body { color: #3c4043; line-height: 1.6; font-size: 0.9rem; }

/* Comment alert */
.comment-alert {
    padding: 0.6rem 1rem;
    border-radius: 6px;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}
.comment-alert-success {
    background: #e6f4ea;
    color: #137333;
}

/* Comment form */
.comment-form-wrap { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid #e8eaed; }
.comment-form-wrap h3 { font-size: 1rem; margin-bottom: 1rem; }
.comment-form .form-row { margin-bottom: 0.75rem; }
.comment-form label {
    display: block;
    font-weight: 500;
    font-size: 0.85rem;
    margin-bottom: 0.2rem;
    color: #3c4043;
}
.comment-form label small { color: #9aa0a6; font-weight: 400; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form textarea {
    width: 100%;
    max-width: 480px;
    padding: 0.45rem 0.65rem;
    border: 1px solid #dadce0;
    border-radius: 4px;
    font-family: inherit;
    font-size: 0.9rem;
}
.comment-form input:focus,
.comment-form textarea:focus {
    outline: none;
    border-color: #1a73e8;
    box-shadow: 0 0 0 3px rgba(26,115,232,.12);
}
.comment-form textarea { resize: vertical; }

/* Star selector */
.star-selector {
    display: flex;
    gap: 0.2rem;
    font-size: 1.5rem;
    cursor: pointer;
}
.star-pick { color: #dadce0; transition: color 0.1s; user-select: none; }
.star-pick.active, .star-pick.hover { color: #f9a825; }

/* Confirm page */
.comment-confirm-page { max-width: 600px; margin-top: 1rem; }
.comment-confirm-page h1 { font-size: 1.25rem; margin-bottom: 0.5rem; }
.comment-preview-card {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 6px;
    border: 1px solid #e8eaed;
    margin-top: 1rem;
}

/* Buttons (reuse site styles) */
.comments-section .btn {
    display: inline-block;
    padding: 0.45rem 1rem;
    border: none;
    border-radius: 4px;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: inherit;
    text-decoration: none;
}
.comment-confirm-page .btn {
    display: inline-block;
    padding: 0.45rem 1rem;
    border: none;
    border-radius: 4px;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: inherit;
    text-decoration: none;
}
.btn-primary { background: #1a73e8; color: #fff; }
.btn-primary:hover { background: #1557b0; color: #fff; }
.btn-outline { background: #fff; color: #3c4043; border: 1px solid #dadce0; }
.btn-outline:hover { background: #f1f3f4; }