.btn-primary {
  @apply cursor-pointer inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-sm text-white bg-indigo-600 transition ease-in-out duration-150;
}

.btn-primary:hover {
  @apply bg-indigo-500;
}

.btn-primary:focus {
  @apply outline-none border-indigo-700 shadow-outline-indigo;
}

.btn-primary:active {
  @apply bg-indigo-500 bg-indigo-700;
}

.btn-green {
  @apply cursor-pointer inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-sm text-white bg-green-600 transition ease-in-out duration-150;
}

.btn-green:hover {
  @apply bg-green-500;
}

.btn-green:focus {
  @apply outline-none border-green-700 shadow-outline-green;
}

.btn-green:active {
  @apply bg-green-500 bg-green-700;
}

.btn-cancel {

  @apply inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-sm text-white transition ease-in-out duration-150 bg-gray-600;
}

.btn-cancel:hover {
  @apply bg-gray-500;
}

.btn-cancel:focus {
  @apply border-gray-700 shadow-outline-gray;
}

.btn-cancel:active {
  @apply bg-gray-700; 
}

.disabled {
  @apply opacity-50 cursor-not-allowed;
}

.bg-primary {
  @apply bg-gray-50; 
}

.rounded-primary {
  @apply rounded-md;
}

.padding-primary {
  @apply p-2;
}

.border-color-primary {
  @apply border-gray-200;
}

.btn-tag {
  @apply inline-flex items-center px-2 py-1 rounded-lg text-sm leading-4 bg-gray-100 text-black whitespace-no-wrap;
}

.btn-tag:hover {
  @apply bg-gray-200;
}

.field-required:after {
  content:" *";
  color: red;
}

.pagy-nav, 
.pagy-nav-js,
.pagy-combo-nav-js {
  @apply inline-flex shadow-md;
}
.pagy-nav.pagination, 
.pagy-nav-js.pagination,
.pagy-combo-nav-js.pagination {
  @apply border border-gray-400 rounded-sm;
}
.pagy-nav .page,
.pagy-nav-js .page,
.pagy-combo-nav-js .page,
.pagy-combo-nav-js .pagy-combo-input {
  @apply text-gray-600 border-r border-gray-400 px-3 py-2 text-sm leading-tight font-medium;
}
.pagy-nav .page:hover,
.pagy-nav-js .page:hover {
  @apply text-gray-500;
}
.pagy-nav .disabled,
.pagy-nav-js .disabled,
.pagy-combo-nav-js .disabled {
  @apply cursor-not-allowed;
}
.pagy-nav .active,
.pagy-nav-js .active {
  @apply text-blue-300;
}
.pagy-nav .prev,
.pagy-nav-js .prev,
.pagy-combo-nav-js .prev {
  @apply text-gray-700;
}
.pagy-nav .next,
 .pagy-nav-js .next,
 .pagy-combo-nav-js .next {
  @apply text-gray-700 border-r border-transparent;
}