/*
Theme Name: Spinoko Child Slots Launch
Theme URI: https://dinomatic.com/spinoko
Author: DinoMatic
Author URI: https://dinomatic.com
Template: spinoko
Description: Spinoko Child Theme for Slots Launch demo games plugin integration.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: spinoko-child
*/

/** SINGLE GAME SHORTCODE **/
.sl-container {
  --color-spinoko-sl-bg: var(--color-neutral);
  --color-spinoko-sl-fg: var(--color-light);
  --spinoko-sl-game-border-radius: 6px;

  margin-block-end: 32px;
  padding: 4px;
  background-color: var(--color-spinoko-sl-bg, var(--color-neutral));
  border-radius: var(--spinoko-border-radius);
  box-shadow: var(--spinoko-box-shadow);
}

.sl-container .slotls-header {
  margin-block-start: 0;
}

.sl-container .slotls-header > a.sl-fullscreen,
.sl-container .slotls-header > a.sl-broken-link {
  margin-inline-start: 4px;
  margin-block-end: 4px;
}

.sl-container .slotls-header .sl-rating-container {
  flex-direction: row;
  justify-content: flex-end;
  margin-block-end: 4px;
  margin-inline-end: 4px;
}

.sl-container .slotls-header .sl-rating-container .sl-rating_text {
  display: none;

  @media (min-width: 768px) {
    display: block;
  }
}


.sl-container .sl-slots {
  background-color: var(--color-spinoko-sl-fg, var(--color-light)) !important;
  border-radius: var(--spinoko-sl-game-border-radius, 6px);
}

.sl-container .sl-slots .sl-placeholder {
  background-color: var(--color-spinoko-sl-fg, var(--color-light));
}

/** GAMES & PROVIDERS ARCHIVE **/
.slotsl-container {
  --input-width: 200px;
  --input-height: 40px;

  padding-inline-start: 0;
  padding-inline-end: 0;
}

.slotsl-game a.slotsl-url.slotsl-thumb-url {
  text-decoration: none;
  background-color: var(--color-light);
}

.slotsl-filters .sl-filter-container {
  margin-block-end: 0;
}

.slotsl-search {
  input {
    padding-inline-end: 0;
  }

  .sl-submit-search {
    right: 12px !important;
    padding-inline-end: 0;
  }

  svg {
    stroke: var(--color-neutral);
  }
}

.slotsl-search input,
.slotsl-providers select,
.slotsl-megaways,
.sl-mobile-filter-button {
  min-height: var(--input-height) !important;
  height: var(--input-height) !important;
  background-color: var(--color-body-bg);
  border-color: var(--color-light) !important;
  border-radius: var(--spinoko-border-radius);

  svg {
    stroke: var(--color-neutral);
  }
}

.slotsl-megaways .slider {
  background-color: var(--color-light);
}

.sl-mobile-filter-button.clicked {
  background-color: var(--color-light);
}

.slotsl-grid .slotsl-game .slotsl-meta .slotsl-title {
  padding-block-end: 8px;
}

@media (min-width: 768px) {

  #slotsl-filters,
  .sl-filter-container {
    display: flex;
    align-items: center;
    margin-block-end: 24px;
  }

  .slotsl-providers {
    height: var(--input-height);
    margin-inline-start: 8px;
  }

  .slotsl-search input,
  .slotsl-providers select,
  .slotsl-megaways {
    min-width: var(--input-width);
    padding-block-start: 0 !important;
    padding-block-end: 0 !important;
  }
}

.slotsl-providers-archives .slotsl-grid .slotsl-game .slotsl-meta .slotsl-title {
  margin-block-end: 0 !important;
  padding-block-end: 0;
}

.slotsl-providers-archives .slotsl-grid .slotsl-game .slotsl-meta .slotsl-title .sl-count {
  background-color: var(--color-light);
}