/**
 * Peniel App — Ícones CSS
 * Uso: <span class="pi pi-{nome}" aria-hidden="true"></span>
 * Bíblia: pi-biblia | Cultos: pi-cultos (calendário + cruz) | Eventos: pi-liturgia / pi-eventos
 * Configurar Culto: pi-culto-config
 * Sempre use o ícone correspondente ao citar uma opção de menu.
 */

.pi {
  display: inline-block;
  width: 1.125rem;
  height: 1.125rem;
  position: relative;
  flex-shrink: 0;
  color: currentColor;
}

.pi-lg {
  width: 2.5rem;
  height: 2.5rem;
}

.pi-xl {
  width: 3.5rem;
  height: 3.5rem;
}

/* Dashboard — grade 2×2 */
.pi-dashboard::before,
.pi-dashboard::after {
  content: "";
  position: absolute;
  border: 1.5px solid currentColor;
  width: 6px;
  height: 6px;
}
.pi-dashboard::before { top: 1px; left: 1px; box-shadow: 9px 0 0 currentColor, 0 9px 0 currentColor, 9px 9px 0 currentColor; }
.pi-dashboard::after { display: none; }

/* Ministérios — três pessoas */
.pi-ministerios::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 2px;
  left: 6px;
  box-shadow: -5px 4px 0 -1px currentColor, 5px 4px 0 -1px currentColor;
}
.pi-ministerios::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 6px;
  border: 1.5px solid currentColor;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  bottom: 1px;
  left: 2px;
}

/* Louvor — nota musical */
.pi-louvor::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  bottom: 1px;
  left: 1px;
}
.pi-louvor::after {
  content: "";
  position: absolute;
  width: 1.5px;
  height: 11px;
  background: currentColor;
  bottom: 5px;
  left: 6px;
  transform: rotate(12deg);
}

/* Projeção — tela */
.pi-projecao::before {
  content: "";
  position: absolute;
  inset: 2px 2px 5px 2px;
  border: 1.5px solid currentColor;
}
.pi-projecao::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 1.5px;
  background: currentColor;
  bottom: 1px;
  left: 50%;
  transform: translateX(-50%);
}

/* Som — alto-falante */
.pi-som::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 5px solid currentColor;
  top: 5px;
  left: 2px;
}
.pi-som::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 8px;
  border: 1.5px solid currentColor;
  border-left: none;
  top: 3px;
  right: 2px;
  border-radius: 0 3px 3px 0;
}

/* Mídia (ministério) — câmera */
.pi-midia-min::before {
  content: "";
  position: absolute;
  inset: 4px 2px 3px 2px;
  border: 1.5px solid currentColor;
  border-radius: 1px;
}
.pi-midia-min::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 2px;
  border: 1.5px solid currentColor;
  border-bottom: none;
  top: 2px;
  left: 5px;
}

/* Pastoral — coração */
.pi-pastoral::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border: 1.5px solid currentColor;
  border-radius: 50% 50% 0 50%;
  top: 4px;
  left: 2px;
  transform: rotate(-45deg);
}
.pi-pastoral::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border: 1.5px solid currentColor;
  border-radius: 50% 50% 50% 0;
  top: 4px;
  right: 2px;
  transform: rotate(45deg);
}

/* Adolescentes — duas figuras */
.pi-adolescentes::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 1px;
  left: 2px;
  box-shadow: 8px 0 0 -1.5px currentColor;
}
.pi-adolescentes::after {
  content: "";
  position: absolute;
  width: 7px;
  height: 7px;
  border: 1.5px solid currentColor;
  border-bottom: none;
  border-radius: 7px 7px 0 0;
  bottom: 1px;
  left: 1px;
  box-shadow: 8px 0 0 -1.5px currentColor;
}

/* Casais — dois anéis */
.pi-casais::before,
.pi-casais::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 4px;
}
.pi-casais::before { left: 1px; }
.pi-casais::after { right: 1px; }

/* Café — xícara */
.pi-cafe::before {
  content: "";
  position: absolute;
  width: 10px;
  height: 8px;
  border: 1.5px solid currentColor;
  border-radius: 0 0 3px 3px;
  bottom: 2px;
  left: 2px;
}
.pi-cafe::after {
  content: "";
  position: absolute;
  width: 3px;
  height: 4px;
  border: 1.5px solid currentColor;
  border-left: none;
  border-radius: 0 3px 3px 0;
  bottom: 4px;
  right: 2px;
}

/* Next / esporte — octógono simples */
.pi-next::before {
  content: "";
  position: absolute;
  inset: 2px;
  border: 1.5px solid currentColor;
  border-radius: 2px;
  transform: rotate(45deg);
  width: 10px;
  height: 10px;
  left: 3px;
  top: 3px;
}
.pi-next::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: currentColor;
  border-radius: 50%;
  top: 6px;
  left: 6px;
}

/* Trupe — máscara */
.pi-trupe::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 10px;
  border: 1.5px solid currentColor;
  border-radius: 6px 6px 4px 4px;
  top: 3px;
  left: 2px;
}
.pi-trupe::after {
  content: "";
  position: absolute;
  width: 2px;
  height: 2px;
  background: currentColor;
  border-radius: 50%;
  top: 7px;
  left: 5px;
  box-shadow: 5px 0 0 currentColor;
}

/* Face a Face — duas faces */
.pi-face::before,
.pi-face::after {
  content: "";
  position: absolute;
  width: 7px;
  height: 10px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 3px;
}
.pi-face::before { left: 1px; }
.pi-face::after { right: 1px; }

/* Infantil — estrela pequena / criança */
.pi-infantil::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 1px;
  left: 5px;
}
.pi-infantil::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 7px;
  border: 1.5px solid currentColor;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  bottom: 1px;
  left: 3px;
}

/* Integração — aperto de mãos (dois arcos) */
.pi-integracao::before,
.pi-integracao::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 4px;
}
.pi-integracao::before {
  left: 1px;
  border-right-color: transparent;
  transform: rotate(-30deg);
}
.pi-integracao::after {
  right: 1px;
  border-left-color: transparent;
  transform: rotate(30deg);
}

/* Jovens — chama */
.pi-jovens::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 11px;
  border: 1.5px solid currentColor;
  border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
  top: 2px;
  left: 4px;
}
.pi-jovens::after {
  content: "";
  position: absolute;
  width: 3px;
  height: 4px;
  border: 1.5px solid currentColor;
  border-top: none;
  border-radius: 0 0 2px 2px;
  bottom: 3px;
  left: 6.5px;
}

/* Manutenção — chave */
.pi-manutencao::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 2px;
  left: 2px;
}
.pi-manutencao::after {
  content: "";
  position: absolute;
  width: 1.5px;
  height: 10px;
  background: currentColor;
  top: 5px;
  left: 8px;
  transform: rotate(40deg);
  box-shadow: 3px 3px 0 -0.5px currentColor;
}

/* Teatro — máscaras */
.pi-teatro::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 9px;
  border: 1.5px solid currentColor;
  border-radius: 4px 4px 6px 6px;
  top: 3px;
  left: 1px;
}
.pi-teatro::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 9px;
  border: 1.5px solid currentColor;
  border-radius: 4px 4px 6px 6px;
  top: 3px;
  right: 1px;
}

/* Eventos — calendário simples */
.pi-liturgia,
.pi-eventos {
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
.pi-liturgia::before,
.pi-liturgia::after,
.pi-eventos::before,
.pi-eventos::after {
  content: none;
  display: none;
}

/* Cultos — calendário com cruz */
.pi-cultos {
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3Cpath d='M12 12.5v6M9.5 15.5h5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3Cpath d='M12 12.5v6M9.5 15.5h5'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
.pi-cultos::before,
.pi-cultos::after {
  content: none;
  display: none;
}

/* História / Lema — pergaminho */
.pi-historia::before {
  content: "";
  position: absolute;
  inset: 3px 2px 3px 3px;
  border: 1.5px solid currentColor;
  border-radius: 1px 3px 3px 1px;
}
.pi-historia::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 1px;
  background: currentColor;
  top: 7px;
  left: 5px;
  box-shadow: 0 3px 0 currentColor;
}

/* Versículo Base — aspas */
.pi-versiculo::before {
  content: "\201C";
  position: absolute;
  font-size: 14px;
  line-height: 1;
  top: 0;
  left: 1px;
  font-family: Georgia, serif;
}
.pi-versiculo::after {
  content: "\201D";
  position: absolute;
  font-size: 14px;
  line-height: 1;
  bottom: 0;
  right: 1px;
  font-family: Georgia, serif;
}

/* Líderes — duas silhuetas */
.pi-lideres::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 2px;
  left: 3px;
}
.pi-lideres::after {
  content: "";
  position: absolute;
  width: 7px;
  height: 4px;
  border: 1.5px solid currentColor;
  border-bottom: none;
  border-radius: 4px 4px 0 0;
  bottom: 2px;
  left: 1px;
  box-shadow: 7px -6px 0 -1px currentColor, 7px -2px 0 0 transparent, 14px 0 0 -1px currentColor;
}

/* Configuração do Culto — engrenagem com cruz */
.pi-culto-config {
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z'/%3E%3Cpath d='M12 9.5v5M10.25 11h3.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z'/%3E%3Cpath d='M12 9.5v5M10.25 11h3.5'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
.pi-culto-config::before,
.pi-culto-config::after {
  content: none;
  display: none;
}

/* Pregador — microfone */
.pi-pregador::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 8px;
  border: 1.5px solid currentColor;
  border-radius: 3px;
  top: 1px;
  left: 6px;
}
.pi-pregador::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 4px;
  border: 1.5px solid currentColor;
  border-top: none;
  border-radius: 0 0 4px 4px;
  bottom: 2px;
  left: 5px;
}

/* Oferta — presente */
.pi-oferta::before {
  content: "";
  position: absolute;
  inset: 5px 2px 2px 2px;
  border: 1.5px solid currentColor;
}
.pi-oferta::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 1.5px;
  background: currentColor;
  top: 5px;
  left: 2px;
  box-shadow: 0 -3px 0 5px transparent, 6px -3px 0 0 currentColor;
}

/* Oração — mãos */
.pi-oracao::before,
.pi-oracao::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 8px;
  border: 1.5px solid currentColor;
  border-bottom: none;
  border-radius: 4px 4px 0 0;
  bottom: 2px;
}
.pi-oracao::before { left: 3px; transform: rotate(-15deg); }
.pi-oracao::after { right: 3px; transform: rotate(15deg); }

/* Painel Holyrics — monitor */
.pi-holyrics::before {
  content: "";
  position: absolute;
  inset: 2px 1px 6px 1px;
  border: 1.5px solid currentColor;
}
.pi-holyrics::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 1.5px;
  background: currentColor;
  bottom: 2px;
  left: 4px;
}

/* Slides — layout */
.pi-slides::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 8px;
  border: 1.5px solid currentColor;
  top: 2px;
  left: 3px;
}
.pi-slides::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 5px;
  border: 1.5px solid currentColor;
  bottom: 2px;
  left: 1px;
  opacity: 0.5;
}

/* Fundos — imagem */
.pi-fundos::before {
  content: "";
  position: absolute;
  inset: 3px;
  border: 1.5px solid currentColor;
}
.pi-fundos::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 3px solid transparent;
  border-bottom: 4px solid currentColor;
  top: 6px;
  left: 4px;
}

/* Playlist — lista com nota (legado) */
.pi-playlist::before {
  content: "";
  position: absolute;
  width: 10px;
  height: 1.5px;
  background: currentColor;
  top: 4px;
  left: 4px;
  box-shadow: 0 4px 0 currentColor, 0 8px 0 currentColor;
}
.pi-playlist::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  bottom: 3px;
  left: 1px;
}

/*
 * Folha Peniel — emblema da marca (PNG vetorizado em CSS).
 * Catálogo de ícones + ícone oficial do Banco de Louvores.
 */
.pi-folha-peniel {
  background-color: transparent !important;
  background-image: url("../assets/folha-peniel.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  /* Fallback silhueta se a imagem não carregar */
  -webkit-mask-image: none;
  mask-image: none;
}
.pi-folha-peniel::before,
.pi-folha-peniel::after {
  content: none !important;
  display: none !important;
}

/* No menu, não forçar tint grená por cima da folha colorida */
.sidebar-nav .nav-link > .pi.pi-folha-peniel,
.sidebar-nav .nav-sublink > .pi.pi-folha-peniel,
.sidebar-nav .accordion-trigger .pi.pi-folha-peniel:not(.accordion-icon),
.sidebar-nav .accordion-trigger .flex > .pi.pi-folha-peniel {
  color: transparent;
  background-image: url("../assets/folha-peniel.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.config-icon-picker__btn .pi.pi-folha-peniel {
  width: 1.5rem;
  height: 1.5rem;
  color: transparent;
}

/*
 * Clave + notas ligadas — ícone oficial do Banco de Louvores.
 * Máscara do PNG (fundo transparente; clave + semicolcheias).
 * Herda currentColor (visível no menu claro/escuro).
 */
.pi-notas-louvores {
  background-color: currentColor;
  background-image: none;
  -webkit-mask-image: url("../assets/notas-louvores.png");
  mask-image: url("../assets/notas-louvores.png");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
.pi-notas-louvores::before,
.pi-notas-louvores::after {
  content: none !important;
  display: none !important;
}

.config-icon-picker__btn .pi.pi-notas-louvores {
  width: 1.75rem;
  height: 1.35rem;
}

/*
 * Claquete + play — ícone oficial do Banco de Vídeos.
 * Linha contínua (SVG mask), herda currentColor.
 */
.pi-claquete {
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Crect x='2.4' y='3.6' width='19.2' height='16.8' rx='3.4' stroke='%23000' stroke-width='1.85'/%3E%3Cpath stroke='%23000' stroke-width='1.85' stroke-linecap='round' d='M2.4 8.7h19.2'/%3E%3Cpath stroke='%23000' stroke-width='1.7' stroke-linecap='round' d='M5.1 8.7L7.4 3.6M8.6 8.7L10.9 3.6M12.1 8.7L14.4 3.6M15.6 8.7L17.9 3.6'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.7' stroke-linejoin='round' stroke-linecap='round' d='M10.1 12.05v6.1l5.4-3.05-5.4-3.05z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Crect x='2.4' y='3.6' width='19.2' height='16.8' rx='3.4' stroke='%23000' stroke-width='1.85'/%3E%3Cpath stroke='%23000' stroke-width='1.85' stroke-linecap='round' d='M2.4 8.7h19.2'/%3E%3Cpath stroke='%23000' stroke-width='1.7' stroke-linecap='round' d='M5.1 8.7L7.4 3.6M8.6 8.7L10.9 3.6M12.1 8.7L14.4 3.6M15.6 8.7L17.9 3.6'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.7' stroke-linejoin='round' stroke-linecap='round' d='M10.1 12.05v6.1l5.4-3.05-5.4-3.05z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
.pi-claquete::before,
.pi-claquete::after {
  content: none;
  display: none;
}

/*
 * Fotos empilhadas + paisagem — ícone oficial do Banco de Imagens.
 */
.pi-galeria {
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Crect x='5.2' y='2.2' width='14.6' height='14.6' rx='3.2' stroke='%23000' stroke-width='1.85'/%3E%3Crect x='2.4' y='5.4' width='14.6' height='14.6' rx='3.2' fill='%23fff' stroke='%23000' stroke-width='1.85'/%3E%3Cpath fill='%23000' d='M4.25 10.2h10.9v7.95c0 1.35-1.05 2.35-2.35 2.35H6.6c-1.3 0-2.35-1-2.35-2.35V10.2z'/%3E%3Ccircle cx='7.15' cy='12.55' r='1.35' fill='%23fff'/%3E%3Cpath fill='%23fff' d='M4.25 18.2l3.35-3.55 2.05 1.85 2.55-3.05 3 4.75H4.25z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Crect x='5.2' y='2.2' width='14.6' height='14.6' rx='3.2' stroke='%23000' stroke-width='1.85'/%3E%3Crect x='2.4' y='5.4' width='14.6' height='14.6' rx='3.2' fill='%23fff' stroke='%23000' stroke-width='1.85'/%3E%3Cpath fill='%23000' d='M4.25 10.2h10.9v7.95c0 1.35-1.05 2.35-2.35 2.35H6.6c-1.3 0-2.35-1-2.35-2.35V10.2z'/%3E%3Ccircle cx='7.15' cy='12.55' r='1.35' fill='%23fff'/%3E%3Cpath fill='%23fff' d='M4.25 18.2l3.35-3.55 2.05 1.85 2.55-3.05 3 4.75H4.25z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
.pi-galeria::before,
.pi-galeria::after {
  content: none;
  display: none;
}

/* Escalas — calendário */
.pi-escalas::before {
  content: "";
  position: absolute;
  inset: 2px;
  border: 1.5px solid currentColor;
}
.pi-escalas::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 3px;
  background: currentColor;
  top: 2px;
  left: 2px;
  box-shadow: 0 5px 0 -1px currentColor, 4px 5px 0 -1px currentColor, 8px 5px 0 -1px currentColor;
}

/* Bíblia — livro aberto */
.pi-biblia {
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 7v14'/%3E%3Cpath d='M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 7v14'/%3E%3Cpath d='M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}
.pi-biblia::before,
.pi-biblia::after {
  content: none;
  display: none;
}

/* Mídia & Broadcast — torre */
.pi-broadcast::before {
  content: "";
  position: absolute;
  width: 1.5px;
  height: 12px;
  background: currentColor;
  bottom: 2px;
  left: 8px;
}
.pi-broadcast::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 1px;
  left: 4px;
}

/* Rádio Peniel */
.pi-radio::before {
  content: "";
  position: absolute;
  inset: 4px 2px 3px 2px;
  border: 1.5px solid currentColor;
  border-radius: 2px;
}
.pi-radio::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 6px;
  left: 7px;
}

/* TV Peniel */
.pi-tv::before {
  content: "";
  position: absolute;
  inset: 2px 1px 5px 1px;
  border: 1.5px solid currentColor;
}
.pi-tv::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 1.5px;
  background: currentColor;
  bottom: 2px;
  left: 6px;
}

/* Banco de Imagens e Vídeos */
.pi-banco::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border: 1.5px solid currentColor;
  top: 2px;
  left: 2px;
}
.pi-banco::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border: 1.5px solid currentColor;
  bottom: 2px;
  right: 2px;
  opacity: 0.6;
}

/* Avisos — megafone */
.pi-avisos::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-right: 8px solid currentColor;
  top: 5px;
  left: 1px;
}
.pi-avisos::after {
  content: "";
  position: absolute;
  width: 3px;
  height: 6px;
  border: 1.5px solid currentColor;
  border-left: none;
  top: 6px;
  right: 4px;
  border-radius: 0 2px 2px 0;
}

/* Social */
.pi-youtube::before {
  content: "";
  position: absolute;
  inset: 3px;
  border: 1.5px solid currentColor;
  border-radius: 3px;
}
.pi-youtube::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-left: 5px solid currentColor;
  top: 6px;
  left: 7px;
}

.pi-instagram::before {
  content: "";
  position: absolute;
  inset: 2px;
  border: 1.5px solid currentColor;
  border-radius: 4px;
}
.pi-instagram::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 5px;
  left: 5px;
}

.pi-tiktok::before {
  content: "";
  position: absolute;
  width: 1.5px;
  height: 10px;
  background: currentColor;
  top: 2px;
  left: 9px;
}
.pi-tiktok::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  bottom: 2px;
  left: 3px;
}

.pi-site::before {
  content: "";
  position: absolute;
  inset: 3px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
}
.pi-site::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 1px;
  background: currentColor;
  top: 8px;
  left: 3px;
  box-shadow: 0 -3px 0 0 currentColor, 0 3px 0 0 currentColor;
}

.pi-whatsapp::before {
  content: "";
  position: absolute;
  inset: 2px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
}
.pi-whatsapp::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 4px;
  border: 1.5px solid currentColor;
  border-top: none;
  border-radius: 0 0 4px 4px;
  bottom: 3px;
  left: 5px;
}

/* UI utilitários */
.pi-chevron::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  top: 4px;
  left: 5px;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}
.pi-chevron.is-open::before {
  transform: rotate(-135deg);
  top: 6px;
}

.pi-menu::before {
  content: "";
  position: absolute;
  width: 14px;
  height: 1.5px;
  background: currentColor;
  top: 4px;
  left: 2px;
  box-shadow: 0 5px 0 currentColor, 0 10px 0 currentColor;
}

.pi-search::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  top: 2px;
  left: 2px;
}
.pi-search::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 1.5px;
  background: currentColor;
  bottom: 3px;
  right: 2px;
  transform: rotate(45deg);
}

.pi-notificacao::before {
  content: "";
  position: absolute;
  width: 10px;
  height: 8px;
  border: 1.5px solid currentColor;
  border-radius: 4px 4px 2px 2px;
  top: 2px;
  left: 4px;
}
.pi-notificacao::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 2px;
  border: 1.5px solid currentColor;
  border-bottom: none;
  border-radius: 2px 2px 0 0;
  top: 1px;
  left: 7px;
}

.pi-fechar::before,
.pi-fechar::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 1.5px;
  background: currentColor;
  top: 8px;
  left: 2px;
}
.pi-fechar::before { transform: rotate(45deg); }
.pi-fechar::after { transform: rotate(-45deg); }

/* Sidebar — ícones de navegação sempre grená (#9B1B1B) */
.sidebar-nav .nav-link > .pi,
.sidebar-nav .nav-sublink > .pi,
.sidebar-nav .accordion-trigger .pi:not(.accordion-icon),
.sidebar-nav .accordion-trigger .flex > .pi {
  color: #9B1B1B;
}

.sidebar-nav .pi.text-peniel-muted:not(.accordion-icon) {
  color: #9B1B1B;
}

.sidebar-nav .nav-link:hover > .pi,
.sidebar-nav .nav-sublink:hover > .pi,
.sidebar-nav .accordion-trigger:hover .pi:not(.accordion-icon) {
  color: #b52222;
}