/* ============================================
   ORAEX - Modernização da Interface
   Paleta de cores baseada no branding ORAEX
   ============================================ */

/* Paleta de Cores ORAEX */
:root {
    --oraex-blue-dark: #0052a3;
    --oraex-blue: #0066cc;
    --oraex-blue-light: #0099ff;
    --oraex-blue-lighter: #4db8ff;
    --oraex-blue-pale: #e6f3ff;
    --oraex-white: #ffffff;
    --oraex-gray-light: #f5f5f5;
    --oraex-gray: #e0e0e0;
    --oraex-gray-dark: #666666;
    --oraex-text: #333333;
    --oraex-green: #28a745;
}

/* ============================================
   DASHBOARD - Small Boxes Modernizados
   ============================================ */

.small-box {
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    overflow: hidden;
    position: relative;
}

.small-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.small-box .inner {
    padding: 20px;
}

.small-box .inner h3 {
    font-size: 32px;
    font-weight: 700;
    margin: 0 0 10px 0;
}

.small-box .inner p {
    font-size: 14px;
    font-weight: 500;
    margin: 0;
}

.small-box .icon {
    position: absolute;
    right: 15px;
    top: 15px;
    font-size: 70px;
    opacity: 0.2;
    transition: all 0.3s ease;
}

.small-box:hover .icon {
    opacity: 0.3;
    transform: scale(1.1);
}

.small-box-footer {
    background: rgba(0, 0, 0, 0.1);
    padding: 12px 20px;
    display: block;
    text-align: center;
    font-weight: 600;
    transition: all 0.3s ease;
}

.small-box-footer:hover {
    background: rgba(0, 0, 0, 0.2);
}

/* Cores dos Small Boxes com gradientes modernos */
.small-box.bg-aqua {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%);
    color: var(--oraex-white) !important;
}

.small-box.bg-aqua .inner h3,
.small-box.bg-aqua .inner p,
.small-box.bg-aqua .icon,
.small-box.bg-aqua .small-box-footer {
    color: var(--oraex-white) !important;
}

.small-box.bg-green {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: var(--oraex-white) !important;
}

.small-box.bg-green .inner h3,
.small-box.bg-green .inner p,
.small-box.bg-green .icon,
.small-box.bg-green .small-box-footer {
    color: var(--oraex-white) !important;
}

.small-box.bg-yellow {
    background: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
    color: var(--oraex-white) !important;
}

.small-box.bg-yellow .inner h3,
.small-box.bg-yellow .inner p,
.small-box.bg-yellow .icon,
.small-box.bg-yellow .small-box-footer {
    color: var(--oraex-white) !important;
}

.small-box.bg-red {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: var(--oraex-white) !important;
}

.small-box.bg-red .inner h3,
.small-box.bg-red .inner p,
.small-box.bg-red .icon,
.small-box.bg-red .small-box-footer {
    color: var(--oraex-white) !important;
}

/* ============================================
   BOXES E CARDS MODERNIZADOS
   ============================================ */

.box {
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    border: none;
    overflow: hidden;
    transition: all 0.3s ease;
}

.box:hover {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}

.box-header {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%);
    color: var(--oraex-white) !important;
    padding: 15px 20px;
    border-bottom: none;
}

.box-header .box-title {
    font-weight: 600;
    font-size: 16px;
    margin: 0;
    color: var(--oraex-white) !important;
}

.box-header * {
    color: var(--oraex-white) !important;
}

.box-body {
    padding: 20px;
    background: var(--oraex-white);
}

/* ============================================
   BOTÕES MODERNIZADOS
   ============================================ */

.btn {
    border-radius: 8px;
    font-weight: 600;
    padding: 10px 20px;
    transition: all 0.3s ease;
    border: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.btn:active {
    transform: translateY(0);
}

.btn-primary {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%);
    color: var(--oraex-white) !important;
}

.btn-primary * {
    color: var(--oraex-white) !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, var(--oraex-blue-dark) 0%, var(--oraex-blue) 100%);
    color: var(--oraex-white) !important;
}

.btn-primary:hover * {
    color: var(--oraex-white) !important;
}

.btn-success {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: var(--oraex-white);
}

.btn-success:hover {
    background: linear-gradient(135deg, #218838 0%, #28a745 100%);
    color: var(--oraex-white);
}

.btn-app {
    border-radius: 10px;
    padding: 30px 25px !important;
    margin: 5px;
    background: var(--oraex-white);
    border: 2px solid var(--oraex-gray);
    color: var(--oraex-blue);
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    min-width: 120px !important;
    min-height: 120px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.btn-app:hover {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%);
    color: var(--oraex-white) !important;
    border-color: var(--oraex-blue);
    transform: translateY(-3px);
    box-shadow: 0 4px 15px rgba(0, 102, 204, 0.3);
}

.btn-app:hover * {
    color: var(--oraex-white) !important;
}

.btn-app i {
    font-size: 32px !important;
    display: block;
    margin-bottom: 10px;
    text-align: center;
}

.btn-app span,
.btn-app {
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ============================================
   TABELAS MODERNIZADAS
   ============================================ */

.table {
    border-radius: 8px;
    overflow: hidden;
}

.table thead {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%);
    color: var(--oraex-white) !important;
}

.table thead th {
    border: none;
    padding: 15px;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
    color: var(--oraex-white) !important;
}

.table thead th * {
    color: var(--oraex-white) !important;
}

.table tbody tr {
    transition: all 0.2s ease;
}

.table tbody tr:hover {
    background: var(--oraex-blue-pale);
    transform: scale(1.01);
}

.table tbody td {
    padding: 12px 15px;
    border-bottom: 1px solid var(--oraex-gray);
}

/* Labels modernizados */
.label {
    border-radius: 6px;
    padding: 5px 12px;
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.label-success {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
}

.label-danger {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
}

/* ============================================
   SIDEBAR MODERNIZADA
   ============================================ */

.main-sidebar {
    background: linear-gradient(180deg, var(--oraex-blue-dark) 0%, var(--oraex-blue) 100%);
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
    color: var(--oraex-white) !important;
}

.main-sidebar * {
    color: var(--oraex-white) !important;
}

.sidebar {
    padding-left: 0 !important;
    padding-right: 5px !important;
}

.sidebar-menu {
    padding-left: 5px !important;
    padding-right: 0 !important;
}

.sidebar-menu > li > a {
    border-radius: 8px;
    margin: 5px 5px 5px 0;
    padding: 12px 10px 12px 8px;
    transition: all 0.3s ease;
    color: var(--oraex-white) !important;
    border-left: 3px solid transparent !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    line-height: 1.4 !important;
}

.sidebar-menu > li > a > span {
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    display: inline-block !important;
    max-width: 100% !important;
}

.sidebar-menu > li > a > i {
    margin-right: 8px !important;
    width: 20px !important;
    text-align: center !important;
    flex-shrink: 0 !important;
}

.sidebar-menu > li > a {
    display: flex !important;
    align-items: flex-start !important;
}

.sidebar-menu > li > a > span {
    flex: 1 !important;
    min-width: 0 !important;
}

.sidebar-menu > li.treeview > a {
    border-left: 3px solid transparent !important;
}

.sidebar-menu > li.treeview > a:hover,
.sidebar-menu > li.treeview:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.sidebar-menu > li.treeview > a:hover *,
.sidebar-menu > li.treeview:hover > a * {
    color: var(--oraex-blue) !important;
}

.sidebar-menu > li.treeview.active > a,
.sidebar-menu > li.treeview.active:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.sidebar-menu > li.treeview.active > a *,
.sidebar-menu > li.treeview.active:hover > a * {
    color: var(--oraex-blue) !important;
}

.sidebar-menu > li > a * {
    color: var(--oraex-white) !important;
}

.sidebar-menu > li > a:hover,
.sidebar-menu > li:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    transform: translateX(5px);
    color: var(--oraex-blue) !important;
}

.sidebar-menu > li > a:hover *,
.sidebar-menu > li:hover > a * {
    color: var(--oraex-blue) !important;
}

.sidebar-menu > li.active > a,
.sidebar-menu > li.active:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.sidebar-menu > li.active > a *,
.sidebar-menu > li.active:hover > a * {
    color: var(--oraex-blue) !important;
}

.sidebar-menu .treeview-menu {
    background: linear-gradient(180deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.sidebar-menu .treeview-menu > li > a {
    padding: 10px 10px 10px 25px;
    border-radius: 6px;
    margin: 2px 5px 2px 0;
    transition: all 0.2s ease;
    color: rgba(255, 255, 255, 0.9) !important;
    border-left: 3px solid transparent !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    line-height: 1.4 !important;
}

.sidebar-menu .treeview-menu > li > a > span {
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    display: inline-block !important;
    max-width: 100% !important;
}

.sidebar-menu .treeview-menu > li > a > i {
    margin-right: 8px !important;
    width: 20px !important;
    text-align: center !important;
    flex-shrink: 0 !important;
}

.sidebar-menu .treeview-menu > li > a {
    display: flex !important;
    align-items: flex-start !important;
}

.sidebar-menu .treeview-menu > li > a > span {
    flex: 1 !important;
    min-width: 0 !important;
}

.sidebar-menu .treeview-menu > li > a * {
    color: rgba(255, 255, 255, 0.9) !important;
}

.sidebar-menu .treeview-menu > li > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    padding-left: 28px;
    color: var(--oraex-blue) !important;
}

.sidebar-menu .treeview-menu > li > a:hover * {
    color: var(--oraex-blue) !important;
}

.sidebar-menu .treeview-menu > li.active > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.sidebar-menu .treeview-menu > li.active > a * {
    color: var(--oraex-blue) !important;
}

/* ============================================
   NAVBAR MODERNIZADA
   ============================================ */

.main-header {
    background: linear-gradient(135deg, var(--oraex-blue-light) 0%, var(--oraex-blue-lighter) 100%);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    color: var(--oraex-white) !important;
    min-height: 50px !important;
    height: 50px !important;
}

.main-header .logo {
    height: 50px !important;
    min-height: 50px !important;
    display: flex !important;
    align-items: center !important;
}

.main-header .navbar {
    min-height: 50px !important;
    height: 50px !important;
    display: flex !important;
    align-items: center !important;
}

.main-header * {
    color: var(--oraex-white) !important;
}

.navbar-static-top {
    background: transparent;
    position: relative !important;
}

.navbar {
    position: relative !important;
}

.navbar-custom-menu > .navbar-nav > li > a {
    border-radius: 8px;
    margin: 5px;
    transition: all 0.3s ease;
    color: var(--oraex-white) !important;
    height: 50px !important;
    min-height: 50px !important;
    display: flex !important;
    align-items: center !important;
}

.navbar-custom-menu {
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    height: 50px !important;
}

.navbar-custom-menu > .navbar-nav {
    height: 50px !important;
    display: flex !important;
    align-items: center !important;
    float: right !important;
    margin-right: 0 !important;
}

.navbar-custom-menu > .navbar-nav > li > a * {
    color: var(--oraex-white) !important;
}

.navbar-custom-menu > .navbar-nav > li > a:hover {
    background: rgba(255, 255, 255, 0.15);
    color: var(--oraex-white) !important;
}

.navbar-custom-menu > .navbar-nav > li > a:hover * {
    color: var(--oraex-white) !important;
}

/* ============================================
   CONTENT HEADER MODERNIZADO
   ============================================ */

.content-header {
    background: var(--oraex-white);
    padding: 20px;
    border-radius: 12px;
    margin-bottom: 20px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.content-header h1 {
    color: var(--oraex-blue);
    font-weight: 700;
    margin: 0;
    font-size: 28px;
}

.content-header h1 small {
    color: var(--oraex-gray-dark);
    font-weight: 400;
    font-size: 18px;
}

.breadcrumb {
    background: transparent;
    padding: 0;
    margin: 10px 0 0 0;
}

.breadcrumb > li > a {
    color: var(--oraex-blue);
    text-decoration: none;
    transition: all 0.2s ease;
}

.breadcrumb > li > a:hover {
    color: var(--oraex-blue-dark);
    text-decoration: underline;
}

/* ============================================
   FORMULÁRIOS MODERNIZADOS
   ============================================ */

.form-control {
    border-radius: 8px;
    border: 2px solid var(--oraex-gray);
    padding: 10px 15px;
    transition: all 0.3s ease;
}

.form-control:focus {
    border-color: var(--oraex-blue);
    box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.1);
    outline: none;
}

/* Garantir que o conteúdo de todos os campos seja preto e visível */
.form-control,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
textarea,
select {
    color: var(--oraex-text) !important;
    background-color: var(--oraex-blue-pale) !important;
    line-height: 1.5 !important;
    padding: 10px 15px !important;
    vertical-align: middle !important;
    display: inline-block !important;
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    color: var(--oraex-blue-light) !important;
    opacity: 1;
}

/* Garantir que selects e options tenham texto preto */
select,
select option {
    color: var(--oraex-text) !important;
    background-color: var(--oraex-blue-pale) !important;
    line-height: 1.5 !important;
    padding: 10px 15px !important;
    vertical-align: middle !important;
}

select option {
    background-color: var(--oraex-blue-pale) !important;
    color: var(--oraex-text) !important;
    padding: 8px 12px !important;
}

/* Centralizar verticalmente o conteúdo dos campos */
.form-control,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"] {
    line-height: 1.5 !important;
    padding: 8px 12px !important;
    height: auto !important;
    min-height: 34px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

select {
    line-height: 1.5 !important;
    padding: 8px 12px !important;
    height: 34px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

textarea {
    line-height: 1.5 !important;
    padding: 8px 12px !important;
    vertical-align: top !important;
    box-sizing: border-box !important;
}

/* Garantir que o texto dentro dos campos esteja visível e centralizado */
.form-control,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
select {
    color: var(--oraex-text) !important;
    background-color: var(--oraex-blue-pale) !important;
    font-size: 14px !important;
    line-height: 1.42857143 !important;
    padding: 6px 12px !important;
    height: 34px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
}

/* Garantir que o valor dos inputs seja visível */
input[type="text"]::value,
input[type="email"]::value,
input[type="number"]::value,
select::value {
    color: var(--oraex-text) !important;
}

/* Select2 específico */
.select2-container .select2-selection--single {
    height: 34px !important;
    background-color: var(--oraex-blue-pale) !important;
    overflow: hidden !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 32px !important;
    padding-left: 12px !important;
    padding-right: 20px !important;
    color: var(--oraex-text) !important;
    background-color: var(--oraex-blue-pale) !important;
    height: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    display: block !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 32px !important;
    right: 1px !important;
}

/* ============================================
   LABELS - REGRAS GLOBAIS PARA TODAS AS TELAS
   ============================================ */

/* REGRA PADRÃO: Labels em fundos cinza/branco/transparente = PRETO */
.form-group > label,
.control-label,
label.control-label {
    color: var(--oraex-text) !important;
    font-weight: 600;
}

.box-body .form-group > label,
.box-body .form-group label,
.box-body .control-label {
    color: var(--oraex-text) !important;
    font-weight: 600;
}

.box-primary .form-group > label,
.box-primary .control-label {
    color: var(--oraex-text) !important;
    font-weight: 600;
}

/* Labels em campos readonly (fundo cinza) = PRETO */
.form-control[readonly] + label,
input[readonly] + label,
textarea[readonly] + label,
.form-group:has(.form-control[readonly]) > label,
.form-group:has(input[readonly]) > label {
    color: var(--oraex-text) !important;
    font-weight: 600;
}

/* EXCEÇÃO: Labels em fundos AZUIS = BRANCO */
.box-header .form-group > label,
.box-header .form-group label,
.box-header .control-label,
.bg-primary .form-group > label,
.bg-primary .control-label,
.bg-info .form-group > label,
.bg-info .control-label,
.bg-aqua .form-group > label,
.bg-aqua .control-label,
[class*="bg-blue"] .form-group > label,
[class*="bg-blue"] .control-label,
.small-box .form-group > label,
.small-box.bg-aqua .form-group > label,
.small-box.bg-aqua .control-label {
    color: var(--oraex-white) !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
    font-weight: 600;
}

/* Garantir que labels em elementos com background azul sejam brancos */
[style*="background"][style*="0066cc"] .form-group > label,
[style*="background"][style*="0052a3"] .form-group > label,
[style*="background"][style*="0099ff"] .form-group > label {
    color: var(--oraex-white) !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

/* ============================================
   FIXES EXISTENTES
   ============================================ */

a[aria-expanded=true] .fa-chevron-right {
   display: none;
}
a[aria-expanded=false] .fa-chevron-down {
   display: none;
}

/* Centralizar ícones quando menu estiver colapsado */
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a {
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > i {
  width: 100% !important;
  text-align: center !important;
  margin: 0 !important;
}

/* Item ativo quando menu estiver colapsado - mesmo estilo do expandido */
.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a,
.sidebar-mini.sidebar-collapse .sidebar-menu > li.active:hover > a {
  background: var(--oraex-white) !important;
  border-left: 4px solid var(--oraex-green) !important;
  color: var(--oraex-blue) !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a *,
.sidebar-mini.sidebar-collapse .sidebar-menu > li.active:hover > a * {
  color: var(--oraex-blue) !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a > i {
  color: var(--oraex-blue) !important;
}

/* Fix para menu colapsado: oculta o título quando menu está colapsado */
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right) {
  display: none !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
  width: auto !important;
  min-width: 234px;
  max-width: 520px;
  white-space: normal;
  z-index: 9998 !important;
  position: absolute !important;
  top: 0 !important;
  left: 50px !important;
  background: linear-gradient(180deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
  border-radius: 0 8px 8px 0 !important;
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.15) !important;
  padding-top: 0 !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span {
  white-space: normal !important;
  word-wrap: break-word;
  overflow-wrap: break-word;
  color: var(--oraex-blue) !important;
  font-weight: bold !important;
  position: absolute !important;
  z-index: 9999 !important;
  background: var(--oraex-white) !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > a > span:not(.pull-right) {
  z-index: 9999 !important;
  position: absolute !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a {
  color: var(--oraex-blue) !important;
  position: relative !important;
  background: transparent !important;
  z-index: 1 !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a * {
  color: var(--oraex-blue) !important;
  position: relative !important;
  z-index: 1 !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a i {
  z-index: 1 !important;
  position: relative !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover {
  z-index: 850 !important;
  position: relative !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu > li > a {
  white-space: normal !important;
  word-wrap: break-word;
  overflow-wrap: break-word;
  padding: 10px 10px 10px 25px !important;
  display: block !important;
  color: rgba(255, 255, 255, 0.9) !important;
  border-left: 3px solid transparent !important;
  border-radius: 6px !important;
  margin: 2px 5px 2px 0 !important;
  line-height: 1.4 !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu > li > a > span {
  white-space: normal !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  display: inline-block !important;
  max-width: 100% !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu > li > a * {
  color: rgba(255, 255, 255, 0.9) !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu > li > a:hover {
  background: var(--oraex-white) !important;
  border-left: 4px solid var(--oraex-green) !important;
  color: var(--oraex-blue) !important;
  padding-left: 45px !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu > li > a:hover * {
  color: var(--oraex-blue) !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu > li.active > a {
  background: var(--oraex-white) !important;
  border-left: 4px solid var(--oraex-green) !important;
  color: var(--oraex-blue) !important;
}

.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu > li.active > a * {
  color: var(--oraex-blue) !important;
}

.navbar-nav > li.notifications-menu > a,
.navbar-nav > li.messages-menu > a {
  position: relative;
}

.navbar-nav > li.notifications-menu > a > .label,
.navbar-nav > li.messages-menu > a > .label {
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: 10px;
  padding: 2px 5px;
  min-width: 18px;
  text-align: center;
  border-radius: 10px;
}

.main-header .navbar-brand {
  padding: 7px 15px;
  display: flex;
  align-items: center;
  height: 50px !important;
  min-height: 50px !important;
}

.main-header .navbar-brand img {
  max-height: 35px;
  width: auto;
}

.main-header .sidebar-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff !important;
  height: 50px !important;
  min-height: 50px !important;
  transition: all 0.3s ease;
  border-radius: 8px;
  margin: 0 5px;
}

.main-header .sidebar-toggle:hover {
  background: var(--oraex-white) !important;
  color: var(--oraex-blue) !important;
}

.main-header .sidebar-toggle:hover i {
  color: var(--oraex-blue) !important;
}

.main-header .sidebar-toggle i {
  font-size: 18px;
  color: #fff;
  transition: all 0.3s ease;
}

.main-header .sidebar-toggle:before {
  display: none !important;
  content: none !important;
}

/* ============================================
   RESPONSIVIDADE
   ============================================ */

@media (max-width: 768px) {
    .small-box {
        margin-bottom: 15px;
    }
    
    .btn-app {
        width: 100%;
        margin: 5px 0;
    }
    
    .content-header h1 {
        font-size: 22px;
    }
}

/* ============================================
   ANIMAÇÕES SUAVES
   ============================================ */

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.box, .small-box {
    animation: fadeIn 0.5s ease;
}

/* ============================================
   SCROLLBAR MODERNIZADA
   ============================================ */

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: var(--oraex-gray-light);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, var(--oraex-blue-dark) 0%, var(--oraex-blue) 100%);
}

/* ============================================
   SOBRESCRITA DO SKIN-BLUE COM PALETA ORAEX
   ============================================ */

.skin-blue .main-header .navbar {
    background: linear-gradient(135deg, var(--oraex-blue-light) 0%, var(--oraex-blue-lighter) 100%) !important;
    color: var(--oraex-white) !important;
}

.skin-blue .main-header {
    background: linear-gradient(135deg, var(--oraex-blue-light) 0%, var(--oraex-blue-lighter) 100%) !important;
}

/* ============================================
   SKIN ORANGE - DEV (Laranja)
   ============================================ */
.skin-orange .main-header,
.skin-orange .main-header .navbar,
.skin-orange .main-header .logo {
    background: linear-gradient(135deg, #ff8800 0%, #ffaa33 100%) !important;
}

.skin-orange .main-header .navbar .dropdown-menu {
    background: linear-gradient(135deg, #ff8800 0%, #ffaa33 100%) !important;
}

.skin-orange .main-header .navbar .dropdown-menu li.user-header,
.skin-orange .main-header .navbar .dropdown-menu li.user-footer,
.skin-orange .main-header .navbar .dropdown-menu .user-body {
    background: linear-gradient(135deg, #ff8800 0%, #ffaa33 100%) !important;
}

.skin-orange .main-header .navbar .dropdown-menu li a {
    color: var(--oraex-white) !important;
}

.skin-orange .main-header .navbar .dropdown-menu li.user-footer .btn-default {
    background: var(--oraex-white) !important;
    color: #ff8800 !important;
    border-color: var(--oraex-white) !important;
    font-weight: 600 !important;
}

.skin-orange .main-header .navbar .dropdown-menu li.user-footer .btn-default:hover {
    background: var(--oraex-white) !important;
    color: #cc6600 !important;
    border-color: var(--oraex-white) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

.skin-orange .navbar-nav > .user-menu.open > a {
    background: linear-gradient(135deg, #ff8800 0%, #ffaa33 100%) !important;
    color: var(--oraex-white) !important;
}

.skin-orange .main-header * {
    color: var(--oraex-white) !important;
}

.skin-orange .main-sidebar,
.skin-orange .left-side {
    background: linear-gradient(180deg, #cc6600 0%, #ff8800 100%) !important;
}

.skin-orange .sidebar-menu > li.header {
    background: rgba(0, 0, 0, 0.2) !important;
    color: rgba(255, 255, 255, 0.9) !important;
}

.skin-orange .sidebar-menu > li:hover > a,
.skin-orange .sidebar-menu > li > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #ff8800 !important;
}

.skin-orange .sidebar-menu > li:hover > a *,
.skin-orange .sidebar-menu > li > a:hover * {
    color: #ff8800 !important;
}

.skin-orange .sidebar-menu > li.active > a,
.skin-orange .sidebar-menu > li.active:hover > a,
.skin-orange .sidebar-menu > li.active > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #ff8800 !important;
}

.skin-orange .sidebar-menu > li.active > a *,
.skin-orange .sidebar-menu > li.active:hover > a *,
.skin-orange .sidebar-menu > li.active > a:hover * {
    color: #ff8800 !important;
}

.skin-orange .sidebar-menu > li.treeview > a:hover,
.skin-orange .sidebar-menu > li.treeview:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #ff8800 !important;
}

.skin-orange .sidebar-menu > li.treeview > a:hover *,
.skin-orange .sidebar-menu > li.treeview:hover > a * {
    color: #ff8800 !important;
}

.skin-orange .sidebar-menu > li.treeview.active > a,
.skin-orange .sidebar-menu > li.treeview.active:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #ff8800 !important;
}

.skin-orange .sidebar-menu > li.treeview.active > a *,
.skin-orange .sidebar-menu > li.treeview.active:hover > a * {
    color: #ff8800 !important;
}

.skin-orange .sidebar-menu > li > .treeview-menu {
    background: linear-gradient(180deg, #ff8800 0%, #ffaa33 100%) !important;
}

.skin-orange .sidebar a {
    color: rgba(255, 255, 255, 0.9) !important;
}

.skin-orange .treeview-menu > li > a {
    color: rgba(255, 255, 255, 0.8) !important;
    border-left: 3px solid transparent !important;
}

.skin-orange .treeview-menu > li.active > a,
.skin-orange .treeview-menu > li > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #ff8800 !important;
}

.skin-orange .treeview-menu > li.active > a *,
.skin-orange .treeview-menu > li > a:hover * {
    color: #ff8800 !important;
}

.skin-orange.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a,
.skin-orange.sidebar-mini.sidebar-collapse .sidebar-menu > li.active:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #ff8800 !important;
}

.skin-orange.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a *,
.skin-orange.sidebar-mini.sidebar-collapse .sidebar-menu > li.active:hover > a * {
    color: #ff8800 !important;
}

.skin-orange.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a > i {
    color: #ff8800 !important;
}

/* ============================================
   SKIN RED - STAGE-AWS (HML) - Vermelho
   ============================================ */
.skin-red .main-header,
.skin-red .main-header .navbar,
.skin-red .main-header .logo {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%) !important;
}

.skin-red .main-header .navbar .dropdown-menu {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%) !important;
}

.skin-red .main-header .navbar .dropdown-menu li.user-header,
.skin-red .main-header .navbar .dropdown-menu li.user-footer,
.skin-red .main-header .navbar .dropdown-menu .user-body {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%) !important;
}

.skin-red .main-header .navbar .dropdown-menu li a {
    color: var(--oraex-white) !important;
}

.skin-red .main-header .navbar .dropdown-menu li.user-footer .btn-default {
    background: var(--oraex-white) !important;
    color: #dc3545 !important;
    border-color: var(--oraex-white) !important;
    font-weight: 600 !important;
}

.skin-red .main-header .navbar .dropdown-menu li.user-footer .btn-default:hover {
    background: var(--oraex-white) !important;
    color: #c82333 !important;
    border-color: var(--oraex-white) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

.skin-red .navbar-nav > .user-menu.open > a {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%) !important;
    color: var(--oraex-white) !important;
}

.skin-red .main-header * {
    color: var(--oraex-white) !important;
}

.skin-red .main-sidebar,
.skin-red .left-side {
    background: linear-gradient(180deg, #c82333 0%, #dc3545 100%) !important;
}

.skin-red .sidebar-menu > li.header {
    background: rgba(0, 0, 0, 0.2) !important;
    color: rgba(255, 255, 255, 0.9) !important;
}

.skin-red .sidebar-menu > li:hover > a,
.skin-red .sidebar-menu > li > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #dc3545 !important;
}

.skin-red .sidebar-menu > li:hover > a *,
.skin-red .sidebar-menu > li > a:hover * {
    color: #dc3545 !important;
}

.skin-red .sidebar-menu > li.active > a,
.skin-red .sidebar-menu > li.active:hover > a,
.skin-red .sidebar-menu > li.active > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #dc3545 !important;
}

.skin-red .sidebar-menu > li.active > a *,
.skin-red .sidebar-menu > li.active:hover > a *,
.skin-red .sidebar-menu > li.active > a:hover * {
    color: #dc3545 !important;
}

.skin-red .sidebar-menu > li.treeview > a:hover,
.skin-red .sidebar-menu > li.treeview:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #dc3545 !important;
}

.skin-red .sidebar-menu > li.treeview > a:hover *,
.skin-red .sidebar-menu > li.treeview:hover > a * {
    color: #dc3545 !important;
}

.skin-red .sidebar-menu > li.treeview.active > a,
.skin-red .sidebar-menu > li.treeview.active:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #dc3545 !important;
}

.skin-red .sidebar-menu > li.treeview.active > a *,
.skin-red .sidebar-menu > li.treeview.active:hover > a * {
    color: #dc3545 !important;
}

.skin-red .sidebar-menu > li > .treeview-menu {
    background: linear-gradient(180deg, #dc3545 0%, #e05565 100%) !important;
}

.skin-red .sidebar a {
    color: rgba(255, 255, 255, 0.9) !important;
}

.skin-red .treeview-menu > li > a {
    color: rgba(255, 255, 255, 0.8) !important;
    border-left: 3px solid transparent !important;
}

.skin-red .treeview-menu > li.active > a,
.skin-red .treeview-menu > li > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #dc3545 !important;
}

.skin-red .treeview-menu > li.active > a *,
.skin-red .treeview-menu > li > a:hover * {
    color: #dc3545 !important;
}

.skin-red.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a,
.skin-red.sidebar-mini.sidebar-collapse .sidebar-menu > li.active:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: #dc3545 !important;
}

.skin-red.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a *,
.skin-red.sidebar-mini.sidebar-collapse .sidebar-menu > li.active:hover > a * {
    color: #dc3545 !important;
}

.skin-red.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a > i {
    color: #dc3545 !important;
}

.skin-purple .main-header,
.skin-purple .main-header .navbar,
.skin-purple .main-header .logo {
    background: linear-gradient(135deg, var(--oraex-blue-light) 0%, var(--oraex-blue-lighter) 100%) !important;
}

.skin-purple .main-header .navbar .dropdown-menu {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
}

.skin-purple .main-header .navbar .dropdown-menu li.user-header,
.skin-purple .main-header .navbar .dropdown-menu li.user-footer,
.skin-purple .main-header .navbar .dropdown-menu .user-body {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
}

.skin-purple .main-header .navbar .dropdown-menu li a {
    color: var(--oraex-white) !important;
}

.skin-purple .main-header .navbar .dropdown-menu li.user-footer .btn-default {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue) !important;
    border-color: var(--oraex-white) !important;
    font-weight: 600 !important;
}

.skin-purple .main-header .navbar .dropdown-menu li.user-footer .btn-default:hover {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue-dark) !important;
    border-color: var(--oraex-white) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

.skin-purple .navbar-nav > .user-menu.open > a {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
    color: var(--oraex-white) !important;
}

.skin-blue .main-header .navbar * {
    color: var(--oraex-white) !important;
}

.skin-blue .main-header .logo {
    background: linear-gradient(135deg, var(--oraex-blue-light) 0%, var(--oraex-blue-lighter) 100%) !important;
    color: var(--oraex-white) !important;
}

.skin-blue .main-header .logo * {
    color: var(--oraex-white) !important;
}

.skin-blue .main-header .logo:hover {
    background: linear-gradient(135deg, var(--oraex-blue-lighter) 0%, var(--oraex-blue-light) 100%) !important;
    color: var(--oraex-white) !important;
}

.skin-blue .main-header li.user-header {
    background: linear-gradient(135deg, var(--oraex-blue-dark) 0%, var(--oraex-blue) 100%) !important;
    color: var(--oraex-white) !important;
}

.skin-blue .main-header li.user-header * {
    color: var(--oraex-white) !important;
}

.skin-blue .main-sidebar,
.skin-blue .left-side {
    background: linear-gradient(180deg, var(--oraex-blue-dark) 0%, var(--oraex-blue) 100%) !important;
}

.skin-blue .sidebar-menu > li.header {
    background: rgba(0, 0, 0, 0.2) !important;
    color: rgba(255, 255, 255, 0.9) !important;
}

.skin-blue .sidebar-menu > li:hover > a,
.skin-blue .sidebar-menu > li > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.skin-blue .sidebar-menu > li:hover > a *,
.skin-blue .sidebar-menu > li > a:hover * {
    color: var(--oraex-blue) !important;
}

.skin-blue .sidebar-menu > li.active > a,
.skin-blue .sidebar-menu > li.active:hover > a,
.skin-blue .sidebar-menu > li.active > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.skin-blue .sidebar-menu > li.active > a *,
.skin-blue .sidebar-menu > li.active:hover > a *,
.skin-blue .sidebar-menu > li.active > a:hover * {
    color: var(--oraex-blue) !important;
}

.skin-blue .sidebar-menu > li.treeview > a:hover,
.skin-blue .sidebar-menu > li.treeview:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.skin-blue .sidebar-menu > li.treeview > a:hover *,
.skin-blue .sidebar-menu > li.treeview:hover > a * {
    color: var(--oraex-blue) !important;
}

.skin-blue .sidebar-menu > li.treeview.active > a,
.skin-blue .sidebar-menu > li.treeview.active:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.skin-blue .sidebar-menu > li.treeview.active > a *,
.skin-blue .sidebar-menu > li.treeview.active:hover > a * {
    color: var(--oraex-blue) !important;
}

.skin-blue .sidebar-menu > li > .treeview-menu {
    background: linear-gradient(180deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
}

.skin-blue .sidebar a {
    color: rgba(255, 255, 255, 0.9) !important;
}

.skin-blue .treeview-menu > li > a {
    color: rgba(255, 255, 255, 0.8) !important;
    border-left: 3px solid transparent !important;
}

.skin-blue .treeview-menu > li.active > a,
.skin-blue .treeview-menu > li > a:hover {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.skin-blue .treeview-menu > li.active > a *,
.skin-blue .treeview-menu > li > a:hover * {
    color: var(--oraex-blue) !important;
}

/* Item ativo quando menu estiver colapsado - skin-blue */
.skin-blue.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a,
.skin-blue.sidebar-mini.sidebar-collapse .sidebar-menu > li.active:hover > a {
    background: var(--oraex-white) !important;
    border-left: 4px solid var(--oraex-green) !important;
    color: var(--oraex-blue) !important;
}

.skin-blue.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a *,
.skin-blue.sidebar-mini.sidebar-collapse .sidebar-menu > li.active:hover > a * {
    color: var(--oraex-blue) !important;
}

.skin-blue.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a > i {
    color: var(--oraex-blue) !important;
}

/* ============================================
   BACKGROUND DO CONTENT AREA
   ============================================ */

.content-wrapper {
    background: var(--oraex-gray-light);
}

.content {
    padding: 20px;
}

/* ============================================
   GARANTIR TEXTO BRANCO EM FUNDOS AZUIS
   ============================================ */

/* Regra geral: qualquer elemento com fundo azul deve ter texto branco */
[style*="background"]:has([style*="linear-gradient"][style*="0066cc"]),
[style*="background"]:has([style*="linear-gradient"][style*="0052a3"]),
[style*="background"]:has([style*="linear-gradient"][style*="0099ff"]) {
    color: var(--oraex-white) !important;
}

/* Garantir texto branco em elementos com classes de fundo azul */
.bg-primary,
.bg-info,
.bg-aqua,
[class*="bg-blue"],
[class*="bg-oraex"] {
    color: var(--oraex-white) !important;
}

.bg-primary *,
.bg-info *,
.bg-aqua *,
[class*="bg-blue"] *,
[class*="bg-oraex"] * {
    color: var(--oraex-white) !important;
}

/* Garantir texto branco em dropdowns com fundo azul */
.dropdown-menu > li > a {
    color: var(--oraex-text) !important;
}

.skin-blue .dropdown-menu {
    background: var(--oraex-white) !important;
}

.skin-blue .main-header .navbar .dropdown-menu {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
}

.skin-blue .main-header .navbar .dropdown-menu li a {
    color: var(--oraex-white) !important;
}

.skin-blue .main-header .navbar .dropdown-menu li.user-header {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
}

.skin-blue .main-header .navbar .dropdown-menu li.user-header * {
    color: var(--oraex-white) !important;
}

.skin-blue .main-header .navbar .dropdown-menu li.user-footer {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
}

.skin-blue .main-header .navbar .dropdown-menu li.user-footer .btn-default {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue) !important;
    border-color: var(--oraex-white) !important;
    font-weight: 600 !important;
}

.skin-blue .main-header .navbar .dropdown-menu li.user-footer .btn-default:hover {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue-dark) !important;
    border-color: var(--oraex-white) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

/* Dropdown do usuário quando aberto - regras gerais para todos os temas */
.navbar-nav > .user-menu.open > a {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
    color: var(--oraex-white) !important;
}

.navbar-nav > .user-menu.open > a * {
    color: var(--oraex-white) !important;
}

/* Dropdown menu do usuário - regras gerais */
.main-header .navbar .dropdown-menu {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
}

.main-header .navbar .dropdown-menu li.user-header,
.main-header .navbar .dropdown-menu li.user-footer,
.main-header .navbar .dropdown-menu .user-body {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
}

.main-header .navbar .dropdown-menu li.user-header *,
.main-header .navbar .dropdown-menu li.user-footer *,
.main-header .navbar .dropdown-menu .user-body * {
    color: var(--oraex-white) !important;
}

.main-header .navbar .dropdown-menu li.user-footer .btn-default {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue) !important;
    border-color: var(--oraex-white) !important;
    font-weight: 600 !important;
}

.main-header .navbar .dropdown-menu li.user-footer .btn-default:hover {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue-dark) !important;
    border-color: var(--oraex-white) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

/* User body no dropdown */
.skin-blue .main-header .navbar .dropdown-menu .user-body {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.skin-blue .main-header .navbar .dropdown-menu .user-body a {
    color: var(--oraex-white) !important;
}

.skin-blue .main-header .navbar .dropdown-menu .user-body a:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: var(--oraex-white) !important;
}

/* Garantir texto branco em badges e labels com fundo azul */
.badge-primary,
.label-primary,
.badge-info,
.label-info {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
    color: var(--oraex-white) !important;
}

/* Garantir texto branco em alertas com fundo azul */
.alert-info,
.alert-primary {
    background: linear-gradient(135deg, var(--oraex-blue-pale) 0%, var(--oraex-blue-lighter) 100%);
    border-color: var(--oraex-blue);
    color: var(--oraex-blue-dark) !important;
}

/* Garantir texto branco em modais com header azul */
.modal-header.bg-primary,
.modal-header.bg-info {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%) !important;
    color: var(--oraex-white) !important;
}

.modal-header.bg-primary *,
.modal-header.bg-info * {
    color: var(--oraex-white) !important;
}

/* ============================================
   TELA DE VISUALIZAÇÃO DE AIMS-ITEMS
   ============================================ */

/* Boxes com fundo transparente */
.aims-items-form .box-primary {
    background: transparent;
    border: 1px solid var(--oraex-blue-lighter);
}

.aims-items-form .box-header {
    background: linear-gradient(135deg, var(--oraex-blue) 0%, var(--oraex-blue-light) 100%);
    color: var(--oraex-white) !important;
    padding: 15px 20px;
    border-bottom: none;
}

.aims-items-form .box-header * {
    color: var(--oraex-white) !important;
}

.aims-items-form .box-body {
    background: transparent;
    padding: 20px;
}

/* Campos readonly com fundo cinza e texto preto */
.aims-items-form .form-control[readonly],
.aims-items-form input[readonly],
.aims-items-form textarea[readonly],
.aims-items-form select[readonly] {
    background-color: #e9ecef !important;
    background-image: none !important;
    border: 1px solid #ced4da !important;
    color: var(--oraex-text) !important;
    cursor: not-allowed;
}

.aims-items-form .form-control[readonly]:focus,
.aims-items-form input[readonly]:focus,
.aims-items-form textarea[readonly]:focus,
.aims-items-form select[readonly]:focus {
    background-color: #e9ecef !important;
    border-color: #ced4da !important;
    color: var(--oraex-text) !important;
    box-shadow: none !important;
}

/* Garantir que todos os inputs dentro de aims-items-form tenham fundo cinza se readonly */
.aims-items-form input[type="text"][readonly],
.aims-items-form input[type="email"][readonly],
.aims-items-form input[type="number"][readonly],
.aims-items-form textarea[readonly],
.aims-items-form select[readonly] {
    background-color: #e9ecef !important;
    color: var(--oraex-text) !important;
}

/* Garantir que o conteúdo dos campos seja sempre preto e visível */
.aims-items-form .form-control,
.aims-items-form input,
.aims-items-form textarea,
.aims-items-form select {
    color: var(--oraex-text) !important;
    line-height: 1.5 !important;
    padding: 10px 15px !important;
    vertical-align: middle !important;
    min-height: 38px !important;
    display: inline-block !important;
}

.aims-items-form .form-control *,
.aims-items-form input *,
.aims-items-form textarea *,
.aims-items-form select * {
    color: var(--oraex-text) !important;
    vertical-align: middle !important;
}

/* Garantir que options em selects sejam pretos */
.aims-items-form select option {
    color: var(--oraex-text) !important;
    background-color: var(--oraex-white) !important;
    padding: 8px 12px !important;
    line-height: 1.5 !important;
}

/* Centralizar verticalmente conteúdo de selects */
.aims-items-form select {
    display: inline-block !important;
    vertical-align: middle !important;
}

/* Labels: preto em fundos cinza/branco (padrão) */
.aims-items-form .form-group > label,
.aims-items-form .control-label {
    color: var(--oraex-text) !important;
    font-weight: 600;
}

/* Garantir que textos dentro dos boxes sejam pretos */
.aims-items-form .box-body {
    color: var(--oraex-text) !important;
}

.aims-items-form .box-body p,
.aims-items-form .box-body span:not(.control-label):not(label),
.aims-items-form .box-body div:not(.form-group):not(.control-label):not(label) {
    color: var(--oraex-text) !important;
}

/* Exceção: textos em headers devem ser brancos */
.aims-items-form .box-header,
.aims-items-form .box-header * {
    color: var(--oraex-white) !important;
}

/* Labels: preto em fundos cinza/branco (padrão para aims-items) */
.aims-items-form .form-group > label,
.aims-items-form .form-group label,
.aims-items-form .control-label,
.aims-items-form label.control-label,
.aims-items-form .box-body .form-group > label,
.aims-items-form .box-body .form-group label,
.aims-items-form .box-body .control-label {
    color: var(--oraex-text) !important;
    font-weight: 600;
}

/* Labels em headers azuis devem ser brancos (exceção) */
.aims-items-form .box-header .form-group > label,
.aims-items-form .box-header .form-group label,
.aims-items-form .box-header .control-label {
    color: var(--oraex-white) !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
    font-weight: 600;
}

/* Campos de formulário dentro dos boxes */
.aims-items-form .form-group {
    margin-bottom: 15px;
}

.aims-items-form .form-group .form-control:not([readonly]),
.aims-items-form .form-group input:not([readonly]),
.aims-items-form .form-group select:not([readonly]),
.aims-items-form .form-group textarea:not([readonly]) {
    background-color: var(--oraex-blue-pale) !important;
    color: var(--oraex-text) !important;
    border: 1px solid #ced4da !important;
    line-height: 1.5 !important;
    padding: 10px 15px !important;
    vertical-align: middle !important;
    min-height: 38px !important;
    display: inline-block !important;
}

.aims-items-form .form-group .form-control::placeholder,
.aims-items-form .form-group input::placeholder {
    color: var(--oraex-blue-light) !important;
    opacity: 1;
}

/* Garantir que Select2 e outros widgets tenham texto preto */
.aims-items-form .select2-selection__rendered,
.aims-items-form .select2-selection__choice {
    color: var(--oraex-text) !important;
    line-height: 1.5 !important;
}

.aims-items-form .select2-container .select2-selection--single {
    height: 38px !important;
    overflow: hidden !important;
}

.aims-items-form .select2-container .select2-selection--single .select2-selection__rendered {
    color: var(--oraex-text) !important;
    line-height: 36px !important;
    padding-left: 12px !important;
    padding-right: 20px !important;
    height: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    display: block !important;
}

.aims-items-form .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--oraex-text) !important;
}

.aims-items-form .select2-results__option {
    color: var(--oraex-text) !important;
}

.aims-items-form .select2-results__option--highlighted {
    background-color: var(--oraex-blue) !important;
    color: var(--oraex-white) !important;
}

/* ============================================
   CORREÇÃO: Botões com fundo claro devem ter texto preto
   ============================================ */

/* Botões default (fundo cinza claro) - texto preto */
.btn-default,
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.btn-default:active:hover,
.btn-default.active:hover {
    background-color: #f4f4f4 !important;
    color: #333333 !important;
    border-color: #ddd !important;
}

/* Garantir que todos os botões com fundo claro tenham texto escuro */
.btn:not(.btn-primary):not(.btn-success):not(.btn-info):not(.btn-warning):not(.btn-danger):not(.btn-link) {
    color: #333333 !important;
}

/* Botões específicos que devem manter suas cores originais */
.btn-primary {
    background-color: #3c8dbc !important;
    color: #ffffff !important;
}

.btn-success {
    background-color: #00a65a !important;
    color: #ffffff !important;
}

.btn-info {
    background-color: #00c0ef !important;
    color: #ffffff !important;
}

.btn-warning {
    background-color: #f39c12 !important;
    color: #ffffff !important;
}

.btn-danger {
    background-color: #dd4b39 !important;
    color: #ffffff !important;
}

/* ============================================
   Kartik GridView - Cabeçalho mais grosso
   ============================================ */

.kv-panel-before,
.kv-panel-after {
    padding: 0 !important;
    min-height: 60px !important;
}

.kv-panel-before .panel-title,
.kv-panel-after .panel-title {
    font-size: 18px !important;
    font-weight: bold !important;
    padding: 10px 0 !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.kv-panel-before {
    background-color: #3c8dbc !important;
    color: white !important;
    border-bottom: 2px solid #2e6da4 !important;
}

.kv-panel-before * {
    color: white !important;
}

.kv-panel-before .box-tools {
    margin-top: 0 !important;
    margin-right: 10px !important;
}

/* Ajustar layout do heading do GridView */
.kv-panel-before > div {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
}

/* Estilo para botão de exportar no cabeçalho - Tela aims-items */
#export-button-container .btn-group {
    position: relative;
    z-index: 9999 !important;
}

#export-button-container .btn-group button,
#export-button-container .btn-group a {
    background: transparent !important;
    border: 1px solid rgba(255,255,255,0.3) !important;
    color: white !important;
    position: relative;
    z-index: 10000 !important;
}

#export-button-container .btn-group button i,
#export-button-container .btn-group a i,
#export-button-container .btn-group .fa,
#export-button-container .btn-group button .fa-share-square-o {
    color: white !important;
    z-index: 10001 !important;
    position: relative;
}

#export-button-container .btn-group button:hover,
#export-button-container .btn-group a:hover {
    background: rgba(255,255,255,0.1) !important;
    border-color: rgba(255,255,255,0.5) !important;
}

/* Estilo para o dropdown menu do botão de exportar - fundo branco, texto preto */
#export-button-container .btn-group .dropdown-menu {
    background-color: #ffffff !important;
    color: #333333 !important;
    border: 1px solid #ddd !important;
}

#export-button-container .btn-group .dropdown-menu li {
    background-color: #ffffff !important;
}

#export-button-container .btn-group .dropdown-menu li a {
    background-color: #ffffff !important;
    color: #333333 !important;
}

#export-button-container .btn-group .dropdown-menu li a:hover {
    background-color: #f5f5f5 !important;
    color: #333333 !important;
}

/* Ícones dentro do dropdown menu - cor preta */
#export-button-container .btn-group .dropdown-menu li a i,
#export-button-container .btn-group .dropdown-menu li a .fa {
    color: #333333 !important;
}

/* Header do dropdown */
#export-button-container .btn-group .dropdown-menu .dropdown-header {
    background-color: #ffffff !important;
    color: #333333 !important;
}

/* Ocultar toolbar vazio do kv-panel-before na tela aims-items */
.kv-panel-before .kv-grid-toolbar:empty {
    display: none !important;
}

/* Remover kv-panel-before que contém apenas toolbar vazio (após mover botão de exportar) */
.kv-panel-before:has(.kv-grid-toolbar:empty) {
    display: none !important;
}

/* Fallback para navegadores que não suportam :has() */
.kv-panel-before .btn-toolbar.kv-grid-toolbar:empty {
    display: none !important;
}

/* Garantir que todos os inputs e selects tenham texto preto */
.aims-items-form input[type="text"]:not([readonly]),
.aims-items-form input[type="email"]:not([readonly]),
.aims-items-form input[type="number"]:not([readonly]),
.aims-items-form input[type="password"]:not([readonly]),
.aims-items-form textarea:not([readonly]),
.aims-items-form select:not([readonly]) {
    color: var(--oraex-text) !important;
    background-color: var(--oraex-blue-pale) !important;
}

.aims-items-form .form-control:not([readonly]) {
    color: var(--oraex-text) !important;
    background-color: var(--oraex-blue-pale) !important;
}

.aims-items-form .select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 36px !important;
    padding-left: 12px !important;
    padding-right: 20px !important;
    color: var(--oraex-text) !important;
    height: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    display: block !important;
}

.aims-items-form .select2-selection__placeholder {
    color: var(--oraex-blue-light) !important;
}

.aims-items-form .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--oraex-blue-light) !important;
}

/* Timeline items com fundo transparente */
.aims-items-form .timeline-item {
    background: transparent;
    border: 1px solid var(--oraex-blue-lighter);
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 15px;
}

.aims-items-form .timeline-body {
    color: var(--oraex-text) !important;
}

.aims-items-form .timeline-body * {
    color: var(--oraex-text) !important;
}

.aims-items-form .timeline-header {
    color: var(--oraex-text) !important;
}

.aims-items-form .timeline-header * {
    color: var(--oraex-text) !important;
}

/* Info box com fundo transparente */
.aims-items-form .info-box {
    background: transparent;
    border: 1px solid var(--oraex-blue-lighter);
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.aims-items-form .info-box-content {
    color: var(--oraex-text) !important;
}

.aims-items-form .info-box-content * {
    color: var(--oraex-text) !important;
}

/* Mailbox read info com fundo transparente */
.aims-items-form .mailbox-read-info {
    background: transparent;
    border: 1px solid var(--oraex-blue-lighter);
    border-radius: 8px;
    padding: 15px;
    margin: 10px 0;
}

.aims-items-form .mailbox-read-info * {
    color: var(--oraex-text) !important;
}

/* Tabelas dentro da view */
.aims-items-form .table {
    background: var(--oraex-white);
}

.aims-items-form .table tbody td {
    background: var(--oraex-white);
    color: var(--oraex-text) !important;
}

.aims-items-form .table tbody td * {
    color: var(--oraex-text) !important;
}

/* ============================================
   DROPDOWNS DE NOTIFICAÇÕES E MENSAGENS
   ============================================ */

/* Dropdown de notificações - caixa branca com fonte azul e borda azul */
.navbar-nav > .notifications-menu > .dropdown-menu {
    background: var(--oraex-white) !important;
    border: 2px solid var(--oraex-blue) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.2) !important;
}

.navbar-nav > .notifications-menu > .dropdown-menu > li.header {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue) !important;
    border-bottom: 1px solid var(--oraex-blue) !important;
    font-weight: 600 !important;
}

.navbar-nav > .notifications-menu > .dropdown-menu > li.header * {
    color: var(--oraex-blue) !important;
}

.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a {
    color: var(--oraex-blue) !important;
    background: var(--oraex-white) !important;
}

.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a * {
    color: var(--oraex-blue) !important;
}

.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a:hover {
    background: var(--oraex-blue-pale) !important;
    color: var(--oraex-blue-dark) !important;
}

.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a:hover * {
    color: var(--oraex-blue-dark) !important;
}

.navbar-nav > .notifications-menu > .dropdown-menu > li.footer > a {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue) !important;
    border-top: 1px solid var(--oraex-blue) !important;
    font-weight: 600 !important;
}

.navbar-nav > .notifications-menu > .dropdown-menu > li.footer > a:hover {
    background: var(--oraex-blue-pale) !important;
    color: var(--oraex-blue-dark) !important;
}

/* Dropdown de mensagens - caixa branca com fonte azul e borda azul */
.navbar-nav > .messages-menu > .dropdown-menu {
    background: var(--oraex-white) !important;
    border: 2px solid var(--oraex-blue) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.2) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li.header {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue) !important;
    border-bottom: 1px solid var(--oraex-blue) !important;
    font-weight: 600 !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li.header * {
    color: var(--oraex-blue) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a {
    color: var(--oraex-blue) !important;
    background: var(--oraex-white) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a * {
    color: var(--oraex-blue) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a h4 {
    color: var(--oraex-blue) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a h4 small {
    color: var(--oraex-blue-light) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a p {
    color: var(--oraex-blue-dark) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:hover {
    background: var(--oraex-blue-pale) !important;
    color: var(--oraex-blue-dark) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:hover * {
    color: var(--oraex-blue-dark) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:hover h4 {
    color: var(--oraex-blue-dark) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:hover p {
    color: var(--oraex-blue-dark) !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li.footer > a {
    background: var(--oraex-white) !important;
    color: var(--oraex-blue) !important;
    border-top: 1px solid var(--oraex-blue) !important;
    font-weight: 600 !important;
}

.navbar-nav > .messages-menu > .dropdown-menu > li.footer > a:hover {
    background: var(--oraex-blue-pale) !important;
    color: var(--oraex-blue-dark) !important;
}

/* Garantir que todos os elementos dentro dos dropdowns tenham cores corretas */
.navbar-nav > .notifications-menu > .dropdown-menu *,
.navbar-nav > .messages-menu > .dropdown-menu * {
    color: var(--oraex-blue) !important;
}

/* Exceção: ícones podem manter suas cores originais */
.navbar-nav > .notifications-menu > .dropdown-menu .fa,
.navbar-nav > .notifications-menu > .dropdown-menu .far,
.navbar-nav > .messages-menu > .dropdown-menu .fa,
.navbar-nav > .messages-menu > .dropdown-menu .far {
    color: var(--oraex-blue) !important;
}

/* ============================================
   CORREÇÃO GLOBAL: Campos com fundo azul claro e texto preto
   ============================================ */

/* Todos os campos de formulário devem ter fundo azul claro */
/* A cor do texto será ajustada automaticamente pelo JavaScript baseado na luminosidade */
.form-control:not([readonly]):not([disabled]),
input[type="text"]:not([readonly]):not([disabled]),
input[type="email"]:not([readonly]):not([disabled]),
input[type="number"]:not([readonly]):not([disabled]),
input[type="password"]:not([readonly]):not([disabled]),
textarea:not([readonly]):not([disabled]),
select:not([readonly]):not([disabled]) {
    background-color: var(--oraex-blue-pale) !important;
    color: var(--oraex-text) !important;
    /* Cor do texto será ajustada pelo JavaScript auto-text-color.js se necessário */
}

/* Botões com fundo claro devem ter texto preto */
.btn-default,
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active {
    background-color: #f4f4f4 !important;
    color: #333333 !important;
    border-color: #ddd !important;
}

/* Garantir que botões com fundo claro tenham texto escuro */
.btn:not(.btn-primary):not(.btn-success):not(.btn-info):not(.btn-warning):not(.btn-danger):not(.btn-danger) {
    color: #333333 !important;
}

/* Select2 widgets também devem ter fundo azul claro */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    background-color: var(--oraex-blue-pale) !important;
    height: 34px !important;
    overflow: hidden !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    /* Cor do texto será ajustada pelo JavaScript auto-text-color.js */
    line-height: 32px !important;
    height: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    display: block !important;
}

/* Garantir que options do select também tenham fundo azul claro */
.select2-results__option {
    background-color: var(--oraex-blue-pale) !important;
    color: var(--oraex-text) !important;
}

.select2-results__option--highlighted {
    background-color: var(--oraex-blue) !important;
    color: var(--oraex-white) !important;
}

/* ============================================
   CORREÇÃO: Botões com fundo claro devem ter texto preto
   ============================================ */

/* Botões default (fundo cinza claro) - texto preto */
.btn-default,
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.btn-default:active:hover,
.btn-default.active:hover {
    background-color: #f4f4f4 !important;
    color: #333333 !important;
    border-color: #ddd !important;
}

/* Garantir que todos os botões com fundo claro tenham texto escuro */
.btn:not(.btn-primary):not(.btn-success):not(.btn-info):not(.btn-warning):not(.btn-danger):not(.btn-link) {
    color: #333333 !important;
}

/* Botões específicos que devem manter suas cores originais */
.btn-primary {
    background-color: #3c8dbc !important;
    color: #ffffff !important;
}

.btn-success {
    background-color: #00a65a !important;
    color: #ffffff !important;
}

.btn-info {
    background-color: #00c0ef !important;
    color: #ffffff !important;
}

.btn-warning {
    background-color: #f39c12 !important;
    color: #ffffff !important;
}

.btn-danger {
    background-color: #dd4b39 !important;
    color: #ffffff !important;
}

/* ============================================
   Kartik GridView - Cabeçalho mais grosso
   ============================================ */

.kv-panel-before,
.kv-panel-after {
    padding: 0 !important;
    min-height: 60px !important;
}

.kv-panel-before .panel-title,
.kv-panel-after .panel-title {
    font-size: 18px !important;
    font-weight: bold !important;
    padding: 10px 0 !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.kv-panel-before {
    background-color: #3c8dbc !important;
    color: white !important;
    border-bottom: 2px solid #2e6da4 !important;
}

.kv-panel-before * {
    color: white !important;
}

.kv-panel-before .box-tools {
    margin-top: 0 !important;
    margin-right: 10px !important;
}

/* Ajustar layout do heading do GridView */
.kv-panel-before > div {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
}

/* Estilo para botão de exportar no cabeçalho - Tela aims-items */
#export-button-container .btn-group {
    position: relative;
    z-index: 9999 !important;
}

#export-button-container .btn-group button,
#export-button-container .btn-group a {
    background: transparent !important;
    border: 1px solid rgba(255,255,255,0.3) !important;
    color: white !important;
    position: relative;
    z-index: 10000 !important;
}

#export-button-container .btn-group button i,
#export-button-container .btn-group a i,
#export-button-container .btn-group .fa,
#export-button-container .btn-group button .fa-share-square-o {
    color: white !important;
    z-index: 10001 !important;
    position: relative;
}

#export-button-container .btn-group button:hover,
#export-button-container .btn-group a:hover {
    background: rgba(255,255,255,0.1) !important;
    border-color: rgba(255,255,255,0.5) !important;
}

/* Estilo para o dropdown menu do botão de exportar - fundo branco, texto preto */
#export-button-container .btn-group .dropdown-menu {
    background-color: #ffffff !important;
    color: #333333 !important;
    border: 1px solid #ddd !important;
}

#export-button-container .btn-group .dropdown-menu li {
    background-color: #ffffff !important;
}

#export-button-container .btn-group .dropdown-menu li a {
    background-color: #ffffff !important;
    color: #333333 !important;
}

#export-button-container .btn-group .dropdown-menu li a:hover {
    background-color: #f5f5f5 !important;
    color: #333333 !important;
}

/* Ícones dentro do dropdown menu - cor preta */
#export-button-container .btn-group .dropdown-menu li a i,
#export-button-container .btn-group .dropdown-menu li a .fa {
    color: #333333 !important;
}

/* Header do dropdown */
#export-button-container .btn-group .dropdown-menu .dropdown-header {
    background-color: #ffffff !important;
    color: #333333 !important;
}

/* Ocultar toolbar vazio do kv-panel-before na tela aims-items */
.kv-panel-before .kv-grid-toolbar:empty {
    display: none !important;
}

/* Remover kv-panel-before que contém apenas toolbar vazio (após mover botão de exportar) */
.kv-panel-before:has(.kv-grid-toolbar:empty) {
    display: none !important;
}

/* Fallback para navegadores que não suportam :has() */
.kv-panel-before .btn-toolbar.kv-grid-toolbar:empty {
    display: none !important;
}