/* ========================================================= IMPERIAL - SIDEBAR GLOBAL V3 ========================================================= */ body .imperial-sidebar-global{ width:235px !important; min-width:235px !important; display:flex !important; flex-direction:column !important; overflow:hidden !important; background: radial-gradient( circle at 0 0, rgba(0,180,255,.16), transparent 25% ), linear-gradient( 180deg, #062b52 0%, #02192f 100% ) !important; border-right: 1px solid rgba(255,255,255,.06) !important; box-shadow: 5px 0 22px rgba(4,23,42,.11) !important; } body .imperial-sidebar-global .sidebar-brand{ min-height:92px !important; display:flex !important; align-items:center !important; gap:11px !important; padding:18px !important; margin:0 !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; } body .imperial-sidebar-global .sidebar-brand-icon{ width:47px !important; height:47px !important; flex:0 0 47px !important; display:flex !important; align-items:center !important; justify-content:center !important; background: linear-gradient( 145deg, #09d6e9, #0298de ) !important; border-radius:14px !important; font-size:23px !important; box-shadow: 0 7px 18px rgba(0,190,240,.22) !important; } body .imperial-sidebar-global .sidebar-brand-text{ display:flex !important; flex-direction:column !important; } body .imperial-sidebar-global .sidebar-brand-text strong{ color:#fff !important; font-size:18px !important; font-weight:700 !important; } body .imperial-sidebar-global .sidebar-brand-text small{ color:#ff820d !important; font-size:10px !important; font-weight:600 !important; } body .imperial-sidebar-global .sidebar-nav{ flex:1 1 auto !important; overflow-y:auto !important; padding:10px 0 18px !important; } body .imperial-sidebar-global .sidebar-section{ margin:16px 0 7px !important; padding:0 23px !important; color: rgba(255,255,255,.46) !important; font-size:9px !important; font-weight:700 !important; letter-spacing:.11em !important; } body .imperial-sidebar-global .sidebar-nav a{ min-height:42px !important; margin:3px 12px !important; padding:0 13px !important; display:flex !important; align-items:center !important; gap:10px !important; border:0 !important; border-radius:11px !important; background: transparent !important; color: rgba(255,255,255,.93) !important; text-decoration:none !important; box-shadow:none !important; font-size:12px !important; font-weight:600 !important; } body .imperial-sidebar-global .sidebar-nav a:hover{ background: rgba(255,255,255,.07) !important; } body .imperial-sidebar-global .sidebar-nav a.active{ background: linear-gradient( 180deg, #ff9628 0%, #ff7200 100% ) !important; color:#fff !important; box-shadow: 0 8px 21px rgba(255,115,0,.30) !important; } body .imperial-sidebar-global .sidebar-nav-icon{ width:21px !important; flex:0 0 21px !important; text-align:center !important; font-size:15px !important; } body .imperial-sidebar-global .sidebar-bottom{ flex:0 0 auto !important; padding:12px 14px 16px !important; background: #02192f !important; border-top: 1px solid rgba(255,255,255,.07) !important; } body .imperial-sidebar-global .sidebar-system-card{ padding:13px !important; background: rgba(255,255,255,.045) !important; border: 1px solid rgba(255,255,255,.09) !important; border-radius:13px !important; } body .imperial-sidebar-global .sidebar-system-card small{ display:block; color: rgba(255,255,255,.48) !important; font-size:9px !important; } body .imperial-sidebar-global .sidebar-system-card strong{ display:block; margin-top:5px; color:#fff !important; font-size:10px !important; } body .imperial-sidebar-global .system-online{ display:inline-block !important; width:8px !important; height:8px !important; margin-right:6px !important; border-radius:50% !important; background:#28d683 !important; box-shadow: 0 0 0 4px rgba(40,214,131,.12) !important; } /* ========================================================= IMPERIAL SIDEBAR V4 CORREÇÃO DE FUNDO + LABELS + ALTURA ========================================================= */ /* sidebar inteira */ body .imperial-sidebar-global{ position:relative !important; width:235px !important; min-width:235px !important; max-width:235px !important; height:100vh !important; min-height:100vh !important; display:flex !important; flex-direction:column !important; overflow:hidden !important; background: radial-gradient( circle at 0 0, rgba(0,183,255,.16), transparent 26% ), linear-gradient( 180deg, #062c54 0%, #02192f 100% ) !important; border-right: 1px solid rgba(255,255,255,.06) !important; color:#fff !important; } /* ========================================================= BRAND ========================================================= */ body .imperial-sidebar-global .sidebar-brand{ flex:0 0 auto !important; width:100% !important; background: transparent !important; } /* ========================================================= NAV - CORRIGE O BRANCO DO PRINT ========================================================= */ body .imperial-sidebar-global .sidebar-nav{ flex: 1 1 auto !important; width: 100% !important; min-height: 0 !important; display: block !important; padding: 12px 0 20px !important; margin: 0 !important; overflow-y: auto !important; overflow-x: hidden !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } /* * alguns CSS antigos estavam transformando * os labels em display:none */ body .imperial-sidebar-global .sidebar-nav-label{ display: inline-block !important; visibility: visible !important; opacity: 1 !important; width: auto !important; max-width: none !important; overflow: visible !important; color: inherit !important; white-space: nowrap !important; } /* ========================================================= LINKS ========================================================= */ body .imperial-sidebar-global .sidebar-nav a{ width: calc(100% - 24px) !important; min-width: 0 !important; height: 42px !important; min-height: 42px !important; margin: 4px 12px !important; padding: 0 13px !important; display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; overflow: hidden !important; background: transparent !important; color: rgba(255,255,255,.94) !important; border: 1px solid transparent !important; border-radius: 11px !important; box-shadow: none !important; font-size: 12px !important; font-weight: 600 !important; text-align: left !important; text-decoration: none !important; } /* hover */ body .imperial-sidebar-global .sidebar-nav a:hover{ background: rgba(255,255,255,.07) !important; color: #ffffff !important; border-color: rgba(255,255,255,.04) !important; } /* ativo */ body .imperial-sidebar-global .sidebar-nav a.active{ background: linear-gradient( 180deg, #ff962a 0%, #ff7600 100% ) !important; color: #ffffff !important; border: 1px solid rgba(255,255,255,.08) !important; box-shadow: 0 8px 22px rgba(255,112,0,.30) !important; } /* ========================================================= ÍCONES ========================================================= */ body .imperial-sidebar-global .sidebar-nav-icon{ width: 22px !important; min-width: 22px !important; flex: 0 0 22px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; visibility: visible !important; opacity: 1 !important; font-size: 15px !important; font-family: 'Segoe UI Emoji', 'Apple Color Emoji', sans-serif !important; } /* ========================================================= TÍTULOS DAS SEÇÕES ========================================================= */ body .imperial-sidebar-global .sidebar-section{ display: block !important; width: 100% !important; margin: 17px 0 7px !important; padding: 0 23px !important; background: transparent !important; color: rgba(255,255,255,.46) !important; font-size: 9px !important; font-weight: 700 !important; letter-spacing: .11em !important; text-align: left !important; visibility: visible !important; opacity: 1 !important; } /* ========================================================= RODAPÉ ========================================================= */ body .imperial-sidebar-global .sidebar-bottom{ position: relative !important; left: auto !important; right: auto !important; bottom: auto !important; flex: 0 0 auto !important; width: 100% !important; padding: 12px 14px 16px !important; background: rgba(0,0,0,.10) !important; border-top: 1px solid rgba(255,255,255,.07) !important; } /* ========================================================= REMOVE QUALQUER ESTADO "COLLAPSED" ========================================================= */ body .imperial-sidebar-global.collapsed, body .imperial-sidebar-global.sidebar-collapsed{ width: 235px !important; min-width: 235px !important; max-width: 235px !important; } body .imperial-sidebar-global.collapsed .sidebar-nav-label, body .imperial-sidebar-global.sidebar-collapsed .sidebar-nav-label{ display: inline-block !important; opacity: 1 !important; } /* ========================================================= SCROLL DA SIDEBAR ========================================================= */ body .imperial-sidebar-global .sidebar-nav::-webkit-scrollbar{ width: 5px; } body .imperial-sidebar-global .sidebar-nav::-webkit-scrollbar-track{ background: transparent; } body .imperial-sidebar-global .sidebar-nav::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.18); border-radius: 99px; } /* ========================================================= IMPERIAL V5 CORREÇÃO DE DUPLO ESPAÇO APÓS A SIDEBAR ========================================================= */ /* * O layout já posiciona a sidebar pelo FLEX. * Alguns estilos antigos ainda adicionavam margin-left * equivalente à largura do menu, causando espaço duplicado. */ body.imperial-system-v2:not(.dashboard-mockup-final) .premium-main, body.imperial-system-v2:not(.dashboard-mockup-final) .app-main, body.imperial-system-v2:not(.dashboard-mockup-final) .layout-main, body.imperial-system-v2:not(.dashboard-mockup-final) .main-wrapper{ margin-left:0 !important; left:auto !important; transform:none !important; width:auto !important; min-width:0 !important; flex:1 1 auto !important; } /* ========================================================= SHELL PRINCIPAL ========================================================= */ body.imperial-system-v2:not(.dashboard-mockup-final) .premium-shell, body.imperial-system-v2:not(.dashboard-mockup-final) .app-shell, body.imperial-system-v2:not(.dashboard-mockup-final) .layout-shell{ width:100% !important; max-width:none !important; display:flex !important; align-items:stretch !important; margin:0 !important; padding:0 !important; } /* ========================================================= TOPBAR ========================================================= */ body.imperial-system-v2:not(.dashboard-mockup-final) .premium-topbar, body.imperial-system-v2:not(.dashboard-mockup-final) .topbar, body.imperial-system-v2:not(.dashboard-mockup-final) .app-topbar{ margin-left:0 !important; left:auto !important; width:100% !important; max-width:none !important; } /* ========================================================= CONTEÚDO ========================================================= */ body.imperial-system-v2:not(.dashboard-mockup-final) main{ width:100% !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important; box-sizing:border-box !important; } /* * Containers internos não devem carregar * a antiga margem reservada à sidebar. */ body.imperial-system-v2:not(.dashboard-mockup-final) .page-content, body.imperial-system-v2:not(.dashboard-mockup-final) .main-content, body.imperial-system-v2:not(.dashboard-mockup-final) .content-wrapper, body.imperial-system-v2:not(.dashboard-mockup-final) .premium-content{ width:100% !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important; left:auto !important; transform:none !important; box-sizing:border-box !important; } /* ========================================================= RESPIRO ENTRE MENU E TELA ========================================================= */ body.imperial-system-v2:not(.dashboard-mockup-final) main{ padding-left:22px !important; padding-right:22px !important; } /* ========================================================= QUALIDADE DA ÁGUA ========================================================= */ body.qualidade-agua-premium main{ width:100% !important; margin-left:0 !important; padding: 20px 22px 30px !important; } body.qualidade-agua-premium .qa-dados, body.qualidade-agua-premium .qa-viveiros-v2{ width:100% !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important; box-sizing:border-box !important; } /* ========================================================= TELAS GRANDES ========================================================= */ @media(min-width:1200px){ body.imperial-system-v2:not(.dashboard-mockup-final) main{ padding-left:24px !important; padding-right:24px !important; } } /* ========================================================= BOTÃO SAIR GLOBAL ========================================================= */ .sidebar-logout{ width:100%; min-height:42px; margin: 0 0 11px; padding: 0 13px; display:flex; align-items:center; gap:10px; border: 1px solid rgba(255,255,255,.10); border-radius: 11px; background: rgba(255,255,255,.055); color: #dceaf2; font-family: inherit; font-size: 12px; font-weight: 800; text-align:left; cursor:pointer; transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease; } .sidebar-logout:hover{ background: rgba(255,120,22,.16); border-color: rgba(255,128,32,.38); color: #ff9a49; transform: translateY(-1px); } .sidebar-logout-icon{ width: 26px; height: 26px; display:flex; align-items:center; justify-content:center; flex: 0 0 26px; border-radius: 8px; background: rgba(255,255,255,.07); color: #ff8a32; font-size: 17px; font-weight: 900; } .sidebar-logout:hover .sidebar-logout-icon{ background: rgba(255,125,28,.15); } /* mantém o rodapé bem organizado */ .sidebar-bottom{ padding-bottom: 13px; } /* ========================================================= PERMISSÕES DE MENU V3 ========================================================= */ .imperial-sem-permissao, .sidebar-nav a.imperial-sem-permissao{ display:none !important; }