/* Compat DaisyUI 4 -> 5: a classe .form-control foi removida no DaisyUI 5, mas o padrão de formulário adotado (modais, filtros) usa esse wrapper assumindo empilhamento vertical (label acima do input/select). Sem essa regra, .form-control vira uma div genérica (display:block) e os filhos (.label e input/select, que o DaisyUI estiliza como inline-flex) só quebram linha quando não cabem lado a lado. */ .form-control { display: flex; flex-direction: column; } /* Tooltip explicativo (ver public/js/help-tooltip.js). Gatilho: elemento com class="js-tooltip-help" + data-tip="texto". Popup fixo no , fora de qualquer ancestral com overflow:hidden que cortaria o tooltip nativo do daisyUI. */ .js-tooltip-help { cursor: help; } #js-tooltip-popup { position: fixed; z-index: 9999; max-width: 18rem; background: var(--color-neutral); color: var(--color-neutral-content); font-size: 0.75rem; line-height: 1.35; font-weight: 400; text-align: left; white-space: pre-wrap; padding: 0.5rem 0.75rem; border-radius: var(--radius-field, 0.5rem); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); pointer-events: none; display: none; } #js-tooltip-popup.show { display: block; } /* Tema Winter — cores derivadas da paleta atual do Metronic (KTAppSettings.colors.theme.base em App/Views/base/base.html), para manter a identidade visual do Transcrify na migração. primary/secondary/accent/success/ warning/error são mantidas idênticas entre os temas winter e dark — só o fundo (base-100/200/300) e o texto (base-content) mudam entre claro e escuro. */ [data-theme="winter"] { --color-base-100: oklch(98% 0 0); --color-base-200: oklch(97% 0 0); --color-base-300: oklch(92% 0 0); --color-base-content: oklch(20% 0 0); --color-primary: #000000; --color-primary-content: #ffffff; --color-secondary: #8950FC; --color-secondary-content: #ffffff; --color-accent: #1BC5BD; --color-accent-content: #ffffff; --color-neutral: oklch(26% 0 0); --color-neutral-content: oklch(98% 0 0); --color-info: #8950FC; --color-info-content: #ffffff; --color-success: #1BC5BD; --color-success-content: #ffffff; --color-warning: #FFA800; --color-warning-content: oklch(26% 0.079 36.259); --color-error: #F64E60; --color-error-content: #ffffff; --radius-selector: 1rem; --radius-field: 0.5rem; --radius-box: 1rem; --size-selector: 0.25rem; --size-field: 0.25rem; --border: 1px; --depth: 1; --noise: 0; /* Variáveis DaisyUI equivalentes (compat) */ --b1: var(--color-base-100); --b2: var(--color-base-200); --b3: var(--color-base-300); --bc: var(--color-base-content); --p: var(--color-primary); --pc: var(--color-primary-content); --s: var(--color-secondary); --sc: var(--color-secondary-content); --a: var(--color-accent); --ac: var(--color-accent-content); --n: var(--color-neutral); --nc: var(--color-neutral-content); --in: var(--color-info); --inc: var(--color-info-content); --su: var(--color-success); --suc: var(--color-success-content); --wa: var(--color-warning); --wac: var(--color-warning-content); --er: var(--color-error); --erc: var(--color-error-content); --rounded-box: var(--radius-box); --rounded-btn: var(--radius-field); --rounded-badge: var(--radius-selector); } /* Tema Dark — mesma paleta de marca, fundo/texto invertidos */ [data-theme="dark"] { default: false; prefersdark: true; color-scheme: "dark"; --color-base-100: oklch(15% 0.02 264); --color-base-200: oklch(20% 0.02 264); --color-base-300: oklch(27% 0.02 264); --color-base-content: oklch(96% 0.007 247.896); --color-primary: #ffffff; --color-primary-content: #000000; --color-secondary: #8950FC; --color-secondary-content: #ffffff; --color-accent: #1BC5BD; --color-accent-content: #ffffff; --color-neutral: oklch(37% 0.044 257.287); --color-neutral-content: oklch(98% 0.003 247.858); --color-info: #8950FC; --color-info-content: #ffffff; --color-success: #1BC5BD; --color-success-content: #ffffff; --color-warning: #FFA800; --color-warning-content: oklch(26% 0.079 36.259); --color-error: #F64E60; --color-error-content: #ffffff; --radius-selector: 1rem; --radius-field: 0.5rem; --radius-box: 1rem; --size-selector: 0.25rem; --size-field: 0.25rem; --border: 1px; --depth: 1; --noise: 0; } .glass-effect { backdrop-filter: blur(10px); background: color-mix(in oklch, var(--color-base-100) 80%, transparent); } /* Sidebar sempre escura, independente do tema ativo (mesmo padrão do projeto de referência): evita que o menu "pisque" claro quando o tema geral é winter. */ .drawer-side { --sidebar-bg-200: oklch(20% 0.02 264); --sidebar-bg-300: oklch(27% 0.02 264); --sidebar-text: oklch(96% 0.007 247.896); --sidebar-text-muted: oklch(70% 0.007 247.896); --sidebar-border: oklch(37% 0.044 257.287); } .drawer-side aside { background-color: var(--sidebar-bg-200) !important; border-color: var(--sidebar-border) !important; } .drawer-side .p-4.border-b { border-color: var(--sidebar-border) !important; background-color: var(--sidebar-bg-200) !important; } .drawer-side nav { background-color: var(--sidebar-bg-200) !important; } .drawer-side h3 { color: var(--sidebar-text-muted) !important; } .drawer-side a:hover { background-color: var(--sidebar-bg-300) !important; } .drawer-side .font-medium { color: var(--sidebar-text) !important; } .drawer-side .text-xs:not(.text-white) { color: var(--sidebar-text-muted) !important; } .drawer-side .text-error\/60 { color: color-mix(in oklch, var(--color-error) 60%, transparent) !important; } .drawer-side .btn-close-menu { color: var(--sidebar-text) !important; border-color: var(--sidebar-border) !important; } .drawer-side .btn-close-menu:hover { background-color: var(--sidebar-bg-300) !important; } /* Scrollbar personalizada para a sidebar escura */ .drawer-side nav::-webkit-scrollbar { width: 6px; } .drawer-side nav::-webkit-scrollbar-track { background: var(--sidebar-bg-200) !important; } .drawer-side nav::-webkit-scrollbar-thumb { background: var(--sidebar-text-muted) !important; border-radius: 3px; } .drawer-side nav::-webkit-scrollbar-thumb:hover { background: var(--sidebar-text) !important; } .drawer-side nav { scrollbar-width: thin; scrollbar-color: var(--sidebar-text-muted) var(--sidebar-bg-200); } .drawer-overlay { background-color: rgba(0, 0, 0, 0.5) !important; } /* SweetAlert2 atrás de