/* FONTS */ @import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap'); /* Modules still using custom CSS (not yet migrated to Tailwind) */ @import url("finances/deposit.6233748ede51.css"); @import url("admin_analytics/dashboard_main.f3591ea61a65.css"); @import url("partials/notifications/notification_app.95842b1857fb.css"); @import url("partials/animation/loading_screen.928e4fb53358.css"); @import url("partials/normalize.af862d42c171.css"); @import url("partials/chat/chat_messages.1c94d3f8e386.css"); /* === GLOBAL RESET === */ html, body { min-height: 100%; width: 100%; } /* Evita o flash escuro durante as View Transitions: o background fica no , mas o (root da transição) precisa de cor sólida — senão o backdrop transparente aparece no meio do cross-fade e o navegador o pinta escuro, mesmo no tema claro. Cores acompanham bg-base-offwhite / dark:bg-grey-900. */ html { background-color: #F9F9FD; } html.dark { background-color: #10101C; } /* === DESIGN TOKENS === */ :root { --color-brand-500: #3b82f6; --color-bg-900: #16181D; --color-bg-800: #1D2128; --color-bg-700: #0f172a; --color-bg-600: #313640; --color-text-100: #FFFFFF; --color-success: #30C04F; --color-warning: #FFB84C; --color-error: #FF4C4C; --font-main: "Lato", sans-serif; } /* === CUSTOM SCROLLBAR === */ .kanban-scroll::-webkit-scrollbar { height: 6px; } .kanban-scroll::-webkit-scrollbar-track { background: transparent; } .kanban-scroll::-webkit-scrollbar-thumb { background: #334155; border-radius: 3px; } .kanban-scroll::-webkit-scrollbar-thumb:hover { background: #475569; } /* Firefox */ .kanban-scroll { scrollbar-width: thin; scrollbar-color: #334155 transparent; } @keyframes kanban-shake { 0%, 100% { transform: translateX(0); } 20% { transform: translateX(-8px); } 40% { transform: translateX(8px); } 60% { transform: translateX(-6px); } 80% { transform: translateX(6px); } } .card-rollback { animation: kanban-shake 0.4s ease-in-out; } .filter-scroll::-webkit-scrollbar { width: 4px; } .filter-scroll::-webkit-scrollbar-track { background: transparent; } .filter-scroll::-webkit-scrollbar-thumb { background: #e2e8f0; border-radius: 4px; } .filter-scroll::-webkit-scrollbar-thumb:hover { background: #cbd5e1; } /* Dark mode */ .dark .filter-scroll::-webkit-scrollbar-thumb { background: #334155; } .dark .filter-scroll::-webkit-scrollbar-thumb:hover { background: #475569; } /* Firefox */ .filter-scroll { scrollbar-width: thin; scrollbar-color: #e2e8f0 transparent; } /* Transição suave entre páginas na navegação (View Transitions API, cross-document). Opt-in que ativa o cross-fade automático entre full-page navigations same-origin. Funciona porque a navegação é full-page (sem hx-boost interceptando os cliques). Em navegadores sem suporte, degrada sem efeito (navegação normal). */ @view-transition { navigation: auto; } /* Acessibilidade: respeita "reduzir movimento" nas transições de página (View Transitions) */ @media (prefers-reduced-motion: reduce) { ::view-transition-group(*), ::view-transition-old(root), ::view-transition-new(root) { animation: none !important; } } /* Skeleton de busca ao vivo: troca conteúdo real por skeletons durante a requisição htmx. Genérico: o container indicador (hx-indicator) ganha .htmx-request e alterna os filhos diretos. */ .search-skeleton { display: none; } .htmx-request > .search-skeleton { display: block; } .htmx-request > .search-real { display: none; }