@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

/* Regras personalizadas */
@media (max-width: 768px) {
  .table-responsive-mobile table thead {
    display: none;
  }

  .table-responsive-mobile table tbody tr {
    display: block;
    margin-bottom: 3px;
    background-color: #f8f9fa;
    border-radius: 0.5rem;
    padding: 5px;
    box-shadow: 0 0 4px rgba(0,0,0,0.1);
  }

  .table-responsive-mobile table tbody td {
    display: flex;
    justify-content: space-between;
    padding: 5px 5px;
    border: none;
    border-bottom: 1px solid #ddd;
    font-size: 14px;
  }

  .table-responsive-mobile table tbody td:last-child {
    border-bottom: none;
  }

  .table-responsive-mobile table tbody td::before {
    content: attr(data-label);
    font-weight: bold;
    color: #555;
    flex-basis: 50%;
  }

  .table-responsive-mobile .btn {
    margin-bottom: 5px;
    width: 50%;
  }

  .table-responsive-mobile .text-end {
    text-align: right;
  }

  .table-responsive-mobile table thead th:last-child {
    display: none;
  }
  
  td[data-label="Ações"] {
    text-align: center !important;
  }

  td[data-label="Ações"] {
    text-align: center !important;
  }

  td[data-label="Ações"] .d-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
  }

  td[data-label="Ações"] .btn {
    width: 45%;
    min-width: 100px;
  }
    .table-responsive-mobile table thead th:last-child {
    display: none !important;
  }
  td[data-label="Ações"]::before {
  display: none !important;
}
/* coloque num CSS do projeto */
.tooltip-inner {
  max-width: 480px; /* padrão é ~200px; ajuste se quiser */
  text-align: left;
}

}