@layer mindz.legacy {
/* =========================================================
   MindZ — compatibilidade visual de componentes legados.
   Tokens, temas, reset, tipografia e controles-base pertencem
   exclusivamente a mindz_foundations.css.
   ========================================================= */

/* =========================================================
   Shell global
   ========================================================= */

body .app-shell,
body .app-area{
    background: transparent;
}

body .app-content{
    padding: 24px 28px 40px;
}

body .sidebar{
    background: color-mix(in srgb, var(--ph-bg-surface-solid) 88%, transparent);
    border-right: 1px solid var(--ph-border-subtle);
    box-shadow: 10px 0 34px color-mix(in srgb, var(--shadow-color) 4.5%, transparent);
    backdrop-filter: blur(18px) saturate(1.22);
}

:root[data-theme="dark"] body .sidebar{
box-shadow: 10px 0 34px color-mix(in srgb, var(--color-black) 28%, transparent);
}

body .sidebar-brand,
body .sidebar-brand.sistema-brand-hugz{
    padding-bottom: 22px;
}

body .sidebar-section-title,
body .sidebar-section-label{
    color: var(--ph-text-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body .sidebar-item{
    min-height: 44px;
    border-radius: 14px;
    color: var(--ph-text-secondary);
    font-weight: 600;
    transition: background var(--ph-transition), color var(--ph-transition), transform var(--ph-transition), box-shadow var(--ph-transition);
}

body .sidebar-item:hover{
    background: var(--ph-primary-softer);
    color: var(--ph-primary);
    transform: translateX(2px);
}

body .sidebar-item.active,
body .sidebar-item.is-active,
body .sidebar-item[aria-current="page"]{
    background: linear-gradient(135deg, var(--ph-primary-soft), color-mix(in srgb, var(--ph-primary-soft) 46%, var(--ph-bg-surface-solid)));
    color: var(--ph-primary);
    box-shadow: inset 3px 0 0 var(--ph-primary), var(--ph-shadow-xs);
}

body .app-topbar,
body .app-topbar.topbar-corrigida{
    min-height: var(--ph-topbar-height);
    height: var(--ph-topbar-height);
    padding: 14px 28px;
    background: var(--ph-bg-surface-solid);
    border-bottom: 1px solid var(--ph-border-subtle);
    box-shadow: 0 8px 30px color-mix(in srgb, var(--shadow-color) 4%, transparent);
    backdrop-filter: none;
}

body .topbar-page-title{
    color: var(--ph-text-primary);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.035em;
}

body .topbar-page-subtitle,
body .topbar-page-context{
    color: var(--ph-text-muted);
    font-size: 13px;
}

body .topbar-notification-button,
body .topbar-theme-toggle,
body .topbar-user-compact,
body .topbar-admin-badge,
body .topbar-environment-badge{
    border: 1px solid var(--ph-border-subtle);
    background: color-mix(in srgb, var(--ph-bg-surface-solid) 92%, transparent);
    box-shadow: var(--ph-shadow-xs);
    border-radius: var(--ph-radius-pill);
}

body .topbar-notification-button:hover,
body .topbar-theme-toggle:hover,
body .topbar-user-compact:hover,
body .topbar-admin-badge:hover{
    border-color: color-mix(in srgb, var(--ph-primary) 38%, var(--ph-border));
    background: var(--ph-primary-softer);
    transform: translateY(-1px);
}

/* =========================================================
   Tipografia e containers de página
   ========================================================= */

body :is(h1, h2, h3, h4, h5, h6){
    color: var(--ph-text-primary);
    font-family: var(--ph-font);
    font-weight: 700;
    letter-spacing: -0.035em;
}

body :is(.page, .content-page, .main-page, .page-content, .avaliacao-page, .clima-page, .perfil-page){
    min-width: 0;
}

body :is(.page-header, .section-hero, .hero-card, .module-header, .result-header){
    border: 1px solid var(--ph-border-subtle);
    border-radius: var(--ph-radius-2xl);
    background: linear-gradient(135deg, color-mix(in srgb, var(--ph-bg-surface-solid) 96%, transparent), color-mix(in srgb, var(--ph-primary-softer) 42%, var(--ph-bg-surface-solid)));
    box-shadow: var(--ph-shadow-sm);
    overflow: hidden;
}

body :is(.page-header h1, .page-header h2, .module-header h1, .module-header h2, .section-title, .card-title){
    margin-top: 0;
}

body :is(.page-header p, .page-subtitle, .subtitle, .description, .section-description, .helper-text){
    color: var(--ph-text-secondary);
}

/* =========================================================
   Cards, painéis, métricas e estados vazios
   ========================================================= */


/* Componentes básicos removidos desta camada: mindz_components.css é a fonte oficial. */

/* =========================================================
   Tabelas e listagens
   ========================================================= */


/* Componentes básicos (badges/status) migrados para mindz_components.css. */

/* =========================================================
   Modais, dialogs, pop-ups e overlays
   ========================================================= */

body :is(.app-modal-backdrop, .modal-backdrop, .feedback-modal-backdrop, .solicitacoes-modal-backdrop, .app-dialog-backdrop){
    background: var(--ph-bg-overlay);
    backdrop-filter: blur(10px) saturate(1.10);
}

body :is(.app-modal, .modal, .modal-content, .feedback-modal, .solicitacoes-modal, .app-dialog-modal, .comunicado-comments-modal, .modal-content-lg){
    border: 1px solid var(--ph-border-subtle);
    border-radius: var(--ph-radius-2xl);
    background: var(--ph-bg-elevated);
    box-shadow: var(--ph-shadow-modal);
    overflow: hidden;
}

body :is(.app-modal-header, .modal-header, .feedback-modal-header, .solicitacoes-modal .app-modal-header, .comunicado-comments-modal .app-modal-header){
    min-height: 76px;
    padding: 22px 28px;
    border-bottom: 1px solid var(--ph-border-subtle);
    background: linear-gradient(135deg, var(--ph-bg-surface-solid), color-mix(in srgb, var(--ph-primary-softer) 44%, var(--ph-bg-surface-solid)));
}

body :is(.app-modal-body, .modal-body, .solicitacoes-modal .app-modal-body){
    background: color-mix(in srgb, var(--ph-bg-subtle) 58%, var(--ph-bg-surface-solid));
}

body :is(.app-modal-footer, .modal-footer, .feedback-modal-footer){
    padding: 18px 28px;
    border-top: 1px solid var(--ph-border-subtle);
    background: color-mix(in srgb, var(--ph-bg-surface-solid) 96%, transparent);
}

body :is(.app-modal-close, .modal-close, .feedback-modal-close, .solicitacao-detalhe-fechar){
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    border-radius: var(--ph-radius-pill);
    border: 1px solid var(--ph-border);
    background: var(--ph-bg-surface-solid);
    color: var(--ph-text-secondary);
    box-shadow: var(--ph-shadow-xs);
}

body :is(.app-modal-close, .modal-close, .feedback-modal-close, .solicitacao-detalhe-fechar):hover{
    color: var(--ph-danger);
    border-color: var(--ph-danger-border);
    background: var(--ph-danger-soft);
}

/* =========================================================
   Toast global
   ========================================================= */

body :is(.app-toast, .toast, .toast-item){
    border: 1px solid var(--ph-border-subtle);
    border-radius: 18px;
    background: color-mix(in srgb, var(--ph-bg-surface-solid) 94%, transparent);
    box-shadow: var(--ph-shadow-lg);
    backdrop-filter: blur(18px) saturate(1.18);
}

body :is(.app-toast-container, .toast-container, .ph-toast-stack){
    z-index: var(--z-critical);
}

/* =========================================================
   Tabs, filtros e barras de ação
   ========================================================= */

body :is(.tabs, .feedbacks-tabs, .app-tabs, .tabbar, .perfil-tabs, .colaborador-trajetoria-tabs, .filter-tabs){
    border: 1px solid var(--ph-border-subtle);
    border-radius: var(--ph-radius-xl);
    background: color-mix(in srgb, var(--ph-bg-surface-solid) 88%, transparent);
    box-shadow: var(--ph-shadow-xs);
}

body :is(.tab-button, .feedback-tab, .app-tab, .tabbar-button, .colaborador-trajetoria-tab){
    border-radius: 14px;
    font-weight: 700;
}

body :is(.tab-button.active, .tab-button.is-active, .feedback-tab.active, .feedback-tab.is-active, .app-tab.active, .app-tab.is-active, .tabbar-button.active, .tabbar-button.is-active, .colaborador-trajetoria-tab.is-active, .colaborador-trajetoria-tab[aria-selected="true"]){
    border-color: color-mix(in srgb, var(--ph-primary) 34%, var(--ph-border));
    background: linear-gradient(135deg, var(--ph-primary-soft), color-mix(in srgb, var(--ph-primary-soft) 46%, var(--ph-bg-surface-solid)));
    color: var(--ph-primary);
}


/* =========================================================
   Chat, interações e comentários
   ========================================================= */

body :is(.chat-container, .chat-panel, .comentarios-panel, .solicitacao-chat, .chat-interacoes){
    border: 1px solid var(--ph-border-subtle);
    border-radius: var(--ph-radius-xl);
    background: var(--ph-bg-surface-solid);
    box-shadow: var(--ph-shadow-sm);
}

body :is(.chat-message, .comentario-card, .solicitacao-chat-mensagem, .chat-bubble){
    border: 1px solid var(--ph-border-subtle);
    border-radius: 18px;
    background: color-mix(in srgb, var(--ph-bg-subtle) 68%, var(--ph-bg-surface-solid));
}


/* =========================================================
   Skeletons e carregamento
   ========================================================= */

body :is(.skeleton, .loading-skeleton, .placeholder-line){
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    background: linear-gradient(90deg, var(--ph-bg-muted), color-mix(in srgb, var(--ph-bg-muted) 52%, var(--ph-bg-surface-solid)), var(--ph-bg-muted));
    background-size: 220% 100%;
    animation: ph-skeleton 1.25s ease-in-out infinite;
}

@keyframes ph-skeleton {
    0%{ background-position: 220% 0; }
    100%{ background-position: -220% 0; }
}

body :is(.spinner, .loading-spinner){
    border-color: color-mix(in srgb, var(--ph-primary) 20%, var(--ph-border));
    border-top-color: var(--ph-primary);
}

/* =========================================================
   Ajustes específicos com impacto visual, sem lógica
   ========================================================= */

body .avaliacao-etapa-card.is-current,
body .avaliacao-etapa-card.em-andamento,
body .avaliacao-stage-card.is-current,
body .avaliacao-stage-card.em-andamento{
    border-color: var(--ph-success-border);
    background: linear-gradient(90deg, var(--ph-success-soft), var(--ph-bg-surface-solid) 28%, var(--ph-bg-surface-solid));
    box-shadow: 0 16px 36px rgba(22, 131, 60, 0.10);
}

body .avaliacao-etapa-card.is-current::before,
body .avaliacao-etapa-card.em-andamento::before,
body .avaliacao-stage-card.is-current::before,
body .avaliacao-stage-card.em-andamento::before{
    background: var(--ph-success);
}

body :is(.page-actions, .table-actions, .card-actions, .modal-actions, .app-modal-footer){
    gap: 12px;
}

body :is(.clearable-field, .input-clearable) button,
body :is(.clear-field-button, .clear-button){
    border-radius: 50%;
}

/* Garante que objetos não sejam visualmente cortados por containers muito rígidos. */


@media (max-width: 1024px) {
    body .app-content{
        padding: 18px 18px 32px;
    }

    body :is(.page-header, .module-header, .app-modal-header, .modal-header){
        padding: 18px 20px;
    }

    body :is(.table-header, .card-header, .list-header, .section-header){
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    body :is(.app-modal, .modal, .feedback-modal, .solicitacoes-modal){
        width: calc(100vw - 20px);
        max-width: calc(100vw - 20px);
        border-radius: 22px;
    }

    body :is(.app-modal-footer, .modal-footer){
        flex-wrap: wrap;
    }
}

@media (prefers-reduced-motion: reduce) {
    body *,
body *::before,
body *::after{
        transition-duration: 0.01ms;
        animation-duration: 0.01ms;
        animation-iteration-count: 1;
        scroll-behavior: auto;
    }
}


/* =========================================================
   Compatibilidade residual do shell
   - A estrutura e as flyouts são controladas por mindz_structure.css.
   ========================================================= */

/* Remove apenas o botão Sair legado. O rodapé global contém o controle de expansão. */
body .sidebar-footer .logout-button{
    display: none;
}

/* Colaboradores: o título da tabela não deve ter borda/cartão próprio. */
body .colaboradores-result-card,
body .colaboradores-result-card:hover,
body .colaboradores-result-card:focus-within{
    border: 0;
    box-shadow: none;
    background: transparent;
    backdrop-filter: none;
}

body .colaboradores-result-header,
body .colaboradores-result-card .colaboradores-result-header,
body .colaboradores-result-header:hover,
body .colaboradores-result-header:focus-within{
    border: 0;
    border-bottom: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    padding: 0 0 12px;
}

body .colaboradores-result-header h2,
body .colaboradores-result-header p{
    margin: 0;
}

/* =========================================================
   FIX v408 — overlays acima do shell fixo
   - Descrição de cargos e Avaliação de desempenho não podem
     ser cortadas pela sidebar nem pelo cabeçalho fixo.
   - Apenas ajuste visual/posicionamento; nenhuma lógica alterada.
   ========================================================= */

body :is(.app-modal-backdrop){
    position: fixed;
    inset: 0;
    z-index: var(--z-backdrop);
    width: 100vw;
    height: 100dvh;
    max-width: 100vw;
    max-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(10px, 1.5vw, 18px);
    overflow: hidden;
}


body .avaliacoes-modal,
body .app-shell.sidebar-collapsed .avaliacoes-modal{
    position: fixed;
    inset: 0;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: var(--z-backdrop);
    width: 100vw;
    height: 100dvh;
    max-width: 100vw;
    max-height: 100dvh;
    padding: clamp(10px, 1.5vw, 18px);
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

body .avaliacoes-modal-secondary,
body .app-shell.sidebar-collapsed .avaliacoes-modal-secondary{
    inset: 0;
    left: 0;
    z-index: var(--z-modal);
}

body .avaliacoes-modal.is-open{
    display: flex;
}

body .avaliacoes-modal__dialog,
body .avaliacoes-modal__dialog--wide,
body .avaliacoes-modal-secondary .avaliacoes-modal__dialog,
body .avaliacoes-modal-secondary .avaliacoes-modal__dialog--wide{
    width: min(96vw, 1480px);
    max-width: calc(100vw - 24px);
    height: auto;
    max-height: calc(100dvh - 24px);
    margin: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
}

body .avaliacoes-modal__body,
body .avaliacoes-response-body,
body .avaliacoes-publico-dialog .avaliacoes-modal__body,
body .avaliacoes-cycle-dialog .avaliacoes-modal__body{
    min-height: 0;
    overflow: auto;
}

body .avaliacoes-modal__header,
body .avaliacoes-modal__footer{
    flex: 0 0 auto;
}

body .avaliacoes-modal__header-actions,
body .avaliacoes-modal__footer{
    min-width: 0;
}

@media (max-width: 768px) {
    body :is(.app-modal-backdrop),
body .avaliacoes-modal,
body .app-shell.sidebar-collapsed .avaliacoes-modal{
        padding: 8px;
    }

    body :is(.avaliacoes-modal__dialog, .avaliacoes-modal__dialog--wide){
        width: calc(100vw - 16px);
        max-width: calc(100vw - 16px);
        max-height: calc(100dvh - 16px);
    }
}

/* =========================================================
   FIX v409 — cabeçalhos filhos opacos acima do shell
   - Modais de Descrição de Cargos e Avaliação de Desempenho
     devem ficar acima da topbar/sidebar.
   - Headers/footers internos precisam ser sólidos, não glass.
   - Apenas camada visual; nenhuma lógica alterada.
   ========================================================= */

body :is(.app-modal-backdrop),
body .avaliacoes-modal,
body .app-shell.sidebar-collapsed .avaliacoes-modal{
    z-index: var(--z-backdrop);
}

body .avaliacoes-modal-secondary,
body .app-shell.sidebar-collapsed .avaliacoes-modal-secondary{
    z-index: var(--z-modal);
}

body :is(.avaliacoes-modal__dialog, .avaliacoes-modal__dialog--wide){
    background: var(--surface);
    opacity: 1;
    isolation: isolate;
}

body .avaliacoes-modal :is(.avaliacoes-modal__header, .avaliacoes-modal__footer),
body .avaliacoes-modal-secondary :is(.avaliacoes-modal__header, .avaliacoes-modal__footer){
    background: var(--surface);
    background-color: var(--surface);
    opacity: 1;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-color: var(--border);
    position: relative;
    z-index: var(--z-content);
}

body .avaliacoes-modal :is(.avaliacoes-modal__body, .avaliacoes-response-body),
body .avaliacoes-modal-secondary :is(.avaliacoes-modal__body, .avaliacoes-response-body){
    background: var(--app-bg);
    position: relative;
    z-index: var(--z-content);
}

/* =========================================================
   FIX v411 — filtro visual horizontal de origem
   Componente único para Feedbacks e Comemorações.
   - Avatar + contador + tooltip + clique para filtrar.
   - Destaque ativo por linha inferior, sem círculo cortado.
   - Sem scroll horizontal; quebra em nova linha quando necessário.
   ========================================================= */
body .feedback-origin-strip-card{
    overflow: visible;
    padding: 18px 20px;
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    background: var(--surface);
    box-shadow: var(--shadow-xs);
}

body .feedback-origin-strip-header{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 2px;
}

body .feedback-origin-strip-header .eyebrow,
body .feedback-origin-strip-header p{
    margin: 0 0 4px;
    color: var(--primary);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

body .feedback-origin-strip-header h3{
    margin: 0;
    color: var(--text);
    font-size: 20px;
    font-weight: 760;
    line-height: 1.16;
    letter-spacing: -0.025em;
}

body .feedback-origin-strip-header span{
    display: block;
    margin-top: 5px;
    color: var(--text-muted);
    font-size: 13px;
    line-height: 1.45;
}

body .feedback-origin-strip{
    position: relative;
    min-height: 84px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px 14px;
    overflow: visible;
    padding: 8px 4px 14px;
    scrollbar-width: none;
}

body .feedback-origin-strip::-webkit-scrollbar{
    display: none;
}

body .feedback-origin-person{
    position: relative;
    width: 64px;
    min-width: 64px;
    height: 64px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
    border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
    border-radius: var(--radius-pill);
    background: var(--surface);
    color: var(--text);
    box-shadow: var(--shadow-xs);
    cursor: pointer;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

body .feedback-origin-person:hover,
body .feedback-origin-person:focus-visible,
body .feedback-origin-person.active{
    z-index: var(--z-content);
    border-color: color-mix(in srgb, var(--primary) 52%, var(--border));
    background: color-mix(in srgb, var(--primary-soft) 42%, var(--surface));
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
    outline: none;
}

body .feedback-origin-person.active::after{
    content: "";
    position: absolute;
    left: 50%;
    right: auto;
    top: auto;
    bottom: -10px;
    width: 30px;
    height: 3px;
    border: 0;
    border-radius: var(--radius-pill);
    background: var(--primary);
    box-shadow: 0 4px 10px color-mix(in srgb, var(--primary) 34%, transparent);
    transform: translateX(-50%);
    pointer-events: none;
}

body .feedback-origin-avatar-wrap{
    position: relative;
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
}

body .feedback-origin-person :is(.feedback-list-avatar, .person-photo){
    width: 52px;
    height: 52px;
    min-width: 52px;
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-pill);
    border: 2px solid var(--surface);
    background: var(--primary-soft);
    color: var(--primary);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--border) 72%, transparent);
    object-fit: cover;
    font-size: 13px;
    font-weight: 820;
}

body .feedback-origin-all-avatar{
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-pill);
    background: linear-gradient(135deg, var(--primary-soft), color-mix(in srgb, var(--primary-soft) 58%, var(--surface)));
    color: var(--primary);
    border: 2px solid var(--surface);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--border) 72%, transparent);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: -0.02em;
}

body .feedback-origin-count{
    position: absolute;
    top: -7px;
    right: -9px;
    min-width: 24px;
    height: 24px;
    padding: 0 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--surface);
    border-radius: var(--radius-pill);
    background: var(--primary);
    color: var(--text-inverse);
    font-size: 11px;
    font-weight: 850;
    line-height: 1;
    box-shadow: var(--shadow-sm);
}

body .feedback-origin-tooltip{
    position: absolute;
    left: 50%;
    bottom: calc(100% + 12px);
    width: max-content;
    max-width: 280px;
    min-width: 210px;
    padding: 12px 14px;
    display: grid;
    gap: 3px;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: var(--surface);
    color: var(--text);
    box-shadow: var(--shadow-modal);
    text-align: left;
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, 8px);
    pointer-events: none;
    transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
}

body .feedback-origin-tooltip::after{
    content: "";
    position: absolute;
    left: 50%;
    bottom: -7px;
    width: 12px;
    height: 12px;
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: var(--surface);
    transform: translateX(-50%) rotate(45deg);
}

body .feedback-origin-tooltip strong{
    color: var(--text);
    font-size: 13px;
    font-weight: 760;
    line-height: 1.25;
}

body .feedback-origin-tooltip small{
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1.35;
}

body .feedback-origin-tooltip em{
    width: fit-content;
    margin-top: 6px;
    padding: 4px 8px;
    border-radius: var(--radius-pill);
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 11px;
    font-style: normal;
    font-weight: 780;
}

body .feedback-origin-person:hover .feedback-origin-tooltip,
body .feedback-origin-person:focus-visible .feedback-origin-tooltip{
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
}

body .comemoracoes-origin-strip-card{
    margin-top: 0;
}

body .comemoracoes-analytics-support-grid{
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, .85fr);
}

@media (max-width: 1024px) {
    body .feedback-origin-strip-card{
        padding: 16px;
    }

    body .feedback-origin-strip{
        gap: 14px 12px;
        padding-bottom: 12px;
    }

    body .feedback-origin-tooltip{
        display: none;
    }

    body .comemoracoes-analytics-support-grid{
        grid-template-columns: 1fr;
    }
}


/* FIX v413 - overlays de perfil e trajetória acima do shell */


/* =========================================================
   FIX v414 - Perfil público responsivo em pop-up
   - Aumenta a largura útil do modal.
   - Evita corte/estouro em telas menores.
   - Mantém cabeçalho, abas e rodapé legíveis no padrão global.
   ========================================================= */
body.body-popup-perfil-colaborador-open{
    overflow: hidden;
}


@media (max-width: 1280px) {
    

    
}

@media (max-width: 768px) {
    

    

    

    

    

    

    

    
}

/* =========================================================
   FIX v416 - Trajetória do colaborador sem fundo verde
   - Correção aplicada na camada carregada por último.
   - Neutraliza qualquer fundo semântico/success herdado na trajetória.
   - Mantém cards e abas no padrão Fluent do sistema.
   ========================================================= */


/* =========================================================
   FIX v417 - Trajetória sem verde fora do design system
   - Na trajetória, indicadores visuais deixam de usar success/verde.
   - Usa tokens primários/neutros do padrão global Fluent.
   ========================================================= */


/* =========================================================
   FIX v420 — cabeçalho fixo opaco e toasts acima de todo o sistema
   ========================================================= */
body .app-topbar,
body .app-topbar.topbar-corrigida{
    background: var(--ph-bg-surface-solid);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

body .ph-toast-stack,
body .app-toast-container,
body .toast-container{
    z-index: var(--z-critical);
}

/* =========================================================
   FIX v421 — dialog global acima de modais de avaliações
   ========================================================= */
body .app-dialog-backdrop{
    z-index: var(--z-backdrop);
}

body .app-dialog-modal{
    z-index: var(--z-modal);
}


/* =========================================================
   FIX v422 - Headers de resultado específicos sem hover visual
   ========================================================= */
body .colaboradores-result-header,
body .colaboradores-result-header:hover,
body .colaboradores-result-header:focus,
body .colaboradores-result-header:focus-within,
body .colaboradores-result-card:hover .colaboradores-result-header,
body .colaboradores-result-card:focus-within .colaboradores-result-header,
body .solicitacoes-user-result-header,
body .solicitacoes-user-result-header:hover,
body .solicitacoes-user-result-header:focus,
body .solicitacoes-user-result-header:focus-within,
body .solicitacoes-user-result-card:hover .solicitacoes-user-result-header,
body .solicitacoes-user-result-card:focus-within .solicitacoes-user-result-header{
    background: transparent;
    background-color: transparent;
    background-image: none;
    box-shadow: none;
    border-top: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    transform: none;
}

body .colaboradores-result-header h2,
body .colaboradores-result-header:hover h2,
body .colaboradores-result-card:hover .colaboradores-result-header h2,
body .solicitacoes-user-result-header h2,
body .solicitacoes-user-result-header:hover h2,
body .solicitacoes-user-result-card:hover .solicitacoes-user-result-header h2{
    color: var(--ph-text-primary);
}

body .colaboradores-result-header p,
body .colaboradores-result-header:hover p,
body .colaboradores-result-card:hover .colaboradores-result-header p,
body .solicitacoes-user-result-header p,
body .solicitacoes-user-result-header:hover p,
body .solicitacoes-user-result-card:hover .solicitacoes-user-result-header p{
    color: var(--ph-text-secondary);
}

/* =========================================================
   MindZ v423 — Paleta azul executivo da tela de referência
   - Camada final de tokens para uniformizar o sistema inteiro.
   - Fundo claro azulado, cartões brancos, azul profundo e sombras suaves.
   ========================================================= */

:root[data-theme="dark"] body{
background: radial-gradient(circle at 18% -10%, rgba(139, 184, 255, 0.13), transparent 34rem),
        radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--primary) 18%, transparent), transparent 30rem),
        linear-gradient(180deg, var(--app-bg-soft) 0%, var(--app-bg) 100%);
}

body .app-shell,
body .app-area,
body .app-content{
    background: transparent;
}

body .sidebar{
    background: color-mix(in srgb, var(--color-white) 92%, transparent);
    border-right-color: rgba(213, 225, 241, 0.82);
    box-shadow: 16px 0 44px rgba(8, 33, 80, 0.055);
}

:root[data-theme="dark"] body .sidebar{
background: rgba(13, 26, 50, 0.92);
    border-right-color: rgba(186, 204, 230, 0.16);
}

body .app-topbar,
body .app-topbar.topbar-corrigida,
body .topbar,
body .topbar-corrigida{
    background: color-mix(in srgb, var(--color-white) 94%, transparent);
    border: 1px solid rgba(213, 225, 241, 0.86);
    border-radius: 22px;
    box-shadow: 0 16px 44px rgba(8, 33, 80, 0.060);
}

body :is(.page-header, .section-hero, .hero-card, .module-header, .result-header){
    background: linear-gradient(135deg, color-mix(in srgb, var(--color-white) 98%, transparent), rgba(245, 249, 255, 0.92));
    border-color: rgba(213, 225, 241, 0.92);
    box-shadow: 0 16px 42px rgba(8, 33, 80, 0.060);
}


body :is(.tabs, .feedbacks-tabs, .app-tabs, .tabbar, .perfil-tabs, .colaborador-trajetoria-tabs, .filter-tabs){
    background: color-mix(in srgb, var(--color-white) 82%, transparent);
    border-color: rgba(213, 225, 241, 0.92);
    box-shadow: 0 10px 26px rgba(8, 33, 80, 0.050);
}

body :is(.tab-button.active, .tab-button.is-active, .feedback-tab.active, .feedback-tab.is-active, .app-tab.active, .app-tab.is-active, .tabbar-button.active, .tabbar-button.is-active, .colaborador-trajetoria-tab.is-active, .colaborador-trajetoria-tab[aria-selected="true"]){
    background: var(--ph-primary-soft);
    border-color: color-mix(in srgb, var(--primary) 32%, var(--border));
    color: var(--ph-primary);
}


/* Ajuste global: menu fixo/shell sem cantos arredondados */
body :is(.sidebar, .app-sidebar, .shell-sidebar, .app-topbar, .app-topbar.topbar-corrigida, .topbar, .app-header, .shell-header, .main-header),
body :is(.sidebar-brand, .app-sidebar-brand, .sidebar-nav, .app-sidebar-nav),
body :is(.sidebar-item, .sidebar-link, .app-sidebar-link, .sidebar-submenu-trigger, .sidebar-submenu-link, .app-menu-link){
    border-radius: 0;
}


/* =========================================================
   MindZ FIX — camada final de perfil visual sem azul fixo
   Mantém botões, tabelas e superfícies obedecendo ao perfil ativo.
   ========================================================= */


/* MindZ FIX — superfícies finais sem azul fixo herdado do Fluent antigo. */


:root[data-theme="dark"] body,
body[data-theme="dark"]{
background: radial-gradient(circle at 18% -10%, color-mix(in srgb, var(--primary) 13%, transparent), transparent 34rem),
        radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--primary) 10%, transparent), transparent 30rem),
        linear-gradient(180deg, var(--app-bg-soft) 0%, var(--app-bg) 100%);
}

body .sidebar{
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    border-right-color: color-mix(in srgb, var(--border) 82%, transparent);
    box-shadow: 16px 0 44px color-mix(in srgb, var(--primary) 5%, transparent);
}

body .app-topbar,
body .app-topbar.topbar-corrigida,
body .topbar,
body .topbar-corrigida{
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    border-color: color-mix(in srgb, var(--border) 86%, transparent);
    box-shadow: 0 16px 44px color-mix(in srgb, var(--primary) 5%, transparent);
}

body :is(.page-header, .section-hero, .hero-card, .module-header, .result-header){
    background: linear-gradient(135deg, color-mix(in srgb, var(--surface) 98%, transparent), color-mix(in srgb, var(--primary-soft) 42%, var(--surface)));
    border-color: color-mix(in srgb, var(--primary) 10%, var(--border));
    box-shadow: 0 16px 42px color-mix(in srgb, var(--primary) 5%, transparent);
}


body :is(.tabs, .feedbacks-tabs, .app-tabs, .tabbar, .perfil-tabs, .colaborador-trajetoria-tabs, .filter-tabs){
    background: color-mix(in srgb, var(--surface) 82%, transparent);
    border-color: color-mix(in srgb, var(--border) 86%, transparent);
    box-shadow: 0 10px 26px color-mix(in srgb, var(--primary) 5%, transparent);
}

body :is(.tab-button.active, .tab-button.is-active, .feedback-tab.active, .feedback-tab.is-active, .app-tab.active, .app-tab.is-active, .tabbar-button.active, .tabbar-button.is-active, .colaborador-trajetoria-tab.is-active, .colaborador-trajetoria-tab[aria-selected="true"]){
    background: var(--primary-soft);
    border-color: color-mix(in srgb, var(--primary) 28%, var(--border));
    color: var(--primary);
}


/* =========================================================
   MindZ FIX — Dropdowns/listas de seleção sem cor fixa
   ========================================================= */


body :where(.dropdown-menu, .dropdown-panel, .menu-panel, .popover, .autocomplete, .suggestions, .search-results, [role="listbox"]){
    background: var(--surface);
    border-color: color-mix(in srgb, var(--primary) 12%, var(--border));
    color: var(--text-color);
}

body :where(.dropdown-menu a, .dropdown-menu button, .dropdown-item, .dropdown-option, .autocomplete-item, .suggestion-item, .search-result-item, [role="option"]){
    background: transparent;
    color: var(--text-color);
    font-weight: 500;
}

body :where(.dropdown-menu a:hover, .dropdown-menu button:hover, .dropdown-item:hover, .dropdown-option:hover, .autocomplete-item:hover, .suggestion-item:hover, .search-result-item:hover, [role="option"]:hover, [role="option"][aria-selected="true"]){
    background: color-mix(in srgb, var(--primary) 9%, var(--surface));
    color: var(--primary);
}
}
