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

.field_with_errors {
  flex-grow: 1;
}

.leftmenu-wrapper {
  transition: all 0.3s;
  bottom: 0;
  top: 0;
  height: 100vh;
  min-width: 15rem;
}

.main-wrapper {
  width: 100%;
  max-width: 100vw;
  height: 100vh;
}

.content-wrapper {
  flex-grow: 1;
  padding: 1rem;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.15s;
}

.card {
  @apply rounded-lg;
}

/* Hide arrow on number input */
@layer utilities {
  input[type="number"]::-webkit-inner-spin-button,
  input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  input[type="number"] {
    -moz-appearance: textfield;
  }

  .no-arrow {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: none;
    padding-right: 8px;
  }
}

/* Pagy pagination CSS classes */
.pagy {
  @apply join;
  a:not(.gap) {
    @apply btn join-item btn-sm rounded-none;
    &:not([href]) { /* disabled links */
      @apply btn-disabled;
    }
    &.current {
      @apply btn-primary btn-active;
    }
  }
  label {
    @apply inline-block whitespace-nowrap bg-gray-200 rounded-lg px-3 py-0.5;
    input {
      @apply bg-gray-100 border-none rounded-md;
    }
  }
}