/**
 * Review Post Layout Styles
 * Smart Gear Select Child Theme
 */

.sgs-review-layout, .sgs-archive-layout, .sgs-pillar-layout {
  padding: var(--sgs-space-7) 0 var(--sgs-space-8);
}

.sgs-review-article, .sgs-archive-layout, .sgs-pillar-layout {
  width: var(--sgs-container);
  margin-inline: auto;
}

.sgs-review-hero {
  background: var(--sgs-color-bg-alt);
  border-bottom: 1px solid var(--sgs-color-border);
  padding: var(--sgs-space-6) 0;
  text-align: center;
}

.sgs-review-hero h1 {
  font-size: clamp(1.875rem, 4vw, 2.5rem);
  margin-bottom: var(--sgs-space-3);
}

.sgs-review-meta {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: var(--sgs-space-3);
  color: var(--sgs-color-muted);
  font-size: var(--sgs-font-size-sm);
  margin-bottom: var(--sgs-space-4);
}

.sgs-review-body {
  color: var(--sgs-color-text);
  line-height: var(--sgs-line-height-relaxed);
}

.sgs-review-body h2, .sgs-review-body h3 {
  margin-top: var(--sgs-space-7);
  margin-bottom: var(--sgs-space-3);
  padding-bottom: var(--sgs-space-2);
  border-bottom: 1px solid var(--sgs-color-border);
}

.sgs-pros-cons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--sgs-space-5);
  margin: var(--sgs-space-6) 0;
}

.sgs-pros, .sgs-cons {
  padding: var(--sgs-space-5);
  border-radius: var(--sgs-radius-lg);
  border: 1px solid var(--sgs-color-border);
}

.sgs-pros {
  background: rgba(16, 185, 129, 0.08);
  border-left: 4px solid #10b981;
}

.sgs-cons {
  background: rgba(239, 68, 68, 0.08);
  border-left: 4px solid #ef4444;
}

.sgs-pros h4, .sgs-cons h4 {
  margin: 0 0 var(--sgs-space-3) 0;
  font-weight: var(--sgs-font-weight-bold);
  color: var(--sgs-color-heading);
}

.sgs-pros ul, .sgs-cons ul { margin: 0; padding-left: 1.25rem; }
.sgs-pros li, .sgs-cons li { margin-bottom: var(--sgs-space-2); color: var(--sgs-color-text); }

.sgs-specs-table {
  width: 100%; border-collapse: collapse;
  margin: var(--sgs-space-5) 0; font-size: var(--sgs-font-size-sm);
}

.sgs-specs-table th, .sgs-specs-table td {
  padding: var(--sgs-space-3) var(--sgs-space-4);
  border: 1px solid var(--sgs-color-border); text-align: left;
}

.sgs-specs-table th {
  background: var(--sgs-color-bg-alt);
  font-weight: var(--sgs-font-weight-semibold);
  color: var(--sgs-color-heading); width: 35%;
}

.sgs-specs-table td { color: var(--sgs-color-text); }

.sgs-verdict {
  background: linear-gradient(135deg, var(--sgs-color-bg-alt), var(--sgs-color-bg));
  border: 2px solid var(--sgs-color-border);
  border-radius: var(--sgs-radius-lg);
  padding: var(--sgs-space-6);
  margin: var(--sgs-space-7) 0; text-align: center;
}

.sgs-verdict-title {
  font-size: var(--sgs-font-size-xl);
  font-weight: var(--sgs-font-weight-bold);
  color: var(--sgs-color-heading);
  margin-bottom: var(--sgs-space-3);
}

.sgs-verdict-score {
  display: inline-flex; align-items: center; justify-content: center;
  width: 80px; height: 80px;
  background: var(--sgs-color-accent); color: #ffffff;
  font-size: 1.5rem; font-weight: var(--sgs-font-weight-bold);
  border-radius: 50%; margin: 0 auto var(--sgs-space-4);
}

.sgs-verdict-text {
  color: var(--sgs-color-text);
  font-size: var(--sgs-font-size-lg);
  line-height: var(--sgs-line-height-normal);
}

.sgs-disclosure {
  font-size: var(--sgs-font-size-sm);
  color: var(--sgs-color-muted);
  padding: var(--sgs-space-4);
  background: var(--sgs-color-bg-alt);
  border-left: 3px solid var(--sgs-color-border);
  margin: var(--sgs-space-6) 0;
}

@media (max-width: 782px) {
  .sgs-review-hero { padding: var(--sgs-space-5) 0; }
  .sgs-pros-cons { grid-template-columns: 1fr; }
  .sgs-specs-table { font-size: 0.8125rem; }
  .sgs-specs-table th, .sgs-specs-table td { padding: var(--sgs-space-2) var(--sgs-space-3); }
  .sgs-verdict { padding: var(--sgs-space-5); }
}

@media (max-width: 544px) {
  .sgs-review-hero h1 { font-size: 1.5rem !important; }
  .sgs-verdict-score { width: 60px; height: 60px; font-size: 1.25rem; }
}