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

@layer components {
  .tab-button[aria-selected="true"] {
    @apply inline-block px-3 py-2.5 text-sm font-medium text-white bg-primary-700 rounded-t-lg hover:text-white hover:bg-primary-800;
  }

  .tab-button[aria-selected="false"] {
    @apply inline-block px-3 py-2.5 text-sm font-medium bg-gray-200 rounded-t-lg hover:text-gray-900 hover:bg-gray-300;
  }

  [type="radio"]:checked {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' aria-hidden='true' viewBox='0 0 16 12'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M1 5.917 5.724 10.5 15 1.5'/%3E%3C/svg%3E");
  }

  .clickable-container {
    pointer-events: none;
  }

  .clickable-container input {
    pointer-events: none;
  }

  /* autocomplete styles */

  :root {
    --aa-primary-color-rgb: 20, 108, 148;
  }

  .aa-Panel {
    z-index: 100;
  }

  .algolia-autocomplete .aa-Form {
    @apply shadow-none bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-secondary-500 focus:border-secondary-300;
  }

  .algolia-autocomplete .aa-Input {
    @apply bg-gray-50 text-sm border-0 rounded-lg focus:ring-0 focus:outline-none;
  }
}
/*
 * 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.
 *


 */

.bustracker_pagination {
  background: #ffffff;
  border-top: 1px solid #e5e5e5;
  padding-top: 15px;
  padding-bottom: 15px;
  text-align: center;
  cursor: default;
  background-color: #f4f6f7;
}
.bustracker_pagination a,
.bustracker_pagination span {
  padding: 0.2em 0.3em;
}
.bustracker_pagination .disabled {
  color: #aaaaaa;
}
.bustracker_pagination .current {
  font-style: normal;
  font-weight: bold;
  color: #ffffff;
  background-color: #146c94;
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  line-height: 1.5;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
.bustracker_pagination a {
  text-decoration: none;
  color: #444b5a;
}
.bustracker_pagination a:hover,
.bustracker_pagination a:focus {
  text-decoration: none;
  font-style: normal;
  color: #363a43;
  background-color: #c9cfd8;
  width: 5px;
  height: 5px;
  line-height: 1.5;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.digg_pagination {
  background: white;
  cursor: default;
  /* self-clearing method: */
}
.digg_pagination a,
.digg_pagination span,
.digg_pagination em {
  padding: 0.2em 0.5em;
  display: block;
  float: left;
  margin-right: 1px;
}
.digg_pagination .disabled {
  color: #999999;
  border: 1px solid #dddddd;
}
.digg_pagination .current {
  font-style: normal;
  font-weight: bold;
  background: #2e6ab1;
  color: white;
  border: 1px solid #2e6ab1;
}
.digg_pagination a {
  text-decoration: none;
  color: #105cb6;
  border: 1px solid #9aafe5;
}
.digg_pagination a:hover,
.digg_pagination a:focus {
  color: #000033;
  border-color: #000033;
}
.digg_pagination .page_info {
  background: #2e6ab1;
  color: white;
  padding: 0.4em 0.6em;
  width: 22em;
  margin-bottom: 0.3em;
  text-align: center;
}
.digg_pagination .page_info b {
  color: #000033;
  background: #6aa6ed;
  padding: 0.1em 0.25em;
}
.digg_pagination:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
* html .digg_pagination {
  height: 1%;
}
*:first-child + html .digg_pagination {
  overflow: hidden;
}