/* ==============================================
   TEMPLATE - DESIGN SYSTEM
   Abordagem Mobile-First
   ============================================== */

:root {
    /* ---- Cores semânticas ---- */
    --cor-sucesso:#22c55e;--cor-sucesso-bg:#f0fdf4;--cor-sucesso-borda:#86efac;
    --cor-erro:#ef4444;--cor-erro-bg:#fef2f2;--cor-erro-borda:#fca5a5;
    --cor-alerta:#f59e0b;--cor-alerta-bg:#fffbeb;--cor-alerta-borda:#fcd34d;
    --cor-info:#3b82f6;--cor-info-bg:#eff6ff;--cor-info-borda:#93c5fd;

    /* ---- Interface ---- */
    --cor-primaria:#2563eb;--cor-primaria-hover:#1d4ed8;--cor-primaria-light:#dbeafe;
    --cor-fundo:#f8fafc;--cor-fundo-card:#ffffff;--cor-fundo-sidebar:#0f172a;
    --cor-texto:#0f172a;--cor-texto-claro:#64748b;--cor-texto-sidebar:#cbd5e1;
    --cor-borda:#e2e8f0;--cor-borda-sutil:#f1f5f9;--cor-borda-focus:#2563eb;

    /* ---- Tipografia ---- */
    --fonte-principal:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,sans-serif;
    --fonte-mono:'JetBrains Mono','Fira Code',monospace;

    /* ---- Espaçamentos ---- */
    --espaco-xs:0.25rem;--espaco-sm:0.5rem;--espaco-md:1rem;--espaco-lg:1.5rem;--espaco-xl:2rem;--espaco-2xl:3rem;

    /* ---- Bordas (mobile) ---- */
    --raio-sm:6px;--raio-md:10px;--raio-lg:12px;--raio-xl:16px;--raio-full:9999px;

    /* ---- Sombras ---- */
    --sombra-sm:0 1px 2px rgba(0,0,0,0.04);--sombra-md:0 4px 12px rgba(0,0,0,0.06);
    --sombra-lg:0 12px 40px rgba(0,0,0,0.1);--sombra-xl:0 20px 25px -5px rgba(0,0,0,0.1);

    /* ---- Layout ---- */
    --sidebar-largura:260px;--header-altura:64px;--touch-target:44px;
    --transicao:all 0.2s ease;
}

@media (min-width:769px) {
    :root { --raio-sm:8px;--raio-md:12px;--raio-lg:16px;--raio-xl:24px; }
}

/* === RESET === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
*{touch-action:manipulation}
html,body{overflow-x:hidden;max-width:100vw}
body{font-family:var(--fonte-principal);font-size:14px;line-height:1.6;color:var(--cor-texto);background:var(--cor-fundo);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
@media(min-width:769px){body{font-size:.9375rem}}
a{color:var(--cor-primaria);text-decoration:none;transition:var(--transicao)}
a:hover{color:var(--cor-primaria-hover)}
img{max-width:100%;height:auto}

/* Scrollbar */
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--cor-borda);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--cor-texto-claro)}

/* === LAYOUT (Mobile-First) === */
.app-layout{display:flex;min-height:100vh;max-width:100vw;overflow-x:hidden}

/* Sidebar: escondida no mobile */
.sidebar{width:var(--sidebar-largura);background:var(--cor-fundo-sidebar);color:var(--cor-texto-sidebar);position:fixed;top:0;left:0;height:100vh;height:100dvh;overflow-y:auto;z-index:1050;display:flex;flex-direction:column;transform:translateX(-100%);transition:transform .3s ease}
.sidebar.aberta{transform:translateX(0)}
@media(min-width:993px){.sidebar{transform:translateX(0);z-index:1000}}

.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:1040}
.sidebar-overlay.visivel{display:block}

.sidebar-logo{padding:var(--espaco-lg);border-bottom:1px solid rgba(255,255,255,0.1);display:flex;align-items:center;gap:var(--espaco-sm)}
.sidebar-logo h1{font-size:1.25rem;color:#fff;font-weight:700}

.sidebar-nav{flex:1;padding:var(--espaco-md)}
.sidebar-nav a{display:flex;align-items:center;gap:12px;padding:11px 16px;color:rgba(255,255,255,0.7);font-size:14px;font-weight:500;border-radius:var(--raio-md);transition:var(--transicao);min-height:var(--touch-target);cursor:pointer}
.sidebar-nav a:hover{background:rgba(255,255,255,0.08);color:#fff}
.sidebar-nav a.ativo{background:var(--cor-primaria);color:#fff}
.sidebar-nav a i{width:24px;text-align:center;font-size:18px}
.sidebar-secao{padding:var(--espaco-lg) 16px var(--espaco-xs);font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,0.35);font-weight:600}

/* Conteúdo */
.conteudo-principal{flex:1;min-height:100vh;display:flex;flex-direction:column;max-width:100%;min-width:0}
@media(min-width:993px){.conteudo-principal{margin-left:var(--sidebar-largura)}}

/* Header */
.header{height:var(--header-altura);background:var(--cor-fundo-card);border-bottom:1px solid var(--cor-borda);display:flex;align-items:center;justify-content:space-between;padding:0 var(--espaco-md);position:sticky;top:0;z-index:500}
@media(min-width:769px){.header{padding:0 var(--espaco-xl)}}
.header-esquerda{display:flex;align-items:center;gap:var(--espaco-md)}
.header-titulo{font-size:1rem;font-weight:600}
@media(min-width:769px){.header-titulo{font-size:1.125rem}}
.header-direita{display:flex;align-items:center;gap:var(--espaco-lg)}

.btn-menu-mobile{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--cor-texto);min-width:var(--touch-target);min-height:var(--touch-target);display:flex;align-items:center;justify-content:center}
@media(min-width:993px){.btn-menu-mobile{display:none}}

.pagina-conteudo{padding:var(--espaco-md);flex:1;padding-bottom:calc(80px + env(safe-area-inset-bottom, 0px))}
@media(min-width:769px){.pagina-conteudo{padding:24px 32px}}

/* === CARDS === */
.card{background:var(--cor-fundo-card);border:1px solid var(--cor-borda-sutil);border-radius:var(--raio-lg);padding:var(--espaco-md);box-shadow:var(--sombra-sm)}
@media(min-width:769px){.card{padding:var(--espaco-lg)}}

.card-cabecalho{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--espaco-md);padding-bottom:var(--espaco-md);border-bottom:1px solid var(--cor-borda-sutil)}
@media(min-width:769px){.card-cabecalho{margin-bottom:var(--espaco-lg)}}
.card-cabecalho h2{font-size:1rem;font-weight:600}

.cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:var(--espaco-lg)}
@media(min-width:769px){.cards-grid{gap:20px;margin-bottom:var(--espaco-xl)}}
@media(min-width:1200px){.cards-grid{grid-template-columns:repeat(4,1fr)}}

.card-indicador{background:var(--cor-fundo-card);border:1px solid var(--cor-borda-sutil);border-radius:var(--raio-lg);padding:var(--espaco-md);box-shadow:var(--sombra-sm)}
@media(min-width:769px){.card-indicador{padding:var(--espaco-lg)}}
.card-indicador-label{font-size:.75rem;color:var(--cor-texto-claro);margin-bottom:var(--espaco-xs);text-transform:uppercase;letter-spacing:.03em}
.card-indicador-valor{font-size:1.5rem;font-weight:700;color:var(--cor-texto)}
@media(min-width:769px){.card-indicador-valor{font-size:1.75rem}}

/* === BOTÕES === */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--espaco-sm);padding:.5rem 1rem;font-size:.875rem;font-weight:500;border-radius:var(--raio-md);border:1px solid transparent;cursor:pointer;transition:var(--transicao);font-family:var(--fonte-principal);line-height:1.5;white-space:nowrap;min-height:var(--touch-target)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primario{background:var(--cor-primaria);color:#fff;border-color:var(--cor-primaria)}
.btn-secundario{background:#fff;color:var(--cor-texto);border-color:var(--cor-borda)}
.btn-perigo{background:var(--cor-erro);color:#fff;border-color:var(--cor-erro)}
.btn-sucesso{background:var(--cor-sucesso);color:#fff;border-color:var(--cor-sucesso)}
.btn-sm{padding:.25rem .75rem;font-size:.8rem;min-height:36px}
.btn-lg{padding:.75rem 1.5rem;font-size:1rem}
.btn-grupo{display:flex;gap:var(--espaco-sm);flex-wrap:wrap}

@media(hover:hover){
    .btn-primario:hover:not(:disabled){background:var(--cor-primaria-hover)}
    .btn-secundario:hover:not(:disabled){background:var(--cor-fundo)}
    .btn-perigo:hover:not(:disabled){background:#dc2626}
    .btn-sucesso:hover:not(:disabled){background:#16a34a}
}
@media(hover:none){
    .btn:active:not(:disabled){transform:scale(.97);opacity:.9}
}

/* === FORMULÁRIOS === */
.form-grupo{margin-bottom:var(--espaco-lg)}
.form-label{display:block;margin-bottom:var(--espaco-xs);font-size:.875rem;font-weight:500;color:var(--cor-texto)}
.form-label .obrigatorio{color:var(--cor-erro);margin-left:2px}

.form-input,.form-select,.form-textarea{width:100%;padding:.625rem .75rem;font-size:16px;font-family:var(--fonte-principal);border:1px solid var(--cor-borda);border-radius:var(--raio-md);background:#fff;color:var(--cor-texto);transition:var(--transicao);line-height:1.5;min-height:var(--touch-target)}
@media(min-width:769px){.form-input,.form-select,.form-textarea{font-size:.9375rem;padding:.5rem .75rem}}

.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--cor-borda-focus);box-shadow:0 0 0 3px var(--cor-primaria-light)}
.form-input.erro,.form-select.erro,.form-textarea.erro{border-color:var(--cor-erro);box-shadow:0 0 0 3px var(--cor-erro-bg)}
.form-erro{display:none;font-size:.8rem;color:var(--cor-erro);margin-top:var(--espaco-xs);align-items:center;gap:var(--espaco-xs)}
.form-erro.visivel{display:flex}
.form-textarea{min-height:100px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr;gap:0}
@media(min-width:769px){.form-row{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--espaco-md)}}

/* === TABELAS === */
.tabela-container{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tabela{width:100%;border-collapse:collapse;font-size:13px;min-width:600px}
@media(min-width:769px){.tabela{font-size:.875rem;min-width:unset}}
.tabela thead{background:var(--cor-fundo)}
.tabela th{padding:10px 8px;text-align:left;font-weight:600;color:var(--cor-texto-claro);font-size:.75rem;text-transform:uppercase;letter-spacing:.03em;border-bottom:2px solid var(--cor-borda);white-space:nowrap}
.tabela td{padding:10px 8px;border-bottom:1px solid var(--cor-borda-sutil);color:var(--cor-texto)}
@media(min-width:769px){.tabela th,.tabela td{padding:.75rem 1rem}}
.tabela tbody tr{transition:var(--transicao)}
@media(hover:hover){.tabela tbody tr:hover{background:var(--cor-fundo)}}
.tabela-acoes{display:flex;gap:var(--espaco-xs)}

.tabela-toolbar{display:flex;flex-direction:column;gap:var(--espaco-sm);margin-bottom:var(--espaco-md)}
@media(min-width:769px){.tabela-toolbar{flex-direction:row;align-items:center;justify-content:space-between;gap:var(--espaco-md);margin-bottom:var(--espaco-lg)}}

.tabela-busca{position:relative;width:100%}
@media(min-width:769px){.tabela-busca{min-width:280px;width:auto}}
.tabela-busca input{width:100%;padding:.5rem .75rem .5rem 2.25rem;border:1px solid var(--cor-borda);border-radius:var(--raio-md);font-size:16px;font-family:var(--fonte-principal);min-height:var(--touch-target)}
@media(min-width:769px){.tabela-busca input{font-size:.875rem}}
.tabela-busca input:focus{outline:none;border-color:var(--cor-borda-focus);box-shadow:0 0 0 3px var(--cor-primaria-light)}
.tabela-busca i{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);color:var(--cor-texto-claro)}

.paginacao{display:flex;flex-direction:column;align-items:center;gap:var(--espaco-md);padding-top:var(--espaco-lg);font-size:.875rem;color:var(--cor-texto-claro);text-align:center}
@media(min-width:769px){.paginacao{flex-direction:row;justify-content:space-between;text-align:left}}
.paginacao-botoes{display:flex;gap:var(--espaco-xs)}
.paginacao-btn{padding:.375rem .75rem;border:1px solid var(--cor-borda);border-radius:var(--raio-md);background:#fff;cursor:pointer;font-size:.8rem;transition:var(--transicao);min-height:36px;font-family:var(--fonte-principal)}
@media(hover:hover){.paginacao-btn:hover:not(:disabled){background:var(--cor-fundo)}}
.paginacao-btn.ativo{background:var(--cor-primaria);color:#fff;border-color:var(--cor-primaria)}
.paginacao-btn:disabled{opacity:.4;cursor:not-allowed}

/* === BADGES === */
.badge{display:inline-flex;align-items:center;padding:.15rem .6rem;font-size:.75rem;font-weight:600;border-radius:var(--raio-full);white-space:nowrap}
.badge-sucesso{background:var(--cor-sucesso-bg);color:#15803d;border:1px solid var(--cor-sucesso-borda)}
.badge-erro{background:var(--cor-erro-bg);color:#b91c1c;border:1px solid var(--cor-erro-borda)}
.badge-alerta{background:var(--cor-alerta-bg);color:#b45309;border:1px solid var(--cor-alerta-borda)}
.badge-info{background:var(--cor-info-bg);color:#1d4ed8;border:1px solid var(--cor-info-borda)}
.badge-neutro{background:var(--cor-fundo);color:var(--cor-texto-claro);border:1px solid var(--cor-borda)}

/* === EMPTY STATE === */
.empty-state{text-align:center;padding:var(--espaco-xl) var(--espaco-md);color:var(--cor-texto-claro)}
@media(min-width:769px){.empty-state{padding:var(--espaco-2xl) var(--espaco-xl)}}
.empty-state-icone{font-size:2.5rem;margin-bottom:var(--espaco-md);opacity:.4}
@media(min-width:769px){.empty-state-icone{font-size:3rem}}
.empty-state-titulo{font-size:1rem;font-weight:600;color:var(--cor-texto);margin-bottom:var(--espaco-sm)}
@media(min-width:769px){.empty-state-titulo{font-size:1.125rem}}
.empty-state-descricao{font-size:.875rem;margin-bottom:var(--espaco-lg);max-width:400px;margin-left:auto;margin-right:auto}

/* === LOADING === */
.loading-spinner{display:inline-block;width:24px;height:24px;border:3px solid var(--cor-borda);border-top-color:var(--cor-primaria);border-radius:50%;animation:spin .6s linear infinite}
.loading-spinner.lg{width:40px;height:40px;border-width:4px}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(255,255,255,0.7);display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;pointer-events:none;transition:opacity .2s}
.loading-overlay.visivel{opacity:1;pointer-events:all}
.skeleton{background:linear-gradient(90deg,var(--cor-borda) 25%,#f1f5f9 50%,var(--cor-borda) 75%);background-size:200% 100%;animation:skeleton-pulse 1.5s infinite;border-radius:var(--raio-md)}
.skeleton-texto{height:1rem;margin-bottom:var(--espaco-sm)}
.skeleton-titulo{height:1.5rem;width:60%;margin-bottom:var(--espaco-md)}
.skeleton-avatar{width:40px;height:40px;border-radius:50%}
@keyframes skeleton-pulse{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* === TOASTS === */
.toast-container{position:fixed;top:var(--espaco-md);left:var(--espaco-md);right:var(--espaco-md);z-index:10000;display:flex;flex-direction:column;gap:var(--espaco-sm);pointer-events:none}
@media(min-width:769px){.toast-container{top:var(--espaco-lg);left:auto;right:var(--espaco-lg);max-width:420px;width:100%}}
.toast{display:flex;align-items:flex-start;gap:var(--espaco-sm);padding:var(--espaco-md) var(--espaco-lg);border-radius:var(--raio-lg);box-shadow:var(--sombra-lg);transform:translateX(120%);transition:transform .35s cubic-bezier(.21,1.02,.73,1);pointer-events:all;font-size:.875rem;line-height:1.5;border-left:4px solid}
.toast.visivel{transform:translateX(0)}
.toast.saindo{transform:translateX(120%);transition:transform .25s ease-in}
.toast-sucesso{background:var(--cor-sucesso-bg);border-left-color:var(--cor-sucesso);color:#15803d}
.toast-erro{background:var(--cor-erro-bg);border-left-color:var(--cor-erro);color:#b91c1c}
.toast-alerta{background:var(--cor-alerta-bg);border-left-color:var(--cor-alerta);color:#b45309}
.toast-info{background:var(--cor-info-bg);border-left-color:var(--cor-info);color:#1d4ed8}
.toast-icone{font-size:1.125rem;flex-shrink:0;margin-top:1px}
.toast-conteudo{flex:1}
.toast-fechar{background:none;border:none;cursor:pointer;font-size:1.25rem;opacity:.5;transition:var(--transicao);color:inherit;flex-shrink:0;min-width:var(--touch-target);min-height:var(--touch-target);display:flex;align-items:center;justify-content:center;margin:-8px -12px -8px 0}
.toast-fechar:hover{opacity:1}

/* === MODAL === */
.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(15,23,42,0.5);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9000;opacity:0;pointer-events:none;transition:opacity .2s;padding:10px}
.modal-overlay.visivel{opacity:1;pointer-events:all}
.modal{background:var(--cor-fundo-card);border-radius:var(--raio-lg);box-shadow:var(--sombra-xl);width:100%;max-width:520px;max-height:calc(100vh - 20px);overflow-y:auto;transform:scale(.95) translateY(10px);transition:transform .25s cubic-bezier(.21,1.02,.73,1)}
@media(min-width:769px){.modal{border-radius:var(--raio-xl)}}
.modal-overlay.visivel .modal{transform:scale(1) translateY(0)}
.modal-cabecalho{display:flex;align-items:center;justify-content:space-between;padding:var(--espaco-md) var(--espaco-lg);border-bottom:1px solid var(--cor-borda-sutil);position:sticky;top:0;background:inherit;z-index:10;border-radius:var(--raio-lg) var(--raio-lg) 0 0}
@media(min-width:769px){.modal-cabecalho{padding:var(--espaco-lg)}}
.modal-cabecalho h3{font-size:1.125rem;font-weight:600}
.modal-fechar{background:none;border:none;font-size:1.25rem;cursor:pointer;color:var(--cor-texto-claro);transition:var(--transicao);width:var(--touch-target);height:var(--touch-target);display:flex;align-items:center;justify-content:center;border-radius:var(--raio-md)}
@media(hover:hover){.modal-fechar:hover{background:var(--cor-fundo);color:var(--cor-texto)}}
.modal-corpo{padding:var(--espaco-md) var(--espaco-lg)}
@media(min-width:769px){.modal-corpo{padding:var(--espaco-lg)}}
.modal-rodape{display:flex;justify-content:flex-end;gap:var(--espaco-sm);padding:var(--espaco-md) var(--espaco-lg);border-top:1px solid var(--cor-borda-sutil)}
@media(min-width:769px){.modal-rodape{padding:var(--espaco-lg)}}
.modal-confirmacao-icone{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto var(--espaco-md);font-size:1.5rem}
.modal-confirmacao-icone.perigo{background:var(--cor-erro-bg);color:var(--cor-erro)}
.modal-confirmacao-icone.alerta{background:var(--cor-alerta-bg);color:var(--cor-alerta)}
.modal-confirmacao-texto{text-align:center;margin-bottom:var(--espaco-lg)}
.modal-confirmacao-texto h4{font-size:1.125rem;margin-bottom:var(--espaco-sm)}
.modal-confirmacao-texto p{color:var(--cor-texto-claro);font-size:.875rem}

/* === SIDEBAR FOOTER / CARD DO USUÁRIO === */
.sidebar-footer{padding:var(--espaco-md);padding-bottom:calc(var(--espaco-md) + env(safe-area-inset-bottom, 0px));border-top:1px solid rgba(255,255,255,0.1);margin-top:auto}
.sidebar-user{display:flex;align-items:center;gap:12px;padding:8px;border-radius:var(--raio-md);cursor:pointer;transition:var(--transicao);min-height:var(--touch-target)}
@media(hover:hover){.sidebar-user:hover{background:rgba(255,255,255,0.1)}}
@media(hover:none){.sidebar-user:active{background:rgba(255,255,255,0.15)}}
.sidebar-user-avatar{width:40px;height:40px;border-radius:50%;background:var(--cor-primaria);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;color:#fff;flex-shrink:0}
.sidebar-user-info{flex:1;min-width:0}
.sidebar-user-nome{font-weight:500;font-size:.875rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-user-cargo{font-size:.75rem;color:rgba(255,255,255,0.5)}

/* Dropdown do usuário na sidebar */
.sidebar-user-menu{display:none;position:absolute;bottom:calc(100% + 8px);left:var(--espaco-md);right:var(--espaco-md);background:var(--cor-fundo-card);border-radius:var(--raio-lg);box-shadow:var(--sombra-lg);overflow:hidden;z-index:1100}
.sidebar-user-menu.visivel{display:block}
.sidebar-user-menu a{display:flex;align-items:center;gap:var(--espaco-sm);padding:10px 16px;color:var(--cor-texto);font-size:.875rem;transition:var(--transicao);min-height:var(--touch-target)}
@media(hover:hover){.sidebar-user-menu a:hover{background:var(--cor-fundo)}}
.sidebar-user-menu a.perigo{color:var(--cor-erro)}
.sidebar-user-menu-divider{height:1px;background:var(--cor-borda-sutil);margin:4px 0}

/* === AVATAR (genérico) === */
.avatar{width:36px;height:36px;border-radius:50%;background:var(--cor-primaria-light);color:var(--cor-primaria);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;flex-shrink:0}

/* === NOTIFICAÇÕES (SINO NO HEADER) === */
.notif-btn{position:relative;background:none;border:none;cursor:pointer;font-size:1.25rem;color:var(--cor-texto-claro);min-width:var(--touch-target);min-height:var(--touch-target);display:flex;align-items:center;justify-content:center;border-radius:var(--raio-md);transition:var(--transicao)}
@media(hover:hover){.notif-btn:hover{background:var(--cor-fundo);color:var(--cor-texto)}}
.notif-badge{position:absolute;top:4px;right:4px;min-width:18px;height:18px;background:var(--cor-erro);color:#fff;font-size:.6rem;font-weight:700;border-radius:var(--raio-full);display:flex;align-items:center;justify-content:center;padding:0 4px}
.notif-badge:empty{display:none}

.notif-dropdown{display:none;position:absolute;top:calc(var(--header-altura) - 4px);right:var(--espaco-md);width:360px;max-width:calc(100vw - 20px);background:var(--cor-fundo-card);border-radius:var(--raio-lg);box-shadow:var(--sombra-lg);z-index:600;overflow:hidden;max-height:420px}
.notif-dropdown.visivel{display:block}
@media(max-width:768px){.notif-dropdown{position:fixed;top:var(--header-altura);left:0;right:0;width:100vw;max-width:100vw;max-height:calc(100vh - var(--header-altura));border-radius:0}}

.notif-dropdown-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--cor-borda-sutil)}
.notif-dropdown-header h4{font-size:.9rem;font-weight:600;margin:0}
.notif-dropdown-header a{font-size:.8rem;color:var(--cor-primaria)}

.notif-list{overflow-y:auto;max-height:320px}
.notif-item{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;border-bottom:1px solid var(--cor-borda-sutil);transition:var(--transicao);cursor:pointer;text-decoration:none;color:var(--cor-texto)}
.notif-item.nao-lida{background:var(--cor-info-bg)}
@media(hover:hover){.notif-item:hover{background:var(--cor-fundo)}}
.notif-item-icone{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;flex-shrink:0}
.notif-item-icone.info{background:var(--cor-info-bg);color:var(--cor-info)}
.notif-item-icone.sucesso{background:var(--cor-sucesso-bg);color:var(--cor-sucesso)}
.notif-item-icone.alerta{background:var(--cor-alerta-bg);color:var(--cor-alerta)}
.notif-item-icone.erro{background:var(--cor-erro-bg);color:var(--cor-erro)}
.notif-item-conteudo{flex:1;min-width:0}
.notif-item-titulo{font-size:.8rem;font-weight:600;margin-bottom:2px}
.notif-item-texto{font-size:.8rem;color:var(--cor-texto-claro);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.notif-item-tempo{font-size:.7rem;color:var(--cor-texto-claro);margin-top:4px}

.notif-dropdown-footer{padding:10px;text-align:center;border-top:1px solid var(--cor-borda-sutil)}
.notif-dropdown-footer a{font-size:.8rem;color:var(--cor-primaria)}

.notif-empty{text-align:center;padding:var(--espaco-xl);color:var(--cor-texto-claro)}
.notif-empty-icone{font-size:2rem;opacity:.3;margin-bottom:var(--espaco-sm)}
.notif-empty p{font-size:.875rem}

/* === UPLOAD PREVIEW === */
.upload-preview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px;margin-top:var(--espaco-sm)}
.upload-preview-item{position:relative;border-radius:var(--raio-md);overflow:hidden;aspect-ratio:1;border:1px solid var(--cor-borda-sutil)}
.upload-preview-item img{width:100%;height:100%;object-fit:cover}
.upload-preview-remove{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;background:var(--cor-erro);color:#fff;border:none;font-size:.7rem;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}
.upload-preview-file{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:8px;text-align:center}
.upload-preview-file-icon{font-size:1.5rem;margin-bottom:4px}
.upload-preview-file-name{font-size:.65rem;color:var(--cor-texto-claro);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}

/* === UTILITÁRIOS === */
.text-sucesso{color:var(--cor-sucesso)!important}.text-erro{color:var(--cor-erro)!important}
.text-alerta{color:var(--cor-alerta)!important}.text-info{color:var(--cor-info)!important}
.text-claro{color:var(--cor-texto-claro)!important}
.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.text-truncate-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mt-1{margin-top:var(--espaco-sm)}.mt-2{margin-top:var(--espaco-md)}.mt-3{margin-top:var(--espaco-lg)}
.mb-1{margin-bottom:var(--espaco-sm)}.mb-2{margin-bottom:var(--espaco-md)}.mb-3{margin-bottom:var(--espaco-lg)}
.flex{display:flex}.flex-center{display:flex;align-items:center;justify-content:center}
.flex-between{display:flex;align-items:center;justify-content:space-between}
.gap-1{gap:var(--espaco-sm)}.gap-2{gap:var(--espaco-md)}
.hidden{display:none!important}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.cursor-pointer{cursor:pointer}

/* === PWA INSTALL === */
.sidebar-install-btn{width:100%;padding:10px 16px;background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.8);border:1px dashed rgba(255,255,255,0.2);border-radius:var(--raio-md);font-size:.8rem;font-weight:500;cursor:pointer;font-family:var(--fonte-principal);transition:var(--transicao);min-height:var(--touch-target);display:flex;align-items:center;justify-content:center;gap:8px}
@media(hover:hover){.sidebar-install-btn:hover{background:rgba(255,255,255,0.15);border-color:rgba(255,255,255,0.3)}}

/* === RESPONSIVO: TABELA DESKTOP / CARDS MOBILE === */
.tabela-desktop{display:none}
.cards-mobile{display:flex;flex-direction:column;gap:12px}
@media(min-width:769px){.tabela-desktop{display:block}.cards-mobile{display:none}}

/* Card genérico para mobile */
.item-card{background:var(--cor-fundo-card);border:1px solid var(--cor-borda-sutil);border-radius:var(--raio-lg);padding:var(--espaco-md)}
.item-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px}
.item-card-titulo{font-weight:600;font-size:.9rem;color:var(--cor-texto)}
.item-card-subtitulo{font-size:.75rem;color:var(--cor-texto-claro);margin-top:2px}
.item-card-meta{display:flex;flex-wrap:wrap;gap:6px;font-size:.75rem;color:var(--cor-texto-claro);margin-bottom:10px;align-items:center}
.item-card-meta span{display:inline-flex;align-items:center;gap:4px}
.item-card-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;align-items:center}
.item-card-acoes{display:flex;gap:8px;border-top:1px solid var(--cor-borda-sutil);padding-top:12px}
.item-card-acoes .btn{flex:1;font-size:.75rem;padding:.375rem .5rem;min-height:38px}

/* Card com avatar */
.item-card-avatar-row{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.item-card-avatar{width:44px;height:44px;border-radius:50%;background:var(--cor-primaria);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;flex-shrink:0}
.item-card-avatar-info{flex:1;min-width:0}
.item-card-avatar-nome{font-weight:600;font-size:.9rem;color:var(--cor-texto)}
.item-card-avatar-email{font-size:.75rem;color:var(--cor-texto-claro);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ColaboradorPicker */
.cpicker-input-row{display:flex;gap:8px;align-items:flex-start}
.cpicker-input-wrap{flex:1;position:relative}
.cpicker-cpf{font-size:1rem!important;letter-spacing:.5px;font-weight:500}
.cpicker-status{font-size:.75rem;margin-top:4px;min-height:18px}
.cpicker-btn-novo{min-width:44px;min-height:44px;font-size:1.2rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cpicker-result{margin-top:8px}
.cpicker-card{display:flex;align-items:center;gap:12px;padding:12px;border:2px solid var(--cor-primaria);border-radius:var(--raio-lg);background:var(--cor-primaria-light)}
.cpicker-card-avatar{width:40px;height:40px;border-radius:50%;background:var(--cor-primaria);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.8rem;flex-shrink:0}
.cpicker-card-info{flex:1;min-width:0}
.cpicker-card-nome{font-weight:600;font-size:.9rem}
.cpicker-card-sub{font-size:.75rem;color:var(--cor-texto-claro);margin-top:2px}
.cpicker-card-limpar{background:none;border:none;color:var(--cor-texto-claro);font-size:1.2rem;cursor:pointer;padding:4px;flex-shrink:0}