@import "tailwindcss";



@layer utilities {
  .active-link {
    @apply text-orange-400 after:w-1.5 after:h-full after:bg-orange-400 after:absolute relative after:left-0 after:rounded-r-lg;
  }
}

@layer utilities {
  .custom-radio {
    @apply relative pl-8 cursor-pointer select-none text-base font-medium;
  }

  .custom-radio input[type="radio"] {
    @apply absolute opacity-0 cursor-pointer h-0 w-0;
  }

  .custom-radio .checkmark {
    @apply absolute left-0 top-1/2 -translate-y-1/2 h-5 w-5 rounded-full border-2 border-orange-400;
  }

  .custom-radio input:checked~.checkmark {
    @apply bg-orange-400 border-orange-400;
  }

  .custom-radio .checkmark::after {
    content: "";
    @apply absolute hidden left-1 top-1 h-2 w-2 rounded-full bg-white;
  }

  .custom-radio input:checked~.checkmark::after {
    @apply block;
  }
}

@layer utilities{
  .datatable-dropdown{
    @apply hidden;
  }
}

@layer utilities{
  .datatable-input{
    @apply border-2 border-neutral-500 my-5 p-2 text-xl rounded-md;
  }
}

@layer utilities{
  .datatable-bottom{
    @apply hidden;
  }
}

@layer utilities {
  .zaffa-shadow {
    box-shadow: 0px 0px 10px 0px #00000040;
  }
}


@font-face {
  font-family: 'Poppins';
  src: url('../../fonts/Poppins-Bold.ttf');
  font-weight: 700;
}

@font-face {
  font-family: 'Poppins';
  src: url('../../fonts/Poppins-SemiBold.ttf');
  font-weight: 600;
}

@font-face {
  font-family: 'Poppins';
  src: url('../../fonts/Poppins-Medium.ttf');
  font-weight: 500;
}

@font-face {
  font-family: 'Poppins';
  src: url('../../fonts/Poppins-Regular.ttf');
  font-weight: 400;
}

.poppins-700 {
  font-family: 'Poppins';
  font-weight: 700;
}

.poppins-600 {
  font-family: 'Poppins';
  font-weight: 600;
}

.poppins-500 {
  font-family: 'Poppins';
  font-weight: 500;
}

.poppins-400 {
  font-family: 'Poppins';
  font-weight: 400;
}

/* CASTOM CODE */
.bg-linear {
  background: linear-gradient(90deg, #FCAF49 0%, #FF6A00 100%);
}