@tailwind base;
@tailwind components;
@tailwind utilities;

/*

@layer components {
  .btn-primary {
    @apply py-2 px-4 bg-blue-200;
  }
}

*/

.tooltip {
  position: relative;
  display: inline-block;
}
.tooltip .tooltiptext {
  visibility: hidden;
  position: absolute;
  bottom: 100%;
  left: 50%;
  z-index: 10;
  margin-bottom: 5px;
  width: 8rem;
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  border-radius: 0.375rem;
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  text-align: center;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.tooltip:not(.tooltip-note) .tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%;
  /* At the bottom of the tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.pagy-nav.pagination {
  @apply isolate inline-flex -space-x-px rounded-md shadow-sm;
}

.pagy-nav .page a,
.pagy-nav .page.active,
.pagy-nav .page.disabled,
.pagy-nav .page.gap {
  @apply px-4 py-2;
}

.pagy-nav .page {
  @apply relative inline-flex items-center border border-gray-300 bg-white text-sm font-medium text-gray-500 hover:bg-gray-50 focus:z-20;
}
.pagy-nav .page.active {
  @apply z-10 border-aqua-500 bg-aqua-100 text-aqua-600;
}

.dataTables_paginate a.paginate_button.previous, .pagy-nav .page.prev { @apply rounded-l-md; }
.dataTables_paginate a.paginate_button.next, .pagy-nav .page.next { @apply rounded-r-md; }

/* Print-specific styles */
@media print {
  table {
    width: 100% !important;
    table-layout: fixed !important;
  }
  
  th, td {
    max-width: 100px;
    overflow: hidden;
    word-wrap: break-word;
    page-break-inside: avoid;
  }
}

