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

/*

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

*/
.checkbox-container {
  @apply relative;
}

.single_team {
  @apply sr-only;
}

.round-checkbox {
  @apply w-5 h-5 border-2 border-gray-600 rounded cursor-pointer bg-white;
  @apply flex flex-shrink-0 justify-center items-center;
}

.round-checkbox:after {
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="14" viewBox="0 0 24 24" fill="none" stroke="green" stroke-width="5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"></polyline></svg>');
  display: none;
}

.single_team:checked ~ .round-checkbox {
  @apply border-indigo-800;
}

.single_team:checked ~ .round-checkbox:after {
  display: block;
}

.pagination .current {
  color: lightgray !important; /* Change according to your preference */
}
.pagination .previous_page,
.pagination .next_page {
  color: #337ab7 !important; /* Active button text color */
}
.pagination .previous_page.disabled,
.pagination .next_page.disabled {
  color:  lightgray !important; /* Disabled button text color */
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS 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/SCSS
 * 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.
 *


 */