/* =============================================================================
   AffiliEngine AI — Public Styles
   Single source of truth. No duplicate rules.
   ============================================================================= */

/* ── Single Review Template ─────────────────────────────────────────────────── */

.aai-single-review {
  max-width: 860px;
  margin: 0 auto;
  padding: 0 20px 40px;
}

.aai-review-article {
  font-size: 16px;
  line-height: 1.8;
  color: #1e1e1e;
}

/* Clearfix so the floated thumbnail never bleeds into later sections */
.aai-review-article::after {
  content: '';
  display: table;
  clear: both;
}

/* Header -------------------------------------------------------------------- */

.aai-review-header {
  margin-bottom: 16px;
}

.aai-review-title {
  font-size: clamp(22px, 4vw, 32px);
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 8px;
}

.aai-review-byline {
  font-size: 13px;
  color: #888;
  margin-bottom: 4px;
}

/* Thumbnail + meta panel ---------------------------------------------------- */

.aai-review-thumbnail {
  float: none;
  margin: 0;
  width: 100%;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,.07);
  background: #fff;
}

.aai-review-thumbnail img,
.aai-review-thumbnail .aai-product-image {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  padding: 12px;
}

/* Rating + CTA below the product image */
.aai-image-meta {
  padding: 14px 16px 16px;
  border-top: 1px solid #f0f0f1;
  background: #fafafa;
}

.aai-overall-rating {
  margin-bottom: 12px;
}

.aai-rating-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #6b7280;
  margin-bottom: 4px;
}

.aai-stars-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

.aai-stars {
  display: inline-flex;
  gap: 1px;
  font-size: 18px;
  line-height: 1;
}

.star-full  { color: #f59e0b; }
.star-half  { color: #f59e0b; opacity: .65; }
.star-empty { color: #d1d5db; }

.aai-rating-value {
  font-size: 13px;
  font-weight: 600;
  color: #374151;
}

/* Full-width CTA button inside the image panel */
.aai-cta-btn {
  display: block;
  width: 100%;
  padding: 10px 14px;
  background: #f59e0b;
  color: #111 !important;
  font-weight: 700;
  font-size: 14px;
  text-align: center;
  text-decoration: none !important;
  border-radius: 7px;
  transition: background .15s;
  box-sizing: border-box;
}
.aai-cta-btn:hover { background: #d97706; }

/* Stack on narrow screens */
@media (max-width: 620px) {
  .aai-review-thumbnail {
    float: none;
    width: 100%;
    max-width: 280px;
    margin: 0 auto 20px;
    display: block;
  }
}

/* Content typography -------------------------------------------------------- */

.aai-review-content h2 {
  font-size: 1.4rem;
  font-weight: 700;
  margin: 36px 0 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid #f0f0f1;
}

.aai-review-content h3 {
  font-size: 1.15rem;
  font-weight: 600;
  margin: 24px 0 8px;
}

.aai-review-content p  { margin: 0 0 16px; }

.aai-review-content ul,
.aai-review-content ol { margin: 0 0 16px; padding-left: 22px; }

.aai-review-content li { margin-bottom: 5px; }

/* ── TOC + Product panel — side by side row ──────────────────────────────── */

/* Outer row — uses flexbox for reliable side-by-side layout */
.aai-toc-panel-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 5% !important;
  width: 100% !important;
  margin-bottom: 28px !important;
  box-sizing: border-box !important;
}

/* TOC nav — 60% width, sits on the left */
.aai-toc-panel-row nav {
  flex: 0 0 60% !important;
  width: 60% !important;
  float: none !important;
  background: #f3f4f6 !important;
  border: 1px solid #d1d5db !important;
  border-left: 4px solid #f59e0b !important;
  border-radius: 8px !important;
  padding: 20px 22px 18px !important;
  margin: 0 !important;
  font-size: inherit !important;
  box-sizing: border-box !important;
}

/* Product panel — 35% width, sits on the right */
.aai-toc-panel-row .aai-review-meta-panel {
  flex: 0 0 35% !important;
  width: 35% !important;
  float: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* Thumbnail fills its panel fully */
.aai-toc-panel-row .aai-review-thumbnail {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

/* TOC nav outside the row wrapper (fallback, no panel) */
.aai-review-content nav,
.entry-content nav,
.post-content nav,
.wp-block-post-content nav,
article.post nav {
  background: #f3f4f6;
  border: 1px solid #d1d5db;
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
  padding: 20px 22px 18px;
  margin-bottom: 28px;
  font-size: inherit;
  display: block;
  box-sizing: border-box;
}

/* Product panel outside the row wrapper (fallback) */
.aai-review-meta-panel {
  float: right;
  width: 280px;
  margin: 0 0 20px 20px;
  box-sizing: border-box;
}

/* Stack vertically on narrow screens */
@media (max-width: 640px) {
  .aai-toc-panel-row {
    flex-direction: column !important;
  }

  .aai-toc-panel-row nav,
  .aai-toc-panel-row .aai-review-meta-panel {
    flex: none !important;
    width: 100% !important;
  }

  .aai-review-meta-panel {
    float: none;
    width: 100%;
    margin: 0 0 20px;
  }
}

/* "Review Overview" h2 heading inside the TOC box */
.aai-toc-heading {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: #1e1e1e !important;
  margin: 0 0 12px 0 !important;
  padding: 0 0 10px 0 !important;
  border-bottom: 1px solid #d1d5db !important;
  border-left: none !important;
  background: none !important;
}

/* TOC list items — inherit article font size, no override */
.aai-review-content nav ul,
.entry-content nav ul,
.post-content nav ul,
article.post nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.aai-review-content nav li,
.entry-content nav li,
.post-content nav li,
article.post nav li {
  margin-bottom: 7px;
  padding-left: 16px;
  position: relative;
  font-size: inherit;   /* same size as article body text */
}

.aai-review-content nav li::before,
.entry-content nav li::before,
.post-content nav li::before,
article.post nav li::before {
  content: '›';
  position: absolute;
  left: 0;
  color: #f59e0b;
  font-weight: 700;
}

.aai-review-content nav a,
.entry-content nav a,
.post-content nav a,
article.post nav a {
  color: #374151;
  text-decoration: none;
  font-weight: 500;
}

.aai-review-content nav a:hover,
.entry-content nav a:hover,
.post-content nav a:hover,
article.post nav a:hover {
  color: #f59e0b;
  text-decoration: underline;
}

.aai-review-content .aai-cta-btn,
.entry-content .aai-cta-btn {
  display: inline-block;
  padding: 11px 22px;
  background: #f59e0b;
  color: #111 !important;
  font-weight: 700;
  font-size: 15px;
  text-align: center;
  text-decoration: none !important;
  border-radius: 8px;
  transition: background .15s;
  margin: 8px 0;
}
.aai-review-content .aai-cta-btn:hover,
.entry-content .aai-cta-btn:hover {
  background: #d97706;
}

/* aai-btn links generated by AI inside review content — style as proper buttons */
.aai-review-content a.aai-btn,
.entry-content a.aai-btn {
  display: inline-block;
  padding: 9px 18px;
  background: #f59e0b;
  color: #111 !important;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none !important;
  border-radius: 7px;
  transition: background .15s;
  line-height: 1.4;
  vertical-align: middle;
  margin: 2px 0;
}
.aai-review-content a.aai-btn:hover,
.entry-content a.aai-btn:hover {
  background: #d97706;
}

/* Disclaimer ---------------------------------------------------------------- */

.aai-disclaimer {
  font-size: 12px;
  color: #9ca3af;
  margin-top: 32px;
  padding-top: 16px;
  border-top: 1px solid #f0f0f1;
}

/* ── Pros / Cons (AI-generated inside review content) ───────────────────────── */

.pros-cons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 24px 0;
}

@media (max-width: 600px) {
  .pros-cons { grid-template-columns: 1fr; }
}

.pros-cons ul {
  list-style: none;
  padding: 16px 18px;
  border-radius: 8px;
  margin: 0;
}

.pros-cons ul:first-child {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
}

.pros-cons ul:last-child {
  background: #fff1f2;
  border: 1px solid #fecdd3;
}

.pros-cons ul li {
  padding: 3px 0;
  font-size: 14px;
  line-height: 1.5;
}

.pros-cons ul li::before {
  margin-right: 8px;
  font-weight: 700;
}

.pros-cons ul:first-child li::before { content: '✓'; color: #16a34a; }
.pros-cons ul:last-child  li::before { content: '✗'; color: #dc2626; }

/* ── Product Box shortcode ──────────────────────────────────────────────────── */

.aai-product-box {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  padding: 24px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  margin: 24px 0;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
}

@media (max-width: 600px) {
  .aai-product-box { flex-direction: column; }
}

.aai-product-image {
  flex: 0 0 180px;
}

.aai-product-image img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  object-fit: contain;
}

.aai-product-info {
  flex: 1;
}

.aai-product-title {
  font-size: 1.1rem;
  margin: 0 0 10px;
  line-height: 1.4;
}

.aai-product-title a {
  text-decoration: none;
  color: inherit;
}

.aai-product-title a:hover { color: #e47911; }

.aai-product-rating {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 10px;
}

.aai-product-price {
  margin-bottom: 16px;
}

.aai-price {
  font-size: 1.4rem;
  font-weight: 700;
  color: #b12704;
}

/* ── Shared buttons ─────────────────────────────────────────────────────────── */

.aai-btn {
  display: inline-block;
  padding: 9px 18px;
  background: #f59e0b;
  color: #111 !important;
  text-decoration: none !important;
  border-radius: 7px;
  font-weight: 700;
  font-size: 14px;
  transition: background .15s;
  line-height: 1.4;
}

.aai-btn:hover { background: #d97706; }

.aai-btn-sm {
  padding: 6px 12px;
  font-size: 12px;
}

/* ── Featured products grid ─────────────────────────────────────────────────── */

.aai-featured-products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 20px;
  margin: 24px 0;
}

.aai-featured-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 16px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
}

.aai-featured-item img {
  max-width: 120px;
  height: 120px;
  object-fit: contain;
  margin-bottom: 10px;
}

.aai-featured-item h4 {
  font-size: 0.9rem;
  margin: 0 0 8px;
  line-height: 1.3;
}

.aai-featured-item .aai-price {
  font-size: 1rem;
  margin-bottom: 10px;
}

/* ── Comparison table ───────────────────────────────────────────────────────── */

.aai-comparison-wrapper {
  overflow-x: auto;
  margin: 24px 0;
}

.aai-comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,.06);
}

.aai-comparison-table th,
.aai-comparison-table td {
  padding: 14px 18px;
  border: 1px solid #e5e7eb;
  text-align: center;
  vertical-align: middle;
}

.aai-comparison-table thead th {
  background: #f9fafb;
  font-weight: 600;
}

.aai-comparison-table thead th:first-child,
.aai-comparison-table tbody td:first-child {
  text-align: left;
  background: #f9fafb;
  font-weight: 600;
  color: #374151;
  white-space: nowrap;
}

.aai-comparison-table thead th img {
  max-width: 80px;
  height: 80px;
  object-fit: contain;
  display: block;
  margin: 0 auto 8px;
}

.aai-comparison-table tbody tr:hover td { background: #fffbeb; }
.aai-cta-row td { background: #fafafa; }

/* ── Reviews Grid (homepage / [affiliate_reviews] shortcode) ────────────────── */

.aai-reviews-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 24px;
  margin: 24px 0;
}

.aai-review-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 6px rgba(0,0,0,.06);
  transition: box-shadow .2s, transform .2s;
}

.aai-review-card:hover {
  box-shadow: 0 6px 18px rgba(0,0,0,.10);
  transform: translateY(-2px);
}

.aai-review-card-image-link {
  display: block;
  background: #f9fafb;
  border-bottom: 1px solid #f0f0f1;
}

.aai-review-card-image {
  width: 100%;
  height: 180px;
  object-fit: contain;
  display: block;
  padding: 12px;
}

.aai-review-card-no-image {
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 48px;
  color: #d1d5db;
}

.aai-review-card-body {
  padding: 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.aai-review-card-title {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  margin: 0 0 8px;
}

.aai-review-card-title a {
  color: inherit;
  text-decoration: none;
}

.aai-review-card-title a:hover { color: #f59e0b; }

.aai-review-card-rating {
  display: flex;
  align-items: center;
  gap: 3px;
  margin-bottom: 10px;
  font-size: 15px;
}

.aai-review-card-rating-value {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  margin-left: 4px;
}

.aai-review-card-excerpt {
  font-size: 13px;
  color: #6b7280;
  line-height: 1.6;
  margin: 0 0 16px;
  flex: 1;
}

.aai-review-card-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: auto;
}

.aai-review-card-read-more {
  font-size: 13px;
  font-weight: 600;
  color: #0ea5e9;
  text-decoration: none;
}

.aai-review-card-read-more:hover { text-decoration: underline; }

/* Smaller CTA button inside cards */
.aai-cta-btn-sm {
  display: inline-block;
  padding: 6px 12px;
  background: #f59e0b;
  color: #111 !important;
  font-weight: 700;
  font-size: 12px;
  text-decoration: none !important;
  border-radius: 6px;
  transition: background .15s;
  white-space: nowrap;
}

.aai-cta-btn-sm:hover { background: #d97706; }

.aai-no-reviews {
  color: #9ca3af;
  font-style: italic;
  padding: 20px 0;
}

/* ── End-of-article Product Summary Box ─────────────────────────────────────── */
/*
   Stacked vertical layout:
   1. Product title
   2. Product image (centred)
   3. Overall rating
   4. CTA button
   All centred inside a bordered box.
*/

.aai-product-summary-box {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  gap: 16px !important;
  padding: 28px 32px !important;
  margin: 40px auto 24px !important;
  max-width: 420px !important;
  background: #ffffff !important;
  border: 2px solid #d1d5db !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.08) !important;
  clear: both !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

/* 1. Title */
.aai-summary-title {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  color: #1e1e1e !important;
}

/* 2. Image */
.aai-summary-image-wrap {
  width: 100%;
  max-width: 260px;
}

.aai-summary-image {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
  border-radius: 8px;
}

/* 3. Rating */
.aai-summary-rating {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.aai-summary-rating-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #6b7280;
}

.aai-summary-rating .aai-stars-row {
  justify-content: center;
}

.aai-summary-rating .aai-stars {
  font-size: 22px;
}

.aai-summary-rating .aai-rating-value {
  font-size: 14px;
  font-weight: 600;
  color: #374151;
}

/* 4. CTA button — full width inside the box */
.aai-summary-btn {
  display: block;
  width: 100%;
  padding: 14px 20px;
  background: #f59e0b;
  color: #111 !important;
  font-weight: 700;
  font-size: 16px;
  text-align: center;
  text-decoration: none !important;
  border-radius: 8px;
  transition: background .15s;
  box-sizing: border-box;
}
.aai-summary-btn:hover { background: #d97706; }

/* .aai-summary-disclosure removed */