/*
  GuiaPJ KB – Estilo inspirado nas páginas de Suporte/FAQ.
  Objetivo: visual moderno (hero em gradiente + cards + accordion) sem depender do tema.
*/

/* Evita “título duplicado” do tema na página do portal */
body.gpj-kb-portal .entry-title{display:none !important;}

/* App container (escopo) */
.gpj-kb-app{
  font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:#f8fafc;
  --gpj-border: rgba(15,23,42,.10);
  --gpj-text: #0f172a;
  --gpj-muted: #64748b;
  --gpj-surface: rgba(255,255,255,.86);
  --gpj-shadow: 0 10px 30px rgba(2,6,23,.10);
  --gpj-shadow-hover: 0 16px 44px rgba(2,6,23,.14);
  --gpj-radius: 18px;
  color: var(--gpj-text);
  border-radius: 22px;
  overflow:hidden;
}

.gpj-kb-app *{box-sizing:border-box;}

.gpj-kb-container{max-width:1100px;margin:0 auto;padding:0 16px;}

/* Fundo decorativo só dentro do plugin */
.gpj-kb-main{position:relative;padding: 22px 0 26px 0;}
.gpj-kb-main:before{
  content:'';
  position:absolute;
  inset:-40px -10px auto -10px;
  height: 340px;
  z-index:0;
  background:
    radial-gradient(700px 220px at 15% 0%, rgba(37,99,235,.10), transparent 60%),
    radial-gradient(650px 220px at 85% 10%, rgba(6,182,212,.09), transparent 60%);
  pointer-events:none;
}
.gpj-kb-main > .gpj-kb-container{position:relative;z-index:1;}

/* HERO (gradiente) */
.gpj-kb-app .gradient-bg{
  position: relative;
  color:#fff;
  background:
    radial-gradient(1200px 600px at 10% 0%, rgba(37,99,235,.45), transparent 60%),
    radial-gradient(900px 520px at 82% 15%, rgba(6,182,212,.35), transparent 55%),
    linear-gradient(135deg, #0b1220, #0a1630 55%, #071225);
}

.gpj-kb-app .gradient-bg:before{
  content:'';
  position:absolute;
  inset:0;
  background-image: radial-gradient(rgba(255,255,255,.10) 1px, transparent 1px);
  background-size: 18px 18px;
  opacity:.22;
  pointer-events:none;
  mix-blend-mode: overlay;
}

.gpj-kb-hero{padding: 26px 0 24px 0;}
.gpj-kb-hero__inner{position:relative;z-index:1;}

.gpj-kb-hero__title{margin:0;font-weight: 900;letter-spacing:-.02em;font-size: 28px;}
@media (min-width: 768px){.gpj-kb-hero__title{font-size: 34px;}}

.gpj-kb-hero__subtitle{margin-top:8px;color: rgba(255,255,255,.85);max-width: 72ch;}

/* Chips (atalhos) */
.gpj-kb-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}


/* Pills */
.gpj-kb-app .gpj-pill{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color: rgba(255,255,255,.92);
  border-radius: 999px;
  padding:.35rem .75rem;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing:.02em;
  backdrop-filter: blur(10px);
}

.gpj-kb-hero__pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}

/* Inputs & buttons (mesmo “feeling” do padrão GuiaPJ) */
.gpj-kb-app .gpj-input{
  width:100%;
  border:1px solid rgba(15,23,42,.16);
  border-radius: 14px;
  padding: 12px;
  outline:none;
  background: rgba(255,255,255,.96);
}

.gpj-kb-app .gpj-input:focus{
  border-color: rgba(37,99,235,.55);
  box-shadow: 0 0 0 4px rgba(37,99,235,.15);
}

.gpj-kb-app .gpj-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  border-radius: 14px;
  padding: 10px 14px;
  font-weight: 900;
  border: 1px solid rgba(15,23,42,.12);
  background: rgba(255,255,255,.92);
  color: #0f172a;
  cursor:pointer;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
  white-space:nowrap;
}

.gpj-kb-app .gpj-btn:hover{
  background: rgba(255,255,255,1);
  box-shadow: 0 12px 28px rgba(2,6,23,.12);
  transform: translateY(-1px);
}

.gpj-kb-app .gpj-btn--primary{
  background: linear-gradient(135deg, rgba(37,99,235,1), rgba(6,182,212,1));
  color: #fff;
  border-color: rgba(255,255,255,.18);
}

.gpj-kb-app .gpj-btn--primary:hover{
  box-shadow: 0 16px 34px rgba(2,6,23,.22);
}

.gpj-kb-app .gpj-link{color:#2563eb;font-weight:900;text-decoration:none;}
.gpj-kb-app .gpj-link:hover{color:#1d4ed8;text-decoration:underline;}

/* Search */
.gpj-kb-search{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;max-width: 860px;}
.gpj-kb-search .gpj-input{flex: 1 1 280px;min-width: 240px;}
.gpj-kb-search .gpj-btn{flex: 0 0 auto;}

/* Sections */
.gpj-kb-section{margin-top: 22px;}
.gpj-kb-section__head{display:flex;flex-wrap:wrap;gap:10px;align-items:baseline;justify-content:space-between;margin-bottom:12px;}
.gpj-kb-section__title{margin:0;font-size: 1.15rem;font-weight: 900;}
.gpj-kb-section__meta{color: var(--gpj-muted);font-size:.9rem;}

/* Cards */
.gpj-kb-app .card-hover{
  border:1px solid var(--gpj-border);
  background: var(--gpj-surface);
  backdrop-filter: blur(10px);
  border-radius: var(--gpj-radius);
  box-shadow: var(--gpj-shadow);
  transition: transform .14s ease, box-shadow .14s ease;
}

.gpj-kb-app .card-hover:hover{transform: translateY(-2px);box-shadow: var(--gpj-shadow-hover);}

.gpj-kb-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;}

.gpj-kb-card{display:block;padding:16px;text-decoration:none;color:inherit;}
.gpj-kb-card__k{font-weight:900;margin:0 0 6px 0;}
.gpj-kb-card__s{color: var(--gpj-muted);font-size:.9rem;}

/* Accordion (FAQ) */
.gpj-kb-app details.faq-item{
  border:1px solid var(--gpj-border);
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(255,255,255,.60);
}

.gpj-kb-app details.faq-item[open]{
  box-shadow: 0 14px 34px rgba(2,6,23,.10);
  border-color: rgba(37,99,235,.20);
}

.gpj-kb-app details.faq-item summary{
  cursor:pointer;
  list-style:none;
  font-weight: 900;
}

.gpj-kb-app details.faq-item summary::-webkit-details-marker{display:none;}

.gpj-kb-faq-body{margin-top:10px;color: rgba(15,23,42,.80);line-height:1.55;}
.gpj-kb-faq-body .gpj-kb-faq-actions{margin-top:10px;display:flex;flex-wrap:wrap;gap:10px;}

/* Result list */
.gpj-kb-results{display:flex;flex-direction:column;gap:12px;}
.gpj-kb-result{padding:16px;}
.gpj-kb-result__t{margin:0;font-weight:900;}
.gpj-kb-result__s{margin-top:6px;color: var(--gpj-muted);}

/* Breadcrumb + article */
.gpj-kb-breadcrumb{margin: 14px 0 14px 0;font-size:.95em;}
.gpj-kb-article{padding: 18px;}
.gpj-kb-article h2{margin-top: 18px;}

/* Notices */
.gpj-kb-notice{
  border:1px solid var(--gpj-border);
  background: rgba(255,255,255,.75);
  border-radius: var(--gpj-radius);
  padding: 14px 16px;
  margin-top: 16px;
  line-height: 1.55;
}

.gpj-kb-empty{color: var(--gpj-muted);}

/* Chips (atalhos) */
.gpj-kb-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}

/* Pills em fundo claro (ex.: dentro de avisos) */
.gpj-kb-notice .gpj-pill{
  border: 1px solid rgba(15,23,42,.14);
  background: rgba(15,23,42,.04);
  color: rgba(15,23,42,.86);
  backdrop-filter: none;
}