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

@layer base {
  html {
    font-family: 'Poppins', sans-serif;
  }
}

@layer components {
  p {
    @apply pb-4
  }
  hr {
    @apply border-stone-300/50 border-t border-t-2
  }
  .btn {
    @apply cursor-pointer inline-block font-bold border-0 transition-all duration-500 disabled:btn-disabled select-none no-underline
  }

  .btn-sm {
    @apply p-2 text-xs h-9 rounded-xl
  }

  .btn-md {
    @apply p-3 text-sm rounded-2xl
  }

  .btn-primary {
    @apply btn bg-black text-white hover:bg-neutral-800
  }

  .btn-secondary {
    @apply btn bg-stone-200 text-black hover:bg-stone-300;
  }

  .btn-disabled {
    @apply bg-neutral-200 border-neutral-200 text-gray-400 cursor-not-allowed;
  }

  .btn-header {
    @apply rounded-2xl p-3 lowercase bg-yellow-300 hover:bg-amber-300 dark:bg-amber-600 dark:hover:bg-amber-700 dark:text-white font-bold block text-sm transition-all duration-500
  }

  .btn-warn {
    @apply btn bg-red-400 text-black font-bold hover:bg-red-800 hover:text-white

  }

  .errorBox {
    @apply flex flex-col bg-red-100 rounded-lg p-4 mb-4 text-sm text-red-700 top-10 left-10 right-10;
  }

  .menu-item { 
    @apply relative flex justify-between items-center text-gray-400 hover:text-gray-200 hover:bg-gray-800 space-x-2 rounded-md p-2 cursor-pointer;
  }
  .menu-item.active { 
    @apply text-white bg-gray-600 transition-all duration-300;
  }

  .navbar-item {
    @apply p-2 text-blue-400 transition-colors duration-200 rounded-full bg-blue-50 hover:text-blue-600 hover:bg-blue-100 dark:hover:text-white dark:hover:bg-blue-700 dark:bg-gray-800 focus:outline-none focus:bg-blue-100 dark:focus:bg-blue-700 focus:ring-blue-800;
  }

  div.field_with_errors input:not([type="submit"], [type="checkbox"])  {
    @apply rounded border bg-red-200 border-red-400;
  }

  div.field_with_errors select  {
    @apply rounded border bg-red-200 border-red-400;
  }

  div.field_with_errors~div.ts-wrapper>div.ts-control  {
    @apply rounded border bg-red-200 border-red-400;
  }

  .auth input:not([type=submit],[type=checkbox]), .auth select {
    @apply w-full appearance-none rounded-md border-0 bg-stone-200/75 py-3 px-6 text-base text-black outline-none focus:border-transparent focus:outline-none focus:ring-2 focus:ring-stone-500;
  }

  .auth label {
    @apply mb-1 block text-base font-medium text-stone-700;
  }

  .results-table {
    @apply min-w-full divide-y divide-stone-200 dark:divide-gray-700;
  }

  .results-table thead {
    @apply bg-stone-100 dark:bg-gray-800;
  }

  .results-table th {
    @apply p-4 text-sm font-semibold text-left rtl:text-right text-black dark:text-gray-400;
  }

  .results-table tbody {
    @apply bg-stone-50 divide-y divide-stone-200 dark:divide-gray-700 dark:bg-gray-900
  }

  .results-table tbody td {
    @apply text-gray-800 dark:text-gray-400 p-6 text-sm;
  }

  /* A record rendered as a primary row plus a secondary detail row. The pair
     has to read as one record, so the tbody divider between them is suppressed
     (!important: divide-y's `> :not([hidden]) ~ :not([hidden])` outranks a
     plain class here) and the vertical padding is closed up between them. */
  .results-table tbody tr.record-primary td {
    @apply pb-3;
  }

  .results-table tbody tr.record-detail {
    @apply !border-t-0;
  }

  .results-table tbody tr.record-detail td {
    @apply pt-0 pb-6;
  }

  .record-detail-label {
    @apply text-xs font-semibold uppercase tracking-wide text-gray-400 dark:text-gray-500 whitespace-nowrap;
  }

  .invoice-table select, .invoice-table input, .invoice-table textarea {
    @apply text-sm bg-white border border-neutral-200 rounded-lg placeholder-gray-400/70 dark:bg-gray-900 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40
  }

  .search input[type="search"] select {
    @apply inline rounded p-2 m-2;
  }
  .search input[type="search"]:not([type="checkbox"]) {
    @apply block w-full py-1.5 p-2 text-gray-700 bg-white border border-gray-200 rounded-lg md:w-80 placeholder-gray-400/70 dark:bg-gray-900 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40;
  }
  .search input[type="checkbox"] {
    @apply form-checkbox h-5 w-5 text-amber-700 bg-gray-50 border-gray-300 focus:ring-4 focus:ring-stone-400 h-4 w-4 rounded pr-2
  }
  .search label {
    @apply text-sm text-stone-800
  }

  .login {
    @apply w-full p-4 text-sm uppercase font-semibold text-white transition-colors duration-300 bg-black rounded-full hover:bg-stone-700 focus:outline-none focus:ring-indigo-200 focus:ring-4 cursor-pointer disabled:bg-gray-200 disabled:text-gray-400 disabled:shadow-none disabled:cursor-not-allowed;
  }

  .pagination span a {
    @apply inline-block items-center justify-center w-1/2 px-5 py-2 text-sm text-gray-700 capitalize transition-colors duration-200 bg-white border rounded-md sm:w-auto gap-x-2 hover:bg-gray-100 dark:bg-gray-900 dark:text-gray-200 dark:border-gray-700 dark:hover:bg-gray-800;
  }

  .pagination .page.disabled {
    @apply opacity-25 inline-block items-center justify-center w-1/2 px-5 py-2 text-sm text-gray-700 capitalize transition-colors duration-200 bg-white border rounded-md sm:w-auto gap-x-2 hover:bg-gray-100 dark:bg-gray-900 dark:text-gray-200 dark:border-gray-700 dark:hover:bg-gray-800;
  }

  .pagination .page.active {
    @apply inline-block items-center justify-center w-1/2 px-5 py-2 text-sm text-gray-700 capitalize transition-colors duration-200 bg-white border border-black rounded-md sm:w-auto gap-x-2  dark:bg-gray-900 dark:text-white dark:border-white;
  }

  .custom-container {
    @apply min-w-full;
  }

  .custom-container input:not([type=submit], [type=checkbox], [type=file], .max-comp ), .custom-container textarea, .custom-container select, .modal textarea, .custom-container .ts-control {
    @apply appearance-none rounded-lg border-0 bg-white/60 py-3 text-base text-black outline-none focus:border-transparent focus:outline-none focus:ring-2 focus:ring-stone-500 disabled:bg-stone-200/50 placeholder:text-stone-400 dark:bg-gray-700 dark:border-gray-500 dark:text-white;
  }

  .modal input:not([type=submit]):not([type="checkbox"]) {
    @apply mb-5 border border-gray-300 text-gray-900 rounded-md focus:ring-blue-500 w-full;
  }
  
  .modal input:not([type=submit]):not([type="checkbox"]):disabled {
    @apply shadow-none mb-5 bg-gray-100 border border-gray-300 text-gray-900 rounded-md focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 cursor-not-allowed dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-gray-400 dark:focus:ring-blue-500 dark:focus:border-blue-500
  }

  .toggle input:checked {
    @apply bg-green-500 bg-none;
  }

  .toggle input:checked ~ span:last-child {
    --tw-translate-x: 2.25rem; /* translate-x-7 */
  }

  .toggle label {
    @apply flex;
  }

  .page-title {
    @apply text-xl md:text-3xl font-black text-gray-800 dark:text-white
  }

  .table-button {
    @apply font-bold text-xs uppercase text-gray-500 align-middle whitespace-nowrap
  }

  .badge {
    @apply px-3 py-1 text-xs text-stone-100 bg-amber-800 rounded-full dark:bg-gray-800 dark:text-blue-400
  }

  /* Status badge styles for dark mode */
  .status-badge {
    @apply inline-flex items-center rounded-md px-2 py-1 text-xs font-medium ring-1 ring-inset select-none;
  }

  .status-badge-green {
    @apply bg-green-50 text-green-700 ring-green-600;
  }

  .dark .status-badge-green {
    @apply bg-green-800 text-green-100 ring-green-500;
  }
  
  .status-badge-red {
    @apply bg-red-50 text-red-700 ring-red-600;
  }

  .dark .status-badge-red {
    @apply bg-red-800 text-red-100 ring-red-500;
  }

  .status-badge-orange {
    @apply bg-orange-50 text-orange-700 ring-orange-600;
  }

  .dark .status-badge-orange {
    @apply bg-orange-800 text-orange-100 ring-orange-500;
  }
  
  .status-badge-yellow {
    @apply bg-yellow-50 text-yellow-700 ring-yellow-600;
  }

  .dark .status-badge-yellow {
    @apply bg-yellow-800 text-yellow-100 ring-yellow-500;
  }
  
  .status-badge-blue {
    @apply bg-blue-50 text-blue-700 ring-blue-600;
  }

  .dark .status-badge-blue {
    @apply bg-blue-800 text-blue-100 ring-blue-500;
  }

  .results-table a, #cases-list a {
    @apply text-amber-700 font-bold hover:underline
  }

  div.case-log-entry:nth-child(odd) {
    @apply bg-white dark:bg-gray-900
  }

  div.case-log-entry {
    @apply bg-stone-50 dark:bg-gray-800
  }

  div.case-log-entry a {
    @apply font-semibold;
  }

  div.case-log-entry a:hover {
    @apply underline;
  }

  div.case-term-children {
    @apply pl-4 border-l-2;
  }
  .internal-form input:not([type="submit"], [type="checkbox"]), .internal-form select {
    @apply w-full
  }

  .internal-form label + input {
    @apply mt-1 block
  }

  .turbo-progress-bar {
    @apply bg-[#dfba00];
  }

  .drop-container {
    @apply relative flex gap-2.5 flex-col justify-center items-center text-stone-600 cursor-pointer p-5 rounded-2xl border-2 border-dashed border-stone-400 transition-all duration-200
  }
  .drop-container:hover,
  .drop-container.drag-active {
    @apply border-amber-800 bg-stone-200/50 transition-all duration-200
  }
  .drop-container:hover .drop-title,
  .drop-container.drag-active .drop-title {
    @apply text-stone-500
  }
  .drop-title {
    @apply text-stone-500 text-base font-semibold text-center transition-all duration-200
  }
  .drop-container input[type="file"] {
    @apply max-w-[500px] w-full text-stone-700 border p-2 rounded-2xl border-solid border-stone-400 bg-white
  }
  .drop-container input[type="file"]::file-selector-button {
    @apply text-white cursor-pointer transition-all duration-200 mr-5 px-5 py-2.5 rounded-lg border-0 bg-stone-800
  }
  .drop-container input[type="file"]::file-selector-button:hover {
    @apply bg-black
  }
  
  span.cell-item {
    @apply rounded-md bg-white px-2 py-1 text-xs font-medium text-neutral-600 ring-1 ring-inset ring-gray-500/10 whitespace-nowrap
  }

  .alert-banner {
    @apply mt-5 flex items-center justify-between p-5 leading-normal text-red-600 bg-red-100 rounded-lg mb-5;
  }

  .table-container-wrapper {
    @apply overflow-hidden border border-gray-200 dark:border-gray-700 md:rounded-lg;
  }

  .card-metric {
    @apply text-center p-4 border rounded-lg dark:border-gray-700;
  }

  .badge-count {
    @apply bg-pink-100 text-pink-800 text-xs font-bold ms-2 px-2.5 py-0.5 rounded dark:bg-pink-900 dark:text-pink-300;
  }

  .badge-count-loading {
    @apply bg-gray-100 text-gray-500 text-xs font-bold ms-2 px-2.5 py-0.5 rounded dark:bg-gray-700 dark:text-gray-400 animate-pulse;
  }

  .btn-sort {
    @apply flex items-center gap-2 bg-white dark:bg-gray-800 dark:text-white px-5 py-2.5 rounded-md shadow;
  }

  .dropdown-menu-item {
    @apply flex items-center gap-2 w-full first-of-type:rounded-t-md last-of-type:rounded-b-md px-4 py-2.5 text-left text-sm hover:bg-gray-50 dark:hover:bg-gray-700 dark:text-white disabled:text-gray-500;
  }

  .section-card {
    @apply rounded-xl bg-white dark:bg-gray-900 bg-clip-border shadow flex flex-col w-full !p-4 mb-5;
  }

  .section-icon-badge {
    @apply flex h-9 w-9 items-center justify-center rounded-full bg-amber-100 dark:bg-gray-700 dark:bg-white/5;
  }

  .radio-toggle-group {
    @apply inline-flex overflow-hidden bg-white border divide-x rounded-lg dark:bg-gray-900 rtl:flex-row-reverse dark:border-gray-700 dark:divide-gray-700;
  }

  .radio-toggle-label {
    @apply inline-block select-none cursor-pointer px-5 py-2 text-xs font-semibold text-stone-600 dark:text-gray-300 transition-colors duration-200 sm:text-sm peer-checked:bg-stone-200 dark:peer-checked:bg-gray-600 peer-checked:text-stone-900 dark:peer-checked:text-white peer-checked:border-stone-400;
  }

  .dashboard-section {
    @apply w-full table-auto text-sm bg-white dark:bg-gray-800 p-4 rounded-md mt-4 max-h-96 overflow-auto;
  }

  /* Label/value tables on the proposal forms. The label column is sized to its content so
     the long "If approved, total ... for all open scopes" labels stay on one line, and the
     figures take whatever is left. minmax(0, ...) lets both columns shrink rather than
     overflow the modal on a narrow viewport. */
  .proposal-figures {
    @apply bg-stone-300/25 p-8 rounded-xl text-right items-center w-full;
    display: grid;
    grid-template-columns: minmax(0, max-content) minmax(0, 1fr);
    column-gap: 1rem;
  }

}

  /* Custom style */
  .header-right {
      width: calc(100% - 3.5rem);
  }
  .sidebar:hover {
      width: 16rem;
  }
  @media only screen and (min-width: 768px) {
      .header-right {
          width: calc(100% - 16rem);
      }        
  }

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

  .engagement-letter p {
      @apply mb-2;
  }

  .internal-border {
    @apply bg-[repeating-linear-gradient(45deg,_linen,_linen_5px,_peachpuff_5px,_peachpuff_10px)] [background-size:14px_14px] bg-[-1px]
  }

  [x-cloak] { display: none !important; }

  .max-h-0 {
    max-height: 0;
  }

  /* Prevent scrolling while dialog is open */
  body:has(dialog[open]) {
    @apply overflow-hidden;
  }

  /*
   * Blur the page content behind the dialog via the ::backdrop pseudo-element
   * instead of applying filter: blur() to <body>. Safari has a bug where
   * filter on an ancestor of <dialog> prevents it from rendering in the
   * top layer, making the dialog invisible while the backdrop still shows.
   */
  dialog[open]::backdrop {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
  }

  /*
   * Use CSS transitions instead of animations for dialog open/close.
   * Safari aborts CSS animations on <dialog> elements when showModal()
   * transitions them from hidden to visible.
   */
  dialog[open] {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 400ms ease, transform 400ms ease;
  }

  dialog[open].modal-opening {
    opacity: 0;
    transform: translateY(20vh);
  }

  dialog[open].modal-closing {
    opacity: 0;
    transform: translateY(10vh);
  }
    
  div.time_wrapper {
    @apply relative w-fit mx-auto my-0;
  }
  div.time_wrapper div.time_input {
    @apply w-fit flex items-center border-gray-300 border-2 text-indigo-600;
  }
  div.time_wrapper input {
    @apply w-[60px] h-auto box-border text-center text-[#132c14] border-[none] focus:outline-none focus:ring focus:ring-indigo-600;
  
    /* padding: auto 10px; */
  }
  div.time_wrapper label {
    @apply flex flex-col justify-center relative;
  }
  div.time_wrapper .label {
    @apply text-[0.55rem] absolute top-0;
  }
  div.time_wrapper .label.lbl-hrs {
    @apply left-5;
  }
  div.time_wrapper .label.lbl-min {
    @apply left-3.5;
  }
  div.time_wrapper .label.lbl-sec {
    @apply left-[13px];
  }
  
  /* Chrome, Safari, Edge, Opera */
  /*
  div.time_wrapper input::-webkit-outer-spin-button,
  div.time_wrapper input::-webkit-inner-spin-button {
    @apply m-0;
    -webkit-appearance: none;
  }
  */
  /* Firefox */
  div.time_wrapper input[type="number"] {
    -moz-appearance: textfield;
  }
  div.time_wrapper div.time_input,
  div.time_wrapper input {
    @apply rounded-lg;
  }
  div.time_wrapper input:focus + .label {
    @apply text-indigo-600;
  }
  div.time_wrapper input.invalid {
    @apply focus:outline-none focus:ring focus:ring-red-600
  }
  div.time_wrapper input.invalid:focus + .label {
    @apply text-[red];
  }
  div.time_wrapper div.error {
    @apply w-max absolute text-[red] invisible rounded bg-white border border-red-200 pl-2 pr-2 bg-opacity-90 top-[40px];
  }

  table.advanced-search-results { 
    @apply border-2 border-black table-auto;
  }
  table.advanced-search-results th { 
    @apply border border-black bg-slate-200 dark:bg-slate-700 text-right p-1;
  }

  table.advanced-search-results tr { 
    @apply  border-b odd:bg-slate-100 odd:dark:bg-slate-700 hover:bg-slate-200 hover:dark:bg-slate-500;
  }

  table.advanced-search-results td { 
    @apply pl-1 pr-1 border border-slate-100
  }

  div#query-groups-form div.field_with_errors { @apply inline }
  div#query-groups-form div.field_with_errors>select { @apply bg-red-300 }
  div#query-groups-form div.field_with_errors>input { @apply bg-red-300 }
  div.field_with_errors>div.toggle>label { @apply bg-red-300 rounded py-2 border-red-500 border}
  table.quick-search-results { @apply w-full;}
  table.quick-search-results th { @apply text-left bg-slate-200 dark:bg-slate-700 dark:text-gray-200 p-1;}
  table.quick-search-results tr { @apply border-b dark:border-gray-600;}
  table.quick-search-results td { @apply p-1 dark:text-gray-300;}


  div.user-page { @apply dark:bg-gray-600 bg-stone-50 rounded-md }
  div.user-page p.label { @apply font-bold }
  div.user-page .inactive-comp { @apply opacity-70 }
:root{--ts-pr-clear-button:0;--ts-pr-caret:0;--ts-pr-min:.75rem}.ts-wrapper.single .ts-control,.ts-wrapper.single .ts-control input{cursor:pointer}.ts-control{padding-right:max(var(--ts-pr-min),var(--ts-pr-clear-button) + var(--ts-pr-caret))!important}.ts-wrapper.plugin-drag_drop.multi>.ts-control>div.ui-sortable-placeholder{background:#f2f2f2!important;background:rgba(0,0,0,.06)!important;border:0!important;box-shadow:inset 0 0 12px 4px #fff;visibility:visible!important}.ts-wrapper.plugin-drag_drop .ui-sortable-placeholder:after{content:"!";visibility:hidden}.ts-wrapper.plugin-drag_drop .ui-sortable-helper{box-shadow:0 2px 5px rgba(0,0,0,.2)}.plugin-checkbox_options .option input{margin-right:.5rem}.plugin-clear_button{--ts-pr-clear-button:1em}.plugin-clear_button .clear-button{background:transparent!important;cursor:pointer;margin-right:0!important;opacity:0;position:absolute;right:2px;top:50%;transform:translateY(-50%);transition:opacity .5s}.plugin-clear_button.form-select .clear-button,.plugin-clear_button.single .clear-button{right:max(var(--ts-pr-caret),8px)}.plugin-clear_button.focus.has-items .clear-button,.plugin-clear_button:not(.disabled):hover.has-items .clear-button{opacity:1}.ts-wrapper .dropdown-header{background:#f8f8f8;border-bottom:1px solid #d0d0d0;border-radius:3px 3px 0 0;padding:10px 8px;position:relative}.ts-wrapper .dropdown-header-close{color:#303030;font-size:20px!important;line-height:20px;margin-top:-12px;opacity:.4;position:absolute;right:8px;top:50%}.ts-wrapper .dropdown-header-close:hover{color:#000}.plugin-dropdown_input.focus.dropdown-active .ts-control{border:1px solid #d0d0d0;box-shadow:none}.plugin-dropdown_input .dropdown-input{background:transparent;border:solid #d0d0d0;border-width:0 0 1px;box-shadow:none;display:block;padding:8px;width:100%}.plugin-dropdown_input .items-placeholder{border:0!important;box-shadow:none!important;width:100%}.plugin-dropdown_input.dropdown-active .items-placeholder,.plugin-dropdown_input.has-items .items-placeholder{display:none!important}.ts-wrapper.plugin-input_autogrow.has-items .ts-control>input{min-width:0}.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control>input{flex:none;min-width:4px}.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control>input::-ms-input-placeholder{color:transparent}.ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control>input::placeholder{color:transparent}.ts-dropdown.plugin-optgroup_columns .ts-dropdown-content{display:flex}.ts-dropdown.plugin-optgroup_columns .optgroup{border-right:1px solid #f2f2f2;border-top:0;flex-basis:0;flex-grow:1;min-width:0}.ts-dropdown.plugin-optgroup_columns .optgroup:last-child{border-right:0}.ts-dropdown.plugin-optgroup_columns .optgroup:before{display:none}.ts-dropdown.plugin-optgroup_columns .optgroup-header{border-top:0}.ts-wrapper.plugin-remove_button .item{align-items:center;display:inline-flex;padding-right:0!important}.ts-wrapper.plugin-remove_button .item .remove{border-radius:0 2px 2px 0;box-sizing:border-box;color:inherit;display:inline-block;padding:0 6px;text-decoration:none;vertical-align:middle}.ts-wrapper.plugin-remove_button .item .remove:hover{background:rgba(0,0,0,.05)}.ts-wrapper.plugin-remove_button.disabled .item .remove:hover{background:none}.ts-wrapper.plugin-remove_button .remove-single{font-size:23px;position:absolute;right:0;top:0}.ts-wrapper.plugin-remove_button:not(.rtl) .item .remove{border-left:1px solid #d0d0d0;margin-left:6px}.ts-wrapper.plugin-remove_button:not(.rtl) .item.active .remove{border-left-color:#cacaca}.ts-wrapper.plugin-remove_button:not(.rtl).disabled .item .remove{border-left-color:#fff}.ts-wrapper.plugin-remove_button.rtl .item .remove{border-right:1px solid #d0d0d0;margin-right:6px}.ts-wrapper.plugin-remove_button.rtl .item.active .remove{border-right-color:#cacaca}.ts-wrapper.plugin-remove_button.rtl.disabled .item .remove{border-right-color:#fff}.ts-wrapper{position:relative}.ts-control,.ts-control input,.ts-dropdown{font-smoothing:inherit;color:#303030;font-family:inherit;font-size:13px;line-height:18px}.ts-control,.ts-wrapper.single.input-active .ts-control{background:#fff;cursor:text}.ts-control{border:1px solid #d0d0d0;border-radius:3px;box-shadow:none;box-sizing:border-box;display:flex;flex-wrap:wrap;overflow:hidden;padding:8px;position:relative;width:100%;z-index:1}.ts-wrapper.multi.has-items .ts-control{padding:6px 8px 3px}.full .ts-control{background-color:#fff}.disabled .ts-control,.disabled .ts-control *{cursor:default!important}.focus .ts-control{box-shadow:none}.ts-control>*{display:inline-block;vertical-align:baseline}.ts-wrapper.multi .ts-control>div{background:#f2f2f2;border:0 solid #d0d0d0;color:#303030;cursor:pointer;margin:0 3px 3px 0;padding:2px 6px}.ts-wrapper.multi .ts-control>div.active{background:#e8e8e8;border:0 solid #cacaca;color:#303030}.ts-wrapper.multi.disabled .ts-control>div,.ts-wrapper.multi.disabled .ts-control>div.active{background:#fff;border:0 solid #fff;color:#7d7d7d}.ts-control>input{background:none!important;border:0!important;box-shadow:none!important;display:inline-block!important;flex:1 1 auto;line-height:inherit!important;margin:0!important;max-height:none!important;max-width:100%!important;min-height:0!important;min-width:7rem;padding:0!important;text-indent:0!important;-webkit-user-select:auto!important;-moz-user-select:auto!important;-ms-user-select:auto!important;user-select:auto!important}.ts-control>input::-ms-clear{display:none}.ts-control>input:focus{outline:none!important}.has-items .ts-control>input{margin:0 4px!important}.ts-control.rtl{text-align:right}.ts-control.rtl.single .ts-control:after{left:15px;right:auto}.ts-control.rtl .ts-control>input{margin:0 4px 0 -2px!important}.disabled .ts-control{background-color:#fafafa;opacity:.5}.input-hidden .ts-control>input{left:-10000px;opacity:0;position:absolute}.ts-dropdown{background:#fff;border:1px solid #d0d0d0;border-radius:0 0 3px 3px;border-top:0;box-shadow:0 1px 3px rgba(0,0,0,.1);box-sizing:border-box;left:0;margin:.25rem 0 0;position:absolute;top:100%;width:100%;z-index:10}.ts-dropdown [data-selectable]{cursor:pointer;overflow:hidden}.ts-dropdown [data-selectable] .highlight{background:rgba(125,168,208,.2);border-radius:1px}.ts-dropdown .create,.ts-dropdown .no-results,.ts-dropdown .optgroup-header,.ts-dropdown .option{padding:5px 8px}.ts-dropdown .option,.ts-dropdown [data-disabled],.ts-dropdown [data-disabled] [data-selectable].option{cursor:inherit;opacity:.5}.ts-dropdown [data-selectable].option{cursor:pointer;opacity:1}.ts-dropdown .optgroup:first-child .optgroup-header{border-top:0}.ts-dropdown .optgroup-header{background:#fff;color:#303030;cursor:default}.ts-dropdown .active{background-color:#f5fafd;color:#495c68}.ts-dropdown .active.create{color:#495c68}.ts-dropdown .create{color:rgba(48,48,48,.5)}.ts-dropdown .spinner{display:inline-block;height:30px;margin:5px 8px;width:30px}.ts-dropdown .spinner:after{animation:lds-dual-ring 1.2s linear infinite;border-color:#d0d0d0 transparent;border-radius:50%;border-style:solid;border-width:5px;content:" ";display:block;height:24px;margin:3px;width:24px}@keyframes lds-dual-ring{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ts-dropdown-content{overflow-scrolling:touch;max-height:200px;overflow-x:hidden;overflow-y:auto;scroll-behavior:smooth}.ts-hidden-accessible{clip:rect(0 0 0 0)!important;border:0!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}
/*# sourceMappingURL=tom-select.min.css.map */
/*
 * 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.
 *


 */