[data-kt-app-sidebar-fixed=true] .app-sidebar {
    z-index: 110;
  }

  .glass {
    background: rgb(255 255 255 / 65%);
    border-radius: 16px;
    /* box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); */
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgb(255 255 255);
  }

  .glass-login {
    border-radius: 16px;
    background-color: rgba(255, 255, 255, .2);
    border: 2px solid rgba(255, 255, 255, .2);
    backdrop-filter: blur(10px);
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
  }

  /* datatable XS size */
  .table-xs>:not(caption)>*>* {
    padding: .25rem;
  }

  /* timeline SM (o Metronic não tem timeline-sm; o tamanho vem da var --bs-timeline-icon-size) */
  .timeline-sm {
    --bs-timeline-icon-size: 30px;
    --bs-timeline-icon-space: 0.25rem;
  }

  /* !important para vencer a utility mb-8 (2rem !important) usada no item */
  /* .timeline-sm .timeline-content {
    margin-bottom: 0.75rem !important;
  } */

  /* button XS size (um degrau abaixo do btn-sm do Metronic).
     !important porque o Metronic define o padding do botão numa regra de
     especificidade muito alta (cadeia de :not()), que venceria um seletor simples. */
  .btn.btn-xs {
    padding: 0.4rem 0.75rem !important;
    font-size: 0.8rem !important;
    line-height: 1.5 !important;
    border-radius: 0.35rem !important;
  }

  /* mesmo tamanho do btn-xs de texto (24px), como o Metronic faz com btn-sm (ícone = texto) */
  .btn.btn-icon.btn-xs {
    width: 24px !important;
    height: 24px !important;
    padding: 0 !important;
  }

  /* centraliza o ícone (glyph) dentro de um btn-icon.
     O Metronic torna .btn > i um inline-flex que encolhe até o glifo, então o
     justify-content só surte efeito com width:100% (ocupa a largura do botão).
     Restrito a FontAwesome (fa-*): os KeenIcons (ki-*) do header usam <span class="path*">
     posicionados e QUEBRAM se o <i> for esticado — por isso não podem ser atingidos. */
  .btn.btn-icon i[class*="fa-"] {
    width: 100% !important;
    justify-content: center !important;
    padding: 0 !important;
  }

  /* swal2 toastr */
  .swal2-popup.swal2-toast {
    box-sizing: border-box;
    grid-column: 1 / 4 !important;
    grid-row: 1 / 4 !important;
    grid-template-columns: min-content auto min-content;
    padding: 1em;
    overflow-y: hidden;
    background: #fff;
    box-shadow: 0 0 1px hsla(0, 0%, 0%, .075), 0 1px 2px hsla(0, 0%, 0%, .075), 1px 2px 4px hsla(0, 0%, 0%, .075), 1px 3px 8px hsla(0, 0%, 0%, .075), 2px 4px 16px hsla(0, 0%, 0%, .075);
    pointer-events: all;
  }

  .swal2-popup.swal2-toast .swal2-html-container {
    margin: .5em 1em;
    padding: 0;
    overflow: initial;
    font-size: 1em;
    text-align: initial;
  }

  div:where(.swal2-container) .swal2-html-container {
    margin: 0 !important;
  }

  /* daterangepicker */
  .daterangepicker .ranges ul {
    padding: 1rem 0;
    width: 170px; /*160px*/
    overflow: auto;
    max-height: auto; /*260px*/
  }



  /* select2 */
  .was-validated .form-select:invalid,
  .form-select.is-invalid+.select2 .select2-selection {
    border-color: #dc3545 !important;
  }

  .was-validated .form-select:valid,
  .form-select.is-valid+.select2 .select2-selection {
    border-color: #28a745 !important;
  }

  .select2-container--bootstrap5 .select2-selection--multiple:not(.form-select-sm):not(.form-select-lg) .select2-selection__choice {
    border-radius: 0.475rem;
    padding: 0rem 0.5rem;
    margin-right: 0.5rem;
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
  }

  .select2-container--bootstrap5 .select2-selection--multiple:not(.form-select-sm):not(.form-select-lg) .select2-selection__choice .select2-selection__choice__display {
    margin-left: 1.1rem;
    font-size: 1rem;
  }

  /* posição absoluta negativa — desloca o dropdown do select2 50px p/ a esquerda
     (usada via data-dropdown-css-class nos filtros perto da borda direita, p/ não vazar a viewport) */
  .a-l-n50 {
    left: -50px !important;
  }

  /* widgets assíncronos (assets_/js/widgets.js) — transições discretas */
  /* entrada do conteúdo no lugar do skeleton */
  [data-widget].widget-entrando {
    opacity: 0;
  }

  [data-widget].widget-visivel {
    opacity: 1;
    transition: opacity .25s ease;
  }

  /* reload: conteúdo atual esmaecido durante o fetch (crossfade, sem skeleton) */
  [data-widget].widget-recarregando {
    opacity: .5;
    pointer-events: none;
    transition: opacity .2s ease;
  }





  /* TIPOS CURSOR */
  .cursor-alias {
    cursor: alias;
  }

  .cursor-all-scroll {
    cursor: all-scroll;
  }

  .cursor-auto {
    cursor: auto;
  }

  .cursor-cell {
    cursor: cell;
  }

  .cursor-context-menu {
    cursor: context-menu;
  }

  .cursor-col-resize {
    cursor: col-resize;
  }

  .cursor-copy {
    cursor: copy;
  }

  .cursor-crosshair {
    cursor: crosshair;
  }

  .cursor-default {
    cursor: default;
  }

  .cursor-e-resize {
    cursor: e-resize;
  }

  .cursor-ew-resize {
    cursor: ew-resize;
  }

  .cursor-grab {
    cursor: grab;
  }

  .cursor-grabbing {
    cursor: grabbing;
  }

  .cursor-help {
    cursor: help;
  }

  .cursor-move {
    cursor: move;
  }

  .cursor-n-resize {
    cursor: n-resize;
  }

  .cursor-ne-resize {
    cursor: ne-resize;
  }

  .cursor-nesw-resize {
    cursor: nesw-resize;
  }

  .cursor-ns-resize {
    cursor: ns-resize;
  }

  .cursor-nw-resize {
    cursor: nw-resize;
  }

  .cursor-nwse-resize {
    cursor: nwse-resize;
  }

  .cursor-no-drop {
    cursor: no-drop;
  }

  .cursor-none {
    cursor: none;
  }

  .cursor-not-allowed {
    cursor: not-allowed;
  }

  .cursor-pointer {
    cursor: pointer;
  }

  .cursor-progress {
    cursor: progress;
  }

  .cursor-row-resize {
    cursor: row-resize;
  }

  .cursor-s-resize {
    cursor: s-resize;
  }

  .cursor-se-resize {
    cursor: se-resize;
  }

  .cursor-sw-resize {
    cursor: sw-resize;
  }

  .cursor-text {
    cursor: text;
  }

  .cursor-url {
    cursor: url(myBall.cur), auto;
  }

  .cursor-w-resize {
    cursor: w-resize;
  }

  .cursor-wait {
    cursor: wait;
  }

  .cursor-zoom-in {
    cursor: zoom-in;
  }

  .cursor-zoom-out {
    cursor: zoom-out;
  }

  /* END TIPOS CURSOR */