/* ============================================================ FLUXUS ERP — SHELL OFICIAL ÚNICA CAMADA VISUAL DO LAYOUT PRINCIPAL Sidebar + Marca + Menu + Header + Workspace ============================================================ */ /* ============================================================ SISTEMA ============================================================ */ #shell.fx-system{ --fx-sidebar:272px; --fx-header:70px; --fx-tabs:36px; --fx-status:30px; --fx-petrol-950:#041e2d; --fx-petrol-900:#052b3d; --fx-petrol-850:#06394b; --fx-petrol-800:#064b5d; --fx-cyan:#18cdd1; --fx-cyan-dark:#0b9eb8; --fx-cyan-soft:#6acfd3; --fx-navy:#09284d; --fx-text:#183c5a; --fx-muted:#718ba0; --fx-white:#ffffff; --fx-page:#f4f8fb; --fx-border:#dae7ee; --fx-border-soft:#e7eff3; display:grid; grid-template-columns: var(--fx-sidebar) minmax(0,1fr) !important; grid-template-rows: var(--fx-header) var(--fx-tabs) minmax(0,1fr) var(--fx-status) !important; width:100vw !important; height:100vh !important; /* IMPORTANTE: não colapsar a sidebar só porque o DevTools reduziu o viewport para 544px. */ min-width:1100px !important; min-height:600px !important; margin:0 !important; padding:0 !important; overflow:hidden !important; background:var(--fx-page) !important; color:var(--fx-text) !important; } #shell.fx-system .fx-chrome{ display:contents !important; } /* ============================================================ SIDEBAR ============================================================ */ #shell.fx-system #fx-menu.fx-menu{ grid-column:1 !important; grid-row:1 / 5 !important; position:relative !important; z-index:70 !important; isolation:isolate !important; display:flex !important; flex-direction:column !important; align-items:stretch !important; justify-content:flex-start !important; width:272px !important; min-width:272px !important; max-width:272px !important; height:100vh !important; min-height:600px !important; top:auto !important; left:auto !important; margin:0 !important; padding: 111px 18px 28px !important; gap:2px !important; overflow-x:hidden !important; overflow-y:auto !important; border:0 !important; border-right: 1px solid rgba(67,190,202,.16) !important; background: radial-gradient( 260px 190px at -12% -4%, rgba(22,208,199,.16), transparent 72% ), radial-gradient( 330px 430px at 120% 63%, rgba(7,141,171,.16), transparent 72% ), linear-gradient( 160deg, var(--fx-petrol-950) 0%, var(--fx-petrol-900) 43%, var(--fx-petrol-850) 73%, var(--fx-petrol-800) 100% ) !important; box-shadow: 8px 0 28px rgba(2,28,42,.10) !important; scrollbar-width:thin !important; scrollbar-color: rgba(72,181,194,.32) transparent !important; row-gap:2px !important; } /* ============================================================ MOVIMENTO DA SIDEBAR ============================================================ */ #shell.fx-system #fx-menu.fx-menu::before{ content:"" !important; position:absolute !important; z-index:-2 !important; left:0 !important; right:0 !important; top:95px !important; bottom:0 !important; display:block !important; pointer-events:none !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='430' height='900' viewBox='0 0 430 900'%3E%3Cpath d='M-110 190 C45 70 205 105 470 18' fill='none' stroke='%2318cdd1' stroke-opacity='.22' stroke-width='1.3'/%3E%3Cpath d='M-125 310 C45 175 210 215 480 110' fill='none' stroke='%230b9eb8' stroke-opacity='.20' stroke-width='1.1'/%3E%3Cpath d='M-120 455 C60 295 225 345 500 230' fill='none' stroke='%2318cdd1' stroke-opacity='.39' stroke-width='1.8'/%3E%3Cpath d='M-100 505 C75 345 240 390 500 275' fill='none' stroke='%236acfd3' stroke-opacity='.15' stroke-width='1'/%3E%3Cpath d='M-100 675 C85 515 250 575 500 460' fill='none' stroke='%2318cdd1' stroke-opacity='.32' stroke-width='1.7'/%3E%3Cpath d='M-70 765 C120 600 270 650 505 545' fill='none' stroke='%230b9eb8' stroke-opacity='.21' stroke-width='1.2'/%3E%3C/svg%3E") !important; background-repeat:no-repeat !important; background-position:center bottom !important; background-size:cover !important; opacity:.90 !important; filter:none !important; } #shell.fx-system #fx-menu.fx-menu::after{ content:"" !important; position:absolute !important; z-index:-3 !important; inset:0 !important; display:block !important; pointer-events:none !important; background: linear-gradient( 180deg, rgba(0,18,29,.06), transparent 23%, transparent 79%, rgba(1,24,36,.13) ) !important; } /* ============================================================ MARCA ============================================================ */ #shell.fx-system .fx-sidebar-brand{ position:absolute !important; z-index:10 !important; left:20px !important; right:18px !important; top:17px !important; display:grid !important; grid-template-columns: 45px minmax(0,1fr) !important; grid-template-rows: 28px 14px !important; column-gap:12px !important; align-items:center !important; align-content:center !important; height:67px !important; margin:0 !important; padding:0 0 14px !important; border:0 !important; border-bottom: 1px solid rgba(81,196,205,.18) !important; background:transparent !important; pointer-events:none !important; } #shell.fx-system .fx-sidebar-brand__mark{ grid-column:1 !important; grid-row:1 / 3 !important; display:grid !important; place-items:center !important; width:44px !important; height:44px !important; margin:0 !important; padding:0 !important; border: 1px solid rgba(84,230,224,.38) !important; border-radius:10px !important; background: linear-gradient( 145deg, #18d1c5 0%, #08aab7 52%, #087b9e 100% ) !important; color:#fff !important; font-size:19px !important; font-weight:800 !important; line-height:1 !important; box-shadow: 0 9px 22px rgba(0,18,29,.26), inset 0 1px 0 rgba(255,255,255,.23) !important; } #shell.fx-system .fx-sidebar-brand__name{ grid-column:2 !important; grid-row:1 !important; align-self:end !important; color:#fff !important; font-size:25px !important; font-weight:760 !important; line-height:1 !important; letter-spacing:-.04em !important; text-shadow: 0 2px 8px rgba(0,0,0,.17) !important; } #shell.fx-system .fx-sidebar-brand__sub{ grid-column:2 !important; grid-row:2 !important; align-self:start !important; margin-top:3px !important; color:var(--fx-cyan-soft) !important; font-size:7.5px !important; font-weight:750 !important; line-height:1 !important; letter-spacing:.18em !important; } /* ============================================================ SEÇÃO PRINCIPAL ============================================================ */ #shell.fx-system .fx-sidebar-section{ position:relative !important; z-index:5 !important; flex:0 0 18px !important; display:flex !important; align-items:center !important; width:100% !important; height:18px !important; margin:0 0 3px !important; padding:0 10px !important; color:#68cbd0 !important; font-size:8px !important; font-weight:750 !important; line-height:1 !important; letter-spacing:.18em !important; white-space:nowrap !important; } #shell.fx-system .fx-sidebar-section::after{ content:"" !important; flex:1 1 auto !important; height:1px !important; margin-left:12px !important; background: linear-gradient( 90deg, rgba(76,198,207,.26), rgba(76,198,207,.025) ) !important; } /* ============================================================ ELIMINA DECORAÇÕES ANTIGAS DOS BOTÕES ============================================================ */ #shell.fx-system #fx-menu.fx-menu > button::before, #shell.fx-system #fx-menu.fx-menu > button::after{ content:none !important; display:none !important; } /* ============================================================ MENU ============================================================ */ #shell.fx-system #fx-menu.fx-menu > button{ position:relative !important; z-index:5 !important; flex:0 0 48px !important; display:grid !important; grid-template-columns: 36px minmax(0,1fr) !important; align-items:center !important; width:100% !important; height:48px !important; min-height:40px !important; max-height:48px !important; column-gap:13px !important; margin:0 !important; padding:3px 10px !important; overflow:hidden !important; border: 1px solid transparent !important; border-radius:9px !important; background: transparent !important; color:#edf6f8 !important; font-family:inherit !important; font-size:13.5px !important; font-weight:520 !important; line-height:1 !important; text-align:left !important; white-space:nowrap !important; box-shadow:none !important; transform:none !important; transition: background .15s ease, border-color .15s ease, color .15s ease !important; } #shell.fx-system #fx-menu.fx-menu > button:hover{ background: rgba(8,112,144,.25) !important; border-color: rgba(62,193,204,.13) !important; color:#fff !important; } /* ativo */ #shell.fx-system #fx-menu.fx-menu > button.is-ui-active{ background: linear-gradient( 90deg, rgba(7,136,173,.80), rgba(5,92,133,.50) ) !important; border-color: rgba(51,202,212,.30) !important; color:#fff !important; font-weight:650 !important; box-shadow: inset 4px 0 0 #18d7dc, 0 5px 15px rgba(0,23,36,.09) !important; } /* ============================================================ ÍCONES ============================================================ */ #shell.fx-system #fx-menu.fx-menu > button > span[data-icon]{ display:grid !important; place-items:center !important; width:34px !important; height:34px !important; min-width:36px !important; min-height:36px !important; margin:0 !important; padding:0 !important; border: 1px solid rgba(60,193,204,.11) !important; border-radius:9px !important; background: linear-gradient( 145deg, rgba(8,137,159,.80), rgba(4,101,131,.75) ) !important; color:#f8ffff !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 3px 9px rgba(0,20,31,.08) !important; } #shell.fx-system #fx-menu.fx-menu > button.is-ui-active > span[data-icon]{ background: linear-gradient( 145deg, #0da4b9, #087b9d ) !important; border-color: rgba(67,219,221,.19) !important; } #shell.fx-system #fx-menu.fx-menu .ui-svg{ display:block !important; width:19px !important; height:19px !important; margin:0 !important; padding:0 !important; fill:none !important; stroke:currentColor !important; stroke-width:1.9 !important; stroke-linecap:round !important; stroke-linejoin:round !important; } /* ============================================================ BUSCA ============================================================ */ #shell.fx-system #fx-menu.fx-menu .fx-search{ position:relative !important; z-index:5 !important; flex:0 0 auto !important; display:flex !important; flex-direction:column !important; width:100% !important; margin: 16px 0 0 !important; padding: 31px 0 0 !important; gap:7px !important; border:0 !important; border-top: 1px solid rgba(89,194,203,.15) !important; background:transparent !important; } #shell.fx-system #fx-menu.fx-menu .fx-search::before{ content:"UTILITÁRIOS" !important; position:absolute !important; left:10px !important; top:10px !important; color:#67c9cf !important; font-size:8px !important; font-weight:750 !important; line-height:1 !important; letter-spacing:.17em !important; } #shell.fx-system #fx-menu.fx-menu .fx-search > span{ display:none !important; } #shell.fx-system #fx-menu.fx-menu .fx-search input{ width:100% !important; height:40px !important; margin:0 !important; padding: 0 36px 0 13px !important; border: 1px solid rgba(53,184,198,.28) !important; border-radius:9px !important; outline:0 !important; background: rgba(2,33,49,.45) !important; color:#fff !important; font-size:11px !important; box-shadow:none !important; } #shell.fx-system #fx-menu.fx-menu .fx-search input::placeholder{ color:#7fa5b1 !important; } #shell.fx-system #fx-menu.fx-menu .fx-search b{ position:absolute !important; right:13px !important; bottom:11px !important; color:#77cfd4 !important; font-size:14px !important; } /* ============================================================ HEADER ============================================================ */ #shell.fx-system .fx-topbar{ grid-column:2 !important; grid-row:1 !important; position:relative !important; z-index:20 !important; display:grid !important; grid-template-columns: minmax(190px,.70fr) minmax(570px,1.30fr) !important; align-items:center !important; width:100% !important; min-width:0 !important; height:70px !important; min-height:70px !important; margin:0 !important; padding: 0 22px !important; overflow:hidden !important; border:0 !important; border-bottom: 1px solid #d9e5ec !important; background:#fff !important; color:var(--fx-navy) !important; box-shadow: 0 2px 11px rgba(15,55,76,.035) !important; } #shell.fx-system .fx-topbar::before, #shell.fx-system .fx-topbar::after{ content:none !important; display:none !important; } /* produto */ #shell.fx-system .fx-product{ display:flex !important; align-items:center !important; justify-content:flex-start !important; width:auto !important; height:70px !important; min-width:0 !important; gap:10px !important; margin:0 !important; padding:0 !important; border:0 !important; background:transparent !important; } #shell.fx-system .fx-product::before, #shell.fx-system .fx-product::after{ content:none !important; display:none !important; } #shell.fx-system .fx-brand-logo, #shell.fx-system .fx-brand-logo--pessoal{ flex:0 0 38px !important; display:grid !important; place-items:center !important; width:38px !important; height:38px !important; margin:0 !important; border:0 !important; border-radius:9px !important; background: linear-gradient( 145deg, #15cec4, #0789aa ) !important; color:#fff !important; font-size:15px !important; font-weight:760 !important; } #shell.fx-system .fx-brand-copy{ display:flex !important; flex-direction:column !important; align-items:flex-start !important; justify-content:center !important; gap:4px !important; } #shell.fx-system .fx-brand-copy > strong{ color:var(--fx-navy) !important; font-size:14px !important; font-weight:750 !important; line-height:1 !important; } #shell.fx-system .fx-brand-copy > span{ color:#7a91a5 !important; font-size:7.5px !important; font-weight:500 !important; line-height:1 !important; } /* GSD / CSC */ #shell.fx-system .fx-institution{ display:none !important; } /* ============================================================ HEADER DIREITO ============================================================ */ #shell.fx-system .fx-user{ display:flex !important; align-items:center !important; justify-content:flex-end !important; width:100% !important; height:70px !important; min-width:0 !important; gap:10px !important; margin:0 !important; padding:0 !important; background:transparent !important; } /* usuário: remove duplicações antigas */ #shell.fx-system .fx-current-user::before, #shell.fx-system .fx-current-user::after{ content:none !important; display:none !important; } /* ============================================================ TABS ============================================================ */ #shell.fx-system .fx-tabs-shell{ grid-column:2 !important; grid-row:2 !important; width:100% !important; height:36px !important; min-width:0 !important; margin:0 !important; border:0 !important; border-bottom: 1px solid #dce8ee !important; background:#fff !important; box-shadow:none !important; } /* ============================================================ WORKSPACE ============================================================ */ #shell.fx-system .fx-workspace{ grid-column:2 !important; grid-row:3 !important; position:relative !important; display:grid !important; grid-template-columns: minmax(0,1fr) auto !important; width:100% !important; height:100% !important; min-width:0 !important; min-height:0 !important; gap:12px !important; margin:0 !important; padding: 18px 20px !important; overflow:auto !important; background: radial-gradient( 620px 280px at 100% 0%, rgba(211,240,246,.31), transparent 72% ), linear-gradient( 180deg, #f7fafc, #f2f7fa ) !important; filter:none !important; backdrop-filter:none !important; } /* ============================================================ MAIN ============================================================ */ #shell.fx-system .fx-main{ display:flex !important; flex-direction:column !important; width:100% !important; min-width:0 !important; min-height:0 !important; margin:0 !important; padding:0 !important; overflow:auto !important; border: 1px solid var(--fx-border) !important; border-radius:12px !important; background:#fff !important; box-shadow: 0 8px 25px rgba(15,55,78,.045) !important; filter:none !important; backdrop-filter:none !important; } /* ============================================================ CONTEXTO ============================================================ */ #shell.fx-system .fx-context{ flex:0 0 50px !important; display:flex !important; align-items:center !important; min-height:50px !important; gap:12px !important; padding: 0 18px !important; border:0 !important; border-bottom: 1px solid var(--fx-border-soft) !important; background:#fff !important; } #shell.fx-system #fx-screen-label{ color:var(--fx-navy) !important; font-size:14px !important; font-weight:750 !important; } #shell.fx-system .fx-context-user{ margin-left:auto !important; color:#7c93a6 !important; font-size:8px !important; } /* ============================================================ CONTEÚDO ============================================================ */ #shell.fx-system #content{ flex:1 1 auto !important; min-width:0 !important; min-height:0 !important; padding:20px !important; background:#fff !important; filter:none !important; backdrop-filter:none !important; } /* ============================================================ STATUS ============================================================ */ #shell.fx-system > .fx-status{ grid-column:2 !important; grid-row:4 !important; display:flex !important; align-items:center !important; width:100% !important; height:30px !important; padding: 0 15px !important; border:0 !important; border-top: 1px solid #e0eaf0 !important; background:#fff !important; color:#7890a3 !important; font-size:8px !important; } /* ============================================================ NÃO EXISTE COLAPSO AUTOMÁTICO NO DESKTOP ============================================================ */ /* Deliberadamente sem @media que reduza o menu para 76px. O DevTools pode ficar com 544px e a sidebar continuará com a proporção desktop aprovada. */ /* === SIDEBAR BRAND SUBSTITUTE START === */ /* MARCA OFICIAL DA SIDEBAR Substituição do bloco anterior. Sem sobreposição. */ #shell.fx-system #fx-menu.fx-menu{ padding:18px 18px 28px !important; } /* BLOCO DA MARCA EM FLUXO NORMAL */ #shell.fx-system .fx-sidebar-brand{ position:relative !important; inset:auto !important; top:auto !important; right:auto !important; bottom:auto !important; left:auto !important; display:flex !important; flex-direction:column !important; align-items:flex-start !important; justify-content:center !important; width:100% !important; min-height:64px !important; height:auto !important; margin:0 0 13px !important; /* Mesma coluna visual de PRINCIPAL e dos títulos do menu. */ padding:0 10px 15px !important; box-sizing:border-box !important; border:0 !important; border-bottom: 1px solid rgba(81,196,205,.18) !important; background:transparent !important; box-shadow:none !important; pointer-events:none !important; } /* NÃO EXISTE MAIS QUADRADO F */ #shell.fx-system .fx-sidebar-brand__mark{ display:none !important; } /* FLUXUS — DESTAQUE PRINCIPAL */ #shell.fx-system .fx-sidebar-brand__name{ display:block !important; width:100% !important; margin:0 !important; padding:0 !important; color:#ffffff !important; font-family:inherit !important; font-size:26px !important; font-weight:800 !important; line-height:1 !important; letter-spacing:-.045em !important; text-align:left !important; text-shadow: 0 2px 9px rgba(0,0,0,.21), 0 0 14px rgba(24,205,209,.04) !important; } /* PESSOAL • ERP — REMOVIDO */ #shell.fx-system .fx-sidebar-brand__sub{ display:none !important; } /* VERSÃO */ #shell.fx-system .fx-sidebar-brand__version{ display:block !important; width:100% !important; margin:7px 0 0 !important; padding:0 !important; color:#b9d0d7 !important; font-family:inherit !important; font-size:9px !important; font-weight:520 !important; line-height:1 !important; letter-spacing:.01em !important; text-align:left !important; } /* PRINCIPAL VEM LOGO ABAIXO */ #shell.fx-system .fx-sidebar-section{ margin-top:0 !important; } /* === SIDEBAR BRAND SUBSTITUTE END === */ /* === MENU TREE PRESENTATION START === */ /* ============================================================ ÁRVORE VERTICAL DO MENU O #fx-cascade continua em seu local funcional original. Ele NÃO é movido no DOM. Quando aberto, aparece visualmente no espaço reservado abaixo do módulo principal. ============================================================ */ /* ------------------------------------------------------------ O botão aberto reserva espaço REAL para sua árvore ------------------------------------------------------------ */ #shell.fx-system #fx-menu.fx-menu > button.fx-tree-host { margin-bottom: var(--fx-tree-space, 0px) !important; } /* ------------------------------------------------------------ CASCADE ORIGINAL — nova apresentação ------------------------------------------------------------ */ #fx-cascade.fx-tree-menu { position:fixed !important; top: var(--fx-tree-top, 0px) !important; left: var(--fx-tree-left, 0px) !important; right:auto !important; bottom:auto !important; z-index:80 !important; display:block !important; width: var(--fx-tree-width, 210px) !important; min-width:0 !important; max-width:none !important; height:auto !important; min-height:0 !important; max-height:none !important; margin:0 !important; padding: 3px 0 5px 13px !important; box-sizing:border-box !important; overflow:visible !important; border:0 !important; border-left: 1px solid rgba(58,188,192,.28) !important; border-radius:0 !important; background: #072c3a !important; box-shadow:none !important; filter:none !important; backdrop-filter:none !important; transform:none !important; } /* respeita fechamento funcional */ #fx-cascade.fx-tree-menu[hidden] { display:none !important; } /* ------------------------------------------------------------ REMOVE A APARÊNCIA DO POPUP BRANCO ------------------------------------------------------------ */ #fx-cascade.fx-tree-menu > *, #fx-cascade.fx-tree-menu section, #fx-cascade.fx-tree-menu article, #fx-cascade.fx-tree-menu nav, #fx-cascade.fx-tree-menu ul, #fx-cascade.fx-tree-menu ol, #fx-cascade.fx-tree-menu li, #fx-cascade.fx-tree-menu [class*="cascade"] { min-width:0 !important; max-width:100% !important; margin-left:0 !important; margin-right:0 !important; border-color: transparent !important; background: transparent !important; box-shadow:none !important; } /* título duplicado, como "Movimentos" */ #fx-cascade.fx-tree-menu .fx-tree-duplicate-title { display:none !important; } /* ------------------------------------------------------------ ITENS ------------------------------------------------------------ */ #fx-cascade.fx-tree-menu button, #fx-cascade.fx-tree-menu a { position:relative !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; width:100% !important; min-width:0 !important; min-height:34px !important; height:auto !important; gap:9px !important; margin:0 !important; padding: 6px 8px !important; box-sizing:border-box !important; border:0 !important; border-radius:7px !important; background: transparent !important; color: #bed0d8 !important; font-family:inherit !important; font-size:12px !important; font-weight:470 !important; line-height:1.25 !important; text-align:left !important; text-decoration:none !important; white-space:normal !important; box-shadow:none !important; transform:none !important; transition: background .12s ease, color .12s ease !important; } #fx-cascade.fx-tree-menu button:hover, #fx-cascade.fx-tree-menu a:hover { background: rgba(24,75,98,.72) !important; color:#ffffff !important; } /* selecionado */ #fx-cascade.fx-tree-menu button.active, #fx-cascade.fx-tree-menu button.is-active, #fx-cascade.fx-tree-menu a.active, #fx-cascade.fx-tree-menu a.is-active, #fx-cascade.fx-tree-menu [aria-current="page"] { background: rgba(25,72,94,.92) !important; color:#ffffff !important; font-weight:600 !important; } /* ------------------------------------------------------------ ÍCONES ------------------------------------------------------------ */ #fx-cascade.fx-tree-menu span[data-icon] { flex:0 0 24px !important; display:grid !important; place-items:center !important; width:24px !important; height:24px !important; margin:0 !important; border-radius:6px !important; background: rgba(10,79,88,.52) !important; color: #37d3ac !important; } /* ------------------------------------------------------------ NÍVEIS INTERNOS ------------------------------------------------------------ */ #fx-cascade.fx-tree-menu ul, #fx-cascade.fx-tree-menu ol { width:100% !important; margin:0 !important; padding: 0 0 0 13px !important; list-style:none !important; border-left: 1px solid rgba(46,171,178,.16) !important; } /* === MENU TREE PRESENTATION END === */ /* === COMPACT HEADER START === */ /* CABEÇALHO COMPACTO — CENTRALIZAÇÃO VERTICAL REAL Altura total: 60px Sem deslocamentos artificiais top:-2px / top:-3px. Os elementos ficam centralizados pelo próprio layout. */ #shell.fx-system .fx-topbar { height:60px !important; min-height:60px !important; max-height:60px !important; padding-top:0 !important; padding-bottom:0 !important; box-sizing:border-box !important; align-items:center !important; } /* ============================================================ BLOCO FLUXUS PESSOAL Ocupa a altura do cabeçalho e centraliza seu conteúdo. ============================================================ */ #shell.fx-system .fx-topbar .fx-product { height:60px !important; min-height:60px !important; max-height:60px !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; align-self:center !important; margin-top:0 !important; margin-bottom:0 !important; padding-top:0 !important; padding-bottom:0 !important; box-sizing:border-box !important; top:auto !important; bottom:auto !important; transform:none !important; } /* Logo e textos também ficam no eixo central */ #shell.fx-system .fx-topbar .fx-product .fx-brand-logo, #shell.fx-system .fx-topbar .fx-product .fx-brand-copy { align-self:center !important; margin-top:0 !important; margin-bottom:0 !important; top:auto !important; bottom:auto !important; transform:none !important; } /* ============================================================ ÁREA DIREITA DO CABEÇALHO Centraliza seus controles na mesma altura. ============================================================ */ #shell.fx-system .fx-topbar .fx-user { height:60px !important; min-height:60px !important; max-height:60px !important; display:flex !important; align-items:center !important; align-self:center !important; margin-top:0 !important; margin-bottom:0 !important; padding-top:0 !important; padding-bottom:0 !important; box-sizing:border-box !important; top:auto !important; bottom:auto !important; } /* Demais controles da área direita seguem o mesmo eixo */ #shell.fx-system .fx-topbar .fx-switch-system, #shell.fx-system .fx-topbar .fx-current-user, #shell.fx-system .fx-topbar .fx-window-actions { align-self:center !important; margin-top:0 !important; margin-bottom:0 !important; top:auto !important; bottom:auto !important; } /* === COMPACT HEADER END === */ /* === HEADER LOGOUT REFINEMENT START === */ /* ============================================================ BOTÃO SAIR — MESMO ELEMENTO FUNCIONAL EXISTENTE Não cria botão novo. Não altera clique. Não altera logout. Apenas substitui sua apresentação visual. ============================================================ */ /* Área do controle no canto direito */ #shell.fx-system .fx-topbar .fx-window-actions { display:flex !important; align-items:center !important; justify-content:flex-end !important; align-self:center !important; height:60px !important; min-height:60px !important; margin-top:0 !important; margin-bottom:0 !important; margin-left:auto !important; padding:0 14px 0 8px !important; box-sizing:border-box !important; opacity:1 !important; visibility:visible !important; overflow:visible !important; } /* ============================================================ BOTÃO FUNCIONAL EXISTENTE ============================================================ */ #shell.fx-system .fx-topbar .fx-window-actions > button:last-of-type { position:relative !important; inset:auto !important; top:auto !important; right:auto !important; bottom:auto !important; left:auto !important; display:grid !important; place-items:center !important; flex:0 0 36px !important; width:36px !important; min-width:36px !important; max-width:36px !important; height:36px !important; min-height:36px !important; max-height:36px !important; margin:0 !important; padding:0 !important; box-sizing:border-box !important; border: 1px solid rgba(46,112,132,.20) !important; border-radius:9px !important; background: rgba(249,252,253,.96) !important; color:#647f8b !important; box-shadow: 0 2px 7px rgba(22,67,81,.04) !important; opacity:1 !important; visibility:visible !important; pointer-events:auto !important; overflow:hidden !important; font-size:0 !important; cursor:pointer !important; transform:none !important; transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease !important; } /* ============================================================ ÍCONE MODERNO DE SAÍDA ============================================================ */ #shell.fx-system .fx-topbar .fx-window-actions > button:last-of-type::before { content:"" !important; display:block !important; width:19px !important; height:19px !important; background-color:currentColor !important; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17l5-5-5-5'/%3E%3Cpath d='M15 12H3'/%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3C/svg%3E") !important; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17l5-5-5-5'/%3E%3Cpath d='M15 12H3'/%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3C/svg%3E") !important; -webkit-mask-size:contain !important; mask-size:contain !important; -webkit-mask-position:center !important; mask-position:center !important; -webkit-mask-repeat:no-repeat !important; mask-repeat:no-repeat !important; } /* elimina o X ou qualquer decoração anterior */ #shell.fx-system .fx-topbar .fx-window-actions > button:last-of-type::after { content:none !important; display:none !important; } /* ============================================================ HOVER DISCRETO ============================================================ */ #shell.fx-system .fx-topbar .fx-window-actions > button:last-of-type:hover { background:#f5fafb !important; border-color: rgba(15,124,146,.30) !important; color:#19788b !important; box-shadow: 0 4px 11px rgba(17,76,91,.08) !important; transform: translateY(-1px) !important; } #shell.fx-system .fx-topbar .fx-window-actions > button:last-of-type:active { transform:none !important; background: #edf6f8 !important; } /* acessibilidade de teclado */ #shell.fx-system .fx-topbar .fx-window-actions > button:last-of-type:focus-visible { outline: 2px solid rgba(20,150,169,.22) !important; outline-offset:2px !important; } /* === HEADER LOGOUT REFINEMENT END === */ /* === SIDEBAR PETROLEO MASTER START === */ /* Menu lateral REAL: NAV#fx-menu.fx-menu Paleta: petróleo profundo -> petróleo médio -> petróleo esverdeado */ #shell.fx-system #fx-menu.fx-menu{ --fx-menu-pet-1:#073a3b; --fx-menu-pet-2:#084848; --fx-menu-pet-3:#0a5653; --fx-menu-pet-4:#0d6661; --fx-menu-pet-accent:#20c9bd; background: radial-gradient( 280px 210px at -12% -4%, rgba(37,202,190,.16) 0%, rgba(37,202,190,.06) 34%, transparent 70% ), linear-gradient( 180deg, #073538 0%, #084247 30%, #095052 67%, #0a5957 100% ) !important; border-right: 1px solid rgba(89,210,200,.16) !important; box-shadow: inset -1px 0 0 rgba(255,255,255,.025) !important; color:#f7ffff !important; } /* ---------------------------------------------------------- CAMADAS DECORATIVAS ---------------------------------------------------------- */ #shell.fx-system #fx-menu.fx-menu::before{ content:"" !important; background: radial-gradient( 900px 270px at -5% 18%, transparent 0 64%, rgba(51,206,195,.17) 64.3%, rgba(51,206,195,.17) 64.6%, transparent 64.9% ), radial-gradient( 930px 300px at 0% 52%, transparent 0 69%, rgba(51,206,195,.14) 69.3%, rgba(51,206,195,.14) 69.6%, transparent 69.9% ), radial-gradient( 980px 320px at -6% 85%, transparent 0 73%, rgba(51,206,195,.11) 73.3%, rgba(51,206,195,.11) 73.6%, transparent 73.9% ) !important; background-image: radial-gradient( 900px 270px at -5% 18%, transparent 0 64%, rgba(51,206,195,.17) 64.3%, rgba(51,206,195,.17) 64.6%, transparent 64.9% ), radial-gradient( 930px 300px at 0% 52%, transparent 0 69%, rgba(51,206,195,.14) 69.3%, rgba(51,206,195,.14) 69.6%, transparent 69.9% ), radial-gradient( 980px 320px at -6% 85%, transparent 0 73%, rgba(51,206,195,.11) 73.3%, rgba(51,206,195,.11) 73.6%, transparent 73.9% ) !important; opacity:1 !important; } /* elimina a película azul antiga */ #shell.fx-system #fx-menu.fx-menu::after{ content:"" !important; background: linear-gradient( 180deg, rgba(1,24,25,.025) 0%, rgba(0,0,0,0) 45%, rgba(1,31,30,.10) 100% ) !important; background-image: linear-gradient( 180deg, rgba(1,24,25,.025) 0%, rgba(0,0,0,0) 45%, rgba(1,31,30,.10) 100% ) !important; } /* ---------------------------------------------------------- BOTÕES ---------------------------------------------------------- */ #shell.fx-system #fx-menu.fx-menu > button{ color:#f3ffff !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; text-shadow: 0 1px 1px rgba(0,0,0,.18) !important; transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease !important; } /* hover mais refinado */ #shell.fx-system #fx-menu.fx-menu > button:hover{ background: linear-gradient( 90deg, rgba(20,139,133,.18), rgba(15,105,104,.14) ) !important; border-color: rgba(92,220,210,.14) !important; } /* ---------------------------------------------------------- ITEM ATIVO REAL: .is-ui-active ---------------------------------------------------------- */ #shell.fx-system #fx-menu.fx-menu > button.is-ui-active{ background: linear-gradient( 90deg, rgba(10,117,112,.76) 0%, rgba(11,101,101,.66) 58%, rgba(10,91,94,.56) 100% ) !important; border: 1px solid rgba(72,213,203,.37) !important; color: #ffffff !important; box-shadow: inset 4px 0 0 #25d9cd, inset 0 1px 0 rgba(255,255,255,.08), 0 7px 16px rgba(0,25,27,.18) !important; transform: translateY(-1px) !important; } /* textos do ativo */ #shell.fx-system #fx-menu.fx-menu > button.is-ui-active *{ color:#ffffff !important; } /* ---------------------------------------------------------- ÍCONES ---------------------------------------------------------- */ #shell.fx-system #fx-menu.fx-menu > button > span[data-icon]{ background: linear-gradient( 180deg, rgba(14,127,126,.75), rgba(9,100,103,.78) ) !important; border: 1px solid rgba(95,226,216,.20) !important; color: #e7ffff !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 3px 8px rgba(0,26,28,.14) !important; } #shell.fx-system #fx-menu.fx-menu > button.is-ui-active > span[data-icon]{ background: linear-gradient( 180deg, #138e89, #0a716f ) !important; border-color: rgba(150,245,237,.29) !important; color: #ffffff !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 4px 9px rgba(0,28,29,.18) !important; } /* SVG */ #shell.fx-system #fx-menu.fx-menu .ui-svg{ color:#e9ffff !important; stroke:currentColor !important; } /* ---------------------------------------------------------- SEÇÕES ---------------------------------------------------------- */ #shell.fx-system .fx-sidebar-section{ color:#8fe1db !important; } #shell.fx-system .fx-sidebar-section::after{ background: rgba(84,207,198,.13) !important; } /* ---------------------------------------------------------- BUSCA ---------------------------------------------------------- */ #shell.fx-system #fx-menu.fx-menu .fx-search{ color:#9fc7c7 !important; } #shell.fx-system #fx-menu.fx-menu .fx-search input{ background: rgba(4,43,45,.42) !important; border: 1px solid rgba(90,213,204,.20) !important; color: #edffff !important; box-shadow: inset 0 1px 2px rgba(0,0,0,.10), 0 1px 0 rgba(255,255,255,.025) !important; } #shell.fx-system #fx-menu.fx-menu .fx-search input::placeholder{ color:#98bfc0 !important; } #shell.fx-system #fx-menu.fx-menu .fx-search b{ color:#5ed8d0 !important; } /* ---------------------------------------------------------- SCROLLBAR ---------------------------------------------------------- */ #shell.fx-system #fx-menu.fx-menu{ scrollbar-color: #14746f rgba(255,255,255,.025) !important; } #shell.fx-system #fx-menu.fx-menu::-webkit-scrollbar{ width:8px !important; } #shell.fx-system #fx-menu.fx-menu::-webkit-scrollbar-track{ background: rgba(255,255,255,.025) !important; } #shell.fx-system #fx-menu.fx-menu::-webkit-scrollbar-thumb{ background: linear-gradient( 180deg, #16867f, #0e6865 ) !important; border-radius: 999px !important; border: 2px solid transparent !important; background-clip: padding-box !important; } /* === SIDEBAR PETROLEO MASTER END === */ /* === PAYROLL COMPETENCY PROPORTION FIX START === */ /* Ajuste baseado nas medidas reais obtidas pelo Console. Aplicado somente em Conferência > Folha > Competências. */ /* ========================================================== WORKSPACE Antes: 653px + 113px Agora: conteúdo flexível + 120px de ações ========================================================== */ #shell.fx-system .fx-workspace:has(> .fx-payroll-competency-side){ grid-template-columns: minmax(0,1fr) 120px !important; column-gap:10px !important; } /* ========================================================== ÁREA PRINCIPAL ========================================================== */ #shell.fx-system .fx-main:has(.fx-payroll-competency-screen){ min-width:0 !important; width:auto !important; max-width:none !important; overflow:hidden !important; } #shell.fx-system #content:has(.fx-payroll-competency-screen){ width:100% !important; max-width:none !important; padding:10px !important; overflow:hidden !important; box-sizing:border-box !important; } .fx-payroll-competency-screen{ width:100% !important; max-width:none !important; min-width:0 !important; } .fx-payroll-competency-columns{ width:100% !important; max-width:none !important; min-width:0 !important; display:grid !important; /* A barra lateral já está fora do conteúdo, portanto aqui deve existir somente a coluna principal. */ grid-template-columns:minmax(0,1fr) !important; gap:0 !important; } .fx-payroll-competency-main{ width:100% !important; max-width:none !important; min-width:0 !important; padding:14px 16px 12px !important; box-sizing:border-box !important; } /* ========================================================== TÍTULO ========================================================== */ .fx-payroll-competency-hero{ width:100% !important; padding-bottom:10px !important; } .fx-payroll-competency-hero h1, .fx-payroll-competency-hero-copy h1{ font-size:20px !important; line-height:1.15 !important; } /* ========================================================== TABELA ========================================================== */ .fx-payroll-competency-table-shell{ width:100% !important; max-width:none !important; height:calc(100dvh - 235px) !important; min-height:330px !important; max-height:none !important; overflow:auto !important; box-sizing:border-box !important; } .fx-payroll-competency-table{ width:100% !important; min-width:0 !important; table-layout:fixed !important; } /* Proporções adequadas aos quatro títulos. */ .fx-payroll-competency-table thead th:nth-child(1){ width:22% !important; } .fx-payroll-competency-table thead th:nth-child(2){ width:28% !important; } .fx-payroll-competency-table thead th:nth-child(3){ width:25% !important; } .fx-payroll-competency-table thead th:nth-child(4){ width:25% !important; } .fx-payroll-competency-table thead th{ height:39px !important; padding:0 6px !important; font-size:10px !important; line-height:1.1 !important; white-space:nowrap !important; box-sizing:border-box !important; } /* células */ .fx-payroll-competency-table tbody td{ height:34px !important; padding:5px 7px !important; font-size:11.5px !important; } /* ========================================================== ESTADO VAZIO ========================================================== */ .fx-payroll-competency-empty{ min-height:285px !important; padding:24px 16px !important; } .fx-payroll-competency-empty-icon{ width:74px !important; height:74px !important; margin-bottom:5px !important; } .fx-payroll-competency-empty-icon svg{ width:35px !important; height:35px !important; } .fx-payroll-competency-empty > strong{ font-size:14px !important; } .fx-payroll-competency-empty > span{ font-size:11.5px !important; } /* ========================================================== COLUNA LATERAL Antes: 113px Nova largura: 120px ========================================================== */ #shell.fx-system .fx-workspace > .fx-payroll-competency-side{ width:120px !important; min-width:120px !important; max-width:120px !important; padding:10px 8px !important; box-sizing:border-box !important; overflow:hidden !important; } /* ========================================================== CORREÇÃO PRINCIPAL: o responsive havia transformado isso em 3 colunas. Deve ser SEMPRE uma coluna nesta versão desktop. ========================================================== */ #shell.fx-system .fx-payroll-competency-side .fx-payroll-competency-side-inner{ display:flex !important; flex-direction:column !important; width:100% !important; grid-template-columns:none !important; gap:8px !important; } /* ========================================================== BOTÕES Antes: 24px x 51px no cálculo do DOM Agora: largura total x 44px ========================================================== */ #shell.fx-system .fx-payroll-competency-side .fx-payroll-competency-side-button{ flex:0 0 auto !important; width:100% !important; min-width:0 !important; max-width:none !important; height:44px !important; min-height:44px !important; display:grid !important; grid-template-columns: 34px minmax(0,1fr) !important; padding:0 !important; box-sizing:border-box !important; } /* área do ícone */ #shell.fx-system .fx-payroll-competency-side-button .fx-payroll-competency-action-icon, #shell.fx-system .fx-payroll-competency-side-button .fx-payroll-competency-plus{ width:34px !important; height:42px !important; padding:9px !important; box-sizing:border-box !important; } /* sinal + */ #shell.fx-system .fx-payroll-competency-side-button .fx-payroll-competency-plus{ padding:0 !important; font-size:23px !important; } /* texto */ #shell.fx-system .fx-payroll-competency-side-button > span:last-child{ min-width:0 !important; padding:0 7px !important; font-size:11px !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; } /* Garante que o botão Sair permaneça visível: 7 x 44px + 6 x 8px + padding = cabe na lateral. */ #shell.fx-system .fx-payroll-approved-exit{ margin-top:0 !important; } /* ========================================================== NÃO ATIVAR O GRID DE 3 COLUNAS NESTA TELA mesmo quando o viewport CSS for inferior a 900px. ========================================================== */ @media(max-width:900px){ #shell.fx-system .fx-workspace:has(> .fx-payroll-competency-side){ grid-template-columns: minmax(0,1fr) 120px !important; } #shell.fx-system .fx-payroll-competency-side{ width:120px !important; min-width:120px !important; max-width:120px !important; } #shell.fx-system .fx-payroll-competency-side .fx-payroll-competency-side-inner{ display:flex !important; flex-direction:column !important; grid-template-columns:none !important; } } /* === PAYROLL COMPETENCY PROPORTION FIX END === */ /* === FLUXUS PESSOAL VISUAL DEFINITIVO START === */ /* ÚNICA regra final para o botão Trocar Sistema. Objetivo: dar o mesmo respiro vertical visual dos botões Empresa e Sair. */ html body #shell.fx-system .fx-topbar [data-fluxus-brand][role="button"]{ /* mantém largura atual */ width:190px !important; min-width:190px !important; max-width:190px !important; flex:0 0 190px !important; /* altura visual menor */ height:47.04px !important; min-height:47.04px !important; max-height:47.04px !important; /* centralização vertical real */ align-self:center !important; margin-top:auto !important; margin-bottom:auto !important; padding: 4px 14px 4px 6px !important; box-sizing:border-box !important; } /* ícone proporcional */ html body #shell.fx-system .fx-topbar [data-fluxus-brand][role="button"] .fx-brand-logo{ width:30px !important; min-width:30px !important; max-width:30px !important; height:30px !important; min-height:30px !important; max-height:30px !important; flex:0 0 30px !important; } /* mantém o conteúdo centralizado */ html body #shell.fx-system .fx-topbar [data-fluxus-brand][role="button"] .fx-brand-copy{ align-self:center !important; } /* divisor acompanha a nova altura */ html body #shell.fx-system .fx-topbar [data-fluxus-brand][role="button"] .fx-brand-logo::after{ top:4px !important; bottom:4px !important; } /* === FLUXUS PESSOAL VISUAL DEFINITIVO END === */ /* === GESTAO TAREFAS SUBMENU ALIGNMENT 20261006 === */ /* Somente apresentação do filho nativo de: Gestão > Demandas > Tarefas. Não altera: - rotas; - cliques; - permissões; - demais menus; - #fx-cascade. */ #shell.fx-system #fx-menu.fx-menu > .fx-gestao-native-children{ position:relative !important; display:block !important; width: calc(100% - 18px) !important; margin: -2px 9px 8px !important; padding: 5px !important; box-sizing: border-box !important; border: 1px solid rgba(62,169,173,.13) !important; border-radius: 8px !important; background: rgba(3,42,49,.54) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important; } #shell.fx-system #fx-menu.fx-menu > .fx-gestao-native-children > .fx-gestao-native-child{ position:relative !important; display:flex !important; align-items:center !important; justify-content:flex-start !important; width:100% !important; min-width:0 !important; min-height:34px !important; height:34px !important; gap:9px !important; margin:0 !important; padding: 5px 8px !important; box-sizing: border-box !important; border: 0 !important; border-radius: 7px !important; background: transparent !important; color: #bed0d8 !important; font-family: inherit !important; font-size: 12px !important; font-weight: 470 !important; line-height: 1.2 !important; text-align: left !important; box-shadow: none !important; transform: none !important; cursor: pointer !important; transition: background .12s ease, color .12s ease !important; } #shell.fx-system #fx-menu.fx-menu > .fx-gestao-native-children > .fx-gestao-native-child:hover{ background: rgba(24,75,98,.72) !important; color: #ffffff !important; } #shell.fx-system #fx-menu.fx-menu > .fx-gestao-native-children > .fx-gestao-native-child.is-active, #shell.fx-system #fx-menu.fx-menu > .fx-gestao-native-children > .fx-gestao-native-child[aria-current="page"]{ background: rgba(25,72,94,.92) !important; color: #ffffff !important; font-weight: 600 !important; } #shell.fx-system #fx-menu.fx-menu > .fx-gestao-native-children > .fx-gestao-native-child > .fx-gestao-native-child-icon{ flex: 0 0 24px !important; display:grid !important; place-items:center !important; width: 24px !important; height: 24px !important; margin: 0 !important; border-radius: 6px !important; background: rgba(10,79,88,.52) !important; color: #37d3ac !important; font-size: 12px !important; line-height: 1 !important; } #shell.fx-system #fx-menu.fx-menu > .fx-gestao-native-children > .fx-gestao-native-child.is-active > .fx-gestao-native-child-icon, #shell.fx-system #fx-menu.fx-menu > .fx-gestao-native-children > .fx-gestao-native-child[aria-current="page"] > .fx-gestao-native-child-icon{ background: rgba(10,93,99,.72) !important; color: #66e2bd !important; } #shell.fx-system #fx-menu.fx-menu > .fx-gestao-native-children > .fx-gestao-native-child > .fx-gestao-native-child-label{ display:block !important; min-width:0 !important; margin:0 !important; padding:0 !important; color: inherit !important; font:inherit !important; line-height: 1.2 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } /* === GESTAO TAREFAS SUBMENU ALIGNMENT 20261006 END === */ /* FLUXUS_SUBMENU_AGENDA_ACESSO_PADRAO_TAREFAS_V1 Padroniza os submenus laterais para o mesmo componente visual usado em Tarefas, incluindo Agenda > Acesso. */ /* Estrutura base dos itens de submenu */ .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .erp-shell-nav-item > a, .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .erp-shell-nav-link, .fluxus-sidebar .fluxus-sidebar-submenu .fluxus-sidebar-item > a, .fluxus-sidebar .fluxus-sidebar-submenu .fluxus-sidebar-link, [class*="sidebar"] [class*="submenu"] > li > a, [class*="sidebar"] [class*="submenu"] > li > button, [class*="sidebar"] [class*="submenu"] [class*="item"] > a, [class*="sidebar"] [class*="submenu"] [class*="link"] { display: flex !important; align-items: center !important; gap: 10px !important; min-height: 42px !important; padding: 0 14px !important; margin: 6px 10px 0 10px !important; border-radius: 10px !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; background: rgba(2, 31, 39, 0.38) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.03) !important; text-decoration: none !important; transition: background .18s ease, border-color .18s ease, transform .18s ease !important; } .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .erp-shell-nav-item > a:hover, .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .erp-shell-nav-link:hover, .fluxus-sidebar .fluxus-sidebar-submenu .fluxus-sidebar-item > a:hover, .fluxus-sidebar .fluxus-sidebar-submenu .fluxus-sidebar-link:hover, [class*="sidebar"] [class*="submenu"] > li > a:hover, [class*="sidebar"] [class*="submenu"] > li > button:hover, [class*="sidebar"] [class*="submenu"] [class*="item"] > a:hover, [class*="sidebar"] [class*="submenu"] [class*="link"]:hover { background: rgba(4, 45, 56, 0.50) !important; border-color: rgba(33, 194, 184, 0.28) !important; } /* Texto */ .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .erp-shell-nav-item > a > span, .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .erp-shell-nav-link > span, .fluxus-sidebar .fluxus-sidebar-submenu .fluxus-sidebar-item > a > span, .fluxus-sidebar .fluxus-sidebar-submenu .fluxus-sidebar-link > span, [class*="sidebar"] [class*="submenu"] > li > a > span, [class*="sidebar"] [class*="submenu"] > li > button > span, [class*="sidebar"] [class*="submenu"] [class*="item"] > a > span, [class*="sidebar"] [class*="submenu"] [class*="link"] > span { color: #eaf6f8 !important; font-size: 12px !important; font-weight: 600 !important; line-height: 1.1 !important; } /* Ícones */ .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .erp-shell-nav-item > a > i, .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .erp-shell-nav-link > i, .fluxus-sidebar .fluxus-sidebar-submenu .fluxus-sidebar-item > a > i, .fluxus-sidebar .fluxus-sidebar-submenu .fluxus-sidebar-link > i, [class*="sidebar"] [class*="submenu"] > li > a > i, [class*="sidebar"] [class*="submenu"] > li > button > i, [class*="sidebar"] [class*="submenu"] [class*="item"] > a > i, [class*="sidebar"] [class*="submenu"] [class*="link"] > i, [class*="sidebar"] [class*="submenu"] > li > a > svg, [class*="sidebar"] [class*="submenu"] > li > button > svg, [class*="sidebar"] [class*="submenu"] [class*="item"] > a > svg, [class*="sidebar"] [class*="submenu"] [class*="link"] > svg { width: 14px !important; min-width: 14px !important; height: 14px !important; color: #7fd6d5 !important; opacity: .95 !important; } /* Item ativo/selecionado: mesmo destaque do padrão visual */ .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .is-active > a, .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .active > a, .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .erp-shell-nav-item[aria-current="page"] > a, .fluxus-sidebar .fluxus-sidebar-submenu .is-active > a, .fluxus-sidebar .fluxus-sidebar-submenu .active > a, [class*="sidebar"] [class*="submenu"] > li.active > a, [class*="sidebar"] [class*="submenu"] > li.is-active > a, [class*="sidebar"] [class*="submenu"] > li[aria-current="page"] > a, [class*="sidebar"] [class*="submenu"] > li.active > button, [class*="sidebar"] [class*="submenu"] > li.is-active > button, [class*="sidebar"] [class*="submenu"] [class*="item"].active > a, [class*="sidebar"] [class*="submenu"] [class*="item"].is-active > a { background: linear-gradient(180deg, rgba(9, 117, 118, 0.88) 0%, rgba(6, 98, 104, 0.96) 100%) !important; border-color: rgba(116, 233, 226, 0.35) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 0 0 1px rgba(2, 180, 173, 0.15) !important; } .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .is-active > a > span, .erp-shell-sidebar .erp-shell-nav .erp-shell-submenu .active > a > span, .fluxus-sidebar .fluxus-sidebar-submenu .is-active > a > span, .fluxus-sidebar .fluxus-sidebar-submenu .active > a > span, [class*="sidebar"] [class*="submenu"] > li.active > a > span, [class*="sidebar"] [class*="submenu"] > li.is-active > a > span, [class*="sidebar"] [class*="submenu"] [class*="item"].active > a > span, [class*="sidebar"] [class*="submenu"] [class*="item"].is-active > a > span, [class*="sidebar"] [class*="submenu"] > li.active > button > span, [class*="sidebar"] [class*="submenu"] > li.is-active > button > span { color: #ffffff !important; }