.side-nav-second-level {
  padding-left: 15px;
}

.side-nav-third-level {
  padding-left: 30px;
}

.side-nav-forth-level {
  padding-left: 45px;
}


body .select2-container--bootstrap-5 .select2-selection {
  color: var(--bs-body-color);
  background-color: var(--bs-body-bg);
  border: var(--bs-border-width) solid var(--bs-border-color);
}

.select2-results__option--selected {
  background-color: var(--ct-primary) !important;
}

.select2-selection__choice__display {
  color: white;
}


.card-shadow {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
}

.hidden-client {
  display: none !important;
}

/* Define a altura da topbar */
.navbar-custom .topbar {
  height: 70px;
  /* Ajuste conforme necessário */
}

@media (max-width: 768px) {
  .page-container {
    margin-left: 20px !important;
    /* Reduz o margin-left para telas menores */
    margin-right: 20px !important;
    /* Reduz o margin-left para telas menores */
  }
}

.page-container {
  margin-left: 90px;
  /* Ajuste o valor conforme necessário */
  margin-right: 20px;
  /* Ajuste o valor conforme necessário */
}

.logo-lg img {
  width: 150px !important;
  /* Ajuste o valor conforme necessário */
  height: auto !important;
  /* Mantém a proporção da imagem */
}

.logo-sm img {
  width: 53px !important;
  /* Ajuste o valor conforme necessário */
  height: auto !important;
  /* Mantém a proporção da imagem */
  margin-left: -12px;
}

.badge-no-uppercase {
  text-transform: none;
}

.client-logo {
  width: 60px;
  /* Ajuste o tamanho máximo conforme necessário */
  height: 60px;
  /* Mantém a proporção da imagem */
  object-fit: contain;
  /* Garante que a imagem se ajuste ao container sem distorção */
}

.client-logo-lg {
  width: 80px;
  /* Ajuste o tamanho máximo conforme necessário */
  height: 80px;
  /* Mantém a proporção da imagem */
  object-fit: contain;
  /* Garante que a imagem se ajuste ao container sem distorção */
}

.loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  /* Fundo semitransparente */
  z-index: 9999;
  /* Certifique-se de que está acima de todos os outros elementos */
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: all;
  /* Garante que o overlay bloqueie cliques */
  transition: opacity 0.3s ease-in-out;
  /* Transição suave para a opacidade */
  backdrop-filter: blur(3px);
  /* Adiciona um efeito de desfoque ao fundo */
}

.loading-overlay .loading-content i {
  font-size: 100px;
  /* Tamanho do ícone */
  color: white;
  /* Cor do ícone */
  animation: spin 1s linear infinite;
  /* Animação de rotação */
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.fixed-height-row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  /* Garante que todos os itens tenham a mesma altura */
}

.fixed-height-row .card {
  display: flex;
  flex-direction: column;
  /* Garante que o conteúdo interno do card seja organizado verticalmente */
  flex-grow: 1;
}

.fixed-height-row>[class*="col-"] {
  display: flex;
  flex-direction: column;
  /* Garante que o conteúdo interno seja organizado verticalmente */
}

.chart-container {
  max-width: 100% !important;
  /* Ajusta o gráfico ao tamanho do container */
  height: 150px !important;
  /* Reduz ainda mais a altura */
  overflow: hidden;
  /* Garante que o conteúdo não ultrapasse o container */
  flex-grow: 1;
}

.card-scrollable {
  max-height: 320px;
  /* Define a altura máxima do card */
  overflow-y: auto;
  /* Adiciona a barra de rolagem vertical */
}

.text-justify {
  text-align: justify;
}


/* Estilo para a caixa de seleçãoo múltipla */
.select2-selection--multiple {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  align-items: center;
  min-height: 38px;
  max-height: 38px;
  padding: 3px !important;
  /* padding uniforme */
  gap: 4px;
}

/* Remove quebras de linha entre os itens */
.select2-selection__rendered {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  align-items: center;
  padding: 0 !important;
  /* remove padding extra */
}

/* Itens selecionados */
.select2-selection__choice {
  height: 30px;
  /* define a altura do chip */
  display: flex;
  align-items: center;
  padding: 0px;
  /* espaço interno horizontal */
  font-size: 14px;
  line-height: 30px;
  border-radius: 4px;
  margin: 2px !important;
  /* zera margin */
  background-color: #6a74f7;
  color: white;
  max-height: 30px;
  /* garante que ele não ultrapasse */
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.select2-selection__choice__display {
  font-size: 12px;
}

/* Remove a barra de rolagem para aparência limpa */
.select2-selection--multiple::-webkit-scrollbar {
  display: none;
}

.select2-selection--multiple {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.select2-search__field::placeholder {
  padding-left: 8px;
}

.card-loading {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.7);
  /* opcional: fundo translúcido */
  z-index: 10;
}

.dashboard-metric {
  position: relative;
}

div.dataTables_paginate {
  text-align: left !important;
  justify-content: flex-start !important;
  display: flex !important;
}

.modal.modal-blur {
  filter: blur(2px) brightness(0.7);
  pointer-events: none;
  /* Impede interação com o modal de fundo */
  transition: filter 0.2s;
}

.cursor-copy {
  cursor: pointer;
}

.sensitive-hidden {
  filter: blur(6px) !important;
  pointer-events: none !important;
  user-select: none !important;
}

.sensitive-hidden-img {
  opacity: 0.2;
  filter: blur(8px) grayscale(1);
  pointer-events: none;
}

.date-period-col {
  transition: width 0.2s;
  min-width: 180px;
  max-width: 420px;
}

.date-period-col.shrink {
  min-width: 120px;
  max-width: 180px;
}

.simulated-disabled {
  background-color: #e9ecef !important;
  color: #6c757d !important;
  border-color: #dee2e6 !important;
  cursor: pointer !important;
}

.color-checkbox-size {
  width: 1.1em;
  height: 1.1em;
  min-width: 1.1em;
  min-height: 1.1em;
  padding: 0;
  border: none;
  background: none;
  vertical-align: middle;
}

.custom-card {
  background: #f8f8f8;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  margin: 8px 0;
  overflow: hidden;
  /*min-width: 220px;*/
  cursor: pointer;
}

.custom-card-title {
  color: #fff;
  font-weight: bold;
  font-size: 1.1rem;
  text-align: center;
  padding: 12px 8px 8px 8px;
}

.custom-card-value {
  background: #fff;
  font-weight: bold;
  font-size: 1.2rem;
  text-align: center;
  padding: 16px 8px 12px 8px;
}

.custom-card-small-title {
  color: #fff;
  font-size: 0.9rem;
  text-align: center;
  padding: 8px 8px 4px 8px;
}

.custom-card-small-value {
    background: #fff;
    font-size: 1.1rem;
    text-align: center;
    padding: 12px 8px 8px 8px;
}

:root {
  --funnel-stage-1: #003366;
  --funnel-stage-2: #1a4d80;
  --funnel-stage-3: #336699;
  --funnel-stage-4: #4d80b2;
  --funnel-stage-5: #6699cc;
  --ct-primary: var(--funnel-stage-1) !important;
  --ct-primary-rgb: 0, 51, 102 !important;
  /* RGB de #003366 */
  --ct-primary-text-emphasis: #002244 !important;
  --ct-primary-bg-subtle: #e6eaf0 !important;
  --ct-primary-border-subtle: #b3c2d6 !important;
  --ct-btn-hover-bg: var(--funnel-stage-3) !important;
  --ct-btn-active-bg: var(--funnel-stage-3) !important;
  --ct-link-hover-color: var(--funnel-stage-1) !important;
}


.metric-chart-container {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  height: 100% !important;
  box-sizing: border-box;
  display: flex;
  align-items: stretch;
}

.metric-chart-container>* {
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}

.no-card-style {
  all: unset;
  display: block;
  /* ou outro valor conforme necessário */
}

.dt-scroll-body{
    border-bottom: none !important;
}

.icon-group {
    width: 48px;
    height: 48px;
    background: #f1f3f5;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    cursor: pointer;
    transition: all 0.25s ease;
    position: relative;
}

/* Ícones agrupados (estado normal) */
.icon-group img {
    width: 16px;
    height: 16px;
    transition: all 0.25s ease;
}

/* Hover: abre o grupo */
.icon-group:hover {
    width: auto;
    height: auto;
    padding: 10px 12px;
    border-radius: 14px;
    flex-direction: column;
    background: #ffffff;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}

/* Hover: ícones maiores */
.icon-group:hover img {
    width: 26px; /* pode usar 30px se preferir */
    height: 26px;
}

.dtfc-fixed-start, .dtfc-fixed-left,
.dtfc-fixed-right {
    z-index: 999 !important;
}

table.dataTable thead .dtfc-fixed-start, table.dataTable thead .dtfc-fixed-end, table.dataTable tfoot .dtfc-fixed-start, table.dataTable tfoot .dtfc-fixed-end,
table.dataTable tbody .dtfc-fixed-start, table.dataTable tbody .dtfc-fixed-end {
    background-color: var(--ct-table-striped-bg) !important;
    z-index: 99 !important;
}

table.dataTable.table-xs td,
table.dataTable.table-xs th {
    padding: 2px 4px !important; /* Smaller than sm */
    font-size: 0.80rem;
}