/* GramTurbo Auditor - UI alinhada ao site (Poppins + ajustes visuais) */

.gt-auditor-wrap{
  width:100%;
  display:flex;
  justify-content:center;
  padding: 20px 12px;
  font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
}
.gt-auditor-wrap *{
  font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
}

.gt-auditor-card{
  width:min(980px, 100%);
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:18px;
  box-shadow: 0 16px 40px rgba(0,0,0,.08);
  overflow:hidden;
}

/* Header com gradiente leve (mantém vibe do site) */
.gt-auditor-head{
  padding: 26px 22px 18px;
  text-align:center;
  background: linear-gradient(180deg, rgba(221,46,114,.08), rgba(242,88,69,.04) 60%, rgba(255,255,255,1));
}

/* Pill: agora fundo branco e texto #54595F */
.gt-auditor-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 10px 14px;
  border-radius:999px;
  background: #fff; /* antes era rosa */
  border:1px solid rgba(0,0,0,.10);
  font-weight:600; /* mais leve */
  letter-spacing:.2px;
  font-size:12px;
  text-transform:uppercase;
  color:#54595F; /* pedido */
}
.gt-auditor-pill-ico{
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background: rgba(242,88,69,.14);
}

/* Título mais leve e com tamanho padrão do seu site */
.gt-auditor-title{
  margin: 14px 0 6px;
  font-size:28px; /* pedido: 25–28 */
  line-height:1.12;
  font-weight:600; /* pedido */
  color:#111;
}
.gt-auditor-subtitle{
  margin:0 auto;
  max-width: 760px;
  opacity:.9;
  font-size:15px;
  font-weight:400;
  color:#54595F;
}

/* Radios com peso menor */
.gt-auditor-modes{
  margin-top:16px;
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
}
.gt-auditor-radio{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 10px 14px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.10);
  background:#fff;
  cursor:pointer;
  font-weight:500; /* mais leve */
  color:#111;
}
.gt-auditor-radio input{
  transform: translateY(1px);
  accent-color: #dd2e72;
}

/* Form central */
.gt-auditor-form{
  margin-top:16px;
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
}

/* Input do @ no estilo "campo clean" (igual referência) */
.gt-auditor-input{
  width: min(600px, 100%);
  height: 44px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(0,0,0,.06);
  font-size: 14px;
  font-weight: 500;
  color: #111;
  outline: none;
  box-shadow: none;
}

.gt-auditor-input::placeholder{
  color: rgba(17,17,17,.55);
  font-weight: 400;
}

/* Focus bem suave, sem "borda gritante" */
.gt-auditor-input:focus{
  background: rgba(0,0,0,.04);
  border-color: rgba(221,46,114,.25);
  box-shadow: 0 0 0 3px rgba(221,46,114,.10);
}

/* Botões no “estilo do site” */
.gt-auditor-btn{
  padding: 14px 18px;
  border-radius:999px; /* mais “site” */
  border: 1px solid rgba(221,46,114,.35);
  background: transparent;
  cursor:pointer;
  font-weight:600; /* menos pesado */
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:#dd2e72;
  text-decoration:none;
  transition: all .15s ease;
}
.gt-auditor-btn:hover{
  background: rgba(221,46,114,.08);
  transform: translateY(-1px);
}
.gt-auditor-btn-solid{
  background: linear-gradient(90deg, #dd2e72, #ba32a0);
  border: none;
  color:#fff !important;
  box-shadow: 0 10px 24px rgba(221,46,114,.18);
}
.gt-auditor-btn-solid:hover{
  filter: brightness(1.04);
  box-shadow: 0 12px 28px rgba(221,46,114,.22);
}
.gt-auditor-btn-ico{
  display:inline-flex;
  width:22px;
  height:22px;
  border-radius:999px;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.18);
}

/* Hint */
.gt-auditor-hint{
  margin-top:12px;
  opacity:.75;
  font-size:13px;
  font-weight:400;
  color:#54595F;
}

/* Output central */
.gt-auditor-out{
  padding: 16px 22px 22px;
  display:flex;
  justify-content:center;
}
.gt-auditor-result{
  width:100%;
  max-width: 920px;
  border:1px solid rgba(0,0,0,.06);
  border-radius:18px;
  padding:18px;
  background:#fff;
}

/* Top row */
.gt-auditor-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  flex-wrap:wrap;
}
.gt-auditor-user{ text-align:left; }
.gt-auditor-badge{
  font-size:12px;
  opacity:.75;
  margin-bottom:6px;
  color:#54595F;
  font-weight:500;
}
.gt-auditor-handle{
  font-size:20px;
  font-weight:600; /* menos pesado */
  color:#111;
}
.gt-auditor-name{
  margin-top:2px;
  font-weight:500;
  opacity:.85;
  color:#54595F;
}
.gt-auditor-score{
  font-size:34px;
  font-weight:700;
  color:#111;
}
.gt-auditor-score span{
  font-size:14px;
  font-weight:600;
  opacity:.75;
  color:#54595F;
}

/* Metrics */
.gt-auditor-metrics{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:12px;
  justify-content:flex-start;
}
.gt-auditor-metric{
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.06);
  background: rgba(0,0,0,.02);
  font-weight:600;
  font-size:13px;
  color:#111;
}
.gt-auditor-metric strong{ font-weight:700; }

/* Sections */
.gt-auditor-sections{
  margin-top:14px;
  text-align:left;
}
.gt-auditor-sec-title{
  margin: 0 0 8px;
  font-size:15px;
  font-weight:600;
  color:#111;
}
.gt-auditor-bar{ margin: 10px 0; }
.gt-auditor-bar-top{
  display:flex;
  justify-content:space-between;
  font-weight:600; /* menos pesado */
  font-size:13px;
  color:#111;
}
.gt-auditor-track{
  height: 10px;
  border-radius:999px;
  background: rgba(0,0,0,.10);
  overflow:hidden;
  margin-top:6px;
}
.gt-auditor-fill{
  height:10px;
  width:0%;
  border-radius:999px;
  background: linear-gradient(90deg, #dd2e72, #ba32a0);
}

/* Level box */
.gt-auditor-level{
  margin-top:16px;
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(221,46,114,.18);
  background: rgba(221,46,114,.06);
  text-align:left;
}
.gt-auditor-level-title{
  font-weight:600;
  margin-bottom:6px;
  color:#111;
}
.gt-auditor-level-msg{
  opacity:.9;
  font-weight:400;
  line-height:1.45;
  color:#54595F;
}

/* Insights */
.gt-auditor-insights{
  margin-top:14px;
  text-align:left;
}
.gt-auditor-insights ul{
  margin: 8px 0 0;
  padding-left: 18px;
  color:#111;
}
.gt-auditor-insights li{
  margin: 6px 0;
  color:#111;
  font-weight:400;
}

/* CTA box */
.gt-auditor-cta{
  margin-top:16px;
  padding: 14px;
  border-radius:16px;
  border:1px solid rgba(0,0,0,.06);
  background: rgba(0,0,0,.02);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.gt-auditor-cta-title{ font-weight:600; color:#111; }
.gt-auditor-cta-sub{
  opacity:.85;
  font-weight:400;
  margin-top:2px;
  color:#54595F;
}

/* Actions */
.gt-auditor-actions{
  margin-top:16px;
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}

/* Força botão final como sólido (override do botão outline) */
.gt-auditor-actions .gt-auditor-btn.gt-auditor-btn{
  background: #dd2e72 !important;
  color: #fff !important;
  border: none !important;
  box-shadow: none !important;
  padding: 14px 28px;
  border-radius: 999px;
}

.gt-auditor-actions .gt-auditor-btn.gt-auditor-btn:hover{
  background: #e23a82 !important;
  transform: none !important;
}

/* Bottom CTA */
.gt-auditor-bottom-cta{
  border-top:1px solid rgba(0,0,0,.06);
  padding: 18px 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.gt-auditor-bottom-cta-text{
  font-weight:600;
  opacity:.9;
  color:#111;
}
.gt-auditor-bottom-cta-text span{
  display:block;
  opacity:.8;
  font-weight:400;
  margin-top:4px;
  color:#54595F;
}

/* Error */
.gt-auditor-error{
  width:100%;
  max-width: 920px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(242,88,69,.25);
  background: rgba(242,88,69,.08);
  color:#7a1b16;
  font-weight:600;
}

@media (max-width: 680px){
  .gt-auditor-title{ font-size:26px; }
  .gt-auditor-score{ font-size:30px; }
  .gt-auditor-head{ padding: 22px 14px 16px; }
  .gt-auditor-out{ padding: 14px 14px 18px; }
  .gt-auditor-bottom-cta{ padding: 16px 14px; }
}
/* Link minimalista (estilo "Selecionar >") */
.gt-auditor-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0;
  border: 0;
  background: transparent;

  color: #dd2e72 !important; /* força o rosinha */
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}

.gt-auditor-link:hover {
  text-decoration: underline;
  color: #dd2e72 !important;
}

.gt-auditor-link::after {
  content: " >";
  font-weight: 600;
}
/* Nível por seguidores - barra visual */
.gt-auditor-level-bar {
  margin-top: 10px;
}

.gt-auditor-level-bar-top {
  display: flex;
  justify-content: space-between;
  font-weight: 600;
  font-size: 13px;
  color: #111;
  margin-bottom: 6px;
}

.gt-auditor-level-bar-track {
  height: 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.10);
  overflow: hidden;
}

.gt-auditor-level-bar-fill {
  height: 10px;
  width: 0%;
  border-radius: 999px;
  background: linear-gradient(90deg, #dd2e72, #ba32a0);
}

/* CTA: botão centralizado (apenas no card CTA) */
.gt-auditor-cta {
  justify-content: center;
  text-align: center;
}

.gt-auditor-cta > div {
  width: 100%;
}

.gt-auditor-cta .gt-auditor-btn-solid {
  margin: 6px auto 0;
}
