/* =============================================================
   custom.css — Global custom styles (DaisyUI v4)
   Berisi style komponen yang tidak tercakup oleh DaisyUI/Tailwind
   ============================================================= */


/* ── Tagify — DaisyUI v4 style ──────────────────────────────── */

.tagify {
  background: var(--color-base-100, #fff);
  border-radius: 0.5rem;
  border: 1px solid var(--color-base-300, #d1d5db);
  min-height: 2.5rem;
  height: auto;
  flex-wrap: wrap;
  padding: 0.4rem 0.4rem;
  font-size: 0.775rem;
  transition: border-color .2s, box-shadow .2s;
  box-shadow: none;
}

.tagify:hover {
  border-color: var(--color-base-content,
      #374151);
}

.tagify__tag {
  margin-block: 1px;
  margin-inline: 0px;
}

.tagify--focus {
  border-color: var(--color-primary,
      #167bff) !important;
  outline: none;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-primary,
        #167bff) 20%, transparent);
}

.tagify__input {
  min-width: 6rem;
  flex: 1;
  color: var(--color-base-content,
      #374151);
}

.tagify__input::before {
  color: color-mix(in srgb, var(--color-base-content,
        #374151) 40%, transparent);
}

/* Tag pills — rotasi 7 warna DaisyUI v4 */
.tagify__tag:nth-child(7n+1)>div {
  background: var(--color-primary,
      #167bff);
  color: var(--color-primary-content, #fff);
}

.tagify__tag:nth-child(7n+2)>div {
  background: var(--color-secondary,
      #9333ea);
  color: var(--color-secondary-content, #fff);
}

.tagify__tag:nth-child(7n+3)>div {
  background: var(--color-accent,
      #06b6d4);
  color: var(--color-accent-content, #fff);
}

.tagify__tag:nth-child(7n+4)>div {
  background: var(--color-success,
      #22c55e);
  color: var(--color-success-content, #fff);
}

.tagify__tag:nth-child(7n+5)>div {
  background: var(--color-warning,
      #f59e0b);
  color: var(--color-warning-content, #000);
}

.tagify__tag:nth-child(7n+6)>div {
  background: var(--color-error,
      #ef4444);
  color: var(--color-error-content, #fff);
}

.tagify__tag:nth-child(7n+0)>div {
  background: var(--color-info,
      #3b82f6);
  color: var(--color-info-content, #fff);
}

.tagify__tag__removeBtn {
  opacity: .7;
}

.tagify__tag__removeBtn:hover {
  background: rgba(0, 0, 0, .15);
}

/* Dropdown */
.tagify__dropdown {

  box-shadow: 0 4px 16px rgba(0, 0, 0, .1);
  background: var(--color-base-100, #fff);
}

.tagify__dropdown__item {
  font-size: 0.875rem;
  padding: 0.4rem 0.75rem;
  color: var(--color-base-content,
      #374151);
}

.tagify__dropdown__item--active {
  background: color-mix(in srgb, var(--color-primary,
        #167bff) 12%, transparent);
  color: var(--color-primary,
      #167bff);
}

table.dataTable thead th.ui-state-default:first-child {
  border-left-width: 0px !Important;
}

.dt-column-title {
  font-weight: bold;
}

div.dt-processing > div:last-child {
    display: none;
}