/*
 * Identidade visual Prime HUB no painel (29/10/2026). Ver DOCS/analise-identidade-visual-painel-2026-10-28.md.
 * A paleta (roxo e neutros índigo) vem do Filament (App\Support\PanelBrand); aqui ficam o fundo, o topo, o menu, os
 * cartões, as tabelas, os botões, o login e as variáveis --marca-* que as telas próprias usam. Só classes públicas do
 * Filament (fi-*). Funciona do celular ao computador, nos temas claro e escuro.
 */

@font-face {
    font-family: 'Saira Marca';
    src: url('../fonts/saira/saira-latin-larga.woff2') format('woff2');
    font-weight: 500 800;
    font-style: normal;
    font-display: swap;
}

:root {
    --marca-degrade: linear-gradient(135deg, #A43DFF 0%, #6335FF 55%, #4329F6 100%);
    --marca-fundo-hero: radial-gradient(130% 150% at 0% 0%, #26116F 0%, #12084B 55%, #040726 100%);
    --marca-roxo: #7330F0;
    --marca-magenta: #A21CAF;
    --marca-cartao: #FFFFFF;
    --marca-cartao-suave: #F3F0FA;
    --marca-borda: rgb(115 48 240 / .14);
    --marca-sombra: 0 18px 40px -26px rgb(18 8 75 / .45);
    --marca-texto: #17132F;
    --marca-texto-suave: #544E73;
    --marca-texto-fraco: #6F6890;
    --marca-sobreposicao: rgb(115 48 240 / .05);
    --marca-sobreposicao-forte: rgb(115 48 240 / .1);
    --marca-trilha: rgb(23 19 47 / .08);
    --marca-linha-ativa: rgb(139 71 255 / .06);
    --marca-cabecalho-tabela: rgb(115 48 240 / .045);
    --marca-fonte-titulo: 'Saira Marca', ui-sans-serif, system-ui, sans-serif;
}

.dark {
    --marca-roxo: #A673FF;
    --marca-magenta: #E879F9;
    --marca-cartao: #15112F;
    --marca-cartao-suave: #1C1640;
    --marca-borda: rgb(255 255 255 / .07);
    --marca-sombra: 0 18px 40px -24px rgb(0 0 0 / .85);
    --marca-texto: #F4F2FF;
    --marca-texto-suave: #C3BDD8;
    --marca-texto-fraco: #9790B3;
    --marca-sobreposicao: rgb(255 255 255 / .035);
    --marca-sobreposicao-forte: rgb(255 255 255 / .07);
    --marca-trilha: rgb(255 255 255 / .07);
    --marca-linha-ativa: rgb(139 71 255 / .09);
    --marca-cabecalho-tabela: rgb(255 255 255 / .03);
}

::selection { background: rgb(139 71 255 / .3); }

/* Fundo: claro levemente lavanda; escuro no índigo da marca, com um brilho roxo no canto */
.fi-body { background-color: #F7F6FB; }
.dark .fi-body {
    background-color: #0C0920;
    background-image:
        radial-gradient(1100px 620px at 0% -10%, rgb(38 17 111 / .55), transparent 62%),
        radial-gradient(900px 520px at 100% 0%, rgb(122 45 255 / .1), transparent 60%);
    background-repeat: no-repeat;
}
.dark { color-scheme: dark; scrollbar-color: #3D385A transparent; }

/* Barra do topo: vidro, com a borda fina da marca (sem desfoque onde o navegador não tem) */
.fi-topbar { background: rgb(255 255 255 / .94); border-bottom: 1px solid var(--marca-borda); box-shadow: none; }
.dark .fi-topbar { background: rgb(12 9 32 / .94); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .fi-topbar { background: rgb(255 255 255 / .8); backdrop-filter: saturate(140%) blur(10px); -webkit-backdrop-filter: saturate(140%) blur(10px); }
    .dark .fi-topbar { background: rgb(12 9 32 / .72); }
}

/* Ícone da marca no topo, só no celular e no tablet (no computador o logo do topo aparece) */
.primehub-topo-marca { display: inline-flex; align-items: center; margin-inline: .25rem .5rem; order: 0; }
.primehub-topo-marca img { width: 2rem; height: 2rem; border-radius: .55rem; }
.fi-topbar-open-sidebar-btn, .fi-topbar-close-sidebar-btn { order: -1; }
@media (min-width: 1024px) { .primehub-topo-marca { display: none; } }

/* Menu lateral */
.fi-sidebar.fi-main-sidebar { background: #FFFFFF; border-inline-end: 1px solid var(--marca-borda); }
.dark .fi-sidebar.fi-main-sidebar { background: linear-gradient(180deg, #140F33 0%, #0C0920 100%); }
.fi-sidebar-header { background: transparent; box-shadow: none; }
.fi-sidebar-group-label { font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.fi-sidebar-item-btn { border-radius: .8rem; min-height: 2.75rem; transition: background-color .15s ease, color .15s ease; }
.fi-sidebar-item:not(.fi-active) > .fi-sidebar-item-btn:hover { background-color: rgb(139 71 255 / .1); }
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: var(--marca-degrade); box-shadow: 0 10px 22px -12px rgb(99 53 255 / .9); }
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-label,
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-icon { color: #FFFFFF; }

/* Aviso das listas de fora no cadastro do cliente (07/11/2026: "recebe 1 de 2 listas") */
.primehub-aviso-listas {
    padding: .7rem .9rem;
    border-radius: .75rem;
    border: 1px solid rgb(217 119 6 / .35);
    background: rgb(245 158 11 / .1);
    color: #92400E;
    font-size: .875rem;
    line-height: 1.45;
}
.dark .primehub-aviso-listas { color: #FCD34D; background: rgb(245 158 11 / .12); border-color: rgb(245 158 11 / .3); }

/*
 * Menu lateral recolhível (07/11/2026): a partir de 1024px o menu recolhe para os ícones pela alça na borda
 * (resources/views/filament/components/barra-lateral-alca.blade.php). Abaixo de 1024px continua o menu que abre por cima.
 */
.primehub-barra-alca { display: none; }
@media (min-width: 1024px) {
    /* A alça substitui os chevrons do topo do Filament */
    .fi-body-has-sidebar-collapsible-on-desktop .fi-topbar-collapse-sidebar-btn-ctn { display: none; }

    .fi-body-has-sidebar-collapsible-on-desktop .fi-main-sidebar { transition: width .22s cubic-bezier(.2, .8, .2, 1); }

    .primehub-barra-alca {
        position: absolute;
        z-index: 25;
        top: 1.6rem;
        inset-inline-end: -.875rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 1.75rem;
        height: 1.75rem;
        padding: 0;
        border-radius: 999px;
        border: 1px solid var(--marca-borda);
        background: var(--marca-cartao);
        color: var(--marca-roxo);
        box-shadow: 0 6px 16px -8px rgb(18 8 75 / .55), 0 0 0 3px rgb(255 255 255 / .9);
        cursor: pointer;
        transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease, border-color .18s ease;
        -webkit-tap-highlight-color: transparent;
    }
    /* Área de toque de 44px em volta do círculo */
    .primehub-barra-alca::before { content: ''; position: absolute; inset: -.5rem; border-radius: 999px; }
    .primehub-barra-alca-icone { width: 1rem; height: 1rem; transition: transform .22s cubic-bezier(.2, .8, .2, 1); }
    .fi-main-sidebar:not(.fi-sidebar-open) .primehub-barra-alca-icone { transform: rotate(180deg); }
    .primehub-barra-alca:focus-visible {
        background: var(--marca-degrade);
        border-color: transparent;
        color: #FFFFFF;
        transform: scale(1.08);
        box-shadow: 0 10px 22px -10px rgb(99 53 255 / .95), 0 0 0 3px rgb(255 255 255 / .9);
    }
    /* O destaque de passar o mouse só onde há mouse: no toque ele ficaria aceso depois de tocar */
    @media (hover: hover) {
        .primehub-barra-alca:hover {
            background: var(--marca-degrade);
            border-color: transparent;
            color: #FFFFFF;
            transform: scale(1.08);
            box-shadow: 0 10px 22px -10px rgb(99 53 255 / .95), 0 0 0 3px rgb(255 255 255 / .9);
        }
    }
    .primehub-barra-alca:active { transform: scale(.96); }
    .primehub-barra-alca:focus { outline: none; }
    .primehub-barra-alca:focus-visible { outline: 2px solid var(--marca-roxo); outline-offset: 3px; }
    .dark .primehub-barra-alca {
        background: #1C1640;
        border-color: rgb(164 61 255 / .35);
        color: #C9B6FF;
        box-shadow: 0 6px 16px -8px rgb(0 0 0 / .8), 0 0 0 3px #0C0920;
    }
    .dark .primehub-barra-alca:focus-visible {
        background: var(--marca-degrade);
        color: #FFFFFF;
        box-shadow: 0 10px 22px -10px rgb(164 61 255 / .9), 0 0 0 3px #0C0920;
    }
    @media (hover: hover) {
        .dark .primehub-barra-alca:hover {
            background: var(--marca-degrade);
            color: #FFFFFF;
            box-shadow: 0 10px 22px -10px rgb(164 61 255 / .9), 0 0 0 3px #0C0920;
        }
    }
    .dark .primehub-barra-alca:focus-visible { outline-color: #C9B6FF; }

    /* Recolhido: os grupos separados por uma linha fina (os nomes dos grupos somem) */
    .fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-nav-groups > .fi-sidebar-group + .fi-sidebar-group::before {
        content: '';
        display: block;
        height: 1px;
        margin: 0 .2rem .9rem;
        border-radius: 1px;
        background: var(--marca-borda);
    }
    .dark .fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-nav-groups > .fi-sidebar-group + .fi-sidebar-group::before { background: rgb(164 61 255 / .22); }

    /* Recolhido: o item com contador ganha um ponto no canto do ícone (o número aparece aberto) */
    .fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-btn { position: relative; }
    .fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-btn:has(.fi-sidebar-item-badge-ctn)::after {
        content: '';
        position: absolute;
        top: .35rem;
        inset-inline-end: .35rem;
        width: .5rem;
        height: .5rem;
        border-radius: 999px;
        background: #F43F5E;
        box-shadow: 0 0 0 2px #FFFFFF;
    }
    .dark .fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-item-btn:has(.fi-sidebar-item-badge-ctn)::after { box-shadow: 0 0 0 2px #0C0920; }
}
@media (min-width: 1024px) and (forced-colors: active) {
    .primehub-barra-alca { border: 1px solid ButtonText; color: ButtonText; background: ButtonFace; }
}
@media (min-width: 1024px) and (prefers-reduced-motion: reduce) {
    .fi-body-has-sidebar-collapsible-on-desktop .fi-main-sidebar,
    .primehub-barra-alca,
    .primehub-barra-alca-icone { transition: none; }
}

/* Títulos na fonte da marca; o texto corrido continua na Inter (mais legível em tabelas e formulários) */
.fi-header-heading, .fi-simple-header-heading, .fi-section-header-heading, .fi-modal-heading, .fi-wi-stats-overview-stat-value {
    font-family: var(--marca-fonte-titulo);
    letter-spacing: .01em;
}
.fi-header-heading, .fi-simple-header-heading { font-weight: 700; }

/* Cartões, tabelas, seções, estatísticas e o assistente no formato da página Aplicativos */
.fi-ta-ctn, .fi-section, .fi-wi-stats-overview-stat, .fi-sc-wizard.fi-contained {
    background-color: var(--marca-cartao);
    border-radius: 1.1rem;
    box-shadow: var(--marca-sombra), 0 0 0 1px var(--marca-borda);
}
.fi-ta-header-cell { background-color: var(--marca-cabecalho-tabela); }
.fi-ta-row { transition: background-color .12s ease; }
.fi-ta-row:hover { background-color: var(--marca-linha-ativa); }
.fi-modal-window { border-radius: 1.25rem; }
.fi-dropdown-panel { border-radius: .9rem; }

/* Botão principal (cheio) com o degradê da marca; texto branco (contraste de 4,5 a 7,5) */
.fi-btn.fi-color-primary.fi-bg-color-600 {
    background-image: var(--marca-degrade);
    border-color: transparent;
    box-shadow: 0 10px 22px -12px rgb(99 53 255 / .9);
}
.fi-btn.fi-color-primary.fi-bg-color-600:hover { filter: brightness(1.08); }

/* Etiquetas de situação em pílula (as cores continuam: verde ativo, âmbar bloqueado, vermelho expirado) */
.fi-badge { border-radius: 999px; padding-inline: .6rem; }

/* Login: sempre no fundo da marca, nos dois temas, com o brilho */
.fi-simple-layout { background: var(--marca-fundo-hero); position: relative; overflow: hidden; }
.fi-simple-layout::before, .fi-simple-layout::after { content: ''; pointer-events: none; position: absolute; border-radius: 999px; }
.fi-simple-layout::before { width: 36rem; height: 36rem; right: -12rem; top: -14rem; background: radial-gradient(circle, rgb(227 94 255 / .28), transparent 65%); }
.fi-simple-layout::after { width: 30rem; height: 30rem; left: -10rem; bottom: -12rem; background: radial-gradient(circle, rgb(99 53 255 / .35), transparent 65%); }
.fi-simple-main-ctn { position: relative; z-index: 1; }
.fi-simple-main { border-radius: 1.5rem; box-shadow: 0 30px 70px -30px rgb(0 0 0 / .8), 0 0 0 1px rgb(255 255 255 / .08); }
.dark .fi-simple-main { background-color: rgb(21 17 47 / .92); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .dark .fi-simple-main { background-color: rgb(21 17 47 / .85); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
}
.fi-simple-header .fi-logo { height: 3rem; }
.fi-simple-page .fi-sc-actions .fi-btn { width: 100%; justify-content: center; min-height: 2.9rem; }

/*
 * Topo no efeito da marca (29/10/2026, pedido do usuário): o mesmo fundo do topo dos cartões da página Aplicativos
 * (degradê índigo com o brilho roxo no canto), nos dois temas. No topo das tabelas (busca, filtros, colunas, ações em
 * massa), no cabeçalho das seções dos formulários, nos passos do assistente e nas boas-vindas. Os menus que abrem do
 * topo (filtros, colunas) ficam como estão: nada aqui vale dentro de .fi-dropdown-panel.
 */
:root {
    --marca-topo: radial-gradient(22rem 16rem at 100% 135%, rgb(122 45 255 / .55), transparent 70%),
        radial-gradient(130% 150% at 0% 0%, #26116F 0%, #12084B 55%, #040726 100%);
    --marca-topo-texto-suave: rgb(255 255 255 / .74);
    --marca-topo-borda: rgb(255 255 255 / .14);
    --marca-topo-campo: rgb(255 255 255 / .08);
    --marca-topo-destaque: #C29EFF;
}

/* Topo das tabelas: o cartão da tabela não corta o conteúdo (os menus abrem para fora), então o topo tem os cantos dele */
.fi-ta-ctn .fi-ta-header-ctn {
    background: var(--marca-topo);
    border-top-left-radius: 1.1rem;
    border-top-right-radius: 1.1rem;
    color: #FFFFFF;
}
/* No celular o topo empilha: o bloco de ações vazio (sem ação em massa) não vira uma faixa vazia acima da busca */
@media (max-width: 639px) {
    .fi-ta-ctn .fi-ta-header-ctn { border-top-left-radius: 1rem; border-top-right-radius: 1rem; }
    .fi-ta-header-toolbar > .fi-ta-actions:not(:has(*)) { display: none; }
}
.fi-ta-header-ctn .fi-ta-header, .fi-ta-header-ctn .fi-ta-header-toolbar { border-color: var(--marca-topo-borda); }
.fi-ta-header-ctn .fi-ta-header-heading { color: #FFFFFF; }
.fi-ta-header-ctn .fi-ta-header-description { color: var(--marca-topo-texto-suave); }
.fi-ta-header-ctn .fi-ta-search-field .fi-input-wrp { background-color: var(--marca-topo-campo); }
.fi-ta-header-ctn .fi-ta-search-field .fi-input-wrp:not(:focus-within) { box-shadow: 0 0 0 1px var(--marca-topo-borda); }
.fi-ta-header-ctn .fi-ta-search-field .fi-input-wrp:focus-within { box-shadow: 0 0 0 2px var(--marca-topo-destaque); }
.fi-ta-header-ctn .fi-ta-search-field .fi-input { color: #FFFFFF; }
.fi-ta-header-ctn .fi-ta-search-field .fi-input::placeholder { color: rgb(255 255 255 / .6); }
.fi-ta-header-ctn .fi-ta-search-field .fi-icon { color: rgb(255 255 255 / .7); }
.fi-ta-header-ctn .fi-icon-btn:not(.fi-dropdown-panel *) { color: rgb(255 255 255 / .85); }
.fi-ta-header-ctn .fi-icon-btn:not(.fi-dropdown-panel *):hover { background-color: rgb(255 255 255 / .1); color: #FFFFFF; }
.fi-ta-header-ctn .fi-btn.fi-color-gray:not(.fi-dropdown-panel *) {
    background-color: rgb(255 255 255 / .06);
    box-shadow: 0 0 0 1px var(--marca-topo-borda);
    color: #FFFFFF;
}
.fi-ta-header-ctn .fi-btn.fi-color-gray:not(.fi-dropdown-panel *) .fi-icon { color: rgb(255 255 255 / .85); }

/* Cabeçalho das seções (título e descrição) e o cartão de boas-vindas do painel do admin */
.fi-section:not(.fi-aside) > .fi-section-header {
    background: var(--marca-topo);
    border-start-start-radius: inherit;
    border-start-end-radius: inherit;
}
.fi-section:not(.fi-aside) > .fi-section-header .fi-section-header-heading { color: #FFFFFF; }
.fi-section:not(.fi-aside) > .fi-section-header .fi-section-header-description { color: var(--marca-topo-texto-suave); }
.fi-section:not(.fi-aside) > .fi-section-header .fi-icon { color: rgb(255 255 255 / .85); }
.fi-account-widget > .fi-section { background: var(--marca-topo); }
.fi-account-widget .fi-account-widget-heading { color: #FFFFFF; }
.fi-account-widget .fi-account-widget-user-name { color: var(--marca-topo-texto-suave); }
.fi-account-widget .fi-btn.fi-color-gray {
    background-color: rgb(255 255 255 / .08);
    box-shadow: 0 0 0 1px var(--marca-topo-borda);
    color: #FFFFFF;
}
.fi-account-widget .fi-btn.fi-color-gray .fi-icon { color: rgb(255 255 255 / .85); }

/* Passos do assistente (criar e editar cliente, criar servidor) */
.fi-sc-wizard.fi-contained > .fi-sc-wizard-header {
    background: var(--marca-topo);
    border-color: var(--marca-topo-borda);
    border-start-start-radius: inherit;
    border-start-end-radius: inherit;
}
.fi-sc-wizard-header .fi-sc-wizard-header-step-label { color: var(--marca-topo-texto-suave); }
.fi-sc-wizard-header .fi-sc-wizard-header-step.fi-active .fi-sc-wizard-header-step-label { color: #FFFFFF; }
.fi-sc-wizard-header .fi-sc-wizard-header-step-icon-ctn { border-color: rgb(255 255 255 / .35); }
.fi-sc-wizard-header .fi-sc-wizard-header-step-number { color: rgb(255 255 255 / .85); }
.fi-sc-wizard-header .fi-sc-wizard-header-step.fi-active .fi-sc-wizard-header-step-icon-ctn { border-color: var(--marca-topo-destaque); }
.fi-sc-wizard-header .fi-sc-wizard-header-step.fi-active .fi-sc-wizard-header-step-number { color: var(--marca-topo-destaque); }
.fi-sc-wizard-header .fi-sc-wizard-header-step.fi-completed .fi-sc-wizard-header-step-icon-ctn { background: var(--marca-degrade); border-color: transparent; }
.fi-sc-wizard-header .fi-sc-wizard-header-step.fi-completed .fi-icon { color: #FFFFFF; }

/* Celular e tablet: alvos de toque maiores, cartões com o mesmo canto e login com margem nas bordas */
@media (max-width: 1023px) {
    .fi-sidebar-item-btn { min-height: 3rem; }
}
@media (max-width: 640px) {
    .fi-simple-main-ctn { padding-inline: 1rem; }
    .fi-simple-main { border-radius: 1.25rem; }
    .fi-ta-ctn, .fi-section, .fi-wi-stats-overview-stat, .fi-sc-wizard.fi-contained { border-radius: 1rem; }
}

/*
 * Páginas iniciais do admin e da revenda (31/10/2026): título das seções de números, altura dos gráficos, cartões no
 * celular (2 por linha) e a atividade recente. Só nas duas páginas (.ph-painel-inicial, das classes da página)
 */
/* Seções de números (Revendas, Clientes, Sistema): o título sobre o fundo da página, sem o topo escuro dos formulários
   e sem um cartão em volta dos cartões */
.ph-painel-inicial .fi-wi-stats-overview .fi-section.fi-section-not-contained { background: transparent; border-radius: 0; box-shadow: none; }
.ph-painel-inicial .fi-wi-stats-overview .fi-section.fi-section-not-contained > .fi-section-header { background: none; padding: 0 .125rem .125rem; }
.ph-painel-inicial .fi-wi-stats-overview .fi-section.fi-section-not-contained > .fi-section-header .fi-section-header-heading {
    color: var(--marca-texto);
    font-size: 1.1rem;
    font-weight: 700;
}
.ph-painel-inicial .fi-wi-stats-overview .fi-section.fi-section-not-contained > .fi-section-header .fi-icon { color: var(--marca-texto-suave); }
.ph-painel-inicial .fi-wi-stats-overview .fi-section.fi-collapsible > .fi-section-header { cursor: pointer; }
/* Gráficos com altura fixa (a largura acompanha a tela): 288 px no computador, 256 px no celular e no tablet */
.ph-painel-inicial .fi-wi-chart .fi-wi-chart-frame-no-aspect-ratio { height: 18rem; }
@media (max-width: 1023px) {
    .ph-painel-inicial .fi-wi-chart .fi-wi-chart-frame-no-aspect-ratio { height: 16rem; }
}
/* Celular: 2 cartões por linha, com o número menor para "1.234,50" caber em meia tela */
@media (max-width: 640px) {
    .ph-painel-inicial .fi-wi-stats-overview-stat { padding: 1rem; }
    .ph-painel-inicial .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-value { font-size: 1.45rem; line-height: 1.2; }
    .ph-painel-inicial .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-label { font-size: .8rem; }
    .ph-painel-inicial .fi-wi-stats-overview-stat .fi-wi-stats-overview-stat-description { font-size: .75rem; line-height: 1.35; }
}
/* Atividade recente da revenda: lista simples (no celular fica melhor que tabela) */
.ph-atividade-lista { list-style: none; margin: 0; padding: 0; }
.ph-atividade-item { border-top: 1px solid var(--marca-borda); display: grid; gap: .75rem; grid-template-columns: 5.75rem minmax(0, 1fr); padding: .6rem 0; }
.ph-atividade-item:first-child { border-top: 0; padding-top: 0; }
.ph-atividade-quando { color: var(--marca-texto-fraco); font-size: .8rem; font-variant-numeric: tabular-nums; line-height: 1.4rem; white-space: nowrap; }
.ph-atividade-texto { color: var(--marca-texto); font-size: .875rem; line-height: 1.4rem; min-width: 0; }
.ph-atividade-texto strong { font-weight: 600; }
.ph-atividade-detalhe { color: var(--marca-texto-suave); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ph-atividade-vazio { color: var(--marca-texto-suave); font-size: .875rem; }
.ph-atividade-rodape {
    border-top: 1px solid var(--marca-borda);
    color: var(--marca-texto-suave);
    display: flex;
    flex-wrap: wrap;
    font-size: .8rem;
    gap: .35rem 1rem;
    margin-top: .9rem;
    padding-top: .8rem;
}
.ph-atividade-alerta { color: #B45309; font-weight: 600; }
.dark .ph-atividade-alerta { color: #F59E0B; }
.ph-atividade-link { color: var(--marca-roxo); font-weight: 600; margin-inline-start: auto; }
.ph-atividade-link:hover { text-decoration: underline; }

/* Quem pede menos movimento não vê transições */
@media (prefers-reduced-motion: reduce) {
    .fi-sidebar-item-btn, .fi-ta-row { transition: none; }
}