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

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');
@import "@fortawesome/fontawesome-free/css/all.min.css";

/* Wrapper untuk select DataTables */
.select-wrapper {
  position: relative;
  display: inline-block;
  width: auto;
}

.select-wrapper select {
  @apply border border-gray-300 rounded-md px-2 py-1 pr-8 text-sm bg-white;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  width: 100%;
}

/* Fix select bentrok FontAwesome */
select {
  appearance: auto !important;        /* balikin panah bawaan browser */
  background-image: none !important;  /* hapus ikon tambahan FontAwesome */
}


/* Panah custom */
.select-wrapper::after {
  content: "▼";
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  font-size: 0.75rem;
  color: #6b7280; /* gray-500 */
}