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

/*

@layer components {
  .btn-primary {
    @apply py-2 px-4 bg-blue-200;
  }
}

*/
table.datagrid {
  background-color: transparent;
  border-collapse: collapse;
  max-width: 100%; }
  table.datagrid th {
    background-color: #eee;
    text-align: left; }
  table.datagrid td,
  table.datagrid th {
    border: 1px solid #d6d6d6;
    padding: 5px 10px; }
    table.datagrid td .order a.asc, table.datagrid td .order a.desc,
    table.datagrid th .order a.asc,
    table.datagrid th .order a.desc {
      text-decoration: none;
      font-weight: normal; }
    table.datagrid td.ordered,
    table.datagrid th.ordered {
      background-color: #fff7d5; }
      table.datagrid td.ordered.asc a.asc,
      table.datagrid th.ordered.asc a.asc {
        font-weight: bold;
        color: #d00; }
      table.datagrid td.ordered.desc a.desc,
      table.datagrid th.ordered.desc a.desc {
        font-weight: bold;
        color: #d00; }
  table.datagrid .noresults {
    text-align: center; }

.datagrid-form {
  background-color: #f0f0f0;
  border-radius: 5px;
  padding: 20px; }

.datagrid-filter {
  margin: 10px;
  *zoom: 1; }
  .datagrid-filter:before, .datagrid-filter:after {
    display: table;
    content: ''; }
  .datagrid-filter:after {
    clear: both; }
  .datagrid-filter label {
    width: 150px;
    float: left; }
  .datagrid-filter a {
    float: left; }
  .datagrid-filter input[class*='filter'] {
    border: 2px solid #ccc;
    border-radius: 4px;
    float: left;
    padding: 5px 12px;
    width: 207px; }
    .datagrid-filter input.from[class*='filter'], .datagrid-filter input.to[class*='filter'] {
      width: 83px; }
  .datagrid-filter select {
    float: left;
    width: 235px; }
    .datagrid-filter select[multiple] {
      border: 2px solid #ccc;
      border-radius: 5px;
      height: 100px; }
    .datagrid-filter select.dynamic_filter.field {
      width: 178px; }
    .datagrid-filter select.dynamic_filter.operation {
      margin-left: 7px;
      width: 50px; }
  .datagrid-filter input.dynamic_filter.value {
    margin: 10px 0 0 150px;
    clear: both; }
  .datagrid-filter .separator {
    float: left;
    margin: 6px 4px 0; }
  .datagrid-filter .enum_filter.checkboxes {
    float: none;
    display: block;
    margin-left: 150px; }
    .datagrid-filter .enum_filter.checkboxes input {
      margin: 7px; }

.datagrid-actions {
  padding-left: 160px; }
  .datagrid-actions input[type='submit'] {
    background-color: #555;
    border: none;
    border-radius: 5px;
    color: white;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    line-height: normal;
    padding: 7px 15px;
    vertical-align: middle;
    display: inline-block;
    zoom: 1;
    *display: inline; }
    .datagrid-actions input[type='submit']:hover, .datagrid-actions input[type='submit']:focus {
      background-color: #333; }
    .datagrid-actions input[type='submit']:active {
      background-color: #000; }
  .datagrid-actions > a {
    font-size: 14px;
    padding: 7px 15px;
    vertical-align: middle;
    display: inline-block;
    zoom: 1;
    *display: inline; }
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *



 */

/* tom select style */
.ts-control {
    border: none !important;
    padding: initial !important;
    line-height: 1.25rem !important;
}

.full .ts-control,
.ts-control,
.ts-wrapper.single.input-active .ts-control {
    background: none !important;
}

.ts-dropdown {
    z-index: 100 !important;
}

.item,
.ts-control input {
    font-size: .875rem !important;
    color: black !important
}

.ts-control input::placeholder {
    color: black !important
}