@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";

@layer base {
    [type='text'],
    [type='email'],
    [type='url'],
    [type='password'],
    [type='number'],
    [type='date'],
    [type='datetime-local'],
    [type='month'],
    [type='search'],
    [type='tel'],
    [type='time'],
    [type='week'],
    [multiple],
    textarea,
    select {
      @apply rounded border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500;
    }

    [type='checkbox'],
    [type='radio'] {
      @apply border-gray-300 text-blue-600 focus:ring-blue-500;
    }
}

// Disable bootstrap
//@import 'bootstrap.scss';

// undo
//@import "~@fortawesome/fontawesome-free/css/all.css";
//@import '~cropper/dist/cropper.css';
//@import '~flag-icon-css/sass/flag-icon.scss';
@import "~select2/dist/css/select2.css";
@import "~bootstrap-daterangepicker/daterangepicker.css";
//@import "~bootstrap-select/sass/bootstrap-select";
//@import '~jquery-ui/themes/base/all.css';

@layer components {
  .card {
    @apply bg-white rounded shadow-lg w-full;
  }

  // Buttons.

  .btn {
    //@apply inline-block text-black px-4 py-2 text-xs font-medium leading-6 text-center bg-gray-100 uppercase transition rounded shadow hover:shadow-lg focus:outline-none;
    //disabled:cursor-not-allowed
    //@apply block px-4 py-2 transition duration-100 ease-in-out focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50 disabled:opacity-50 ;
    @apply h-10 inline-flex items-center px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2;
  }

  .btn-primary {
    @apply text-white bg-blue-700 hover:bg-blue-800 focus:ring-indigo-500;
  }

  .btn-warning {
    @apply text-white bg-yellow-400 hover:bg-yellow-800 focus:ring-yellow-500;
  }

  .btn-success {
    @apply text-white bg-green-400 hover:bg-green-800;
  }

  .btn-danger {
    @apply text-white bg-red-700 hover:bg-red-800;
  }

  // Buttons with icons.
  .btn > .fa {
    @apply -ml-1 mr-1 h-4 w-5 fill-current ;
  }

  .btn > .svg {
    @apply -ml-1 mr-1 h-4 w-5 fill-current ;
  }

  // Forms.

  .help-block {
    @apply mt-2 text-xs text-gray-500;
  }

  .has-error .ch-form-label {
    @apply h-8 text-red-500;
  }

  .has-error .help-block {
    @apply text-red-500 italic text-xs;
  }

  .has-error .ch-form-control {
    @apply border-red-500;
  }

  legend {
    float: left;
    width: 100%;
    padding: 0;
    margin-bottom: 0.5rem;
    font-size: calc(1.275rem + 0.3vw);
    line-height: inherit;
  }

  fieldset {
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0;
  }

  // Tables
  table {
      @apply min-w-full divide-y divide-gray-200;
  }

  table thead {
    @apply bg-gray-50;
  }

  table tbody {
    @apply bg-white divide-y divide-gray-200;
  }

  .table td img {
    display: inline-block;
  }

  // List

  .list-group {
    @apply flex flex-col mr-4;
  }

  .list-group-item {
    @apply flex flex-row justify-start gap-2 border rounded-sm px-3 py-3;
  }

  // Alerts

  .alert {
    @apply px-6 py-4 border-0 rounded relative mb-4;
  }

  .alert-info {
    @apply text-white bg-blue-400;
  }

  .alert-warning {
    @apply text-yellow-700 bg-yellow-100;
  }

  .alert-success {
    @apply text-white bg-green-400;
  }

  .alert-danger {
    @apply text-white bg-red-500;
  }

  // Tabs

  .tab_wrapper nav {
    @apply card flex flex-row justify-between gap-4;
  }

  .tab_wrapper nav a {
    @apply p-4;
  }

  // Calendar

  #calendar .fc-toolbar-chunk {
    @apply flex flex-row;
  }

  // Page header

  .page-header {
    @apply text-gray-500 text-2xl flex flex-row gap-2;
  }

  #no-data-view {
    @apply flex flex-col items-center justify-center p-4 space-y-4 antialiased text-gray-900;
  }

  .pull-right {
    @apply flex flex-row;
  }

  @import "scss/index.scss";
}

// tabs
.tab-content {
  > .tab-pane {
    display: none;
  }
  > .active {
    display: block;
  }
}

//@import 'primevue-md-light-indigo/theme.css';
//@import '~primevue/resources/primevue.min.css';
//@import '~primeflex/primeflex.css';
//@import "~primeicons/primeicons.css";

//@import "~jquery-ui-timepicker-addon/dist/jquery-ui-timepicker-addon.css";
@import "~@fancyapps/fancybox/dist/jquery.fancybox.css";
//@import "~jquery-contextmenu/dist/jquery.contextMenu.css";