/* =======================================================
   Loomah Inscrições — Public CSS
   Reset defensivo: evita conflito com estilos do tema
======================================================= */

/* Reset de sublinhado em links e ícones dentro de qualquer
   container do plugin. Temas costumam forçar text-decoration: underline
   em <a> com !important ou seletores de alta especificidade (Hello
   Elementor, temas de diocese, etc), o que bagunça botões com <i>+texto
   e até decora ícones Phosphor (.ph::before herda decoração do <a>).

   A v2.6.8 reforça com !important e cobre descendentes (a *) — sem
   isso, o tema vence em qualquer site onde body a {text-decoration:
   underline !important} esteja definido. */
.li-form-inscricao a,
.li-form-inscricao a *,
.li-evento-single a,
.li-evento-single a *,
.li-lista-eventos a,
.li-lista-eventos a *,
.li-evento-card a,
.li-evento-card a *,
.li-info-wrap a,
.li-info-wrap a *,
.li-acompanhar-wrap a,
.li-acompanhar-wrap a *,
.li-share-dropdown a,
.li-share-dropdown a *,
.li-btn,
.li-btn *,
.li-btn:hover,
.li-btn:hover *,
.li-btn:focus,
.li-btn:focus * {
    text-decoration: none !important;
}
.li-form-inscricao a:hover,
.li-evento-single a:hover,
.li-lista-eventos a:hover,
.li-info-wrap a:hover,
.li-acompanhar-wrap a:hover,
.li-share-dropdown a:hover {
    text-decoration: none;
}
.li-form-inscricao .ph,
.li-evento-single .ph,
.li-lista-eventos .ph,
.li-info-wrap .ph,
.li-acompanhar-wrap .ph,
.li-share-dropdown .ph {
    text-decoration: none;
}

/* Evento single */
.li-evento-single { max-width: 860px; margin: 0 auto; padding: 24px 16px; }
.li-evento-capa img { width: 100%; border-radius: 10px; margin-bottom: 24px; }
.li-evento-titulo { font-size: 28px; margin-bottom: 12px; }
.li-evento-meta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; color: #4b5563; font-size: 14px; }
.li-evento-meta__item { display: flex; align-items: center; gap: 4px; }
.li-evento-descricao { margin-bottom: 32px; line-height: 1.8; }

/* Lista de eventos */
.li-lista-eventos { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }
.li-evento-card { border: 1px solid #e5e7eb; border-radius: 10px; overflow: hidden; background: #fff; }
.li-evento-card__thumb img { width: 100%; height: 180px; object-fit: cover; display: block; }
.li-evento-card__body { padding: 16px; }
.li-evento-card__titulo { margin: 0 0 8px; font-size: 18px; }
.li-evento-card__titulo a { text-decoration: none; color: inherit; }
.li-evento-card__titulo a:hover { color: #2563eb; }
.li-evento-card__meta { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: #6b7280; margin-bottom: 10px; }

/* Badges genéricos */
.li-badge { display: inline-block; padding: 2px 10px; border-radius: 12px; font-size: 12px; font-weight: 600; background: #e5e7eb; color: #374151; }
.li-badge--verde    { background: #dcfce7; color: #166534; }
.li-badge--vermelho { background: #fee2e2; color: #991b1b; }
.li-badge--amarelo  { background: #fef9c3; color: #854d0e; }

/* Card de evento simultâneo — lista de localidades (2.26.6) */
.li-badge--simultaneo { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; }
.li-evento-card__locs-toggle { margin: 0 0 10px; }
.li-evento-card__locs-toggle > summary {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #2563eb;
    padding: 6px 0;
}
.li-evento-card__locs-toggle > summary::-webkit-details-marker { display: none; }
.li-evento-card__locs-toggle > summary i { transition: transform .18s ease; }
.li-evento-card__locs-toggle[open] > summary i { transform: rotate(180deg); }
.li-evento-card__locs-toggle[open] > summary { margin-bottom: 6px; }
.li-evento-card__locs {
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.li-evento-card__loc {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 10px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fafafa;
}
.li-evento-card__loc-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.li-evento-card__loc-info strong {
    font-size: 13px;
    color: #111827;
    line-height: 1.3;
}
.li-evento-card__loc-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    font-size: 12px;
    color: #6b7280;
}
.li-evento-card__loc .li-badge {
    flex-shrink: 0;
    white-space: nowrap;
}

/* =======================================================
   Formulário de inscrição
======================================================= */

.li-form-inscricao {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 32px 28px;
    margin-top: 32px;
    box-sizing: border-box;
}

.li-form-inscricao h2 {
    margin: 0 0 24px;
    font-size: 22px;
    color: #111827;
}

.li-form-step {
    margin-bottom: 4px;
}

/* Grupo de campo */
.li-form-grupo {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 18px;
}

/* Labels */
.li-label,
.li-form-grupo label {
    font-weight: 600;
    font-size: 14px;
    color: #374151;
    display: block;
}

.li-label-titulo {
    font-weight: 700;
    font-size: 15px;
    color: #111827;
    margin-bottom: 12px;
    display: block;
}

.li-obrig { color: #dc2626; }

/* Inputs */
.li-form-inscricao input[type="text"],
.li-form-inscricao input[type="email"],
.li-form-inscricao input[type="tel"],
.li-form-inscricao input[type="number"],
.li-form-inscricao input[type="date"],
.li-form-inscricao input[type="url"],
.li-form-inscricao select,
.li-form-inscricao textarea {
    display: block;
    width: 100%;
    padding: 10px 12px;
    border: 1.5px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    color: #111827;
    background: #fff;
    box-sizing: border-box;
    line-height: 1.5;
    transition: border-color .15s;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
}

.li-form-inscricao input:focus,
.li-form-inscricao select:focus,
.li-form-inscricao textarea:focus {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37,99,235,.1);
}

.li-form-inscricao textarea {
    resize: vertical;
    min-height: 80px;
}

/* Select: restaura seta nativa */
.li-form-inscricao select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    padding-right: 36px;
}

/* =======================================================
   Seletor de modo: membro / visitante / convidado
======================================================= */

/* Cards de seleção de modo — reset total para isolar do tema */
.li-form-inscricao .li-modo-toggle {
    display: block !important;
    float: none !important;
    margin-bottom: 20px;
    padding: 0 !important;
    list-style: none !important;
}

.li-form-inscricao .li-modo-toggle::before,
.li-form-inscricao .li-modo-toggle::after {
    display: none !important;
    content: none !important;
}

.li-form-inscricao .li-modo-option {
    display: block !important;
    float: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 8px !important;
    padding: 12px 16px 12px 46px !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 8px !important;
    background: #fff !important;
    cursor: pointer;
    position: relative !important;
    transition: border-color .15s, background .15s;
    text-align: left !important;
}

/* Radio escondido — acessível via label */
.li-form-inscricao .li-modo-option input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 1px !important;
    height: 1px !important;
    left: -9999px !important;
}

/* Círculo de seleção via ::before posicionado */
.li-form-inscricao .li-modo-option::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 18px !important;
    height: 18px !important;
    border: 2px solid #d1d5db !important;
    border-radius: 50% !important;
    background: #fff !important;
    box-sizing: border-box !important;
    transition: border-color .15s, background .15s !important;
}

.li-form-inscricao .li-modo-option.active {
    border-color: #2563eb !important;
    background: #eff6ff !important;
}

.li-form-inscricao .li-modo-option.active::before {
    border-color: #2563eb !important;
    background: #2563eb !important;
    box-shadow: inset 0 0 0 4px #fff !important;
}

.li-form-inscricao .li-modo-option--convidado.active {
    border-color: #7c3aed !important;
    background: #f5f3ff !important;
}

.li-form-inscricao .li-modo-option--convidado.active::before {
    border-color: #7c3aed !important;
    background: #7c3aed !important;
    box-shadow: inset 0 0 0 4px #fff !important;
}

.li-form-inscricao .li-modo-content {
    display: block !important;
}

.li-form-inscricao .li-modo-content strong {
    display: block !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #111827 !important;
    line-height: 1.3 !important;
    margin: 0 !important;
}

.li-form-inscricao .li-modo-option.active .li-modo-content strong { color: #1d4ed8 !important; }
.li-form-inscricao .li-modo-option--convidado.active .li-modo-content strong { color: #6d28d9 !important; }

.li-form-inscricao .li-modo-content small {
    display: block !important;
    font-size: 12px !important;
    color: #6b7280 !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    margin-top: 2px !important;
}

/* =======================================================
   Input + botão lado a lado
======================================================= */

.li-input-action {
    display: flex;
    gap: 8px;
    align-items: flex-start;
}

.li-input-action input {
    flex: 1;
    min-width: 0; /* evita overflow em flex */
}

.li-input-action .li-btn {
    flex-shrink: 0;
    white-space: nowrap;
}

/* =======================================================
   Botões
======================================================= */

.li-btn {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border: 2px solid #2563eb;
    background: #2563eb;
    color: #fff;
    transition: background .15s, border-color .15s;
    line-height: 1.4;
    text-align: center;
    box-sizing: border-box;
    font-family: inherit;
}

.li-btn:hover,
.li-btn:focus {
    background: #1d4ed8;
    border-color: #1d4ed8;
    color: #fff;
    outline: none;
}

.li-btn--primary { background: #2563eb; color: #fff; }

/* Variante outline: stroke e texto na cor primária default do plugin.
   Em containers com personalização de cor (#li-info-wrap), regras com
   maior especificidade sobrescrevem com a cor do tema. Ver o <style>
   inline emitido por pagina-evento.php. */
.li-btn--outline {
    background: transparent;
    border-color: #2563eb;
    color: #2563eb;
}
.li-btn--outline:hover,
.li-btn--outline:focus {
    background: #2563eb;
    color: #fff;
    border-color: #2563eb;
}

.li-btn:disabled,
.li-btn[disabled] {
    opacity: .6;
    cursor: not-allowed;
}

.li-form-submit { margin-top: 8px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

/* =======================================================
   Feedback inline
======================================================= */

.li-feedback { font-size: 13px; line-height: 1.4; }
.li-feedback--erro  { color: #dc2626; }
.li-feedback--ok    { color: #16a34a; }
.li-feedback--info  { color: #2563eb; }

/* =======================================================
   Card do membro encontrado
======================================================= */

.li-membro-card {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    padding: 12px 16px;
    margin: 4px 0 16px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.li-membro-card__foto-wrap {
    flex-shrink: 0;
}

.li-membro-card__foto {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #bfdbfe;
    display: block;
}

.li-membro-card__info {
    flex: 1;
    min-width: 0;
}

.li-membro-card__nome    { font-weight: 700; font-size: 15px; color: #1e40af; margin-bottom: 4px; }
.li-membro-card__detalhe { font-size: 13px; color: #6b7280; margin-top: 2px; }

/* =======================================================
   Avisos
======================================================= */

.li-aviso {
    padding: 12px 16px;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 16px;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    box-sizing: border-box;
}

.li-aviso--warn { background: #fefce8; border-color: #fde047; color: #854d0e; }

.li-info-text { font-size: 13px; color: #6b7280; margin: 0 0 14px; line-height: 1.5; }
.li-info-ok   { color: #166534; font-weight: 600; }

/* =======================================================
   Campos preenchidos via API (readonly)
======================================================= */

.li-campo--preenchido,
input.li-campo--preenchido,
select.li-campo--preenchido,
textarea.li-campo--preenchido {
    background: #f0fdf4 !important;
    border-color: #86efac !important;
    color: #166534 !important;
    cursor: not-allowed;
}

.li-campo--erro {
    border-color: #f87171 !important;
    background: #fef2f2 !important;
}

/* Radio / checkbox públicos */
.li-radios, .li-checks { display: flex; flex-direction: column; gap: 8px; }
.li-radio-option, .li-checkbox-option {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 400;
    font-size: 14px;
    cursor: pointer;
}

/* =======================================================
   Resultado final
======================================================= */

#li-inscricao-resultado {
    margin-top: 20px;
    border-radius: 10px;
    overflow: hidden;
}

#li-inscricao-resultado.li-sucesso { background: #f0fdf4; border: 1px solid #bbf7d0; }
#li-inscricao-resultado.li-erro    { background: #fef2f2; border: 1px solid #fecaca; }

.li-inscricao-ok { padding: 32px 24px; text-align: center; }
.li-inscricao-ok__icon { font-size: 52px; color: #16a34a; line-height: 1; margin-bottom: 16px; }
.li-inscricao-ok h3 { margin: 0 0 10px; font-size: 20px; color: #15803d; }
.li-inscricao-ok p  { margin: 4px 0; font-size: 14px; color: #374151; }

/* =======================================================
   Responsivo
======================================================= */

@media (max-width: 640px) {
    .li-form-inscricao { padding: 20px 16px; }
    /* .li-modo-toggle já usa display:block — sem necessidade de override */
    .li-input-action { flex-direction: column; }
    .li-input-action .li-btn { width: 100%; }
    .li-lista-eventos { grid-template-columns: 1fr; }
}

/* =======================================================
   Localidades (eventos simultâneos) — v2.0.0
======================================================= */

.li-localidades-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.li-localidade-opcao {
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 2px solid #d1d5db;
    border-radius: 10px;
    padding: 14px 16px;
    cursor: pointer;
    transition: border-color .15s, background .15s, box-shadow .15s;
    background: #fff;
    position: relative;
}

.li-localidade-opcao input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.li-localidade-opcao:hover {
    border-color: #9ca3af;
    background: #f9fafb;
}

.li-localidade-opcao.is-selected {
    border-color: #2563eb;
    background: #eff6ff;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.li-localidade-opcao__nome {
    font-weight: 700;
    font-size: 15px;
    color: #111827;
    line-height: 1.3;
}

.li-localidade-opcao__sub {
    font-size: 12px;
    color: #6b7280;
    margin-top: 2px;
}

.li-localidade-opcao__data {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #4b5563;
    margin-top: 6px;
    font-weight: 500;
}

/* 2.50.0 — nível de escassez no texto de vagas do card de localidade.
   Usa a rampa coral/amber do DS: são os mesmos tons de "perigo" e
   "atenção" do admin, com contraste suficiente sobre superfície clara. */
.li-loc-vagas__texto--critico {
    color: var(--lm-coral-500, #BA3220);
    font-weight: var(--lm-font-weight-semibold, 600);
}
.li-loc-vagas__texto--baixo {
    color: var(--lm-amber-500, #C07200);
    font-weight: var(--lm-font-weight-semibold, 600);
}

/* 2.49.0 — preço da sede na opção de localidade */
.li-localidade-opcao__valor {
    display: inline-flex;
    align-items: center;
    gap: var(--lm-space-1, 4px);
    margin-top: var(--lm-space-2, 8px);
    font-size: var(--lm-font-size-sm, 13px);
    font-weight: var(--lm-font-weight-semibold, 600);
    color: var(--lm-color-text, #1e293b);
}

.li-localidade-opcao__esgotado {
    display: inline-block;
    margin-top: 6px;
    font-size: 11px;
    font-weight: 700;
    color: #991b1b;
    background: #fee2e2;
    padding: 2px 8px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: .4px;
}

/* =======================================================
   Termos de Participação — v2.0.0
======================================================= */

.li-step-termos {
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1.5px solid #e5e7eb;
}

.li-termos-header {
    margin-bottom: 12px;
}

.li-termos-titulo {
    font-size: 18px;
    font-weight: 700;
    color: #111827;
    margin: 0 0 6px;
}

.li-termos-intro {
    font-size: 13px;
    color: #6b7280;
    margin: 0;
}

.li-termos-corpo {
    max-height: 320px;
    overflow-y: auto;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px 24px;
    background: #fafafa;
    font-size: 13px;
    color: #374151;
    line-height: 1.7;
    margin-bottom: 16px;
    scroll-behavior: smooth;
}

.li-termos-corpo h1, .li-termos-corpo h2, .li-termos-corpo h3 {
    color: #2563eb;
    font-size: 14px;
    font-weight: 700;
    margin: 16px 0 6px;
    text-transform: uppercase;
    letter-spacing: .3px;
}

.li-termos-corpo p { margin: 0 0 8px; }
.li-termos-corpo ul, .li-termos-corpo ol { padding-left: 20px; margin: 0 0 8px; }
.li-termos-corpo li { margin-bottom: 4px; }

.li-termos-aceite {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.li-termos-aceite__label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    user-select: none;
}

.li-termos-aceite__label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    min-width: 18px;
    cursor: pointer;
    accent-color: #2563eb;
}

.li-termos-aceite--obrig .li-obrig { color: #dc2626; }

/* =======================================================
   Links de recuperação de ID — v2.0.0
======================================================= */

.li-links-recuperacao {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.li-link-recuperar {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
    transition: opacity .15s;
}

.li-link-recuperar:hover { opacity: .75; }

/* =======================================================
   Responsivo adicional — v2.0.0
======================================================= */

@media (max-width: 640px) {
    .li-localidades-grid {
        grid-template-columns: 1fr;
    }
    .li-termos-corpo {
        padding: 14px 16px;
        max-height: 240px;
    }
}

/* =======================================================
   Campos em colunas (largura %) — v2.0.0
======================================================= */

.li-step-campos-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

.li-step-campos-wrap .li-form-grupo {
    /* largura 100% por padrão — sobrescrita inline quando < 100 */
    width: 100%;
    box-sizing: border-box;
}

@media (max-width: 600px) {
    /* Em mobile, todos os campos ficam 100% independente da configuração */
    .li-step-campos-wrap .li-form-grupo[style*="width"] {
        width: 100% !important;
        padding-right: 0 !important;
    }
}

/* Localidade desabilitada */
.li-localidade-opcao.is-disabled {
    opacity: .55;
    cursor: not-allowed;
    background: #f3f4f6;
    border-color: #e5e7eb;
}
.li-localidade-opcao.is-disabled input[type="radio"] { pointer-events: none; }
.li-localidade-opcao.is-disabled:hover { border-color: #e5e7eb; background: #f3f4f6; box-shadow: none; }

/* Status da localidade */
.li-localidade-opcao__status {
    display: inline-block;
    margin-top: 6px;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: .4px;
}
.li-localidade-opcao__status--esgotada  { color: #991b1b; background: #fee2e2; }
/* 2.39.0 — lotada, mas com fila: âmbar, não vermelho. Vermelho diz "acabou";
   aqui ainda há uma ação possível, e a cor precisa dizer isso. */
.li-localidade-opcao__status--espera    { color: #92400e; background: #fef3c7; }
.li-localidade-opcao.is-espera          { border-style: dashed; }
.li-localidade-opcao__status--encerrada { color: #6b7280; background: #f3f4f6; }
.li-localidade-opcao__status--nao_aberta{ color: #92400e; background: #fef3c7; }

/* ================================================================
   BADGES DE URGÊNCIA
   ================================================================ */

.li-badge--urgencia {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin: 4px 0;
}

.li-badge--azul     { background: #dbeafe; color: #1d4ed8; }
.li-badge--laranja  { background: #fef3c7; color: #92400e; }
.li-badge--cinza    { background: #f3f4f6; color: #6b7280; }
.li-badge--verde    { background: #dcfce7; color: #166534; }
.li-badge--vermelho { background: #fee2e2; color: #991b1b; }

@keyframes li-pulsar {
    0%, 100% { opacity: 1; }
    50%       { opacity: .65; }
}
.li-badge--pulsante { animation: li-pulsar 1.4s ease-in-out infinite; }

.li-urgencia-banner {
    margin: 0 0 16px;
}
.li-urgencia-banner--urgente {
    padding: 10px 14px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 8px;
    display: inline-block;
}

/* ================================================================
   ICALENDAR — BOTÃO E MENU DE DOIS PASSOS

   2.52.1 — Bloco reescrito nos tokens do design system. O front não
   carrega li-admin-ui.css, onde os --lm-* são declarados, então aqui
   vale a convenção já adotada no resto deste arquivo: token com
   fallback, `var(--lm-color-text, #1e293b)`. O fallback é o valor real
   em produção; o token existe para quando o DS for carregado no front.
   ================================================================ */

.li-icalendar-wrapper {
    position: relative;
    display: inline-block;
    margin: var(--lm-space-2, 8px) 0;
}

.li-btn--icalendar {
    display: inline-flex;
    align-items: center;
    gap: var(--lm-space-2, 8px);
    cursor: pointer;
}

.li-icalendar-opcoes {
    display: none;
    position: absolute;
    top: calc(100% + var(--lm-space-1, 4px));
    left: 0;
    min-width: 240px;
    background: var(--lm-color-surface, #fff);
    border: var(--lm-border, 1px solid #e2e8f0);
    border-radius: var(--lm-radius-md, 8px);
    box-shadow: var(--lm-shadow-lg, 0 8px 24px rgba(26,23,20,.10), 0 4px 8px rgba(26,23,20,.06));
    z-index: var(--lm-z-dropdown, 100);
    overflow: hidden;
}

/* Abre por classe is-open (clique no trigger) ou pelo atributo
   hidden estar removido. O JS cuida de alternar. */
.li-icalendar-wrapper.is-open .li-icalendar-opcoes,
.li-icalendar-opcoes:not([hidden]) {
    display: block;
}

.li-icalendar-chevron {
    margin-left: auto;
    transition: transform var(--lm-transition-base, .2s ease);
    font-size: 14px;
}
.li-icalendar-wrapper.is-open .li-icalendar-chevron {
    transform: rotate(180deg);
}

/* ----------------------------------------------------------------
   Itens do menu — `a` e `button` na mesma linha visual.

   2.52.1 — O `color` do botão estava faltando aqui, e era o defeito:
   temas baseados em Hello Elementor estilizam `button` com texto
   branco, então o nome da sede saía invisível sobre o fundo do menu
   enquanto os itens que são `a` apareciam normais. Resetar background
   e border sem resetar color deixa exatamente esse rastro.

   O prefixo `body` sobe a especificidade para (0,2,1) — mesma tática
   já usada no bloco NPS deste arquivo contra reset.css de tema.
   ---------------------------------------------------------------- */
body .li-icalendar-opcoes .li-icalendar-opcao,
body .li-icalendar-opcoes .li-icalendar-voltar {
    display: flex;
    align-items: center;
    gap: var(--lm-space-2, 8px);
    width: 100%;
    margin: 0;
    padding: var(--lm-space-3, 12px) var(--lm-space-4, 16px);
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    font-family: inherit;
    font-size: var(--lm-font-size-sm, 13px);
    font-weight: var(--lm-font-weight-medium, 500);
    line-height: 1.4;
    letter-spacing: normal;
    text-align: left;
    text-transform: none;
    text-decoration: none;
    color: var(--lm-color-text, #1e293b);
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: background var(--lm-transition-fast, .12s ease);
}

body .li-icalendar-opcoes .li-icalendar-opcao:hover,
body .li-icalendar-opcoes .li-icalendar-opcao:focus,
body .li-icalendar-opcoes .li-icalendar-voltar:hover,
body .li-icalendar-opcoes .li-icalendar-voltar:focus {
    background: var(--lm-color-surface-alt, #f8fafc);
    color: var(--lm-color-text, #1e293b);
}

/* Ícones e texto secundário herdam a cor do item — sem isso, o mesmo
   reset de tema que pintava o rótulo pinta os ícones. */
body .li-icalendar-opcoes .li-icalendar-opcao i,
body .li-icalendar-opcoes .li-icalendar-voltar i {
    color: inherit;
    font-size: 16px;
    flex-shrink: 0;
}

body .li-icalendar-opcoes .li-icalendar-opcao:focus-visible,
body .li-icalendar-opcoes .li-icalendar-voltar:focus-visible {
    outline: none;
    box-shadow: var(--lm-shadow-focus, 0 0 0 3px rgba(26,23,20,.18)) inset;
}

/* ----------------------------------------------------------------
   Passo 1 — escolha da sede
   ---------------------------------------------------------------- */

.li-icalendar-titulo {
    margin: 0;
    padding: var(--lm-space-3, 12px) var(--lm-space-4, 16px) var(--lm-space-2, 8px);
    font-size: var(--lm-font-size-xs, 11px);
    font-weight: var(--lm-font-weight-semibold, 600);
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--lm-color-text-muted, #64748b);
}

.li-icalendar-sede > span {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    line-height: 1.3;
}

body .li-icalendar-opcoes .li-icalendar-sede small {
    font-size: var(--lm-font-size-xs, 11px);
    font-weight: var(--lm-font-weight-regular, 400);
    color: var(--lm-color-text-muted, #64748b);
}

.li-icalendar-opcao--todas {
    border-top: var(--lm-border, 1px solid #e2e8f0);
}

/* ----------------------------------------------------------------
   Passo 2 — destinos de calendário
   ---------------------------------------------------------------- */

body .li-icalendar-opcoes .li-icalendar-voltar {
    font-size: var(--lm-font-size-xs, 11px);
    font-weight: var(--lm-font-weight-semibold, 600);
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--lm-color-text-muted, #64748b);
    border-bottom: var(--lm-border, 1px solid #e2e8f0);
}

/* Região aria-live: existe para leitor de tela, não para a tela. */
.li-icalendar-aviso {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* O tema pode não definir .screen-reader-text — e aí o rótulo do botão
   "voltar" apareceria como texto solto no meio do menu. */
.li-icalendar-opcoes .screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* Muitas sedes não podem empurrar o menu para fora da tela. */
.li-icalendar-wrapper--multi .li-icalendar-opcoes {
    max-height: 60vh;
    overflow-y: auto;
}

/* Alvo de toque confortável em dispositivo sem hover. */
@media (hover: none) {
    body .li-icalendar-opcoes .li-icalendar-opcao,
    body .li-icalendar-opcoes .li-icalendar-voltar {
        padding-top: var(--lm-space-3, 12px);
        padding-bottom: var(--lm-space-3, 12px);
        min-height: 44px;
    }
}

/* ----------------------------------------------------------------
   Tela estreita — folha inferior.

   O popover ancorado ao botão vira uma coluna de 240px com rolagem
   interna, ou sai da viewport quando o botão está perto da borda.
   ---------------------------------------------------------------- */
@media (max-width: 640px) {
    .li-icalendar-wrapper.is-open .li-icalendar-opcoes,
    .li-icalendar-opcoes:not([hidden]) {
        position: fixed;
        top: auto;
        right: 0;
        bottom: 0;
        left: 0;
        width: auto;
        min-width: 0;
        max-width: none;
        max-height: 75vh;
        overflow-y: auto;
        border-radius: var(--lm-radius-xl, 16px) var(--lm-radius-xl, 16px) 0 0;
        border-bottom: 0;
        box-shadow: var(--lm-shadow-lg, 0 8px 24px rgba(26,23,20,.10), 0 4px 8px rgba(26,23,20,.06));
        padding-bottom: env(safe-area-inset-bottom, 0);
        z-index: var(--lm-z-modal, 300);
    }

    .li-icalendar-wrapper.is-open::before {
        content: '';
        position: fixed;
        inset: 0;
        background: rgba(26,23,20,.45);
        z-index: calc(var(--lm-z-modal, 300) - 1);
    }

    body.li-ical-aberto { overflow: hidden; }
}

/* ================================================================
   ACOMPANHAR INSCRIÇÃO — [li_acompanhar]
   ================================================================ */

.li-acompanhar-wrap {
    max-width: 620px;
    margin-inline: auto; /* 2.59.6 — centralizado sem depender do tema (o Hello/Elementor centralizava) */
    font-family: inherit;
}

.li-acompanhar-header {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
}

.li-acompanhar-header__icon {
    width: 48px;
    height: 48px;
    background: #eff6ff;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 24px;
    color: #2563eb;
}

.li-acompanhar-titulo {
    font-size: 20px;
    font-weight: 700;
    color: #111827;
    margin: 0 0 4px;
    line-height: 1.3;
}

.li-acompanhar-desc {
    font-size: 13px;
    color: #6b7280;
    margin: 0;
    line-height: 1.6;
}

.li-acompanhar-body {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 24px;
}

/* Seletor de tipo — pill tabs */
.li-acompanhar-tipo {
    display: flex;
    gap: 4px;
    margin-bottom: 20px;
    background: #f3f4f6;
    border-radius: 8px;
    padding: 4px;
}

.li-acompanhar-tipo-opt {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #6b7280;
    cursor: pointer;
    transition: background .15s, color .15s, box-shadow .15s;
    user-select: none;
    text-align: center;
}

.li-acompanhar-tipo-opt input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.li-acompanhar-tipo-opt.is-active {
    background: #fff;
    color: #2563eb;
    box-shadow: 0 1px 4px rgba(0,0,0,.10);
}

/* Campo + botão */
.li-acompanhar-field {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.li-acompanhar-input {
    /* 2.59.6 — era flex: 1. Dentro do .li-acompanhar-field (coluna), flex: 1
       zera a base e ignora o height: o campo colapsava para a altura da
       linha. O Hello mascarava com o padding que ele põe em todo input. */
    flex: none;
    height: 46px;
    padding: 0 14px;
    border: 1.5px solid #d1d5db;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    font-family: 'SF Mono', 'Fira Mono', monospace;
    color: #111827;
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
    box-sizing: border-box;
    width: 100%;
}

.li-acompanhar-input:focus {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}

/* Feedback */
.li-acomp-feedback-area { min-height: 0; }

.li-acomp-feedback {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: 6px;
    margin-top: 2px;
}

.li-acomp-feedback--erro {
    background: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
}

.li-acomp-feedback--ok {
    background: #f0fdf4;
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

/* Resultado */
.li-acomp-lista {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 20px;
}

.li-acomp-card {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    transition: box-shadow .15s;
}

.li-acomp-card:hover { box-shadow: 0 2px 12px rgba(0,0,0,.07); }

.li-acomp-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    background: #f9fafb;
    border-bottom: 1px solid #f0f0f0;
    flex-wrap: wrap;
}

.li-acomp-card__evento {
    font-weight: 700;
    font-size: 14px;
    color: #111827;
    line-height: 1.3;
}

.li-acomp-status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 3px 10px;
    border-radius: 20px;
    white-space: nowrap;
}

.li-acomp-status--confirmada { background: #dcfce7; color: #166534; }
.li-acomp-status--pendente   { background: #fef9c3; color: #854d0e; }
.li-acomp-status--analise    { background: #dbeafe; color: #1e40af; }
.li-acomp-status--cancelada,
.li-acomp-status--rejeitada  { background: #fee2e2; color: #991b1b; }
.li-acomp-status--espera     { background: #f3f4f6; color: #4b5563; }

.li-acomp-card__body {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.li-acomp-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
}

.li-acomp-meta__item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: #374151;
}

.li-acomp-meta__item i {
    color: #9ca3af;
    font-size: 14px;
    flex-shrink: 0;
}

/* Botões de documentos */
.li-acomp-docs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid #f3f4f6;
}

.li-acomp-doc-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 14px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    border: 1.5px solid #d1d5db;
    color: #374151;
    background: #fff;
    transition: background .15s, border-color .15s, color .15s;
}

.li-acomp-doc-btn:hover {
    border-color: #2563eb;
    color: #2563eb;
    background: #eff6ff;
}

.li-acomp-doc-btn--destaque {
    border-color: #2563eb;
    color: #2563eb;
    background: #eff6ff;
}

.li-acomp-doc-btn--destaque:hover {
    background: #dbeafe;
}

/* Lista de membros do grupo (apenas em inscrições-grupo modo membro/ambos) */
.li-acomp-membros {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e5e7eb;
}

.li-acomp-membros__titulo {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 10px;
}

.li-acomp-membros__lista {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.li-acomp-membro {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    background: #f9fafb;
    border-radius: 8px;
    font-size: 13px;
    flex-wrap: wrap;
}

.li-acomp-membro__nome {
    flex: 1;
    color: #111827;
    font-weight: 500;
    min-width: 100px;
}

.li-acomp-membro__codigo {
    background: #fff;
    border: 1px solid #e5e7eb;
    padding: 2px 6px;
    border-radius: 4px;
    font-family: monospace;
    font-size: 11px;
    color: #6b7280;
    letter-spacing: 0.5px;
}

/* 2.8.2 — Autorizações (líder via /acompanhar) */
.li-acomp-autorizacoes {
    margin-top: 16px;
    padding: 14px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}
.li-acomp-autorizacoes__titulo {
    font-weight: 600;
    font-size: 13px;
    color: #374151;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}
.li-acomp-autorizacoes__titulo i { color: var(--li-color-primary, #2BAAD4); }
.li-acomp-autorizacoes__tabela {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 12px;
}
.li-acomp-autz-membro {
    padding: 10px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
}
.li-acomp-autz-membro__nome {
    font-weight: 600;
    font-size: 13px;
    color: #111827;
    margin-bottom: 6px;
}
.li-acomp-autz-membro__checks {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
}
.li-acomp-autz-check {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #374151;
    cursor: pointer;
}
.li-acomp-autz-check input[type="checkbox"] { cursor: pointer; }
.li-acomp-autorizacoes__acoes {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Spinner */
@keyframes li-spin {
    to { transform: rotate(360deg); }
}
.li-spin { display: inline-block; animation: li-spin .7s linear infinite; }

/* Mobile */
@media (max-width: 520px) {
    .li-acompanhar-body { padding: 16px; }
    .li-acompanhar-tipo-opt { font-size: 12px; padding: 7px 8px; gap: 4px; }
    .li-acomp-card__header { flex-direction: column; align-items: flex-start; gap: 6px; }
    .li-acomp-docs { gap: 6px; }
}

/* ================================================================
   DOCUMENTOS — [li_documentos]
   ================================================================ */

.li-documentos-wrap {
    margin: 16px 0;
}

.li-documentos-titulo {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #6b7280;
    margin-bottom: 10px;
}

.li-documentos-btns {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.li-btn--doc {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
}

/* ================================================================
   BOTÃO SM
   ================================================================ */

.li-btn--sm {
    padding: 5px 12px;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

/* ================================================================
   PÁGINA DE DETALHES DO EVENTO — [li_evento_info]
   ================================================================ */

.li-info-wrap {
    /* Variáveis --li-info-cor-primaria e --li-info-cor-texto são
       declaradas no :root via <style> inline em pagina-evento.php
       com a cor do evento (ou azul default se não personalizado).
       Não declarar fallback aqui — declaração em escopo mais próximo
       venceria o :root e ignoraria a personalização do evento. */
    font-family: inherit;
}

/* ----------------------------------------------------------------
   HERO
   ---------------------------------------------------------------- */
.li-info-hero {
    position: relative;
    min-height: 340px;
    display: flex;
    align-items: flex-end;
    background-color: #1e293b;
    background-image: var(--li-info-bg);
    background-size: cover;
    background-position: center;
    border-radius: var(--lm-radius-lg, 12px);
    overflow: hidden;
    margin-bottom: var(--lm-space-6, 24px);
}

.li-info-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,.75) 0%, rgba(0,0,0,.2) 60%, transparent 100%);
}

.li-info-hero__content {
    position: relative;
    z-index: 1;
    padding: 40px 32px 32px;
    width: 100%;
}

.li-info-hero__logo {
    max-height: 56px;
    max-width: 200px;
    object-fit: contain;
    margin-bottom: 16px;
    display: block;
}

.li-info-hero__titulo {
    font-size: clamp(1.5rem, 4vw, 2.25rem);
    font-weight: 700;
    color: #fff;
    margin: 0 0 12px;
    line-height: 1.2;
    text-shadow: 0 1px 4px rgba(0,0,0,.4);
}

.li-info-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    color: rgba(255,255,255,.88);
    font-size: 14px;
    margin-bottom: 20px;
}

.li-info-hero__meta span {
    display: flex;
    align-items: center;
    gap: 5px;
}

.li-info-hero__acoes {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.li-info-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 99px;
    font-size: 12px;
    font-weight: 600;
    background: rgba(255,255,255,.18);
    color: #fff;
    backdrop-filter: blur(4px);
}

.li-info-badge--encerrado {
    background: rgba(239,68,68,.25);
    color: #fca5a5;
}

/* ----------------------------------------------------------------
   BOTÃO LG
   ---------------------------------------------------------------- */
.li-btn--lg {
    padding: 10px 22px;
    font-size: 15px;
}

.li-btn--full {
    width: 100%;
    justify-content: center;
}

/* ----------------------------------------------------------------
   COMPARTILHAMENTO
   ---------------------------------------------------------------- */
.li-share-wrap {
    position: relative;
}

.li-share-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    background: var(--lm-color-surface, #fff);
    border: var(--lm-border, 1px solid #e2e8f0);
    border-radius: var(--lm-radius-md, 8px);
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    min-width: 200px;
    z-index: 100;
    overflow: hidden;
}

.li-share-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 16px;
    font-size: 13px;
    color: var(--lm-color-text, #1e293b);
    text-decoration: none;
    background: none;
    border: none;
    cursor: pointer;
    transition: background .15s;
}

.li-share-item:hover {
    background: var(--lm-color-surface-alt, #f8fafc);
}

/* ----------------------------------------------------------------
   CONTAGEM REGRESSIVA
   ---------------------------------------------------------------- */
.li-countdown-section {
    background: var(--li-info-cor-primaria);
    border-radius: var(--lm-radius-lg, 12px);
    padding: 24px 32px;
    margin-bottom: var(--lm-space-6, 24px);
    color: var(--li-info-cor-texto);
}

.li-countdown-label {
    margin: 0 0 16px;
    font-size: 13px;
    opacity: .85;
    display: flex;
    align-items: center;
    gap: 6px;
}

.li-countdown {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.li-countdown__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 64px;
}

.li-countdown__num {
    font-size: clamp(2rem, 6vw, 3rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1px;
    font-variant-numeric: tabular-nums;
}

.li-countdown__label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    opacity: .75;
    margin-top: 4px;
}

.li-countdown__sep {
    font-size: 2rem;
    font-weight: 700;
    opacity: .5;
    line-height: 1;
    margin-bottom: 18px;
}

/* ----------------------------------------------------------------
   LAYOUT PRINCIPAL
   ---------------------------------------------------------------- */
.li-info-container {
    max-width: 1100px;
    margin: 0 auto;
}

.li-info-layout {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: var(--lm-space-5, 20px);
    align-items: start;
}

.li-info-main {
    display: flex;
    flex-direction: column;
    gap: var(--lm-space-5, 20px);
}

.li-info-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--lm-space-4, 16px);
}

/* Sticky só em desktop. Em mobile (1 coluna + order: -1), sticky causa
   sobreposição visual. Definimos sticky em min-width: 769px para garantir
   que não vaze pro mobile, em vez de declarar sticky base e tentar
   sobrescrever em max-width — isso falhava por ordem de cascata
   (regra base vinha depois da @media e vencia por specificity igual). */
@media (min-width: 769px) {
    .li-info-sidebar {
        position: sticky;
        top: 24px;
    }
}

@media (max-width: 768px) {
    /* Mobile: forçar layout linear absoluto. Sem grid, sem order,
       sem sticky, sem position. Garante que main aparece primeiro,
       sidebar depois (ordem natural do DOM), cards empilhados em
       fluxo de bloco normal. !important defende contra regras
       remanescentes em cache de Safari/Chrome iOS e contra
       interferência de tema. */
    .li-info-layout {
        display: block !important;
        grid-template-columns: none !important;
    }
    .li-info-main,
    .li-info-sidebar {
        display: block !important;
        position: static !important;
        top: auto !important;
        order: 0 !important;
        transform: none !important;
        width: 100% !important;
    }
    .li-info-sidebar {
        margin-top: var(--lm-space-5, 20px);
    }
    .li-info-main > *,
    .li-info-sidebar > * {
        margin-bottom: var(--lm-space-4, 16px);
    }
}

/* ----------------------------------------------------------------
   CARDS
   ---------------------------------------------------------------- */
.li-info-card {
    background: var(--lm-color-surface, #fff);
    border: var(--lm-border, 1px solid #e2e8f0);
    border-radius: var(--lm-radius-lg, 12px);
    padding: var(--lm-space-5, 20px);
}

.li-info-section-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--lm-color-text, #1e293b);
    margin: 0 0 var(--lm-space-4, 16px);
    display: flex;
    align-items: center;
    gap: 8px;
}

.li-info-sidebar-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--lm-color-text, #1e293b);
    margin: 0 0 12px;
    display: flex;
    align-items: center;
    gap: 7px;
}

/* ----------------------------------------------------------------
   INFORMAÇÕES GERAIS
   ---------------------------------------------------------------- */
.li-info-meta-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: var(--lm-space-4, 16px);
}

.li-info-meta-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 14px;
}

.li-info-meta-item > i {
    font-size: 18px;
    color: var(--li-info-cor-primaria);
    margin-top: 2px;
    flex-shrink: 0;
}

.li-info-meta-item > div {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.li-info-meta-label {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--lm-color-text-muted, #64748b);
}

.li-info-meta-val {
    font-weight: 600;
    color: var(--lm-color-text, #1e293b);
}

.li-info-meta-sub {
    font-size: 12px;
    color: var(--lm-color-text-muted, #64748b);
}

.li-info-sobre {
    font-size: 14px;
    line-height: 1.65;
    color: var(--lm-color-text, #1e293b);
    border-top: var(--lm-border, 1px solid #e2e8f0);
    padding-top: var(--lm-space-4, 16px);
    margin-top: var(--lm-space-3, 12px);
}

/* ----------------------------------------------------------------
   PREÇOS
   ---------------------------------------------------------------- */
.li-info-preco-gratuito {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: var(--lm-radius-md, 8px);
}

.li-info-preco-gratuito > i {
    font-size: 22px;
    color: #16a34a;
    flex-shrink: 0;
}

.li-info-preco-gratuito strong {
    display: block;
    font-weight: 700;
    color: #15803d;
    font-size: 15px;
}

.li-info-preco-gratuito span {
    font-size: 12px;
    color: #4ade80;
}

.li-info-preco-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: var(--lm-color-surface-alt, #f8fafc);
    border-radius: var(--lm-radius-md, 8px);
    border: var(--lm-border, 1px solid #e2e8f0);
}

.li-info-preco-nome {
    font-size: 14px;
    color: var(--lm-color-text-muted, #64748b);
}

.li-info-preco-val {
    font-size: 18px;
    font-weight: 800;
    color: var(--li-info-cor-primaria);
}

/* ----------------------------------------------------------------
   GALERIA
   ---------------------------------------------------------------- */
.li-info-galeria {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 8px;
}

.li-galeria-thumb {
    border: none;
    padding: 0;
    cursor: pointer;
    border-radius: var(--lm-radius-md, 8px);
    overflow: hidden;
    aspect-ratio: 4/3;
    background: var(--lm-color-surface-alt, #f8fafc);
    transition: transform .2s, box-shadow .2s;
}

.li-galeria-thumb:hover {
    transform: scale(1.03);
    box-shadow: 0 4px 16px rgba(0,0,0,.15);
}

.li-galeria-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Lightbox */
.li-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.li-lightbox__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.88);
}

.li-lightbox__inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: 95vw;
    max-height: 95vh;
}

.li-lightbox__img-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: min(800px, 80vw);
}

.li-lightbox__img-wrap img {
    max-width: 100%;
    max-height: 80vh;
    object-fit: contain;
    border-radius: 4px;
    display: block;
}

.li-lightbox__caption {
    color: rgba(255,255,255,.7);
    font-size: 13px;
    margin: 8px 0 0;
    text-align: center;
}

.li-lightbox__close,
.li-lightbox__nav {
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.2);
    color: #fff;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: background .15s;
    flex-shrink: 0;
}

.li-lightbox__close:hover,
.li-lightbox__nav:hover {
    background: rgba(255,255,255,.22);
}

.li-lightbox__close {
    position: absolute;
    top: -48px;
    right: 0;
}

/* ----------------------------------------------------------------
   PALESTRANTES
   ---------------------------------------------------------------- */
.li-info-speakers {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.li-speaker-card {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.li-speaker-foto {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 3px solid var(--lm-color-surface-alt, #f8fafc);
    box-shadow: 0 2px 8px rgba(0,0,0,.1);
}

.li-speaker-foto--placeholder {
    background: var(--lm-color-surface-alt, #f8fafc);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: var(--lm-color-text-muted, #94a3b8);
    border: var(--lm-border, 1px solid #e2e8f0);
}

.li-speaker-info {
    flex: 1;
}

.li-speaker-nome {
    font-size: 15px;
    font-weight: 700;
    color: var(--lm-color-text, #1e293b);
    display: block;
    margin-bottom: 2px;
}

.li-speaker-cargo {
    font-size: 12px;
    font-weight: 600;
    color: var(--li-info-cor-primaria);
    display: block;
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.li-speaker-bio {
    font-size: 13px;
    color: var(--lm-color-text-muted, #64748b);
    line-height: 1.55;
    margin: 0;
}

/* ----------------------------------------------------------------
   FAQ
   ---------------------------------------------------------------- */
/*
 * Seletor especifico .li-info-card .li-faq-* eh proposital: temas WP
 * (Astra, Kadence, Avada, etc) costumam aplicar background, border-radius
 * e width:auto a todo `button` com peso maior que classe simples. O
 * encaixe na hierarquia do card vence por especificidade sem precisar de
 * !important. Reset explicito de cada propriedade que tema costuma forcar.
 */
.li-info-card .li-faq-lista {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
}

.li-info-card .li-faq-item {
    border-bottom: var(--lm-border, 1px solid #e2e8f0);
    width: 100%;
    display: block;
}

.li-info-card .li-faq-item:last-child {
    border-bottom: none;
}

.li-info-card .li-faq-pergunta {
    /* Layout */
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 0;
    /* Reset defensivo (vence reset/tema) */
    background: transparent;
    background-color: transparent;
    background-image: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    margin: 0;
    /* Tipografia */
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    color: var(--lm-color-text, #1e293b);
    text-align: left;
    line-height: 1.45;
    font-family: inherit;
    text-transform: none;
    letter-spacing: normal;
    min-height: 0;
    box-sizing: border-box;
}

.li-info-card .li-faq-pergunta:hover,
.li-info-card .li-faq-pergunta:focus,
.li-info-card .li-faq-pergunta:focus-visible,
.li-info-card .li-faq-pergunta:active {
    background: transparent;
    background-color: transparent;
    background-image: none;
    color: var(--li-info-cor-primaria);
    border: none;
    box-shadow: none;
    outline: none;
}

.li-info-card .li-faq-pergunta:focus-visible {
    /* Visibilidade de acessibilidade sem o "ring" do tema */
    outline: 2px solid var(--li-info-cor-primaria);
    outline-offset: 2px;
}

.li-info-card .li-faq-chevron {
    font-size: 16px;
    flex-shrink: 0;
    transition: transform .2s;
    color: var(--lm-color-text-muted, #64748b);
}

.li-info-card .li-faq-resposta {
    width: 100%;
    font-size: 13px;
    color: var(--lm-color-text-muted, #64748b);
    line-height: 1.65;
    padding: 4px 0 14px;
}

/* ----------------------------------------------------------------
   AVALIAÇÃO — estrelas
   ---------------------------------------------------------------- */
.li-aval-resumo {
    margin-bottom: 16px;
}

.li-aval-media {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.li-aval-numero {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--lm-color-text, #1e293b);
    line-height: 1;
}

.li-aval-estrelas-display i,
.li-aval-estrelas-mini i {
    color: #f59e0b;
    font-size: 18px;
}

.li-aval-estrelas-mini i {
    font-size: 14px;
}

.li-aval-total {
    font-size: 13px;
    color: var(--lm-color-text-muted, #64748b);
}

.li-aval-comentarios {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
    padding: 12px 0;
    border-top: var(--lm-border, 1px solid #e2e8f0);
}

.li-aval-comentario-item {
    font-size: 13px;
    color: var(--lm-color-text, #1e293b);
}

.li-aval-comentario-item p {
    margin: 4px 0 0;
    color: var(--lm-color-text-muted, #64748b);
    line-height: 1.55;
}

.li-aval-form-titulo {
    font-size: 14px;
    font-weight: 600;
    color: var(--lm-color-text, #1e293b);
    margin: 0 0 10px;
    border-top: var(--lm-border, 1px solid #e2e8f0);
    padding-top: 16px;
}

.li-aval-estrelas-input {
    display: flex;
    gap: 4px;
    margin-bottom: 4px;
}

.li-aval-star-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 24px;
    color: #d1d5db;
    padding: 2px;
    transition: color .1s, transform .1s;
}

.li-aval-star-btn:hover {
    transform: scale(1.15);
}

.li-aval-star-btn i.ph-star-fill {
    color: #f59e0b;
}

.li-aval-feedback {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    padding: 8px 12px;
    border-radius: var(--lm-radius-md, 8px);
    margin-top: 10px;
}

.li-aval-feedback--erro {
    background: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
}

.li-aval-feedback--ok {
    background: #f0fdf4;
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

.li-aval-sucesso {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #15803d;
    padding: 12px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: var(--lm-radius-md, 8px);
}

.li-aval-pendente {
    font-size: 13px;
    color: var(--lm-color-text-muted, #64748b);
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 12px;
    background: var(--lm-color-surface-alt, #f8fafc);
    border-radius: var(--lm-radius-md, 8px);
    margin: 0;
}

/* ----------------------------------------------------------------
   AVALIAÇÃO — NPS
   ---------------------------------------------------------------- */
.li-nps-resumo {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 12px;
}

.li-nps-media {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--lm-color-text, #1e293b);
}

.li-nps-total {
    font-size: 12px;
    color: var(--lm-color-text-muted, #64748b);
}

.li-nps-pergunta {
    font-size: 13px;
    color: var(--lm-color-text, #1e293b);
    margin: 0 0 12px;
}

.li-nps-opcoes {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 4px;
}

.li-nps-btn {
    width: 38px;
    height: 38px;
    border-radius: var(--lm-radius-sm, 6px);
    border: var(--lm-border, 1px solid #e2e8f0);
    background: var(--lm-color-surface, #fff);
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--lm-color-text-muted, #64748b);
    transition: background .15s, color .15s, border-color .15s;
}

.li-nps-btn:hover {
    border-color: var(--li-info-cor-primaria);
    color: var(--li-info-cor-primaria);
}

.li-nps-btn.is-selected {
    background: var(--li-info-cor-primaria);
    color: var(--li-info-cor-texto);
    border-color: var(--li-info-cor-primaria);
}

/* ----------------------------------------------------------------
   SIDEBAR — iCalendar
   ---------------------------------------------------------------- */
.li-info-card--icalendar .li-icalendar-wrapper {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.li-info-card--icalendar .li-btn--icalendar {
    width: 100%;
    justify-content: space-between;
}

/* No info-card, o dropdown fica abaixo no fluxo normal (não posicionado
   absoluto) para não cobrir conteúdo subsequente. Mostra/esconde pelo
   estado is-open, não pelo :hover. */
.li-info-card--icalendar .li-icalendar-opcoes {
    position: static;
    display: none;
    flex-direction: column;
    gap: 4px;
    box-shadow: none;
    border: 1px solid var(--lm-color-border, #e5e7eb);
    border-radius: 8px;
    padding: 4px;
    background: #fff;
}

.li-info-card--icalendar .li-icalendar-wrapper.is-open .li-icalendar-opcoes,
.li-info-card--icalendar .li-icalendar-opcoes:not([hidden]) {
    display: flex;
}

.li-info-card--icalendar .li-icalendar-chevron {
    transition: transform .2s;
}
.li-info-card--icalendar .li-icalendar-wrapper.is-open .li-icalendar-chevron {
    transform: rotate(180deg);
}

.li-info-card--icalendar .li-icalendar-opcao {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    font-size: 13px;
    color: var(--lm-color-text, #1e293b);
    text-decoration: none;
    border-radius: var(--lm-radius-sm, 6px);
    transition: background .15s;
}

.li-info-card--icalendar .li-icalendar-opcao:hover {
    background: var(--lm-color-surface-alt, #f8fafc);
}

/* ----------------------------------------------------------------
   SIDEBAR — Clima
   ---------------------------------------------------------------- */
.li-clima-resumo {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.li-clima-icone {
    font-size: 2.5rem;
    color: var(--li-info-cor-primaria);
    line-height: 1;
}

.li-clima-desc {
    font-size: 14px;
    font-weight: 600;
    color: var(--lm-color-text, #1e293b);
}

.li-clima-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.li-clima-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 8px;
    background: var(--lm-color-surface-alt, #f8fafc);
    border-radius: var(--lm-radius-sm, 6px);
    font-size: 11px;
    color: var(--lm-color-text-muted, #64748b);
    gap: 3px;
    text-align: center;
}

.li-clima-item i {
    font-size: 18px;
    color: var(--li-info-cor-primaria);
}

.li-clima-item strong {
    font-size: 13px;
    color: var(--lm-color-text, #1e293b);
}

.li-clima-erro {
    font-size: 13px;
    color: var(--lm-color-text-muted, #64748b);
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

/* ----------------------------------------------------------------
   SIDEBAR — Mapa
   ---------------------------------------------------------------- */
.li-mapa-wrap {
    width: 100%;
    border-radius: var(--lm-radius-md, 8px);
    overflow: hidden;
    margin-bottom: 8px;
    border: var(--lm-border, 1px solid #e2e8f0);
}

.li-mapa-frame {
    width: 100%;
    height: 200px;
    border: none;
    display: block;
}

.li-mapa-link {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: var(--li-info-cor-primaria);
    text-decoration: none;
}

.li-mapa-link:hover {
    opacity: .75;
}

.li-mapa-endereco {
    font-size: 12px;
    color: var(--lm-color-text-muted, #64748b);
    margin: 8px 0 0;
    display: flex;
    align-items: flex-start;
    gap: 5px;
}

/* ----------------------------------------------------------------
   ACOMPANHAR — botão iCalendar
   ---------------------------------------------------------------- */
.li-acomp-doc-btn--ical {
    background: #f0fdf4;
    border-color: #bbf7d0 !important;
    color: #15803d !important;
}

.li-acomp-doc-btn--ical:hover {
    background: #dcfce7;
}

/* ----------------------------------------------------------------
   ADMIN — link para página de detalhes
   ---------------------------------------------------------------- */
.li-info-link-preview {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: var(--lm-color-surface-alt);
    border: var(--lm-border);
    border-radius: var(--lm-radius-md);
    font-size: 13px;
    margin-bottom: var(--lm-space-5);
    color: var(--lm-color-text-muted);
}

.li-info-link-preview a {
    color: var(--lm-color-primary);
    text-decoration: none;
    word-break: break-all;
}

.li-info-link-preview a:hover {
    opacity: .75;
}

/* ----------------------------------------------------------------
   TOGGLE SWITCH (reutilizado da aba de personalização)
   ---------------------------------------------------------------- */
.li-toggle-switch {
    position: relative;
    display: inline-flex;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
}

.li-toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.li-toggle-slider {
    position: absolute;
    inset: 0;
    background: #cbd5e1;
    border-radius: 99px;
    cursor: pointer;
    transition: background .2s;
}

.li-toggle-slider::before {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    left: 3px;
    top: 3px;
    background: #fff;
    border-radius: 50%;
    transition: transform .2s;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
}

.li-toggle-switch input:checked + .li-toggle-slider {
    background: var(--lm-color-primary, #2563eb);
}

.li-toggle-switch input:checked + .li-toggle-slider::before {
    transform: translateX(20px);
}

/* ----------------------------------------------------------------
   SPIN (ícone giratório)
   ---------------------------------------------------------------- */
@keyframes li-spin {
    to { transform: rotate(360deg); }
}

.li-spin {
    display: inline-block;
    animation: li-spin .7s linear infinite;
}

/* ================================================================
   CARDS DE LOCALIDADE (eventos simultâneos)
   ================================================================ */

.li-localidades-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--lm-space-4, 16px);
}

.li-loc-card {
    position: relative;
    border: var(--lm-border, 1px solid #e2e8f0);
    border-radius: var(--lm-radius-lg, 12px);
    padding: var(--lm-space-4, 16px);
    background: var(--lm-color-surface, #fff);
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: box-shadow .2s, border-color .2s;
}

.li-loc-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.08);
}

.li-loc-card--proxima {
    border-color: var(--li-info-cor-primaria);
    box-shadow: 0 0 0 1px var(--li-info-cor-primaria);
}

.li-loc-card--fechada {
    opacity: .65;
}

.li-loc-badge-proxima {
    position: absolute;
    top: -10px;
    left: 12px;
    background: var(--li-info-cor-primaria);
    color: var(--li-info-cor-texto);
    font-size: 11px;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 99px;
    display: flex;
    align-items: center;
    gap: 4px;
    letter-spacing: .03em;
}

.li-loc-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}

.li-loc-nome {
    font-size: 15px;
    font-weight: 700;
    color: var(--lm-color-text, #1e293b);
}

.li-loc-card__body {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.li-loc-meta {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    font-size: 13px;
    color: var(--lm-color-text-muted, #64748b);
}

.li-loc-meta i {
    font-size: 15px;
    flex-shrink: 0;
    margin-top: 1px;
    color: var(--li-info-cor-primaria);
}

.li-loc-vagas {
    margin-top: 4px;
}

.li-loc-vagas__texto {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: var(--lm-color-text-muted, #64748b);
    margin-bottom: 4px;
}

.li-loc-vagas__texto i {
    font-size: 14px;
    color: var(--li-info-cor-primaria);
}

.li-loc-vagas__barra {
    height: 4px;
    background: var(--lm-color-surface-alt, #f1f5f9);
    border-radius: 99px;
    overflow: hidden;
}

.li-loc-vagas__progresso {
    height: 100%;
    background: var(--li-info-cor-primaria);
    border-radius: 99px;
    transition: width .4s;
    max-width: 100%;
}

.li-loc-card__btn {
    margin-top: auto;
    width: 100%;
    justify-content: center;
}

/* ----------------------------------------------------------------
   MAPA MULTI-MARCADOR (Leaflet)
   ---------------------------------------------------------------- */
.li-mapa-multi-wrap {
    width: 100%;
    height: 360px;
    border-radius: var(--lm-radius-md, 8px);
    overflow: hidden;
    border: var(--lm-border, 1px solid #e2e8f0);
}

/* Badge genéricos reaproveitados */
.li-badge--verde   { background:#dcfce7; color:#16a34a; }
.li-badge--amarelo { background:#fef9c3; color:#ca8a04; }
.li-badge--vermelho{ background:#fee2e2; color:#dc2626; }
.li-badge--cinza   { background:#f1f5f9; color:#64748b; }

/* 2.8.5 — Edição pós-envio do grupo (líder via /acompanhar) */
.li-acomp-editar-membros {
    margin-top: 16px;
    padding: 14px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}
.li-acomp-editar-lista {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.li-acomp-editar-item {
    padding: 10px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
}
.li-acomp-editar-item__view {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
.li-acomp-editar-item__info {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-size: 13px;
    flex: 1;
    min-width: 0;
}
.li-acomp-editar-item__actions {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}
.li-acomp-editar-item__form {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed #e5e7eb;
}
.li-acomp-tag-resp {
    background: rgba(43,170,212,.12);
    color: var(--li-color-primary, #2BAAD4);
    font-size: 10px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
.li-acomp-editar-grid {
    display: grid;
    grid-template-columns: 1fr 160px 180px;
    gap: 8px;
    margin-bottom: 10px;
}
.li-acomp-editar-grid input {
    padding: 6px 10px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 13px;
    background: #fff;
}
.li-acomp-editar-form-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}
.li-acomp-add-membro {
    padding-top: 8px;
    border-top: 1px dashed #e5e7eb;
}
@media (max-width: 600px) {
    .li-acomp-editar-grid { grid-template-columns: 1fr; }
}

/* 2.17.0 — Modal de pendência de cadastro */
.li-pend-overlay{position:fixed;inset:0;z-index:99999;background:rgba(17,24,39,.55);display:none;align-items:center;justify-content:center;padding:16px;}
.li-pend-modal{position:relative;background:#fff;width:100%;max-width:440px;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.25);padding:24px;font-family:inherit;}
.li-pend-x{position:absolute;top:12px;right:12px;border:0;background:transparent;cursor:pointer;font-size:20px;color:#98a2b3;line-height:1;padding:4px;}
.li-pend-x:hover{color:#475467;}
.li-pend-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.li-pend-head .ph{font-size:24px;color:#e8920c;}
.li-pend-head h3{margin:0;font-size:18px;color:#1d2939;}
.li-pend-body .li-pend-msg{margin:0 0 12px;font-size:14px;line-height:1.5;}
.li-pend-campos{margin:0 0 14px;font-size:13px;color:#475467;background:#f9fafb;border:1px solid #eaecf0;border-radius:8px;padding:8px 12px;}
.li-pend-label{display:block;font-size:13px;font-weight:600;color:#344054;margin:8px 0 4px;}
.li-pend-input{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid #d0d5dd;border-radius:8px;font-size:14px;margin-bottom:10px;}
.li-pend-input:focus{outline:none;border-color:#7a5af8;box-shadow:0 0 0 3px rgba(122,90,248,.15);}
.li-pend-ajuda{font-size:12px;color:#667085;margin:0 0 14px;}
.li-pend-email{display:flex;align-items:center;gap:8px;font-size:15px;color:#1d2939;background:#f9fafb;border:1px solid #eaecf0;border-radius:8px;padding:10px 12px;margin:0 0 16px;}
.li-pend-acoes{display:flex;flex-wrap:wrap;gap:10px;}
.li-pend-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;border-radius:8px;padding:10px 16px;font-size:14px;font-weight:600;border:1px solid #d0d5dd;background:#fff;color:#344054;text-decoration:none;transition:.15s;}
.li-pend-btn:hover{background:#f9fafb;}
.li-pend-btn--primary{background:#7a5af8;border-color:#7a5af8;color:#fff;}
.li-pend-btn--primary:hover{background:#6943f5;color:#fff;}
.li-pend-btn[disabled]{opacity:.6;cursor:not-allowed;}
#li-pend-recheck{margin-top:12px;width:100%;}

/* ==================================================================
   ACOMPANHAR — CAIXA DO PIN (2.27.0)

   O passo 1 do /acompanhar não devolve mais dado nenhum: ele dispara um
   PIN para o e-mail cadastrado. Este bloco é o passo 2, onde a pessoa
   prova posse da caixa antes de qualquer informação aparecer.
   ================================================================== */

.li-acomp-pin-box {
    text-align: center;
    padding: 28px 24px;
    border: 1px solid var(--li-border, #e5e7eb);
    border-radius: 12px;
    background: var(--li-surface, #f9fafb);
}

.li-acomp-pin-box__icon {
    font-size: 34px;
    line-height: 1;
    color: var(--li-primary, #2563eb);
    margin-bottom: 10px;
}

.li-acomp-pin-box__titulo {
    margin: 0 0 6px;
    font-size: 17px;
    font-weight: 700;
    color: var(--li-text, #111827);
}

.li-acomp-pin-box__desc {
    margin: 0 0 18px;
    font-size: 14px;
    line-height: 1.55;
    color: var(--li-text-muted, #6b7280);
}

.li-acomp-pin-box__desc strong {
    color: var(--li-text, #111827);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    white-space: nowrap;
}

/* Caixas do PIN: fluidas, para caber em 320px sem estourar */
.li-acomp-pin-inputs {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-bottom: 14px;
}

.li-acomp-pin-digit {
    flex: 1 1 0;
    min-width: 0;
    max-width: 52px;
    height: 60px;
    padding: 0;
    border: 2px solid var(--li-border, #d1d5db);
    border-radius: 10px;
    background: #fff;
    color: var(--li-text, #111827);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    transition: border-color .15s, box-shadow .15s;
}

.li-acomp-pin-digit:focus {
    outline: none;
    border-color: var(--li-primary, #2563eb);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.li-acomp-pin-digit:not(:placeholder-shown) {
    border-color: #9ca3af;
}

.li-acomp-pin-box__voltar {
    margin-top: 12px;
    padding: 6px 10px;
    border: 0;
    background: none;
    cursor: pointer;
    font-size: 13px;
    color: var(--li-text-muted, #6b7280);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.li-acomp-pin-box__voltar:hover {
    color: var(--li-primary, #2563eb);
    text-decoration: none;
}

@media (max-width: 400px) {
    .li-acomp-pin-inputs { gap: 5px; }
    .li-acomp-pin-digit  { height: 52px; font-size: 20px; }
}

/* ================================================================
   2.30.0 — PIN DE CONSULTA no /acompanhar
   ================================================================ */

.li-acomp-pin-consulta {
    margin-top: 12px;
    border-top: 1px solid #f1f1f1;
    padding-top: 12px;
}

.li-acomp-pin-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: none;
    background: transparent;
    padding: 4px 0;
    font-size: 13px;
    font-weight: 600;
    color: #4b5563;
    cursor: pointer;
    font-family: inherit;
}

.li-acomp-pin-toggle:hover { color: #111827; }
.li-acomp-pin-toggle i     { font-size: 14px; transition: transform .15s; }

.li-acomp-pin-campo {
    margin-top: 10px;
    padding: 14px;
    border-radius: 10px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
}

.li-acomp-pin-campo[hidden] { display: none; }

.li-acomp-pin-campo__desc {
    margin: 0 0 10px;
    font-size: 12.5px;
    line-height: 1.5;
    color: #6b7280;
}

.li-acomp-link-sutil {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 10px;
    border: none;
    background: transparent;
    padding: 0;
    font-size: 12px;
    color: #6b7280;
    text-decoration: none;
    cursor: pointer;
    font-family: inherit;
}

.li-acomp-link-sutil:hover:not(:disabled) { color: #111827; }
.li-acomp-link-sutil:disabled             { opacity: .5; cursor: default; }

/* ================================================================
   2.32.0 — ENTRADA UNIFICADA no /acompanhar
   Código e PIN no mesmo formulário, um botão só.
   ================================================================ */

.li-acomp-pin-campo__label {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}

.li-acomp-pin-campo__label i { font-size: 15px; color: #6b7280; }

.li-acomp-pin-campo__opcional {
    margin-left: auto;
    font-weight: 400;
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: #9ca3af;
}

.li-acomp-pin-campo__desc { margin-top: 10px; }

/* O rodapé do botão: é aqui que a tela avisa, antes do clique, se
   um e-mail vai sair ou não. */
.li-acomp-btn-hint {
    margin: -2px 0 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: #6b7280;
    text-align: center;
}

.li-acomp-pin-box__aviso {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 12px auto 16px;
    max-width: 420px;
    padding: 9px 12px;
    border-radius: 8px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    color: #92400e;
    font-size: 12.5px;
    line-height: 1.45;
    text-align: left;
}

.li-acomp-pin-box__aviso i    { flex-shrink: 0; font-size: 15px; }
.li-acomp-pin-box__aviso span { flex: 1; }

/* 2.32.2 — o link do caminho por e-mail, sob o botão primário. */
.li-acomp-link-sutil--centro {
    display: flex !important;
    justify-content: center;
    width: 100% !important;
    margin-top: 6px;
    text-align: center;
}

/* 2.32.5 — o PIN revelado na tela, para quem entrou sem ele.
   Fica no e-mail? Não: lá ele disputaria com o código de acesso, e a pessoa
   teria dois códigos e nenhuma pista de qual usar. */
.li-acomp-pin-revelar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
    padding: 14px 16px;
    border-radius: 10px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
}

.li-acomp-pin-revelar__txt {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.li-acomp-pin-revelar__txt strong { font-size: 13.5px; color: #14532d; }
.li-acomp-pin-revelar__txt span   { font-size: 12.5px; line-height: 1.45; color: #3f6212; }

.li-acomp-pin-revelar__pin {
    flex-shrink: 0;
    padding: 8px 14px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #bbf7d0;
    font-family: monospace;
    font-size: 19px;
    font-weight: 700;
    letter-spacing: 3px;
    color: #14532d;
    user-select: all;
}


/* 2.39.0 — botão de lista de espera no card da localidade. Secundário de
   propósito: é uma ação real, mas não é a mesma coisa que garantir vaga. */
.li-loc-card__btn--espera {
    border-color: #f59e0b;
    color: #92400e;
}
.li-loc-card__btn--espera:hover,
.li-loc-card__btn--espera:focus {
    background: #fef3c7;
    border-color: #d97706;
}

/* ==================================================================
   2.42.0 — SEDE JÁ OCUPADA PELA PRÓPRIA PESSOA (multi-localidade)

   Diferente de "esgotada" (vermelho: não cabe mais ninguém) e de
   "encerrada" (cinza: acabou). Aqui não há problema nenhum — a pessoa
   simplesmente JÁ ESTÁ dentro. Verde, e fora de alcance.
   ================================================================== */
.li-localidade-opcao.is-ocupada {
    opacity: .75;
    border-style: dashed;
    cursor: not-allowed;
}
.li-localidade-opcao__ocupada {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 6px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    color: #166534;
    background: #dcfce7;
}
