/* =====================================================================
   Projetar.Web — componentes específicos do site, construídos sobre
   os tokens do tema gov.br (govbr.css). Carregar depois de govbr.css.
   ===================================================================== */

/* ==== Layout base ================================================== */
.gbr-container {
  max-width: var(--gbr-container);
  margin: 0 auto;
  padding: 0 var(--gbr-space-6);
}

@media (max-width: 600px) {
  .gbr-container { padding: 0 var(--gbr-space-4); }
}

.gbr-main {
  padding: var(--gbr-space-10) 0 var(--gbr-space-16);
  min-height: calc(100vh - 68px - 120px);
}

.gbr-text-danger { color: var(--gbr-danger); }

/* ==== Topbar (faixa utilitária, acima do cabeçalho) ================= */
.gbr-topbar { background: var(--gbr-navy-900); color: #C9D6E8; font-size: var(--gbr-fs-xs); }
.gbr-topbar__inner { display: flex; align-items: center; justify-content: center; gap: var(--gbr-space-2); height: 34px; flex-wrap: wrap; text-align: center; }
.gbr-topbar__inner span:first-child { text-transform: capitalize; }
.gbr-topbar__sep { opacity: 0.5; }

/* ==== Header (logo + busca) ========================================= */
.gbr-header { background: var(--gbr-surface); border-bottom: 1px solid var(--gbr-border); }
.gbr-header__inner { display: flex; align-items: center; gap: var(--gbr-space-6); padding: var(--gbr-space-4) 0; }
.gbr-header__brand { display: flex; align-items: center; flex-shrink: 0; }
.gbr-header__logo { height: 34px; width: auto; display: block; }
.gbr-header__search { display: flex; flex: 1; max-width: 640px; margin-left: auto; gap: var(--gbr-space-2); }
.gbr-header__search .gbr-input { flex: 1; border-radius: var(--gbr-radius-pill); border-width: var(--gbr-border-width); padding-left: var(--gbr-space-5); }
.gbr-header__search .gbr-btn { border-radius: var(--gbr-radius-pill); }

@media (max-width: 760px) {
  .gbr-header__inner { flex-wrap: wrap; }
  .gbr-header__search { max-width: none; width: 100%; margin-left: 0; }
}

/* ==== Breadcrumb ===================================================== */
.gbr-breadcrumb-bar { background: var(--gbr-bg); border-bottom: 1px solid var(--gbr-border); }
.gbr-breadcrumb { display: flex; align-items: center; gap: var(--gbr-space-2); flex-wrap: wrap; height: 44px; font-size: var(--gbr-fs-xs); }
.gbr-breadcrumb a { color: var(--gbr-text-muted); font-weight: var(--gbr-fw-medium); }
.gbr-breadcrumb a:hover { color: var(--gbr-primary); }
.gbr-breadcrumb span[aria-current] { color: var(--gbr-text); font-weight: var(--gbr-fw-semibold); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 50vw; }
.gbr-breadcrumb__sep { color: var(--gbr-text-subtle); }

/* ==== Navbar ======================================================= */
.gbr-navbar__inner {
  display: flex;
  align-items: center;
  gap: var(--gbr-space-6);
  width: 100%;
}

/* Botão hambúrguer — só aparece abaixo de 1000px (ver media query no fim do arquivo). */
.gbr-navbar__hamburger {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 40px; height: 40px;
  flex-shrink: 0;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
}
.gbr-navbar__hamburger-line {
  display: block;
  width: 22px; height: 2px;
  border-radius: 2px;
  background: var(--gbr-text);
  transition: transform var(--gbr-dur) var(--gbr-ease), opacity var(--gbr-dur) var(--gbr-ease);
}
.gbr-navbar__hamburger[aria-expanded="true"] .gbr-navbar__hamburger-line:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.gbr-navbar__hamburger[aria-expanded="true"] .gbr-navbar__hamburger-line:nth-child(2) { opacity: 0; transform: scaleX(0); }
.gbr-navbar__hamburger[aria-expanded="true"] .gbr-navbar__hamburger-line:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1000px) {
  .gbr-navbar { height: auto; }
  .gbr-navbar__inner { flex-wrap: wrap; row-gap: 0; padding-block: var(--gbr-space-3); }
  .gbr-navbar__hamburger { display: inline-flex; }
  .gbr-navbar__links {
    order: 10;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: var(--gbr-space-1);
    margin-top: 0;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height var(--gbr-dur-slow) var(--gbr-ease), opacity var(--gbr-dur) var(--gbr-ease), margin-top var(--gbr-dur-slow) var(--gbr-ease);
  }
  .gbr-navbar__links.is-open { max-height: 400px; opacity: 1; margin-top: var(--gbr-space-3); }
  .gbr-navbar__user-name { display: none; }
}
.gbr-navbar__logo { height: 32px; width: auto; display: block; }
[data-theme="claro"] .gbr-navbar__logo--escuro { display: none; }
[data-theme="escuro"] .gbr-navbar__logo--claro { display: none; }
.gbr-theme-icon { font-size: 1.15rem; line-height: 1; }
[data-theme="claro"] .gbr-theme-icon--moon { display: none; }
[data-theme="escuro"] .gbr-theme-icon--sun { display: none; }

/* Navbar navy — usada abaixo do cabeçalho com busca, no lugar da navbar clara antiga */
.gbr-navbar--navy {
  background: var(--gbr-navy-800);
  border-bottom: none;
}
.gbr-navbar--navy .gbr-navlink {
  color: #B9C7DC;
  position: relative;
  border-radius: 0;
  padding-bottom: 6px;
  border-bottom: 2px solid transparent;
}
.gbr-navbar--navy .gbr-navlink:hover { color: #fff; background: transparent; }
.gbr-navbar--navy .gbr-navlink--ativo { color: #fff; border-bottom-color: var(--gbr-accent); }
.gbr-navbar--navy .gbr-navbar__user-name { color: #fff; }
.gbr-navbar--navy .gbr-btn--ghost { --_fg: #B9C7DC; }
.gbr-navbar--navy .gbr-btn--ghost:hover { --_fg: #fff; background: rgba(255, 255, 255, 0.08); }
.gbr-navbar--navy .gbr-navbar__hamburger-line { background: #fff; }
.gbr-navbar--navy .gbr-theme-icon { color: #fff; }
.gbr-navbar__cta {
  flex-shrink: 0;
  --_bg: transparent; --_fg: var(--gbr-accent); --_bd: var(--gbr-accent);
  border-radius: var(--gbr-radius-pill);
}
.gbr-navbar__cta:hover { --_bg: var(--gbr-accent); --_fg: var(--gbr-accent-contrast); }
@media (max-width: 1000px) {
  .gbr-navbar--navy .gbr-navlink { color: #B9C7DC; border-bottom: none; padding-bottom: 8px; }
  .gbr-navbar--navy .gbr-navlink--ativo { border-left: 3px solid var(--gbr-accent); padding-left: calc(14px - 3px); }
  .gbr-navbar--navy .gbr-navbar__links.is-open { background: var(--gbr-navy-700); border-radius: var(--gbr-radius-md); padding: var(--gbr-space-2); }
}

/* ==== Footer ======================================================== */
.gbr-footer {
  border-top: 1px solid var(--gbr-border);
  background: var(--gbr-surface);
  margin-top: var(--gbr-space-16);
}
.gbr-footer__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--gbr-space-3);
  padding: var(--gbr-space-6) var(--gbr-space-6);
  color: var(--gbr-text-muted);
  font-size: var(--gbr-fs-sm);
}

.gbr-footer--navy {
  background: var(--gbr-navy-900);
  border-top: none;
  color: #A9B9CE;
}
.gbr-footer--navy .gbr-footer__grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: var(--gbr-space-8);
  padding: var(--gbr-space-12) 0 var(--gbr-space-8);
}
.gbr-footer__brand { display: flex; flex-direction: column; gap: var(--gbr-space-3); }
.gbr-footer__logo { height: 30px; width: auto; }
.gbr-footer__brand p { font-size: var(--gbr-fs-sm); line-height: var(--gbr-lh-normal); margin: 0; max-width: 32ch; }
.gbr-footer__col { display: flex; flex-direction: column; gap: var(--gbr-space-3); }
.gbr-footer__col h3 { font-size: var(--gbr-fs-xs); font-weight: var(--gbr-fw-bold); text-transform: uppercase; letter-spacing: var(--gbr-ls-caps); color: var(--gbr-accent); margin: 0 0 var(--gbr-space-1); }
.gbr-footer__col a { color: #A9B9CE; font-size: var(--gbr-fs-sm); }
.gbr-footer__col a:hover { color: #fff; text-decoration: underline; }
.gbr-footer__bottom { border-top: 1px solid rgba(255, 255, 255, 0.1); }
.gbr-footer__bottom-inner { display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--gbr-space-2); padding: var(--gbr-space-4) 0; font-size: var(--gbr-fs-xs); }

@media (max-width: 860px) {
  .gbr-footer--navy .gbr-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .gbr-footer--navy .gbr-footer__grid { grid-template-columns: 1fr; }
}

/* ==== Hero (home) =================================================== */
.gbr-hero {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--gbr-space-3);
  padding: 0 0 var(--gbr-space-8);
  margin-bottom: var(--gbr-space-8);
  border-bottom: 1px solid var(--gbr-border);
}
.gbr-hero .gbr-lead { max-width: 640px; }
.gbr-hero__logo-h1 { margin: 0; }
.gbr-hero__logo { width: 100%; max-width: 460px; height: auto; display: block; border-radius: var(--gbr-radius-md); }
[data-theme="claro"] .gbr-hero__logo--escuro { display: none; }
[data-theme="escuro"] .gbr-hero__logo--claro { display: none; }

/* ==== Accordion — principios ======================================= */
.principio {
  margin-bottom: var(--gbr-space-3);
  border: var(--gbr-border-width) solid var(--gbr-border);
  border-radius: var(--gbr-radius-lg);
  background: var(--gbr-surface);
  overflow: hidden;
  transition: border-color var(--gbr-dur) var(--gbr-ease), box-shadow var(--gbr-dur) var(--gbr-ease);
}
.principio:hover { border-color: var(--gbr-border-strong); }
.principio.open { border-color: var(--gbr-primary); box-shadow: var(--gbr-shadow-sm); }
.principio--oculto { border-style: dashed; opacity: 0.75; }

.principio-header {
  display: flex;
  align-items: center;
  gap: var(--gbr-space-4);
  padding: var(--gbr-space-5) var(--gbr-space-6);
  cursor: pointer;
  user-select: none;
  transition: background var(--gbr-dur) var(--gbr-ease);
}
.principio-header:hover { background: var(--gbr-primary-soft); }

.numeral {
  width: 42px; height: 42px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: var(--gbr-fw-bold); font-size: 1.1rem;
  background: var(--gbr-primary-soft); color: var(--gbr-primary-soft-fg);
  border: var(--gbr-border-width-strong) solid var(--gbr-primary);
  flex-shrink: 0;
  transition: background var(--gbr-dur) var(--gbr-ease), color var(--gbr-dur) var(--gbr-ease);
}
.principio.open .numeral { background: var(--gbr-primary); color: var(--gbr-primary-contrast); }

.principio-title { flex: 1; min-width: 0; }
.principio-title .biblical,
.principio-title .principio-num {
  font-size: var(--gbr-fs-sm); color: var(--gbr-text-muted);
  display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.principio-title .biblical { font-style: italic; }
.principio-title .principio-num {
  text-transform: uppercase; letter-spacing: .06em; font-weight: var(--gbr-fw-semibold);
}
.principio-title .secular {
  font-size: var(--gbr-fs-body); font-weight: var(--gbr-fw-semibold); color: var(--gbr-text); display: block;
}
.principio.open .principio-title .secular { color: var(--gbr-primary); }

.arrow {
  width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  color: var(--gbr-text-muted); font-size: 1.1em;
  transition: transform var(--gbr-dur) var(--gbr-ease), color var(--gbr-dur) var(--gbr-ease);
  flex-shrink: 0;
}
.principio.open .arrow { transform: rotate(180deg); color: var(--gbr-primary); }

.principio-body { max-height: 0; overflow: hidden; transition: max-height 0.5s ease; }
.principio.open .principio-body { max-height: 99999px; }
.principio-content {
  padding: 0 var(--gbr-space-6) var(--gbr-space-6) calc(42px + var(--gbr-space-6) + var(--gbr-space-4));
  color: var(--gbr-text-muted);
  font-size: var(--gbr-fs-sm);
}
.principio-content .intro { margin-bottom: var(--gbr-space-4); color: var(--gbr-text); line-height: var(--gbr-lh-normal); }

/* Sub-item */
.subitem {
  margin-bottom: var(--gbr-space-2);
  border: var(--gbr-border-width) solid var(--gbr-border);
  border-radius: var(--gbr-radius-sm);
  background: var(--gbr-surface-2);
  overflow: hidden;
}
.subitem-header {
  display: flex; align-items: center; gap: var(--gbr-space-2);
  padding: var(--gbr-space-3) var(--gbr-space-4);
  cursor: pointer; user-select: none;
  transition: background var(--gbr-dur) var(--gbr-ease);
}
.subitem-header:hover, .subitem.open .subitem-header { background: var(--gbr-secondary-soft); }
.subitem.open { border-color: var(--gbr-secondary); }
.subitem--oculto { border-style: dashed; opacity: 0.75; }
.subitem-icon { font-size: var(--gbr-fs-sm); color: var(--gbr-secondary); flex-shrink: 0; }
.subitem-text { flex: 1; min-width: 0; font-size: var(--gbr-fs-sm); color: var(--gbr-text); font-weight: var(--gbr-fw-medium); }
.subitem.open .subitem-text { color: var(--gbr-secondary-soft-fg); }
.subitem-votos { flex-shrink: 0; white-space: nowrap; }
.subitem-votos .gbr-rating__display { font-size: 0.85rem; letter-spacing: 1px; margin-right: 4px; }
.subitem-arrow {
  font-size: var(--gbr-fs-xs); color: var(--gbr-text-muted);
  transition: transform var(--gbr-dur) var(--gbr-ease); flex-shrink: 0;
}
.subitem.open .subitem-arrow { transform: rotate(180deg); color: var(--gbr-secondary); }
.subitem-body { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
.subitem.open .subitem-body { max-height: 99999px; }
.subitem-detail {
  padding: var(--gbr-space-3) var(--gbr-space-4) var(--gbr-space-4) calc(var(--gbr-space-4) + 18px);
  color: var(--gbr-text-muted);
  font-size: var(--gbr-fs-sm);
  border-top: 1px solid var(--gbr-border);
}

.btn-ver-mais {
  display: inline-block;
  margin-top: var(--gbr-space-2);
  padding: 6px var(--gbr-space-4);
  border: var(--gbr-border-width-strong) solid var(--gbr-primary);
  color: var(--gbr-primary);
  border-radius: var(--gbr-radius-pill);
  font-size: var(--gbr-fs-xs); font-weight: var(--gbr-fw-bold);
  text-decoration: none;
  transition: background var(--gbr-dur) var(--gbr-ease), color var(--gbr-dur) var(--gbr-ease);
}
.btn-ver-mais:hover { background: var(--gbr-primary); color: var(--gbr-primary-contrast); text-decoration: none; }

.gbr-principio-propor { margin-top: var(--gbr-space-3); padding-left: 76px; }

.gbr-home-tagline {
  text-align: center;
  margin-top: var(--gbr-space-10);
  padding-top: var(--gbr-space-6);
  border-top: 1px solid var(--gbr-border);
  color: var(--gbr-text-muted);
  font-size: var(--gbr-fs-sm);
}

/* ==== Página de item ================================================ */

/* Card de título — linha única, largura total da página, acima do layout de 2 colunas */
.gbr-item-title-card { max-width: 1040px; margin: 0 auto var(--gbr-space-6); padding: var(--gbr-space-8); }

.gbr-item-layout {
  display: flex;
  align-items: flex-start;
  gap: var(--gbr-space-6);
  max-width: 1040px;
  margin: 0 auto;
}
.gbr-item-layout__main { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: var(--gbr-space-6); }
.gbr-item-layout__sidebar {
  flex: 0 0 320px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--gbr-space-6);
  position: sticky;
  top: var(--gbr-space-6);
}

@media (max-width: 860px) {
  .gbr-item-layout { flex-direction: column; }
  .gbr-item-layout__sidebar { flex: 1 1 auto; width: 100%; position: static; }
}

.gbr-item {
  max-width: none;
  margin: 0;
  position: relative;
  padding: var(--gbr-space-8);
  overflow: hidden;
}

.gbr-item-title-card h1 { margin: var(--gbr-space-3) 0 0; color: var(--gbr-navy-900); }
.gbr-item__subtitle {
  margin: var(--gbr-space-3) 0 0;
  font-size: var(--gbr-fs-lg);
  font-weight: var(--gbr-fw-regular);
  color: var(--gbr-text-muted);
}

.gbr-tag--principio {
  border-radius: var(--gbr-radius-pill);
  background: var(--gbr-secondary-soft); color: var(--gbr-secondary-soft-fg); border-color: transparent;
  text-transform: uppercase; font-weight: var(--gbr-fw-bold); font-size: var(--gbr-fs-xs); letter-spacing: var(--gbr-ls-caps);
  padding: 5px 14px;
}

.gbr-item__byline {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--gbr-space-2);
  margin-top: var(--gbr-space-4);
  font-size: var(--gbr-fs-xs);
  color: var(--gbr-text-muted);
}
.gbr-item__byline strong { color: var(--gbr-text); letter-spacing: var(--gbr-ls-caps); }
.gbr-item__byline-sep { opacity: 0.5; }

.gbr-item__share { display: flex; align-items: center; gap: var(--gbr-space-2); margin-top: var(--gbr-space-3); font-size: var(--gbr-fs-sm); }
.gbr-share-btn {
  width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--gbr-radius-sm); border: 1px solid var(--gbr-border-strong);
  background: var(--gbr-surface);
  font-size: var(--gbr-fs-xs); font-weight: var(--gbr-fw-bold); color: var(--gbr-text-muted);
  cursor: pointer;
  transition: background var(--gbr-dur) var(--gbr-ease), color var(--gbr-dur) var(--gbr-ease), border-color var(--gbr-dur) var(--gbr-ease);
}
.gbr-share-btn:hover { background: var(--gbr-primary); border-color: var(--gbr-primary); color: #fff; text-decoration: none; }

.gbr-item__banner-img {
  margin-bottom: var(--gbr-space-6);
  border-radius: var(--gbr-radius-lg);
  overflow: hidden;
  aspect-ratio: 16 / 7;
  background: var(--gbr-surface-2);
}
.gbr-item__banner-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

.gbr-item__body p { margin-bottom: var(--gbr-space-4); line-height: var(--gbr-lh-normal); color: var(--gbr-text); }
.gbr-item__body p:last-child { margin-bottom: 0; }

/* Conteúdo vindo do editor rich text (Quill) — o reset global zera list-style/padding,
   então listas, títulos e citações precisam do estilo de volta aqui. */
.gbr-item__body :where(ul, ol),
.gbr-moderacao-diff :where(ul, ol),
.gbr-moderacao-redline :where(ul, ol),
.gbr-paragrafo__preview :where(ul, ol) {
  list-style: revert;
  padding-left: var(--gbr-space-6);
  margin: 0 0 var(--gbr-space-4);
}
.gbr-item__body li,
.gbr-moderacao-diff li,
.gbr-moderacao-redline li,
.gbr-paragrafo__preview li {
  margin-bottom: var(--gbr-space-2);
  line-height: var(--gbr-lh-normal);
}
.gbr-item__body h2,
.gbr-item__body h3,
.gbr-item__body h4 {
  margin: var(--gbr-space-6) 0 var(--gbr-space-3);
  font-weight: var(--gbr-fw-bold);
  color: var(--gbr-text);
}
.gbr-item__body h2 { font-size: var(--gbr-fs-h3); }
.gbr-item__body h3 { font-size: var(--gbr-fs-h4); }
.gbr-item__body h4 { font-size: var(--gbr-fs-lg); }
.gbr-item__body blockquote,
.gbr-moderacao-redline blockquote {
  margin: 0 0 var(--gbr-space-4);
  padding-left: var(--gbr-space-4);
  border-left: 3px solid var(--gbr-border-strong);
  color: var(--gbr-text-muted);
}
.gbr-moderacao-redline :where(p, ul, ol, blockquote) { margin: 0 0 var(--gbr-space-2); }

/* Cards "Autoria" / "Como citar este conteúdo" — cards padrão, empilhados na coluna principal */
.gbr-item-layout__main > .gbr-card h2 { margin-bottom: var(--gbr-space-3); }
.gbr-item-layout__main > .gbr-card p { font-size: var(--gbr-fs-sm); color: var(--gbr-text); margin-bottom: var(--gbr-space-1); }
.gbr-item-layout__main > .gbr-card p:last-child { margin-bottom: 0; }

.gbr-item__tags { display: flex; align-items: center; flex-wrap: wrap; gap: var(--gbr-space-2); }
.gbr-tag--add { background: transparent; border: 1px dashed var(--gbr-border-strong); color: var(--gbr-text-muted); cursor: pointer; }
.gbr-tag--add:hover { border-color: var(--gbr-primary); color: var(--gbr-primary); }
.gbr-tag--removivel { display: inline-flex; align-items: center; gap: 4px; padding-right: 6px; }
.gbr-tag--removivel a { color: inherit; }
.gbr-tag__remover {
  background: none; border: none; padding: 0; margin: 0; cursor: pointer;
  width: 16px; height: 16px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; color: currentColor; opacity: 0.6; font-size: 13px; line-height: 1;
}
.gbr-tag__remover:hover { opacity: 1; background: rgba(0, 0, 0, 0.08); }

.gbr-modal-dialog {
  border: none; border-radius: var(--gbr-radius-lg); padding: var(--gbr-space-6);
  max-width: 480px; width: calc(100% - var(--gbr-space-8));
  background: var(--gbr-surface); color: var(--gbr-text);
  box-shadow: var(--gbr-shadow-lg);
}
.gbr-modal-dialog::backdrop { background: var(--gbr-overlay); }

.gbr-item__signature { text-align: right; font-style: italic; color: var(--gbr-text-muted); margin: var(--gbr-space-6) 0 0; }
.gbr-item__footnote { text-align: center; font-size: var(--gbr-fs-xs); margin-top: var(--gbr-space-2); }
.gbr-item__back { text-align: center; }

/* ==== Autenticação ================================================== */
.gbr-auth-card {
  max-width: 440px;
  margin: var(--gbr-space-8) auto;
}
.gbr-auth-card__title { text-align: center; margin-bottom: var(--gbr-space-2); }
.gbr-auth-card__subtitle { text-align: center; margin-bottom: var(--gbr-space-6); }
.gbr-auth-card__row { gap: var(--gbr-space-4); align-items: flex-start; }
.gbr-auth-card__footer { text-align: center; margin: var(--gbr-space-4) 0 0; }
.gbr-auth-card .gbr-alert { margin-bottom: var(--gbr-space-4); }
.gbr-auth-card .validation-summary-valid { display: none; }
.gbr-auth-card .field-validation-valid { display: none; }

.gbr-navbar__user { display: flex; align-items: center; gap: var(--gbr-space-3); }
.gbr-navbar__user-name { font-size: var(--gbr-fs-sm); font-weight: var(--gbr-fw-semibold); color: var(--gbr-text); }
.gbr-navbar__logout-form { margin: 0; }

/* ==== Editor rich text (Quill) ======================================= */
/* O quill.snow.css vem com cores fixas (ícones cinza, fundo branco) e é carregado depois
   do principios.css — por isso os !important, pra sobrepor a folha de estilo do Quill e
   fazer o editor seguir os tokens do tema (claro/escuro) em vez de ficar sempre "claro". */
.gbr-richtext-editor { background: var(--gbr-surface); border-radius: 0 0 var(--gbr-radius-md) var(--gbr-radius-md); }
.gbr-richtext-editor .ql-editor { min-height: 260px; font-size: var(--gbr-fs-body); font-family: var(--gbr-font); color: var(--gbr-text) !important; }
.gbr-richtext-editor .ql-editor.ql-blank::before { color: var(--gbr-text-subtle) !important; font-style: normal !important; }
.gbr-richtext-editor .ql-editor a { color: var(--gbr-primary) !important; }
.gbr-richtext-editor .ql-toolbar { border-radius: var(--gbr-radius-md) var(--gbr-radius-md) 0 0; background: var(--gbr-surface-2); border-color: var(--gbr-border-strong) !important; }
.gbr-richtext-editor .ql-container { border-color: var(--gbr-border-strong) !important; border-radius: 0 0 var(--gbr-radius-md) var(--gbr-radius-md); font-family: var(--gbr-font); }

/* Ícones (SVG) do menu do editor */
.gbr-richtext-editor .ql-stroke, .gbr-richtext-editor .ql-stroke-miter { stroke: var(--gbr-text-muted) !important; }
.gbr-richtext-editor .ql-fill, .gbr-richtext-editor .ql-stroke.ql-fill { fill: var(--gbr-text-muted) !important; }

/* Seletor de título (H2/H3) e demais dropdowns do menu */
.gbr-richtext-editor .ql-picker { color: var(--gbr-text-muted) !important; }
.gbr-richtext-editor .ql-picker-label { border-color: transparent !important; }
.gbr-richtext-editor .ql-picker.ql-expanded .ql-picker-label { border-color: var(--gbr-border-strong) !important; }
.gbr-richtext-editor .ql-picker-options {
  background: var(--gbr-surface) !important;
  border-color: var(--gbr-border-strong) !important;
  box-shadow: var(--gbr-shadow-md);
}
.gbr-richtext-editor .ql-picker-item { color: var(--gbr-text) !important; }

/* Estado ativo/hover dos botões e itens do menu */
.gbr-richtext-editor .ql-toolbar button:hover,
.gbr-richtext-editor .ql-toolbar button.ql-active,
.gbr-richtext-editor .ql-toolbar .ql-picker-label:hover,
.gbr-richtext-editor .ql-toolbar .ql-picker-label.ql-active,
.gbr-richtext-editor .ql-toolbar .ql-picker-item:hover,
.gbr-richtext-editor .ql-toolbar .ql-picker-item.ql-selected {
  color: var(--gbr-primary) !important;
}
.gbr-richtext-editor .ql-toolbar button:hover .ql-stroke,
.gbr-richtext-editor .ql-toolbar button.ql-active .ql-stroke,
.gbr-richtext-editor .ql-toolbar .ql-picker-label:hover .ql-stroke,
.gbr-richtext-editor .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.gbr-richtext-editor .ql-toolbar .ql-picker-item:hover .ql-stroke,
.gbr-richtext-editor .ql-toolbar .ql-picker-item.ql-selected .ql-stroke {
  stroke: var(--gbr-primary) !important;
}
.gbr-richtext-editor .ql-toolbar button:hover .ql-fill,
.gbr-richtext-editor .ql-toolbar button.ql-active .ql-fill,
.gbr-richtext-editor .ql-toolbar .ql-picker-label:hover .ql-fill,
.gbr-richtext-editor .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.gbr-richtext-editor .ql-toolbar .ql-picker-item:hover .ql-fill,
.gbr-richtext-editor .ql-toolbar .ql-picker-item.ql-selected .ql-fill {
  fill: var(--gbr-primary) !important;
}

/* Tooltip de link (aparece ao inserir/editar um link) */
.gbr-richtext-editor .ql-tooltip {
  background: var(--gbr-surface) !important;
  border: 1px solid var(--gbr-border-strong) !important;
  color: var(--gbr-text) !important;
  box-shadow: var(--gbr-shadow-md);
}
.gbr-richtext-editor .ql-tooltip input[type="text"] {
  background: var(--gbr-surface) !important;
  border: 1px solid var(--gbr-border-strong) !important;
  color: var(--gbr-text) !important;
}
.gbr-richtext-editor .ql-tooltip a.ql-action,
.gbr-richtext-editor .ql-tooltip a.ql-remove { color: var(--gbr-primary) !important; }
.gbr-item__body img, .gbr-moderacao-diff img { max-width: 100%; height: auto; }

/* ==== Editor por parágrafo (Propor edição) =========================== */
.gbr-paragrafo {
  padding: var(--gbr-space-3) var(--gbr-space-4);
  border: 1px dashed var(--gbr-border-strong);
  border-radius: var(--gbr-radius-md);
  margin-bottom: var(--gbr-space-2);
}
.gbr-paragrafo__preview { color: var(--gbr-text); font-size: var(--gbr-fs-body); line-height: var(--gbr-lh-normal); margin-bottom: var(--gbr-space-2); }
.gbr-paragrafo__preview :where(p, ul, ol, blockquote) { margin: 0 0 var(--gbr-space-2); }
.gbr-paragrafo__preview > :last-child { margin-bottom: 0; }
.gbr-paragrafo-add { text-align: center; margin: var(--gbr-space-2) 0; }
.gbr-paragrafo-add .gbr-richtext-editor { margin-top: var(--gbr-space-2); text-align: left; }

/* ==== Edição / moderação ============================================ */
.gbr-edit-card { max-width: 760px; margin: var(--gbr-space-8) auto; }
.gbr-item-status-banner { max-width: 760px; margin: 0 auto var(--gbr-space-6); }

.gbr-moderacao-diff {
  max-height: 240px;
  overflow-y: auto;
  padding: var(--gbr-space-3);
  border-radius: var(--gbr-radius-md);
  background: var(--gbr-surface-2);
  font-size: var(--gbr-fs-sm);
  line-height: var(--gbr-lh-normal);
  color: var(--gbr-text);
}
.gbr-moderacao-diff--atual { border-left: 3px solid var(--gbr-border-strong); }
.gbr-moderacao-diff--novo { border-left: 3px solid var(--gbr-secondary); }
.gbr-moderacao-diff :where(p, ul, ol, blockquote) { margin: 0 0 var(--gbr-space-2); }
.gbr-moderacao-diff :where(h1, h2, h3, h4) { font-size: var(--gbr-fs-body); font-weight: var(--gbr-fw-bold); margin: 0 0 var(--gbr-space-2); }
.gbr-moderacao-diff :where(ul, ol) { padding-left: var(--gbr-space-5); }
.gbr-moderacao-diff > :last-child { margin-bottom: 0; }

.gbr-moderacao-redline {
  padding: var(--gbr-space-3);
  border-radius: var(--gbr-radius-md);
  background: var(--gbr-surface-2);
  font-size: var(--gbr-fs-sm);
  line-height: var(--gbr-lh-normal);
  color: var(--gbr-text);
  margin-bottom: var(--gbr-space-3);
}
.gbr-moderacao-redline p { margin: 0 0 var(--gbr-space-2); }
.gbr-moderacao-redline > :last-child { margin-bottom: 0; }
.gbr-diff-add { background: color-mix(in oklab, var(--gbr-success) 18%, var(--gbr-surface)); text-decoration: none; }
.gbr-diff-del { background: color-mix(in oklab, var(--gbr-danger) 14%, var(--gbr-surface)); text-decoration: line-through; opacity: .8; }
.gbr-moderacao-formatacao { margin-bottom: var(--gbr-space-3); }
.gbr-moderacao-formatacao > summary { list-style: none; }
.gbr-moderacao-formatacao > summary::-webkit-details-marker { display: none; }

.gbr-moderacao-rejeitar { position: relative; }
.gbr-moderacao-rejeitar > summary { list-style: none; }
.gbr-moderacao-rejeitar > summary::-webkit-details-marker { display: none; }
.gbr-moderacao-rejeitar__form {
  position: absolute;
  right: 0;
  top: calc(100% + var(--gbr-space-2));
  width: min(320px, 90vw);
  padding: var(--gbr-space-4);
  background: var(--gbr-surface);
  border: 1px solid var(--gbr-border);
  border-radius: var(--gbr-radius-md);
  box-shadow: var(--gbr-shadow-lg);
  z-index: 10;
}

.gbr-moderacao-editar { margin-bottom: var(--gbr-space-3); }
.gbr-moderacao-editar > summary { list-style: none; }
.gbr-moderacao-editar > summary::-webkit-details-marker { display: none; }
.gbr-moderacao-criar > summary { list-style: none; }
.gbr-moderacao-criar > summary::-webkit-details-marker { display: none; }
.gbr-moderacao-editor-content {
  min-height: 160px;
  padding: var(--gbr-space-3) var(--gbr-space-4);
  border: var(--gbr-border-width-strong) solid var(--gbr-border-strong);
  border-radius: var(--gbr-radius-md);
  background: var(--gbr-surface);
  font-size: var(--gbr-fs-sm);
  line-height: var(--gbr-lh-normal);
  color: var(--gbr-text);
}
.gbr-moderacao-editor-content:focus { outline: none; border-color: var(--gbr-primary); box-shadow: var(--gbr-focus-ring); }
.gbr-moderacao-editor-content p { margin: 0 0 var(--gbr-space-2); }
.gbr-moderacao-editor-content p:last-child { margin-bottom: 0; }
.gbr-moderacao-editor-content ul, .gbr-moderacao-editor-content ol { margin: 0 0 var(--gbr-space-2); padding-left: var(--gbr-space-5); }

/* ==== Utilitário ===================================================== */
.gbr-visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ==== Avaliação (estrelas) =========================================== */
.gbr-avaliacao-card { margin: 0; }
.gbr-rating__display { color: var(--gbr-accent); font-size: 1.3rem; letter-spacing: 2px; margin-right: var(--gbr-space-2); }

.gbr-historico-votos summary { cursor: pointer; list-style: none; }
.gbr-historico-votos summary::-webkit-details-marker { display: none; }

.gbr-rating__stars {
  border: none; margin: 0; padding: 0;
  display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 2px;
}
.gbr-rating__stars input {
  position: absolute; opacity: 0; width: 0; height: 0;
}
.gbr-rating__stars label {
  font-size: 1.8rem; line-height: 1; color: var(--gbr-border-strong); cursor: pointer;
  transition: color var(--gbr-dur) var(--gbr-ease);
}
.gbr-rating__stars input:checked ~ label,
.gbr-rating__stars label:hover,
.gbr-rating__stars label:hover ~ label {
  color: var(--gbr-accent);
}

/* ==== Navegação lateral "Decálogo" ==================================== */
.gbr-decalogo-nav { margin: 0; }
.gbr-decalogo-nav__list { list-style: none; margin: var(--gbr-space-3) 0 0; padding: 0; }
.gbr-decalogo-nav__list li { border-top: 1px solid var(--gbr-border); }
.gbr-decalogo-nav__list li:first-child { border-top: none; }
.gbr-decalogo-nav__list a { display: flex; flex-direction: column; gap: 2px; padding: var(--gbr-space-3) 0; color: var(--gbr-text); }
.gbr-decalogo-nav__list a:hover { text-decoration: none; }
.gbr-decalogo-nav__titulo { font-size: var(--gbr-fs-sm); font-weight: var(--gbr-fw-semibold); line-height: var(--gbr-lh-snug); }
.gbr-decalogo-nav__list a:hover .gbr-decalogo-nav__titulo { color: var(--gbr-primary); }

/* ==== Cards de call-to-action da barra lateral ======================== */
.gbr-cta-card { margin: 0; }
.gbr-cta-card p { font-size: var(--gbr-fs-sm); color: var(--gbr-text-muted); margin: var(--gbr-space-2) 0 var(--gbr-space-4); }
.gbr-cta-card--navy { background: var(--gbr-navy-800); border-color: var(--gbr-navy-800); }
.gbr-cta-card--navy h2, .gbr-cta-card--navy p { color: #fff; }
.gbr-cta-card--navy p { opacity: 0.85; }

/* ==== Cards de item (grade "Ideias" / "Veja também" / busca) ========= */
.gbr-itemcard-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--gbr-space-5); margin-top: var(--gbr-space-6); }
.gbr-itemcard {
  display: flex; flex-direction: column;
  border: 1px solid var(--gbr-border); border-radius: var(--gbr-radius-lg);
  background: var(--gbr-surface); overflow: hidden; text-decoration: none;
  transition: box-shadow var(--gbr-dur) var(--gbr-ease), border-color var(--gbr-dur) var(--gbr-ease), transform var(--gbr-dur) var(--gbr-ease);
}
.gbr-itemcard:hover { box-shadow: var(--gbr-shadow-md); border-color: var(--gbr-border-strong); transform: translateY(-2px); text-decoration: none; }
.gbr-itemcard__imagem {
  aspect-ratio: 16 / 10; background: var(--gbr-primary-soft) center / cover no-repeat;
  display: flex; align-items: center; justify-content: center;
}
.gbr-itemcard__numeral { font-size: 2rem; font-weight: var(--gbr-fw-extrabold); color: var(--gbr-primary-soft-fg); opacity: 0.6; }
.gbr-itemcard__corpo { display: flex; flex-direction: column; gap: 4px; padding: var(--gbr-space-4); }
.gbr-itemcard__titulo { font-size: var(--gbr-fs-sm); font-weight: var(--gbr-fw-bold); color: var(--gbr-text); line-height: var(--gbr-lh-snug); }
.gbr-itemcard:hover .gbr-itemcard__titulo { color: var(--gbr-primary); }
.gbr-itemcard__autor { font-size: var(--gbr-fs-xs); color: var(--gbr-text-muted); }

/* ==== "Veja também" (rodapé da página de item) ======================== */
.gbr-veja-tambem { max-width: 1040px; margin: 0 auto var(--gbr-space-10); }

/* ==== Material de apoio (referências / documentos) =================== */
.gbr-material-card { margin: 0; }
.gbr-material-list { list-style: none; margin: 0 0 var(--gbr-space-4); padding: 0; }
.gbr-material-list__item {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--gbr-space-2);
  padding: var(--gbr-space-3) 0; border-top: 1px solid var(--gbr-border);
  font-size: var(--gbr-fs-sm);
}
.gbr-material-list__item a { font-weight: var(--gbr-fw-semibold); }
.gbr-historico-votos__item { flex-direction: column; align-items: stretch; }
.gbr-material-list__autor { font-size: var(--gbr-fs-xs); }

/* Cards de referência / documento */
.gbr-referencia-grid { display: flex; flex-direction: column; gap: var(--gbr-space-3); margin: 0 0 var(--gbr-space-4); }
.gbr-referencia-card {
  display: flex; flex-direction: column; gap: var(--gbr-space-2);
  padding: var(--gbr-space-4);
  border: 1px solid var(--gbr-border);
  border-radius: var(--gbr-radius-md);
  background: var(--gbr-surface);
  text-decoration: none;
  transition: border-color var(--gbr-dur) var(--gbr-ease), box-shadow var(--gbr-dur) var(--gbr-ease), transform var(--gbr-dur) var(--gbr-ease);
}
.gbr-referencia-card:hover { border-color: var(--gbr-primary); box-shadow: var(--gbr-shadow-sm); transform: translateY(-1px); text-decoration: none; }
.gbr-referencia-card__head { display: flex; align-items: center; flex-wrap: wrap; gap: var(--gbr-space-2); }
.gbr-referencia-card__titulo { font-weight: var(--gbr-fw-semibold); font-size: var(--gbr-fs-sm); line-height: var(--gbr-lh-snug); color: var(--gbr-text); }
.gbr-referencia-card__autor { font-size: var(--gbr-fs-xs); color: var(--gbr-text-muted); }
.gbr-referencia-card .gbr-tag { font-size: var(--gbr-fs-xs); padding: 2px 10px; }

.gbr-tag--livro  { background: var(--gbr-secondary-soft); color: var(--gbr-secondary-soft-fg); border-color: transparent; }
.gbr-tag--artigo { background: var(--gbr-primary-soft); color: var(--gbr-primary-soft-fg); border-color: transparent; }
.gbr-tag--lei    { background: var(--gbr-accent-soft); color: var(--gbr-accent-soft-fg); border-color: transparent; }
.gbr-tag--video  { background: color-mix(in oklab, var(--gbr-danger) 14%, var(--gbr-surface)); color: var(--gbr-danger); border-color: transparent; }
.gbr-tag--outro  { background: var(--gbr-surface-2); color: var(--gbr-text-muted); }
.gbr-material-forms { flex-wrap: wrap; gap: var(--gbr-space-4); align-items: flex-start; }
.gbr-material-forms__item summary { cursor: pointer; list-style: none; }
.gbr-material-forms__item summary::-webkit-details-marker { display: none; }
.gbr-material-forms__item[open] summary { margin-bottom: var(--gbr-space-3); }
.gbr-material-forms__item form { min-width: 0; width: 100%; }

/* ==== Comentários ===================================================== */
.gbr-comentarios-card { max-width: 1040px; margin: 0 auto var(--gbr-space-10); }
.gbr-comentario {
  padding: var(--gbr-space-4) 0;
  border-top: 1px solid var(--gbr-border);
}
.gbr-comentario__head { display: flex; align-items: baseline; gap: var(--gbr-space-3); }
.gbr-comentario__autor { font-weight: var(--gbr-fw-bold); font-size: var(--gbr-fs-sm); color: var(--gbr-text); }
.gbr-comentario__data { font-size: var(--gbr-fs-xs); color: var(--gbr-text-subtle); }
.gbr-comentario__texto { margin: var(--gbr-space-2) 0; font-size: var(--gbr-fs-sm); color: var(--gbr-text); white-space: pre-wrap; line-height: var(--gbr-lh-normal); }
.gbr-comentario__acoes { gap: var(--gbr-space-4); align-items: center; }
.gbr-comentario__acoes form { margin: 0; }
.gbr-comentario__responder summary { cursor: pointer; color: var(--gbr-primary); font-size: var(--gbr-fs-sm); font-weight: var(--gbr-fw-semibold); list-style: none; }
.gbr-comentario__responder summary::-webkit-details-marker { display: none; }
.gbr-comentario__responder form { margin-top: var(--gbr-space-2); min-width: 0; width: 100%; max-width: 360px; }
.gbr-comentario__respostas { margin: var(--gbr-space-3) 0 0 var(--gbr-space-6); border-left: 2px solid var(--gbr-border); padding-left: var(--gbr-space-4); }
.gbr-comentario__respostas .gbr-comentario { border-top: none; padding-top: 0; padding-bottom: var(--gbr-space-3); }

/* ==== Página Sobre ==================================================== */
.gbr-sobre-section { margin-bottom: var(--gbr-space-8); }

.gbr-sobre-pilares { list-style: none; margin: var(--gbr-space-6) 0 0; padding: 0; border-top: 1px solid var(--gbr-border); }
.gbr-sobre-pilares li { display: flex; align-items: flex-start; gap: var(--gbr-space-4); padding: var(--gbr-space-4) 0; border-bottom: 1px solid var(--gbr-border); }
.gbr-sobre-pilar-num { flex-shrink: 0; width: 2rem; font-weight: var(--gbr-fw-bold); font-size: var(--gbr-fs-sm); color: var(--gbr-text-muted); font-variant-numeric: tabular-nums; padding-top: 2px; }
.gbr-sobre-pilares .principio-title { flex: 1; min-width: 0; }

.gbr-sobre-quote {
  margin: var(--gbr-space-10) 0;
  padding: var(--gbr-space-8) 0;
  border-top: 1px solid var(--gbr-border);
  border-bottom: 1px solid var(--gbr-border);
  font-size: var(--gbr-fs-h3);
  font-weight: var(--gbr-fw-semibold);
  line-height: var(--gbr-lh-snug);
  color: var(--gbr-text);
  max-width: 26ch;
}

.gbr-sobre-principios { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gbr-space-6); margin-top: var(--gbr-space-6); }

.gbr-sobre-fechamento { text-align: center; padding: var(--gbr-space-6) 0 var(--gbr-space-10); }
.gbr-sobre-fechamento p:not(.gbr-h4) { max-width: 60ch; margin: 0 auto var(--gbr-space-6); }

@media (max-width: 600px) {
  .principio-content { padding: 0 var(--gbr-space-4) var(--gbr-space-4) 50px; }
  .gbr-item { padding: var(--gbr-space-6) var(--gbr-space-5); }
  .subitem-header { flex-wrap: wrap; }
  .subitem-votos { order: 3; width: 100%; margin-left: calc(var(--gbr-fs-sm) + var(--gbr-space-2)); }
  .gbr-sobre-principios { grid-template-columns: 1fr; }
  .gbr-sobre-quote { font-size: var(--gbr-fs-h4); }
}