/* ===================================================================== BO Refresh — versão mínima Carregar DEPOIS de assets/css/bo/style.css Faz APENAS três coisas: 1) Tipografia moderna em todo o BO (system fonts) 2) Logo da navbar com fundo branco (para se ver sobre o fundo escuro) 3) Remover qualquer text-transform: lowercase / uppercase forçado ===================================================================== */ :root { --bo-font: "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif; } /* ---- 1) Tipografia ------------------------------------------------- */ /* Aplicar a mesma fonte em TODO o BO. O selector universal cobre menus, tabelas, dropdowns, modais e qualquer elemento que herde do . As classes de ícones são excluídas para não partir Font Awesome, Glyphicons e Halflings (são fontes de ícones, não texto). */ body, body * { font-family: var(--bo-font) !important; } /* repor a font correcta para cada conjunto de ícones — Font Awesome v3, Glyphicons e Halflings têm fontes próprias, senão aparecem caixas vazias */ .fa, .fas, .far, .fab, .fal, .fa::before, .fa::after, [class^="icon-"], [class*=" icon-"], [class^="icon-"]::before, [class*=" icon-"]::before, [class^="icon-"]:before, [class*=" icon-"]:before { font-family: FontAwesome !important; } .glyphicon, [class^="glyphicon-"], [class*=" glyphicon-"], .glyphicon::before, [class^="glyphicon-"]::before, [class*=" glyphicon-"]::before { font-family: 'Glyphicons Halflings' !important; } .halflings, .halflings i, .halflings::before, .halflings i::before { font-family: 'Glyphicons Halflings' !important; } /* halflings-icon usa background-image (sprite) — só garantir display */ .halflings-icon, [class*="halflings-icon"] { display: inline-block; } .cke_button_icon { font-family: inherit; } body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* normalizar font-weight — o tema antigo usa 300 (light) em muitos sítios, o que faz labels e menus parecerem uma fonte diferente da dos botões. Repor pesos coerentes em toda a UI. */ body, p, td, th, li, span, div, a { font-weight: 400 !important; } label, .control-label, #sidebar-left .nav-tabs.nav-stacked > li > a, #sidebar-left .nav-tabs.nav-stacked > li > ul > li > a, .box-header h2, .widget-title h2, .widget-title span, h1, h2, h3, h4, h5, h6, legend, .breadcrumb, .breadcrumb a { font-weight: 500 !important; } /* ---- 2) Logo com fundo branco ------------------------------------- */ /* O logo do cliente é colorido/escuro e fica invisível sobre a navbar preta original. Criar um "card" branco à volta. */ .navbar .brand { background: #fff !important; padding: 8px 12px !important; border-radius: 6px; margin: 8px 12px 8px 0 !important; line-height: 1; display: inline-block; } .navbar .brand img { display: block; height: 28px; width: auto !important; margin: 0 !important; position: static !important; filter: none !important; } /* ---- 3) Botões — design flat moderno, cores originais ------------- */ /* Mesmas cores do tema (primary azul, success verde, danger vermelho, etc.) mas sem gradientes, sem text-shadow, sem bevel — estilo flat actual. */ .btn { background-image: none !important; text-shadow: none !important; box-shadow: none !important; border-radius: 8px !important; border-width: 1px !important; border-style: solid !important; font-weight: 600 !important; padding: 8px 16px !important; line-height: 1.4 !important; transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .05s ease; } .btn:hover { background-image: none !important; text-shadow: none !important; } .btn:active { background-image: none !important; transform: translateY(1px); } .btn:focus { outline: none !important; box-shadow: 0 0 0 3px rgba(0,0,0,0.08) !important; } /* btn default — cinza claro / texto escuro */ .btn { background-color: #f3f4f6 !important; border-color: #d1d5db !important; color: #1f2329 !important; } .btn:hover { background-color: #e5e7eb !important; border-color: #9ca3af !important; } /* primary — azul Bootstrap */ .btn-primary { background-color: #006dcc !important; border-color: #006dcc !important; color: #fff !important; } .btn-primary:hover { background-color: #0058a8 !important; border-color: #0058a8 !important; color: #fff !important; } /* success — verde Bootstrap */ .btn-success { background-color: #5bb75b !important; border-color: #5bb75b !important; color: #fff !important; } .btn-success:hover { background-color: #449d44 !important; border-color: #449d44 !important; color: #fff !important; } /* info — azul claro Bootstrap */ .btn-info { background-color: #49afcd !important; border-color: #49afcd !important; color: #fff !important; } .btn-info:hover { background-color: #2f96b4 !important; border-color: #2f96b4 !important; color: #fff !important; } /* warning — laranja Bootstrap */ .btn-warning { background-color: #faa732 !important; border-color: #faa732 !important; color: #fff !important; } .btn-warning:hover { background-color: #df8a13 !important; border-color: #df8a13 !important; color: #fff !important; } /* danger — vermelho Bootstrap */ .btn-danger { background-color: #da4f49 !important; border-color: #da4f49 !important; color: #fff !important; } .btn-danger:hover { background-color: #bd362f !important; border-color: #bd362f !important; color: #fff !important; } /* inverse — preto Bootstrap */ .btn-inverse { background-color: #363636 !important; border-color: #363636 !important; color: #fff !important; } .btn-inverse:hover { background-color: #1a1a1a !important; border-color: #1a1a1a !important; color: #fff !important; } /* tamanhos — manter proporção */ .btn-mini { padding: 4px 10px !important; font-size: 12px !important; border-radius: 6px !important; } .btn-small { padding: 6px 12px !important; font-size: 13px !important; border-radius: 6px !important; } .btn-large { padding: 11px 20px !important; font-size: 16px !important; border-radius: 10px !important; } /* garantir que ícones brancos (halflings.white) ficam centrados */ .btn .halflings-icon { display: inline-block !important; vertical-align: text-top !important; margin-top: 1px; } /* ---- 4) Menu lateral — toques simples ----------------------------- */ /* Mantém cores e estrutura do tema. Só melhora espaçamento, hover e destaque do item activo (linha vermelha à esquerda, sem cores novas). */ #sidebar-left .nav-tabs.nav-stacked > li > a, #sidebar-left .nav-tabs.nav-stacked > li > ul > li > a { padding: 10px 16px !important; border-left: 3px solid transparent !important; border-right: none !important; transition: background-color .12s ease, border-color .12s ease; } #sidebar-left .nav-tabs.nav-stacked > li > a:hover, #sidebar-left .nav-tabs.nav-stacked > li > ul > li > a:hover { background-color: rgba(255, 255, 255, 0.10) !important; border-left-color: #da4f49 !important; color: #fff !important; } #sidebar-left .nav-tabs.nav-stacked > li.active > a, #sidebar-left .nav-tabs.nav-stacked > li > ul > li.active > a { background-color: rgba(255, 255, 255, 0.06) !important; border-left-color: #da4f49 !important; color: #fff !important; } /* submenu ligeiramente recuado e mais discreto */ #sidebar-left .nav-tabs.nav-stacked > li > ul > li > a { padding-left: 36px !important; font-size: 13px !important; } /* botão "admin" no topo direito — fundir com a navbar preta */ .navbar .nav > li > .dropdown-toggle, .navbar .btn-navbar, .navbar .nav > li > a { background: transparent !important; background-image: none !important; border: 1px solid rgba(255, 255, 255, 0.15) !important; border-radius: 6px !important; color: #ffffff !important; text-shadow: none !important; box-shadow: none !important; padding: 6px 12px !important; margin: 12px 6px !important; } .navbar .nav > li > .dropdown-toggle:hover, .navbar .nav > li.open > .dropdown-toggle, .navbar .nav > li > a:hover { background: rgba(255, 255, 255, 0.10) !important; border-color: rgba(255, 255, 255, 0.25) !important; color: #ffffff !important; } /* dropdown da navbar (menu do utilizador no topo) — fundo branco sólido, texto escuro e hover claramente visível */ .navbar .dropdown-menu { background-color: #ffffff !important; border: 1px solid #d1d5db !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15) !important; border-radius: 8px !important; padding: 6px !important; margin-top: 4px !important; } .navbar .dropdown-menu > li > a { color: #1f2329 !important; background: transparent !important; background-image: none !important; text-shadow: none !important; padding: 8px 12px !important; border-radius: 6px !important; font-size: 14px !important; } .navbar .dropdown-menu > li > a:hover, .navbar .dropdown-menu > li > a:focus { background-color: #f3f4f6 !important; color: #1f2329 !important; } .navbar .dropdown-menu .divider { background-color: #e5e7eb !important; border: none !important; height: 1px !important; margin: 6px 0 !important; } .navbar .dropdown-menu-title, .navbar .dropdown-menu .nav-header { color: #6b7280 !important; text-shadow: none !important; padding: 6px 12px !important; font-weight: 600 !important; } /* ---- 5) Campos de formulário — toques simples --------------------- */ /* Cantos arredondados, padding consistente, focus visível. Cores e fundo continuam os do tema. */ input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="search"], input[type="tel"], input[type="url"], input[type="date"], input[type="datetime-local"], input[type="time"], input.input-large, input.input-medium, input.input-small, input.input-mini, input.span1, input.span2, input.span3, input.span4, input.span5, input.span6, textarea, select, .uneditable-input, .chzn-container .chzn-single, .chzn-container .chzn-search input, .chzn-container-multi .chzn-choices input { font-family: var(--bo-font) !important; font-size: 14px !important; border-radius: 6px !important; padding: 7px 11px !important; line-height: 1.4 !important; height: auto !important; box-shadow: none !important; transition: border-color .12s ease, box-shadow .12s ease; } input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="date"]:focus, input[type="datetime-local"]:focus, textarea:focus, select:focus { border-color: #006dcc !important; outline: none !important; box-shadow: 0 0 0 3px rgba(0, 109, 204, 0.15) !important; } textarea { min-height: 80px; } label, .control-label { font-weight: 500 !important; margin-bottom: 4px; } /* ---- Remover lowercase / uppercase forçado ------------------------ */ /* Repor `text-transform: none` em todos os elementos estruturais para que o texto apareça tal como é escrito nas views. */ body, h1, h2, h3, h4, h5, h6, .nav, .nav-tabs, .nav-stacked, .nav-tabs > li > a, .nav-tabs.nav-stacked > li > a, .nav-tabs.nav-stacked > li > ul > li > a, .breadcrumb, .breadcrumb a, .breadcrumb li, .btn, .btn-group .btn, .box-header, .box-header h2, .box-header span, .widget-title, .widget-title h2, .widget-title span, .table, .table th, .table td, .dropdown-menu, .dropdown-menu > li > a, .navbar, .navbar .brand, .navbar .nav > li > a, label, .control-label, legend, .alert, .modal-header, .modal-header h3, .dataTables_wrapper, .pagination, p, span, li, a, td, th, div { text-transform: none !important; }