/* ==========================================================================
   Curadobia — Design System v2
   Override layer carregado após custom.css
   Backup do original: custom.backup.css
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. DESIGN TOKENS
   -------------------------------------------------------------------------- */
:root {
  /* Backgrounds */
  --ds-bg-body:             #F2F3F7;
  --ds-bg-card:             #ffffff;
  --ds-bg-gray:             #F6F6F9;
  --ds-bg-gray-2:           #EDEDF0;
  --ds-bg-sidebar:          #171620;
  --ds-bg-sidebar-hover:    rgba(255,255,255,0.05);
  --ds-bg-sidebar-active:   rgba(26,187,156,0.13);
  --ds-bg-sidebar-sub:      rgba(0,0,0,0.15);

  /* Cor primária — teal (mantida) */
  --ds-primary:             #1ABB9C;
  --ds-primary-hover:       #17a589;
  --ds-primary-light:       rgba(26,187,156,0.12);
  --ds-primary-active-border: #1ABB9C;

  /* Status / Semânticas */
  --ds-success:             #22c55e;
  --ds-success-light:       rgba(34,197,94,0.12);
  --ds-danger:              #ef4444;
  --ds-danger-light:        rgba(239,68,68,0.12);
  --ds-warning:             #f59e0b;
  --ds-warning-light:       rgba(245,158,11,0.12);
  --ds-info:                #3b82f6;
  --ds-info-light:          rgba(59,130,246,0.12);

  /* Texto */
  --ds-text-heading:        #191822;
  --ds-text-body:           #57575A;
  --ds-text-muted:          #939397;
  --ds-text-disabled:       #B6B6B6;
  --ds-text-sidebar:        rgba(255,255,255,0.45);
  --ds-text-sidebar-hover:  rgba(255,255,255,0.80);
  --ds-text-sidebar-active: #ffffff;
  --ds-text-sidebar-label:  rgba(255,255,255,0.22);

  /* Bordas */
  --ds-border:              #E8E8E8;
  --ds-border-2:            #DFDFE0;

  /* Sombras */
  --ds-shadow-sm:           0 1px 3px rgba(25,24,34,0.06);
  --ds-shadow:              0 2px 8px rgba(25,24,34,0.08);
  --ds-shadow-md:           0 4px 16px rgba(25,24,34,0.10);

  /* Radius */
  --ds-radius-xs:           3px;
  --ds-radius-sm:           6px;
  --ds-radius:              10px;
  --ds-radius-lg:           14px;
  --ds-radius-pill:         100px;

  /* Dimensões do layout */
  --ds-sidebar-width:       230px;
  --ds-topbar-height:       56px;
}


/* --------------------------------------------------------------------------
   2. BODY & BACKGROUND GERAL
   -------------------------------------------------------------------------- */
body {
  background: var(--ds-bg-body) !important;
  color: var(--ds-text-body) !important;
  font-size: 13px;
}

body .container.body .right_col {
  background: var(--ds-bg-body) !important;
}

.right_col {
  background: var(--ds-bg-body) !important;
}

/* Links */
a {
  color: var(--ds-primary);
}
a:hover, a:focus {
  color: var(--ds-primary-hover);
}


/* --------------------------------------------------------------------------
   3. SIDEBAR — .left_col
   -------------------------------------------------------------------------- */
.left_col {
  background: var(--ds-bg-sidebar) !important;
  border-right: none;
}

/* Logo area */
.nav_title {
  background: var(--ds-bg-sidebar) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  height: 60px;
  display: flex;
  align-items: center;
  padding: 0 16px;
}

.site_title {
  color: #ffffff !important;
  font-size: 16px;
  font-weight: 700;
  line-height: 60px;
  height: 60px;
  letter-spacing: -0.3px;
}

/* Seções do menu */
.menu_section {
  margin-bottom: 8px;
}

.menu_section h3 {
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.7px !important;
  color: var(--ds-text-sidebar-label) !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
  padding: 14px 16px 4px !important;
  margin: 0 !important;
}

/* Menu items nível 1 */
.nav.side-menu > li > a {
  color: var(--ds-text-sidebar) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 9px 16px !important;
  margin-bottom: 1px;
  border-radius: var(--ds-radius-sm);
  margin: 0 6px 2px;
  transition: all 0.15s ease;
  border-left: 3px solid transparent !important;
  display: flex;
  align-items: center;
  gap: 8px;
}

.nav.side-menu > li > a:hover {
  background: var(--ds-bg-sidebar-hover) !important;
  color: var(--ds-text-sidebar-hover) !important;
}

/* Item ativo nível 1 */
.nav.side-menu > li.current-page,
.nav.side-menu > li.active {
  border-right: none !important;
}

.nav.side-menu > li.active > a,
.nav.side-menu > li.current-page > a {
  background: var(--ds-bg-sidebar-active) !important;
  color: var(--ds-text-sidebar-active) !important;
  border-left-color: var(--ds-primary) !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Submenu */
.nav.child_menu {
  background: transparent;
  padding: 2px 0 6px;
}

.nav.child_menu li {
  padding-left: 0 !important;
}

.nav.child_menu > li > a {
  color: rgba(255,255,255,0.35) !important;
  font-size: 12px !important;
  padding: 6px 16px 6px 44px !important;
  border-radius: var(--ds-radius-sm);
  margin: 0 6px;
  transition: all 0.12s ease;
}

.nav.child_menu > li > a:hover {
  color: rgba(255,255,255,0.75) !important;
  background: rgba(255,255,255,0.04) !important;
}

.nav.child_menu li.active > a,
.nav.child_menu li.current-page > a {
  color: var(--ds-primary) !important;
  background: transparent !important;
}

/* Bullet do submenu (nav-md) */
.nav-md ul.nav.child_menu li:before {
  background: rgba(26,187,156,0.5) !important;
  width: 5px !important;
  height: 5px !important;
  left: 26px !important;
  margin-top: 14px !important;
  border-radius: 50%;
}

.nav-md ul.nav.child_menu li:after {
  border-left: 1px solid rgba(26,187,156,0.25) !important;
  left: 28px !important;
}

/* Setas do menu */
.main_menu span.fa {
  color: rgba(255,255,255,0.25) !important;
  font-size: 9px !important;
}

/* Profile section */
.profile {
  border-bottom: 1px solid rgba(255,255,255,0.07);
  padding: 14px 16px !important;
  margin-bottom: 4px;
}

.profile_info span {
  color: rgba(255,255,255,0.35) !important;
  font-size: 11px !important;
}

.profile_info h2 {
  color: rgba(255,255,255,0.85) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

/* Nav sm (sidebar colapsada) */
.nav-sm .nav.child_menu,
.nav-sm ul.nav.child_menu {
  background: #12121a !important;
}

.nav-sm .nav.side-menu li.active-sm {
  border-right: none !important;
}

.nav-sm > .nav.side-menu > li.active-sm > a {
  color: var(--ds-primary) !important;
}


/* --------------------------------------------------------------------------
   4. TOPBAR — .top_nav
   -------------------------------------------------------------------------- */
.top_nav {
  background: var(--ds-bg-card);
  border-bottom: 1px solid var(--ds-border);
  box-shadow: var(--ds-shadow-sm);
}

.nav_menu {
  background: var(--ds-bg-card) !important;
  border-bottom: none !important;
  min-height: var(--ds-topbar-height) !important;
  display: flex !important;
  align-items: center;
}

.nav_menu nav {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0 16px;
}

/* Toggle hamburger */
.toggle {
  padding-top: 0 !important;
  display: flex;
  align-items: center;
}

.toggle a {
  padding: 8px 10px !important;
  color: var(--ds-text-body) !important;
  border-radius: var(--ds-radius-sm);
  transition: background 0.15s;
}

.toggle a:hover {
  background: var(--ds-bg-gray);
}

.toggle a i {
  font-size: 18px !important;
  color: var(--ds-text-body);
}

/* Navbar header (logo area no top) */
.navbar-header {
  background: var(--ds-bg-sidebar) !important;
}

/* Top nav items */
.top_nav .nav > li > a:focus,
.top_nav .nav > li > a:hover,
.top_nav .nav .open > a,
.top_nav .nav .open > a:focus,
.top_nav .nav .open > a:hover {
  background: var(--ds-bg-gray) !important;
  color: var(--ds-text-heading) !important;
}

/* --------------------------------------------------------------------------
   5. CARDS / PAINÉIS — .x_panel
   -------------------------------------------------------------------------- */
.x_panel {
  background: var(--ds-bg-card) !important;
  border: 1px solid var(--ds-border) !important;
  border-radius: var(--ds-radius) !important;
  box-shadow: var(--ds-shadow-sm) !important;
  padding: 0 !important;
  margin: 0 0 20px 0 !important;
  gap: 0 !important;
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}

.x_panel:hover {
  box-shadow: var(--ds-shadow) !important;
}

.x_title {
  border-bottom: 1px solid var(--ds-border) !important;
  padding: 12px 20px !important;
  margin-bottom: 0 !important;
  /* Float-based layout: pull-right vem antes do h2 no HTML (padrão Bootstrap) */
  overflow: hidden; /* clearfix */
  min-height: 52px;
  display: block !important;
}

.x_title h2 {
  font-family: 'Poppins', sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--ds-text-heading) !important;
  margin: 0 !important;
  float: left !important;
  line-height: 36px;
  white-space: nowrap;
}

/* Elementos pull-right dentro do x_title (botões, formulários, filtros) */
.x_title .pull-right {
  float: right !important;
  margin-top: 0 !important;
  line-height: 36px;
}

.x_title .pull-right .form-group,
.x_title .pull-right .input-group {
  margin-bottom: 0 !important;
}

.x_title .pull-right .btn {
  margin-top: 0 !important;
  vertical-align: middle;
}

.x_title h2 small {
  font-family: 'Inter', sans-serif;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: var(--ds-text-muted) !important;
  margin-left: 8px;
}

.x_title span {
  color: var(--ds-text-muted) !important;
}

.x_content {
  padding: 20px !important;
  margin-top: 0 !important;
}

/* Também reutilizado como x_content1 em alguns templates */
.x_content1 {
  padding: 16px 20px 20px !important;
}

/* Panel toolbox (ações no topo do card) */
.panel_toolbox {
  float: none !important;
}

.panel_toolbox > li > a {
  color: var(--ds-text-muted) !important;
  padding: 4px 6px !important;
  border-radius: var(--ds-radius-xs);
  transition: all 0.12s;
}

.panel_toolbox > li > a:hover {
  background: var(--ds-bg-gray) !important;
  color: var(--ds-text-body) !important;
}


/* --------------------------------------------------------------------------
   6. STAT CARDS / KPI TILES — .tile-stats
   -------------------------------------------------------------------------- */
.tile-stats {
  background: var(--ds-bg-card) !important;
  border: 1px solid var(--ds-border) !important;
  border-radius: var(--ds-radius) !important;
  box-shadow: var(--ds-shadow-sm) !important;
  padding: 20px !important;
  margin-bottom: 16px !important;
  overflow: visible !important;
  transition: box-shadow 0.2s ease, transform 0.2s ease !important;
}

.tile-stats:hover {
  box-shadow: var(--ds-shadow-md) !important;
  transform: translateY(-2px);
}

/* Ícone do tile-stats */
.tile-stats .icon {
  width: 44px !important;
  height: 44px !important;
  background: var(--ds-primary-light);
  border-radius: var(--ds-radius-pill) !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  position: relative !important;
  right: auto !important;
  top: auto !important;
  float: right;
  color: var(--ds-primary) !important;
}

.tile-stats .icon i {
  font-size: 22px !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* Número principal */
.tile-stats .count {
  font-family: 'Poppins', sans-serif !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  color: var(--ds-text-heading) !important;
  line-height: 1.2 !important;
  margin-left: 0 !important;
  margin-bottom: 4px !important;
}

/* Título do tile */
.tile-stats h3 {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--ds-text-muted) !important;
  margin: 0 0 8px 0 !important;
  margin-left: 0 !important;
}

/* Subtítulo/descrição */
.tile-stats p {
  font-size: 12px !important;
  color: var(--ds-text-muted) !important;
  margin-left: 0 !important;
  margin-top: 4px !important;
}

/* Footer do tile */
.tile-stats > .dash-box-footer {
  background: var(--ds-bg-gray) !important;
  color: var(--ds-text-muted) !important;
  border-top: 1px solid var(--ds-border);
  margin: 10px -20px -20px !important;
  padding: 8px 20px !important;
  font-size: 12px;
}

.tile-stats > .dash-box-footer:hover {
  background: var(--ds-bg-gray-2) !important;
  color: var(--ds-text-body) !important;
}

/* Hover icon animation off — clean look */
.tile-stats:hover .icon i {
  animation: none !important;
  color: var(--ds-primary) !important;
}


/* --------------------------------------------------------------------------
   7. TABELAS — .jambo_table
   -------------------------------------------------------------------------- */
table.jambo_table {
  border: 1px solid var(--ds-border) !important;
  border-radius: var(--ds-radius);
  overflow: hidden;
}

table.jambo_table thead {
  background: var(--ds-bg-gray) !important;
  color: var(--ds-text-body) !important;
}

table.jambo_table thead th {
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--ds-text-muted) !important;
  padding: 10px 12px !important;
  border-bottom: 1px solid var(--ds-border-2) !important;
  white-space: nowrap;
}

table.jambo_table tbody tr:hover td {
  background: var(--ds-bg-gray) !important;
  border-top: 1px solid var(--ds-border) !important;
  border-bottom: 1px solid var(--ds-border) !important;
}

table.jambo_table tbody tr.selected {
  background: var(--ds-primary-light) !important;
}

table.jambo_table tbody tr.selected td {
  border-top: 1px solid rgba(26,187,156,0.3) !important;
  border-bottom: 1px solid rgba(26,187,156,0.3) !important;
}

/* Borda entre linhas */
.table > tbody > tr > td,
.table > tbody > tr > th {
  border-top: 1px solid var(--ds-border);
  padding: 10px 12px;
  vertical-align: middle;
}

.table > thead > tr > th {
  border-bottom: 1px solid var(--ds-border-2) !important;
}

/* Datatable paginação */
.dataTables_paginate a {
  background: var(--ds-bg-gray) !important;
  border-color: var(--ds-border) !important;
  border-radius: var(--ds-radius-xs) !important;
  color: var(--ds-text-body) !important;
  padding: 4px 10px !important;
}

.dataTables_paginate a:hover {
  background: var(--ds-bg-gray-2) !important;
}

.paging_full_numbers a.paginate_active {
  background-color: var(--ds-primary-light) !important;
  border-color: rgba(26,187,156,0.3) !important;
  color: var(--ds-primary) !important;
}

/* Focus outline nas células */
table.dataTable th.focus,
table.dataTable td.focus {
  outline: 2px solid var(--ds-primary) !important;
}

/* Datatable controles */
.dataTables_length,
.dataTables_filter,
.dataTables_info,
.dataTables_paginate {
  font-size: 12px;
  color: var(--ds-text-muted);
}

.dataTables_filter input {
  border: 1px solid var(--ds-border-2) !important;
  border-radius: var(--ds-radius-sm) !important;
  padding: 4px 10px !important;
  font-size: 12px !important;
  color: var(--ds-text-body) !important;
  outline: none !important;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.dataTables_filter input:focus {
  border-color: var(--ds-primary) !important;
  box-shadow: 0 0 0 3px var(--ds-primary-light) !important;
}


/* --------------------------------------------------------------------------
   8. BOTÕES
   -------------------------------------------------------------------------- */
/* Reset margin agressivo do original */
button, .buttons, .btn, .modal-footer .btn + .btn {
  margin: 2px 3px !important;
}

/* Base btn */
.btn {
  font-family: 'Inter', sans-serif;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-radius: var(--ds-radius-sm) !important;
  transition: all 0.15s ease !important;
  line-height: 1.4 !important;
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
}

/* btn-default / btn-secondary */
.btn-default {
  background: var(--ds-bg-gray) !important;
  color: var(--ds-text-body) !important;
  border-color: var(--ds-border) !important;
}

.btn-default:hover, .btn-default:focus {
  background: var(--ds-bg-gray-2) !important;
  color: var(--ds-text-heading) !important;
  border-color: var(--ds-border-2) !important;
}

/* btn-primary */
.btn-primary {
  background: var(--ds-primary) !important;
  border-color: var(--ds-primary) !important;
  color: #fff !important;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  background: var(--ds-primary-hover) !important;
  border-color: var(--ds-primary-hover) !important;
  color: #fff !important;
}

/* btn-success */
.btn-success {
  background: var(--ds-success) !important;
  border-color: var(--ds-success) !important;
  color: #fff !important;
}

.btn-success:hover {
  background: #16a34a !important;
  border-color: #16a34a !important;
}

/* btn-danger */
.btn-danger {
  background: var(--ds-danger) !important;
  border-color: var(--ds-danger) !important;
  color: #fff !important;
}

.btn-danger:hover {
  background: #dc2626 !important;
  border-color: #dc2626 !important;
}

/* btn-warning */
.btn-warning {
  background: var(--ds-warning) !important;
  border-color: var(--ds-warning) !important;
  color: #fff !important;
}

/* btn-xs — usado extensivamente nos formulários do sistema */
.btn-xs {
  background: var(--ds-primary) !important;
  border-color: var(--ds-primary) !important;
  color: #fff !important;
  font-size: 11px !important;
  padding: 3px 10px !important;
  border-radius: var(--ds-radius-xs) !important;
}

.btn-xs:hover {
  background: var(--ds-primary-hover) !important;
  border-color: var(--ds-primary-hover) !important;
  color: #fff !important;
}

/* btn-sm */
.btn-sm {
  font-size: 12px !important;
  padding: 4px 10px !important;
}

/* btn-lg */
.btn-lg {
  font-size: 14px !important;
  padding: 10px 20px !important;
}


/* --------------------------------------------------------------------------
   9. FORMULÁRIOS
   -------------------------------------------------------------------------- */
.form-control {
  background: var(--ds-bg-card) !important;
  border: 1px solid var(--ds-border-2) !important;
  border-radius: var(--ds-radius-sm) !important;
  color: var(--ds-text-heading) !important;
  font-size: 13px !important;
  font-family: 'Inter', sans-serif;
  box-shadow: none !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
  height: 36px;
  padding: 0 12px !important;
}

.form-control:focus {
  border-color: var(--ds-primary) !important;
  box-shadow: 0 0 0 3px var(--ds-primary-light) !important;
  outline: none !important;
}

.form-control:disabled,
.form-control[readonly] {
  background: var(--ds-bg-gray) !important;
  color: var(--ds-text-muted) !important;
  cursor: not-allowed;
}

.form-control::placeholder {
  color: var(--ds-text-disabled) !important;
}

textarea.form-control {
  height: auto;
  padding: 8px 12px !important;
}

select.form-control {
  appearance: auto;
}

.form-group {
  margin-bottom: 14px;
}

label {
  font-size: 13px;
  font-weight: 500;
  color: var(--ds-text-body);
  margin-bottom: 5px;
}

/* Input group */
.input-group-btn .btn {
  height: 36px;
  margin: 0 !important;
  border-radius: 0 var(--ds-radius-sm) var(--ds-radius-sm) 0 !important;
}

/* Validation states */
.has-error .form-control {
  border-color: var(--ds-danger) !important;
}

.has-error .form-control:focus {
  box-shadow: 0 0 0 3px var(--ds-danger-light) !important;
}

.has-error .help-block,
.has-error .control-label {
  color: var(--ds-danger) !important;
}

.has-success .form-control {
  border-color: var(--ds-success) !important;
}


/* --------------------------------------------------------------------------
   10. ALERTAS / FLASH MESSAGES
   -------------------------------------------------------------------------- */
.alert-form {
  padding: 0 0 4px;
}

.alert {
  border-radius: var(--ds-radius-sm) !important;
  border: 1px solid transparent !important;
  padding: 12px 16px !important;
  font-size: 13px !important;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 12px !important;
}

.alert-success {
  background: var(--ds-success-light) !important;
  color: #166534 !important;
  border-color: rgba(34,197,94,0.25) !important;
}

.alert-danger,
.alert-error {
  background: var(--ds-danger-light) !important;
  color: #991b1b !important;
  border-color: rgba(239,68,68,0.25) !important;
}

.alert-warning {
  background: var(--ds-warning-light) !important;
  color: #92400e !important;
  border-color: rgba(245,158,11,0.25) !important;
}

.alert-info {
  background: var(--ds-info-light) !important;
  color: #1e40af !important;
  border-color: rgba(59,130,246,0.25) !important;
}

.alert .close {
  opacity: 0.5 !important;
  font-size: 18px;
  line-height: 1;
  color: currentColor !important;
  margin-left: auto;
}

.alert .close:hover {
  opacity: 1 !important;
}


/* --------------------------------------------------------------------------
   11. BADGES / LABELS
   -------------------------------------------------------------------------- */
.badge {
  border-radius: var(--ds-radius-pill) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  padding: 2px 7px !important;
}

.label {
  border-radius: var(--ds-radius-xs) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 2px 6px !important;
}

.label-default, .badge-default {
  background: var(--ds-bg-gray-2) !important;
  color: var(--ds-text-muted) !important;
}

.label-primary, .badge-primary {
  background: var(--ds-primary-light) !important;
  color: var(--ds-primary) !important;
}

.label-success, .badge-success {
  background: var(--ds-success-light) !important;
  color: var(--ds-success) !important;
}

.label-danger, .badge-danger {
  background: var(--ds-danger-light) !important;
  color: var(--ds-danger) !important;
}

.label-warning, .badge-warning {
  background: var(--ds-warning-light) !important;
  color: #b45309 !important;
}

.label-info, .badge-info {
  background: var(--ds-info-light) !important;
  color: var(--ds-info) !important;
}


/* --------------------------------------------------------------------------
   12. MODALS
   -------------------------------------------------------------------------- */
.modal-content {
  border-radius: var(--ds-radius-lg) !important;
  border: none !important;
  box-shadow: var(--ds-shadow-lg, 0 8px 32px rgba(25,24,34,0.18)) !important;
  overflow: hidden;
}

.modal-header {
  background: var(--ds-bg-card) !important;
  border-bottom: 1px solid var(--ds-border) !important;
  padding: 16px 20px !important;
}

.modal-title {
  font-family: 'Poppins', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--ds-text-heading) !important;
}

.modal-body {
  padding: 20px !important;
  background: var(--ds-bg-card);
}

.modal-footer {
  background: var(--ds-bg-gray) !important;
  border-top: 1px solid var(--ds-border) !important;
  padding: 12px 20px !important;
}

.modal-footer .btn {
  margin: 0 3px !important;
}

.modal-backdrop {
  background-color: rgba(25,24,34,0.7) !important;
}


/* --------------------------------------------------------------------------
   13. DROPDOWN MENUS
   -------------------------------------------------------------------------- */
.dropdown-menu {
  border: 1px solid var(--ds-border) !important;
  border-radius: var(--ds-radius-sm) !important;
  box-shadow: var(--ds-shadow-md) !important;
  padding: 4px !important;
  background: var(--ds-bg-card) !important;
}

.dropdown-menu > li > a {
  color: var(--ds-text-body) !important;
  padding: 7px 12px !important;
  font-size: 13px !important;
  border-radius: var(--ds-radius-xs);
  transition: background 0.12s;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  background: var(--ds-bg-gray) !important;
  color: var(--ds-text-heading) !important;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover {
  background: var(--ds-primary-light) !important;
  color: var(--ds-primary) !important;
}

.dropdown-divider,
.dropdown-menu .divider {
  border-color: var(--ds-border) !important;
  margin: 4px 0 !important;
}


/* --------------------------------------------------------------------------
   14. FOOTER
   -------------------------------------------------------------------------- */
footer {
  background: var(--ds-bg-card) !important;
  border-top: 1px solid var(--ds-border) !important;
  padding: 14px 20px !important;
  font-size: 12px !important;
  color: var(--ds-text-muted) !important;
}


/* --------------------------------------------------------------------------
   15. SCROLLBAR PERSONALIZADA
   -------------------------------------------------------------------------- */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: var(--ds-border-2);
  border-radius: var(--ds-radius-pill);
}

::-webkit-scrollbar-thumb:hover {
  background: #bbb;
}


/* --------------------------------------------------------------------------
   16. UTILITÁRIOS — manter compatibilidade com templates existentes
   -------------------------------------------------------------------------- */

/* .tile-stats dentro do .animated (com flipInY) */
.animated.flipInY .tile-stats {
  transform-origin: center;
}

/* Progress bars */
.progress {
  background: var(--ds-bg-gray-2) !important;
  border-radius: var(--ds-radius-pill) !important;
  height: 6px !important;
  box-shadow: none !important;
}

.progress-bar {
  background: var(--ds-primary) !important;
  border-radius: var(--ds-radius-pill) !important;
}

.progress-bar-success { background: var(--ds-success) !important; }
.progress-bar-warning { background: var(--ds-warning) !important; }
.progress-bar-danger  { background: var(--ds-danger) !important; }
.progress-bar-info    { background: var(--ds-info) !important; }
.progress-bar-dark    { background: var(--ds-text-heading) !important; }

/* Accordion */
.accordion .panel {
  border-radius: var(--ds-radius-sm) !important;
  border: 1px solid var(--ds-border) !important;
  margin-bottom: 6px !important;
  box-shadow: none !important;
}

.accordion .panel-heading {
  background: var(--ds-bg-gray) !important;
  border-radius: var(--ds-radius-sm) var(--ds-radius-sm) 0 0 !important;
  padding: 10px 14px !important;
}

.accordion .panel:hover {
  background: var(--ds-bg-card) !important;
}

/* Pagination */
.pagination > li > a,
.pagination > li > span {
  color: var(--ds-text-body) !important;
  border-color: var(--ds-border) !important;
  transition: all 0.12s;
}

.pagination > li > a:hover {
  background: var(--ds-bg-gray) !important;
  color: var(--ds-text-heading) !important;
  border-color: var(--ds-border-2) !important;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
  background: var(--ds-primary) !important;
  border-color: var(--ds-primary) !important;
  color: #fff !important;
}

/* iCheck inputs */
.icheckbox_flat-green,
.iradio_flat-green {
  border-radius: var(--ds-radius-xs);
}

/* NProgress */
#nprogress .bar {
  background: var(--ds-primary) !important;
}

#nprogress .peg {
  box-shadow: 0 0 10px var(--ds-primary), 0 0 5px var(--ds-primary) !important;
}

/* --------------------------------------------------------------------------
   17. RESPONSIVO — mobile overrides
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
  .right_col {
    padding: 12px !important;
  }

  .x_panel {
    margin: 0 0 16px 0 !important;
  }

  .tile-stats {
    margin-bottom: 12px !important;
  }
}

/* --------------------------------------------------------------------------
   18. PÁGINA DE LOGIN
   -------------------------------------------------------------------------- */
.login_wrapper {
  background: var(--ds-bg-body);
}

.login_wrapper .login_content {
  background: var(--ds-bg-card);
  border-radius: var(--ds-radius-lg);
  box-shadow: var(--ds-shadow-md);
  border: 1px solid var(--ds-border);
}