.tc-container{grid-column:1/-1}.tc-container:not(:has(.casino-review-and-terms-grid)){padding:4px 0}.tc-container.casino-review-and-terms-grid{display:-ms-grid;display:grid;grid-template-areas:"terms review" "content content";-ms-grid-columns:1fr auto;grid-template-columns:1fr auto;max-width:80%;margin:0 auto;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%}.tc-container .js-tc-toggler{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.tc-container .tc-toggle-label{-ms-grid-row:1;-ms-grid-column:1;cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:6px;grid-area:terms;padding:8px 0}.tc-container .tc-content{-ms-grid-row:2;-ms-grid-column:1;-ms-grid-column-span:2;grid-area:content;max-height:0;overflow:hidden;margin-top:0;margin-bottom:0;opacity:0;text-align:center;-webkit-transition:max-height 0.3s ease-out,opacity 0.4s ease-out,margin-top 0.3s ease-out;transition:max-height 0.3s ease-out,opacity 0.4s ease-out,margin-top 0.3s ease-out;font-size:10px}.tc-container .js-tc-toggler:checked~.tc-content{max-height:500px;opacity:1;margin-top:10px;-webkit-transition:max-height 0.5s ease-in,opacity 0.5s ease-in,margin-top 0.3s ease-out;transition:max-height 0.5s ease-in,opacity 0.5s ease-in,margin-top 0.3s ease-out}.tc-container .casino-review-btn{-ms-grid-row:1;-ms-grid-column:2;grid-area:review;-ms-grid-column-align:end;justify-self:end}.tc-container .casino-review-btn a{width:100%!important}.casino-grid-review-and-terms{display:-webkit-box;display:-ms-flexbox;display:flex;font-size:0.6rem}.casino-grid-review-and-terms .casino-carousel-item__review-btn,.casino-grid-review-and-terms .casino-grid-item__review-btn{font-size:0.6rem!important}

/* ------------------------------------------------------------------
 * Moved out of PHP in v4.5.
 * These rules used to be printed as an inline <style> block on every
 * page of the site (including pages with no casino output). Keeping
 * them in a real stylesheet makes them cacheable and conditional.
 * ------------------------------------------------------------------ */

:root {
  --star-size: 20px;
  --star-color: #ddd;
  --star-background: #fc0;
}

.decimal-star-rating {
  --percent: calc(var(--rating) / 5 * 100%);
  display: inline-block;
  font-size: var(--star-size);
  line-height: 1;
}

.decimal-star-rating::before {
  content: '\2605\2605\2605\2605\2605';
  letter-spacing: 1px;
  background: linear-gradient(90deg, var(--star-background) var(--percent), var(--star-color) var(--percent));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.casino-skin-container ul,
.casino-skin-container ol {
  margin: 0;
  list-style: none;
}

.casino-item__bonus-usp li::before {
  min-width: 16px;
}

#show-more {
  margin-top: 1rem;
}

.star-rating {
  display: inline-flex;
  gap: 1px;
  font-size: 20px;
}

.star {
  color: #ddd;
  position: relative;
}

.stars-1 .star:nth-child(-n+1),
.stars-1-5 .star:nth-child(-n+1),
.stars-2 .star:nth-child(-n+2),
.stars-2-5 .star:nth-child(-n+2),
.stars-3 .star:nth-child(-n+3),
.stars-3-5 .star:nth-child(-n+3),
.stars-4 .star:nth-child(-n+4),
.stars-4-5 .star:nth-child(-n+4),
.stars-5 .star:nth-child(-n+5) {
  color: #ffc107;
}

.stars-0-5 .star:nth-child(1)::before,
.stars-1-5 .star:nth-child(2)::before,
.stars-2-5 .star:nth-child(3)::before,
.stars-3-5 .star:nth-child(4)::before,
.stars-4-5 .star:nth-child(5)::before {
  content: '\2605';
  position: absolute;
  left: 0;
  top: 0;
  width: 50%;
  overflow: hidden;
  color: #ffc107;
}

/* ---------------------------------- Filter dropdown ---------------- */

.casino-filter-bar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 6px;
  position: relative;
}

.casino-filter-dropdown {
  position: relative;
}

.casino-filter-toggle {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 6px 12px !important;
  border: 1px solid #ddd !important;
  border-radius: 20px;
  background: #fff;
  cursor: pointer;
  font-size: 13px !important;
  font-family: inherit;
  line-height: 1.3;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.casino-filter-toggle:hover,
.casino-filter-toggle:focus-visible {
  border-color: #999 !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

.casino-filter-count {
  background: #cc0e37;
  color: #fff;
  border-radius: 50%;
  min-width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
}

.casino-filter-panel {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 4px;
  min-width: 220px;
  max-width: min(300px, calc(100vw - 32px));
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  z-index: 100;
  padding: 8px 0;
}

.casino-filter-search-wrapper {
  padding: 8px 12px;
}

.casino-filter-search {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #ddd;
  border-radius: 6px;
  /* 16px stops iOS Safari zooming the viewport when the field is focused. */
  font-size: 16px;
  outline: none;
  box-sizing: border-box;
}

.casino-filter-search:focus {
  border-color: #999;
}

.casino-filter-search::placeholder {
  color: var(--cd-placeholder-color, inherit);
  opacity: 1;
}

.casino-filter-options {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  max-height: min(200px, 40vh);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.casino-filter-option {
  padding: 0;
}

.casino-filter-option label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  cursor: pointer;
  font-size: 13px;
  transition: background 0.15s;
  margin: 0;
}

.casino-filter-option label:hover {
  background: #f5f5f5;
}

.casino-filter-item-count {
  margin-left: auto;
  font-size: 11px;
  color: #999;
  font-weight: 400;
}

.casino-filter-reset {
  display: block;
  width: calc(100% - 24px);
  margin: 8px 12px 4px;
  background: transparent;
  border: 1px solid #ddd;
  border-radius: 6px;
  cursor: pointer;
  font-family: inherit;
  text-align: center;
  transition: background 0.15s;
  padding: 6px 12px !important;
  font-size: 13px !important;
}

.casino-filter-reset:hover {
  background: #f5f5f5;
}

@media (max-width: 600px) {
  .casino-filter-bar {
    justify-content: stretch;
  }

  .casino-filter-toggle {
    width: 100%;
    justify-content: center;
  }

  .casino-filter-panel {
    left: 0;
    right: 0;
    max-width: none;
  }
}