.rpa-wrap { max-width: 100%; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; color: #23272f; }
.rpa-wrap * { box-sizing: border-box; }

/* highlight strip */
.rpa-highlight-strip {
  display: flex; gap: 12px; overflow-x: auto; padding: 16px; background: #fff;
  border-radius: 10px; margin-bottom: 28px; border: 1px solid #e3e5e8;
}
.rpa-highlight-item { flex: 0 0 100px; text-align: center; }
.rpa-highlight-item a { text-decoration: none; color: inherit; }
.rpa-highlight-thumb {
  width: 72px; height: 72px; border-radius: 8px; background: #f2f3f5; margin: 0 auto 6px;
  display: flex; align-items: center; justify-content: center; color: #b7bcc4; font-size: 11px;
  border: 1px solid #e3e5e8; overflow: hidden;
}
.rpa-highlight-thumb img { width: 100%; height: 100%; object-fit: cover; }
.rpa-highlight-rank { font-size: 11px; font-weight: 700; color: #1e9e63; }
.rpa-highlight-name { font-size: 11px; color: #5a5f67; margin-top: 2px; line-height: 1.3; }

/* comparison table */
.rpa-table-scroll { overflow-x: auto; background: #fff; border-radius: 10px; border: 1px solid #e3e5e8; margin-bottom: 30px; }
table.rpa-compare { border-collapse: collapse; width: 100%; min-width: 620px; font-size: 11px; }
table.rpa-compare th {
  background: #fafbfc; text-align: left; padding: 6px 8px; font-weight: 600;
  border-bottom: 1px solid #e3e5e8; color: #3a3f47; white-space: nowrap; line-height: 1.3;
}
table.rpa-compare th.rpa-group-th { background: #e7f4ee; color: #1a7a4c; text-align: center; }
table.rpa-compare td { padding: 6px 8px; border-bottom: 1px solid #eef0f2; vertical-align: middle; line-height: 1.35; }
table.rpa-compare tr:last-child td { border-bottom: none; }
table.rpa-compare a { color: #1e6fd9; text-decoration: none; font-weight: 600; }

.rpa-rank-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 15px; height: 15px; border-radius: 50%; background: #c7cbd1; color: #fff;
  font-size: 9px; font-weight: 700; margin-right: 4px;
}
.rpa-rank-badge.rpa-rank-1 { background: #f0b429; }
.rpa-rank-badge.rpa-rank-2 { background: #9aa0a8; }
.rpa-rank-badge.rpa-rank-3 { background: #b9793a; }

.rpa-thumb-cell {
  width: 32px; height: 32px; border-radius: 5px; background: #f2f3f5; border: 1px solid #e3e5e8;
  display: flex; align-items: center; justify-content: center; color: #b7bcc4; font-size: 9px; overflow: hidden;
}
.rpa-thumb-cell img { width: 100%; height: 100%; object-fit: cover; }

.rpa-btn-store {
  display: inline-block; background: #1e9e63; color: #fff !important; font-size: 10px; font-weight: 600 !important;
  padding: 4px 7px; border-radius: 5px; margin: 1px 2px 1px 0;
}
.rpa-btn-store.rpa-alt { background: #2aad72; }

/* product detail card */
.rpa-product-card { background: #fff; border: 1px solid #e3e5e8; border-radius: 10px; padding: 22px; margin-bottom: 24px; scroll-margin-top: 20px; }
.rpa-badge-rank { display: inline-block; background: #eef0f2; color: #3a3f47; font-size: 13px; font-weight: 700; padding: 4px 12px; border-radius: 6px; margin-bottom: 10px; }
.rpa-badge-rank.rpa-top { background: #1e9e63; color: #fff; }
.rpa-product-title { font-size: 18px; font-weight: 700; margin: 0 0 16px; }
.rpa-product-main { display: flex; gap: 22px; flex-wrap: wrap; margin-bottom: 16px; }
.rpa-product-gallery { flex: 0 0 220px; }
.rpa-product-photo {
  width: 220px; height: 220px; border-radius: 8px; background: #f2f3f5; border: 1px solid #e3e5e8;
  display: flex; align-items: center; justify-content: center; color: #b7bcc4; font-size: 13px; margin-bottom: 8px; overflow: hidden;
}
.rpa-product-photo img { width: 100%; height: 100%; object-fit: cover; }
.rpa-thumb-row { display: flex; gap: 6px; }
.rpa-thumb-row .rpa-thumb-small { width: 40px; height: 40px; border-radius: 6px; background: #f2f3f5; border: 1px solid #e3e5e8; overflow: hidden; }
.rpa-thumb-row .rpa-thumb-small img { width: 100%; height: 100%; object-fit: cover; }
.rpa-thumb-row .rpa-thumb-small.rpa-active { border: 2px solid #1e9e63; }
.rpa-product-buy { flex: 1; min-width: 220px; }
.rpa-price-row { display: flex; align-items: baseline; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.rpa-price { font-size: 22px; font-weight: 700; color: #e0522a; }
.rpa-price-label { font-size: 12px; color: #9aa0a8; }
.rpa-buy-buttons a {
  display: block; background: #1e9e63; color: #fff !important; font-size: 14px; font-weight: 600;
  text-align: center; padding: 11px; border-radius: 8px; margin-bottom: 8px; text-decoration: none !important;
}
.rpa-buy-buttons a.rpa-blibi { background: #2aad72; }
.rpa-buy-buttons a.rpa-lazada { background: #17805a; }

.rpa-highlight-box { background: #eaf7f0; color: #1a7a4c; font-size: 13px; padding: 10px 12px; border-radius: 8px; margin-bottom: 16px; }

.rpa-desc-box { background: #fafbfc; border-radius: 8px; padding: 12px 14px; margin-bottom: 16px; font-size: 13px; line-height: 1.7; color: #3a3f47; }
.rpa-desc-box p { margin: 0 0 8px; }
.rpa-desc-box p:last-child { margin-bottom: 0; }
.rpa-desc-box ul, .rpa-desc-box ol { margin: 0 0 8px; padding-left: 18px; }
.rpa-desc-box ul:last-child, .rpa-desc-box ol:last-child { margin-bottom: 0; }

.rpa-kk-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.rpa-kk-col h4 { font-size: 13px; margin: 0 0 6px; }
.rpa-kk-col.rpa-plus h4 { color: #1e9e63; }
.rpa-kk-col.rpa-minus h4 { color: #d64545; }
.rpa-kk-col ul { margin: 0; padding-left: 0; font-size: 13px; line-height: 1.6; color: #3a3f47; list-style: none; }
.rpa-kk-col ul li { position: relative; padding-left: 22px; margin-bottom: 4px; }
.rpa-kk-col ul li:last-child { margin-bottom: 0; }
.rpa-kk-col.rpa-plus ul li::before {
  content: "\2713"; position: absolute; left: 0; top: 0; color: #1e9e63; font-weight: 700; font-size: 13px;
}
.rpa-kk-col.rpa-minus ul li::before {
  content: "\2715"; position: absolute; left: 0; top: 0; color: #d64545; font-weight: 700; font-size: 12px;
}

.rpa-spec-table { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: auto; }
.rpa-spec-table td { padding: 8px 10px 8px 4px; border-bottom: 1px solid #eef0f2; }
.rpa-spec-table td.rpa-k { color: #9aa0a8; white-space: nowrap; width: 1%; }
.rpa-varian-table { margin-bottom: 16px; }
.rpa-varian-table td { text-align: center; }
.rpa-varian-table td.rpa-k { white-space: normal; width: auto; font-weight: 600; color: #3a3f47; }

/* byline: reviewer + tanggal update */
.rpa-byline {
  display: flex; flex-wrap: wrap; gap: 4px 16px; justify-content: space-between;
  font-size: 12px; color: #7a7f87; padding: 10px 14px; background: #fafbfc;
  border: 1px solid #e3e5e8; border-radius: 8px; margin-bottom: 20px;
}
.rpa-byline strong { color: #3a3f47; }

/* badge khusus di kartu produk */
.rpa-badge-khusus {
  display: inline-block; background: #fdf0d5; color: #a6690a; font-size: 12px; font-weight: 700;
  padding: 4px 12px; border-radius: 6px; margin-bottom: 10px; margin-left: 6px;
}

/* chip (cocok untuk & sertifikasi) */
.rpa-chip-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.rpa-chip {
  display: inline-block; background: #eef2ff; color: #3452c7; font-size: 12px; font-weight: 600;
  padding: 4px 10px; border-radius: 999px;
}
.rpa-chip-sert { background: #eaf7f0; color: #1a7a4c; }

/* skor penilaian (bar) */
.rpa-skor-box { margin-bottom: 16px; }
.rpa-skor-row { display: grid; grid-template-columns: 110px 1fr 32px; align-items: center; gap: 8px; margin-bottom: 6px; }
.rpa-skor-row:last-child { margin-bottom: 0; }
.rpa-skor-label { font-size: 12px; color: #5a5f67; }
.rpa-skor-bar { background: #eef0f2; border-radius: 999px; height: 8px; overflow: hidden; }
.rpa-skor-fill { display: block; height: 100%; background: #1e9e63; border-radius: 999px; }
.rpa-skor-nilai { font-size: 12px; font-weight: 700; color: #3a3f47; text-align: right; }

/* cara pakai */
.rpa-carapakai-box { background: #fafbfc; border-radius: 8px; padding: 12px 14px; margin-bottom: 16px; }
.rpa-carapakai-box h4 { font-size: 13px; margin: 0 0 8px; color: #3a3f47; }
.rpa-carapakai-box ol { margin: 0; padding-left: 18px; font-size: 13px; line-height: 1.7; color: #3a3f47; }

/* kandungan lengkap (collapsible) */
.rpa-kandungan-detail { margin-bottom: 8px; font-size: 13px; }
.rpa-kandungan-detail summary { cursor: pointer; color: #1e6fd9; font-weight: 600; }
.rpa-kandungan-detail p { margin: 8px 0 0; color: #5a5f67; line-height: 1.6; }

/* FAQ */
.rpa-faq-wrap { margin-top: 8px; }
.rpa-faq-title { font-size: 18px; font-weight: 700; margin: 0 0 12px; }
.rpa-faq-item {
  background: #fff; border: 1px solid #e3e5e8; border-radius: 8px; padding: 12px 14px; margin-bottom: 8px; font-size: 13px;
}
.rpa-faq-item summary { cursor: pointer; font-weight: 600; color: #3a3f47; }
.rpa-faq-item p { margin: 8px 0 0; color: #5a5f67; line-height: 1.6; }

@media (max-width: 640px) {
  .rpa-product-main { flex-direction: column; }
  .rpa-product-gallery, .rpa-product-photo { width: 100%; }
  .rpa-kk-grid { grid-template-columns: 1fr; }
  .rpa-spec-table td.rpa-k { white-space: normal; width: auto; }
  .rpa-byline { flex-direction: column; }
  .rpa-skor-row { grid-template-columns: 90px 1fr 28px; }
}