/* ============================================================
   TEC8 REVIEWS — componentes visuais
   Paleta: escuro #191919/#232323, claro #e7e7e7/#f3f3f3, Inter
   Cor de destaque (CTA): laranja #ff6a00 (alto contraste p/ conversão)
   ============================================================ */

:root {
  --tec8-cta: #ff6a00;
  --tec8-cta-hover: #ff7d22;
  --tec8-ok: #1db954;
  --tec8-ruim: #e23b3b;
  --tec8-medio: #f5a623;
}

/* Caixa base de todos os componentes */
.tec8-box {
  margin: 30px 0;
  padding: 26px;
  background-color: #202020;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  font-family: 'Inter', sans-serif;
  color: #fff;
}
html.theme-white .tec8-box {
  background-color: #fff;
  border-color: rgba(0,0,0,.08);
  color: #222;
  box-shadow: 0 4px 20px rgba(0,0,0,.05);
}

/* -------- Botão CTA (usado em vários componentes) -------- */
.tec8-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 15px 30px;
  background-color: var(--tec8-cta);
  color: #fff !important;
  font-weight: 700; font-size: 16px;
  border-radius: 14px;
  text-decoration: none;
  transition: background-color .2s ease, transform .15s ease;
}
.tec8-btn:hover { background-color: var(--tec8-cta-hover); transform: translateY(-2px); color:#fff !important; }
.tec8-btn--lg { padding: 18px 40px; font-size: 18px; }
.tec8-btn--outline {
  background: transparent; border: 2px solid var(--tec8-cta);
  color: var(--tec8-cta) !important;
}
.tec8-btn--outline:hover { background: var(--tec8-cta); color:#fff !important; }
.tec8-btn-arrow { transition: transform .2s ease; }
.tec8-btn:hover .tec8-btn-arrow { transform: translateX(4px); }
.tec8-cta-wrap { text-align: center; margin: 26px 0; }

/* -------- Selo -------- */
.tec8-selo {
  display: inline-block;
  padding: 6px 16px;
  border-radius: 30px;
  font-weight: 700; font-size: 13px;
  text-transform: uppercase; letter-spacing: .5px;
}
.tec8-selo--ok    { background: rgba(29,185,84,.15);  color: var(--tec8-ok); }
.tec8-selo--medio { background: rgba(245,166,35,.15); color: var(--tec8-medio); }
.tec8-selo--ruim  { background: rgba(226,59,59,.15);  color: var(--tec8-ruim); }

/* ============ 1) FICHA DE AVALIAÇÃO ============ */
.tec8-aval-top { display: grid; grid-template-columns: auto 1fr; gap: 30px; align-items: center; }
.tec8-aval-nota { text-align: center; }
.tec8-nota-num { font-size: 56px; font-weight: 800; line-height: 1; color: var(--tec8-cta); }
.tec8-nota-max { font-size: 20px; opacity: .6; }
.tec8-estrelas {
  position: relative; display: inline-block; margin: 10px auto 12px;
  font-size: 20px; line-height: 1; width: 120px; height: 20px;
  background: linear-gradient(90deg,#555 0 100%);
  -webkit-mask: repeating-linear-gradient(90deg,#000 0 18px,transparent 18px 24px);
          mask: repeating-linear-gradient(90deg,#000 0 18px,transparent 18px 24px);
}
.tec8-estrelas-fill { position: absolute; top:0; left:0; height:100%; background: #ffb400; }
html.theme-white .tec8-estrelas { background: linear-gradient(90deg,#ccc 0 100%); }
.tec8-aval-nota .tec8-selo { display: block; margin-top: 4px; }

.tec8-aval-criterios { display: flex; flex-direction: column; gap: 12px; }
.tec8-criterio { display: grid; grid-template-columns: 110px 1fr 32px; gap: 12px; align-items: center; font-size: 14px; }
.tec8-criterio-nome { opacity: .8; }
.tec8-criterio-bar { height: 8px; background: rgba(128,128,128,.2); border-radius: 10px; overflow: hidden; }
.tec8-criterio-bar span { display: block; height: 100%; background: var(--tec8-cta); border-radius: 10px; }
.tec8-criterio-val { font-weight: 700; text-align: right; }
.tec8-avaliacao .tec8-btn { display: flex; justify-content: center; margin-top: 24px; }

/* ============ 3) RECLAME AQUI ============ */
.tec8-ra-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.tec8-ra-title { font-weight: 700; font-size: 18px; }
.tec8-ra-title i { color: var(--tec8-cta); margin-right: 6px; }
.tec8-ra-status { padding: 5px 14px; background: rgba(29,185,84,.15); color: var(--tec8-ok); border-radius: 30px; font-size: 13px; font-weight: 700; }
.tec8-ra-grid { display: grid; grid-template-columns: auto 1fr; gap: 28px; align-items: center; }
.tec8-ra-nota { text-align: center; padding-right: 28px; border-right: 1px solid rgba(128,128,128,.2); }
.tec8-ra-nota-num { display: block; font-size: 44px; font-weight: 800; color: var(--tec8-cta); line-height: 1; }
.tec8-ra-nota-lbl { font-size: 13px; opacity: .6; }
.tec8-ra-indicadores { display: flex; flex-direction: column; gap: 14px; }
.tec8-ra-item-top { display: flex; justify-content: space-between; font-size: 14px; margin-bottom: 5px; }
.tec8-ra-bar { display: block; height: 8px; background: rgba(128,128,128,.2); border-radius: 10px; overflow: hidden; }
.tec8-ra-bar span { display: block; height: 100%; background: var(--tec8-ok); border-radius: 10px; }
.tec8-ra-link { display: inline-block; margin-top: 18px; color: var(--tec8-cta) !important; font-weight: 600; font-size: 14px; text-decoration: none; }

/* ============ 4) PRÓS E CONTRAS ============ */
.tec8-pc-titulo { margin-bottom: 20px; font-size: 22px; font-weight: 700; }
.tec8-pc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.tec8-pc-col h4 { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; font-size: 17px; font-weight: 700; }
.tec8-pc-pros h4 { color: #1db954 !important; }
.tec8-pc-contras h4 { color: #e23b3b !important; }
.tec8-pc-col ul { list-style: none; margin: 0; padding: 0; }
.tec8-pc-col li { position: relative; padding: 8px 0 8px 26px; font-size: 15px; line-height: 1.4; border-bottom: 1px solid rgba(128,128,128,.12); }
.tec8-pc-col li:last-child { border-bottom: none; }
html.theme-white .tec8-pc-col li { color: #222; }
html.theme-white .tec8-pc-titulo { color: #222; }
.tec8-pc-pros li::before { content: '✓'; position: absolute; left: 0; top: 8px; color: #1db954 !important; font-weight: 800; }
.tec8-pc-contras li::before { content: '✕'; position: absolute; left: 0; top: 8px; color: #e23b3b !important; font-weight: 800; }

/* ============ 5) CUPOM ============ */
.tec8-cupom { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px; border: 2px dashed var(--tec8-cta); }
.tec8-cupom-desconto { display: block; font-size: 30px; font-weight: 800; color: var(--tec8-cta); }
.tec8-cupom-desc { font-size: 15px; opacity: .8; }
.tec8-cupom-codigo { display: flex; align-items: center; gap: 0; border: 2px solid var(--tec8-cta); border-radius: 12px; overflow: hidden; }
.tec8-cupom-label { padding: 12px 16px; background: rgba(255,106,0,.12); font-size: 13px; font-weight: 700; text-transform: uppercase; color: var(--tec8-cta); }
.tec8-cupom-code { padding: 12px 20px; font-size: 20px; font-weight: 800; letter-spacing: 1px; }
.tec8-cupom-copy { padding: 12px 20px; background: var(--tec8-cta); color: #fff; border: none; font-weight: 700; font-size: 14px; cursor: pointer; transition: background .2s ease; }
.tec8-cupom-copy:hover { background: var(--tec8-cta-hover); }
.tec8-cupom-copy.copiado { background: var(--tec8-ok); }

/* ============ 6) VEREDITO ============ */
.tec8-veredito { background: linear-gradient(180deg, rgba(255,106,0,.06), transparent); border-color: rgba(255,106,0,.25); }
html.theme-white .tec8-veredito { background: linear-gradient(180deg, rgba(255,106,0,.05), #fff); }
.tec8-veredito-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.tec8-veredito-title { font-size: 22px; font-weight: 800; }
.tec8-veredito-nota { font-size: 38px; font-weight: 800; color: var(--tec8-cta); line-height: 1; }
.tec8-veredito-nota small { font-size: 18px; opacity: .6; }
.tec8-veredito-texto { margin: 16px 0 22px; line-height: 1.6; font-size: 16px; }
.tec8-veredito-texto p { margin-bottom: 12px; }
.tec8-veredito .tec8-btn { display: flex; justify-content: center; }

/* ============ RESPONSIVO ============ */
@media (max-width: 680px) {
  .tec8-box { padding: 20px; }
  .tec8-aval-top { grid-template-columns: 1fr; gap: 22px; }
  .tec8-ra-grid { grid-template-columns: 1fr; gap: 20px; }
  .tec8-ra-nota { padding-right: 0; padding-bottom: 20px; border-right: none; border-bottom: 1px solid rgba(128,128,128,.2); }
  .tec8-pc-grid { grid-template-columns: 1fr; }
  .tec8-cupom-code { font-size: 17px; }
}

/* ============ 7) FAQ (acordeão) ============ */
/* Seletores reforçados (.tec8-faq ...) para vencer o reset agressivo do tema */
.tec8-box.tec8-faq { padding: 26px; }
.tec8-faq .tec8-faq-titulo { margin: 0 0 20px 0 !important; font-size: 24px !important; font-weight: 800 !important; line-height: 1.2 !important; }
.tec8-faq .tec8-faq-lista { display: flex !important; flex-direction: column; gap: 12px; }

.tec8-faq .tec8-faq-item {
  display: block !important;
  border: 1px solid rgba(128,128,128,.18);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(128,128,128,.04);
  transition: border-color .2s ease, background .2s ease;
}
.tec8-faq .tec8-faq-item[open] { border-color: var(--tec8-cta); background: rgba(255,106,0,.04); }

.tec8-faq .tec8-faq-item summary {
  list-style: none !important;
  cursor: pointer;
  margin: 0 !important;
  padding: 18px 22px !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
  display: flex !important;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: color .15s ease;
}
.tec8-faq .tec8-faq-item summary::-webkit-details-marker { display: none !important; }
.tec8-faq .tec8-faq-item summary::marker { content: '' !important; }

/* ícone + que vira x */
.tec8-faq .tec8-faq-item summary::after {
  content: '+' !important;
  flex-shrink: 0;
  width: 26px; height: 26px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(128,128,128,.15);
  font-size: 20px; font-weight: 700;
  color: #999;
  line-height: 1;
  transition: background .2s ease, transform .25s ease, color .2s ease;
}
.tec8-faq .tec8-faq-item[open] summary::after { background: rgba(255,106,0,.15); transform: rotate(45deg); color: var(--tec8-cta); }
.tec8-faq .tec8-faq-item[open] summary { color: var(--tec8-cta); }

.tec8-faq .tec8-faq-resposta {
  padding: 0 22px 20px 22px !important;
  line-height: 1.65 !important;
  font-size: 15px !important;
  opacity: .92;
}
html.theme-white .tec8-faq .tec8-faq-item { background: #fafafa; }
html.theme-white .tec8-faq .tec8-faq-item[open] { background: rgba(255,106,0,.04); }

/* ============================================================
   ===== REVIEW DE PRODUTOS (v1.4) =====
   ============================================================ */

/* ----- Estrelas 0-5 ----- */
.tec8-stars5 { position: relative; display: inline-block; font-size: 16px; line-height: 1; font-family: Arial, sans-serif; color: #d9d9d9; }
.tec8-stars5::before { content: '★★★★★'; letter-spacing: 2px; }
.tec8-stars5-fill { position: absolute; top: 0; left: 0; overflow: hidden; white-space: nowrap; color: #f5a623; }
.tec8-stars5-fill::before { content: '★★★★★'; letter-spacing: 2px; }

/* ----- TABELA COMPARATIVA ----- */
.tec8-tabela-wrap { padding: 0; overflow: hidden; }
.tec8-tabela-titulo { margin: 0; padding: 20px 24px; font-size: 20px; font-weight: 700; border-bottom: 2px solid var(--tec8-laranja, #FF6A00); }
.tec8-tabela-scroll { width: 100%; overflow-x: auto; }
.tec8-tabela { width: 100%; border-collapse: collapse; }
.tec8-tabela thead th { padding: 14px 18px; text-align: left; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; background: #111; color: #fff; }
.tec8-tabela tbody td { padding: 18px; border-bottom: 1px solid rgba(128,128,128,.15); vertical-align: middle; }
.tec8-tabela tbody tr:last-child td { border-bottom: none; }
.tec8-th-img, .tec8-td-img { width: 130px; }
.tec8-td-img { position: relative; text-align: center; }
.tec8-tabela-img { width: 90px; height: 90px; object-fit: contain; border-radius: 8px; }
.tec8-tabela-badge { display: inline-block; margin-bottom: 8px; padding: 3px 10px; background: var(--tec8-laranja, #FF6A00); color: #fff; border-radius: 20px; font-size: 11px; font-weight: 700; }
.tec8-td-nome strong { font-size: 16px; font-weight: 700; line-height: 1.3; }
.tec8-tabela-specs { list-style: none; margin: 0; padding: 0; }
.tec8-tabela-specs li { font-size: 13px; line-height: 1.6; opacity: .85; }
.tec8-btn-tabela { display: inline-block; padding: 12px 20px; background: var(--tec8-laranja, #FF6A00); color: #fff; border-radius: 10px; font-weight: 700; font-size: 14px; text-align: center; white-space: nowrap; transition: transform .15s ease, background .2s ease; }
.tec8-btn-tabela:hover { transform: translateY(-2px); background: #ff7d22; color: #fff; }

/* ----- CARD DE PRODUTO ----- */
.tec8-produto { padding: 0; overflow: hidden; }
.tec8-produto-class { padding: 12px 24px; background: var(--tec8-laranja, #FF6A00); color: #fff; font-weight: 700; font-size: 15px; text-align: center; }
.tec8-produto-top { display: flex; gap: 24px; padding: 24px; align-items: center; }
.tec8-produto-info { flex: 1; min-width: 0; }
.tec8-produto-nome { margin: 0 0 4px; font-size: 22px; font-weight: 700; line-height: 1.2; }
.tec8-produto-sub { margin: 0 0 16px; font-size: 14px; opacity: .7; }
.tec8-produto-criterios { display: flex; flex-direction: column; gap: 10px; }
.tec8-prod-crit { display: flex; align-items: center; gap: 12px; }
.tec8-prod-crit-nome { min-width: 130px; font-size: 14px; font-weight: 600; }
.tec8-prod-crit--final .tec8-prod-crit-nome { color: var(--tec8-laranja, #FF6A00); font-weight: 700; }
.tec8-produto-media { position: relative; flex-shrink: 0; width: 180px; text-align: center; }
.tec8-produto-img { width: 100%; max-width: 180px; height: auto; max-height: 180px; object-fit: contain; }
.tec8-produto-selo { position: absolute; top: -8px; right: -8px; padding: 6px 12px; background: #1db954; color: #fff; border-radius: 8px; font-size: 12px; font-weight: 700; z-index: 2; }
.tec8-produto-desc { padding: 0 24px 20px; font-size: 16px; line-height: 1.7; }
.tec8-produto-desc p { margin: 0 0 14px; }
.tec8-produto-cta { display: block; margin: 0 24px 24px; }

/* ----- BLOCO "NOSSA OPINIÃO" ----- */
.tec8-opiniao { border-left: 4px solid var(--tec8-laranja, #FF6A00); }
.tec8-opiniao-titulo { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 19px; font-weight: 700; }
.tec8-opiniao-icone { font-size: 28px; color: var(--tec8-laranja, #FF6A00); line-height: 1; }
.tec8-opiniao-texto { font-size: 16px; line-height: 1.7; }
.tec8-opiniao-texto p { margin: 0 0 12px; }
.tec8-opiniao-texto p:last-child { margin-bottom: 0; }

/* ----- GUIA DO COMPRADOR ----- */
.tec8-guia-titulo { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; font-size: 22px; font-weight: 700; }
.tec8-guia-icone { font-size: 24px; line-height: 1; }
.tec8-guia-conteudo { font-size: 16px; line-height: 1.7; }
.tec8-guia-conteudo h4 { display: flex; align-items: center; gap: 10px; margin: 28px 0 12px; padding: 12px 16px; font-size: 18px; font-weight: 700; color: #fff; background: var(--tec8-laranja, #FF6A00); border-radius: 10px; }
.tec8-guia-conteudo h4:first-child { margin-top: 0; }
.tec8-guia-conteudo p { margin: 0 0 16px; padding: 0 4px; }
.tec8-guia-conteudo ul { margin: 0 0 16px; padding-left: 8px; list-style: none; }
.tec8-guia-conteudo ul li { position: relative; margin-bottom: 12px; padding-left: 28px; line-height: 1.6; }
.tec8-guia-conteudo ul li::before { content: '✓'; position: absolute; left: 0; top: 0; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; background: rgba(255,106,0,.15); color: var(--tec8-laranja, #FF6A00); border-radius: 50%; font-size: 12px; font-weight: 800; }
.tec8-guia-conteudo ul li strong { color: var(--tec8-laranja, #FF6A00); }

/* ----- RESPONSIVO ----- */
@media (max-width: 600px) {
  .tec8-produto-top { flex-direction: column; align-items: flex-start; }
  .tec8-produto-media { width: 100%; max-width: 100%; margin-top: 10px; }
  .tec8-produto-img { max-width: 140px; }
  .tec8-prod-crit-nome { min-width: 110px; font-size: 13px; }
  .tec8-tabela thead { display: none; }
  .tec8-tabela tbody td { display: block; width: 100% !important; padding: 10px 16px; text-align: center; }
  .tec8-tabela tbody tr { display: block; border-bottom: 2px solid rgba(128,128,128,.2); padding: 12px 0; }
  .tec8-tabela-specs { text-align: center; }
  .tec8-td-nome { text-align: center; }
}

/* ----- TEMA CLARO ----- */
html.theme-white .tec8-tabela tbody td { color: #222; }
html.theme-white .tec8-produto-nome,
html.theme-white .tec8-opiniao-titulo,
html.theme-white .tec8-guia-titulo { color: #1a1a1a; }
html.theme-white .tec8-produto-desc,
html.theme-white .tec8-opiniao-texto,
html.theme-white .tec8-guia-conteudo { color: #222; }
html.theme-white .tec8-guia-conteudo h4 { color: #fff; }
html.theme-white .tec8-prod-crit-nome { color: #333; }

/* ============================================================
   ===== MINI-TABELA DE SPECS NO CARD (v1.6) =====
   ============================================================ */
.tec8-produto-specs-wrap { padding: 0 24px 20px; }
.tec8-produto-specs { width: 100%; border-collapse: collapse; border-radius: 10px; overflow: hidden; }
.tec8-produto-specs tr { border-bottom: 1px solid rgba(128,128,128,.15); }
.tec8-produto-specs tr:last-child { border-bottom: none; }
.tec8-spec-label { padding: 10px 16px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; width: 40%; background: rgba(255,106,0,.08); color: var(--tec8-laranja, #FF6A00); }
.tec8-spec-valor { padding: 10px 16px; font-size: 14px; }

/* ============================================================
   ===== BOX "MONTAR PC" + QUALPCGAMER (v1.6) =====
   ============================================================ */
.tec8-montar-pc { display: flex; align-items: center; gap: 20px; padding: 28px; background: linear-gradient(135deg, rgba(255,106,0,.12), rgba(255,106,0,.04)); border: 2px solid rgba(255,106,0,.3); }
.tec8-montar-icone { font-size: 56px; line-height: 1; flex-shrink: 0; }
.tec8-montar-conteudo { flex: 1; min-width: 0; }
.tec8-montar-titulo { margin: 0 0 8px; font-size: 22px; font-weight: 800; }
.tec8-montar-texto { margin: 0 0 16px; font-size: 16px; line-height: 1.6; opacity: .9; }
.tec8-montar-extra { font-size: 15px; margin-bottom: 16px; }
.tec8-montar-btn { display: inline-block; padding: 14px 28px; background: var(--tec8-laranja, #FF6A00); color: #fff; border-radius: 12px; font-weight: 700; font-size: 16px; transition: transform .15s ease, background .2s ease; }
.tec8-montar-btn:hover { transform: translateY(-2px); background: #ff7d22; color: #fff; }

@media (max-width: 600px) {
  .tec8-montar-pc { flex-direction: column; text-align: center; }
  .tec8-montar-icone { font-size: 48px; }
}

/* tema claro */
html.theme-white .tec8-spec-valor { color: #222; }
html.theme-white .tec8-montar-titulo { color: #1a1a1a; }
html.theme-white .tec8-montar-texto { color: #333; }

