@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap");
.font-oswald-extralight {
  font-family: "Oswald", sans-serif;
  font-weight: 200;
  font-style: normal;
  font-optical-sizing: auto;
}

.font-oswald-light {
  font-family: "Oswald", sans-serif;
  font-weight: 300;
  font-style: normal;
  font-optical-sizing: auto;
}

.font-oswald-regular {
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-optical-sizing: auto;
}

.font-oswald-medium {
  font-family: "Oswald", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-optical-sizing: auto;
}

.font-oswald-semibold {
  font-family: "Oswald", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-optical-sizing: auto;
}

.font-oswald-bold {
  font-family: "Oswald", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-optical-sizing: auto;
}

.text-warning {
  color: #ff9900 !important;
}

.text-white {
  color: #f8f9fa !important;
}

.section-title {
  font-weight: bold;
  color: #fff0ac !important;
  text-shadow: 0 0 10px #ff5500, 0 0 20px rgba(255, 85, 0, 0.5), 0 0 30px rgba(255, 153, 0, 0.3);
  letter-spacing: 1px;
}

* {
  font-family: "Oswald", sans-serif;
  color: #f8f9fa;
}

body {
  background-image: url("/images/background/baza2.png");
  background-color: #0d0e1b;
  color: #f8f9fa;
  overflow-x: hidden;
}

.site-header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
  transition: transform 0.7s ease-in-out;
  background-color: #07070f;
  color: #f8f9fa;
}
.site-header.header-hidden {
  transform: translateY(-100%);
}
.site-header .navbar {
  padding-top: 0;
  padding-bottom: 0;
}
.site-header .navbar .social-icons-glow .social-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  color: #f8f9fa;
  text-decoration: none;
  border: 1px solid rgba(248, 249, 250, 0.1);
  transition: all 0.3s ease;
}
.site-header .navbar .social-icons-glow .social-icon:hover {
  color: #ff5500;
  border-color: #ff5500;
  box-shadow: 0 0 10px #ff5500, 0 0 20px rgba(255, 85, 0, 0.7), 0 0 30px rgba(255, 153, 0, 0.5);
}
.site-header .navbar .nav-links {
  padding-bottom: 25px;
}
.site-header .navbar .nav-links .nav-item {
  position: relative;
}
.site-header .navbar .nav-links .nav-link {
  letter-spacing: 1px;
  display: block;
  border-radius: 50px;
  font-weight: bold;
  color: white;
  z-index: 2;
  position: relative;
}
.site-header .navbar .nav-links .nav-item.active::after {
  content: "";
  position: absolute;
  width: 30%;
  height: 1%;
  top: 50%;
  left: 50%;
  z-index: 1;
  box-shadow: 0 0 40px 10px rgba(255, 85, 0, 0.7), 0 0 45px 20px rgba(255, 85, 0, 0.3), 0 0 50px 25px rgba(255, 153, 0, 0.3);
  filter: blur(8px);
  transform: translate(-50%, -50%);
}

#usp,
#mechanika,
#regrywalnosc,
.player-reviews-section,
.faq-section,
.hero-section,
.crowdfunding-section {
  background-image: url("../images/background/przejscie-gora.png"), url("../images/background/przejscie-dol.png");
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: top center, bottom center;
  background-color: #07070f;
  padding: 100px 0 !important;
}

.hero-carousel .hero-title {
  color: #fff0ac;
  text-shadow: 0 0 10px #ff5500, 0 0 20px rgba(255, 85, 0, 0.7), 0 0 30px rgba(255, 153, 0, 0.5);
}

.lead {
  font-size: 150%;
}

@media screen and (min-width: 768px) {
  #first-timer {
    width: 50%;
    margin: 0 auto;
  }
}
.box-timer {
  background-color: #07070f;
  border-radius: 8px;
  border: 1px solid #222;
  box-shadow: 0 0 5px rgba(255, 153, 0, 0.2);
}
.box-timer h5 {
  color: #f8f9fa;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.box-timer #countdown-timer-bottom,
.box-timer #countdown-timer-top,
.box-timer #countdown-timer-topsite {
  color: #ff9900 !important;
  font-family: "Consolas", monospace;
  letter-spacing: 3px;
  text-shadow: 0 0 7px #ff5500, 0 0 10px rgba(255, 85, 0, 0.7);
}
@media (min-width: 992px) {
  .box-timer #countdown-timer-bottom,
  .box-timer #countdown-timer-top,
  .box-timer #countdown-timer-topsite {
    font-size: 300%;
  }
}

.button {
  background-color: #ff9900;
  border-color: #ff5500;
  color: #07070f;
  font-size: 1.8rem;
  font-weight: bold;
  text-transform: uppercase;
  box-shadow: 0 0 10px rgba(255, 85, 0, 0.5);
  transition: all 0.5s linear;
}
.button:hover {
  background-color: rgba(255, 85, 0, 0.3);
  border-color: rgba(255, 85, 0, 0.3);
  box-shadow: 0 0 15px rgba(255, 85, 0, 0.8);
}

#porownanie-rpg .comparison-table {
  border-top: 1px solid #444;
  border-bottom: 1px solid #444;
}
#porownanie-rpg .comparison-table .comparison-col {
  padding: 1.5rem 1rem;
}
#porownanie-rpg .comparison-table .comparison-col--left {
  border-right: 1px solid #444;
}
#porownanie-rpg .comparison-list {
  margin-bottom: 0;
}
#porownanie-rpg .comparison-list li {
  font-size: 120%;
  min-height: 90px;
}
@media (min-width: 992px) {
  #porownanie-rpg .comparison-list {
    padding: 1.5rem 2rem;
  }
}
#porownanie-rpg .comparison-list .comparison-item {
  margin-bottom: 1.5rem;
}
#porownanie-rpg .comparison-list .comparison-item:last-child {
  margin-bottom: 0;
}

/* #swiat-gry .container, */
#mechanika .container {
  border-radius: 25px;
  background-color: #0d0e1b;
  border: #222 1px solid;
  padding: 25px !important;
}

#zawartosc .pic {
  margin-left: -50px;
  height: 450px;
  width: auto;
}

#usp .container {
  border-radius: 25px;
  background-color: rgba(255, 255, 255, 0.02);
  border: #222 1px solid;
  padding: 50px 0px;
}

/* Tekst musi być nad overlayem */
.section-background > * {
  position: relative;
  z-index: 2;
}

.card {
  border: 1px solid #444;
}

.accordion .accordion-item {
  background-color: #0d0e1b;
  border-color: #444;
}
.accordion .accordion-item .accordion-button-white-icon::after {
  filter: brightness(0) invert(1); /* Odwraca i rozjaśnia (lub po prostu zmienia na biały) */
}
.accordion .accordion-item .accordion-button {
  background-color: #0d0e1b;
  color: #f8f9fa;
  border-color: #444;
}
.accordion .accordion-item .accordion-button:not(.collapsed) {
  color: #f8f9fa;
  box-shadow: none;
}

.player-reviews-section .carousel-indicators {
  bottom: -50px !important;
}

.site-footer {
  background-color: #0d0e1b;
  color: #f8f9fa;
}
.site-footer .btn-buy {
  background-image: url("../images/components/przycisk.png");
  background-size: 40%;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  font-size: 24px;
}

.footer-links li {
  position: relative; /* Niezbędne dla pozycjonowania kropki */
  padding-left: 20px; /* Robi miejsce na kropkę */
  margin-bottom: 8px; /* Dodaje odstęp między linkami */
}
.footer-links li::before {
  content: "•"; /* To jest nasza kropka */
  position: absolute;
  left: 0;
  top: 0;
  color: #ff9900; /* Kolor pomarańczowy, pasujący do Twojej strony */
  font-size: 1.2em; /* Lekko powiększa kropkę */
  line-height: 1;
}
.footer-links a {
  color: #f8f9fa;
  transition: color 0.3s;
}
.footer-links a:hover {
  text-shadow: 0 0 10px #ff5500, 0 0 20px rgba(255, 85, 0, 0.7), 0 0 30px rgba(255, 153, 0, 0.5);
}
.footer-links .active-link a {
  color: #ff5500;
}

.footer-bottom {
  background-image: url("../images/components/ramka-footer.png");
  background-position: top center;
  background-repeat: no-repeat;
}

.social-icons-glow .social-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  color: #f8f9fa;
  text-decoration: none;
  border: 1px solid rgba(248, 249, 250, 0.1);
  transition: all 0.3s ease;
}
.social-icons-glow .social-icon:hover {
  color: #ff5500;
  border-color: #ff5500;
  box-shadow: 0 0 10px #ff5500, 0 0 20px rgba(255, 85, 0, 0.7), 0 0 30px rgba(255, 153, 0, 0.5);
}

#gallery .gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 1rem;
}
#gallery .gallery-item a {
  display: block;
  width: 100%;
  height: 100%;
}
#gallery .gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 1/1;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
#gallery .gallery-item img:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}
#gallery .row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 1.5rem;
}

#galleryModal {
  max-height: 95vh; /* Ustawienie maksymalnej wysokości na 95% wysokości ekranu */
  margin-top: 2.5vh; /* Wyśrodkowanie pionowe, pozostawiając 2.5% na górze */
  margin-bottom: 2.5vh;
}
#galleryModal .modal-content {
  background-color: transparent !important;
  border: none !important;
}
#galleryModal #modalImage {
  border-radius: 20px;
  border: 1px solid #444;
}

.carousel-slide {
  margin-top: 65px;
  background-color: #07070f;
  background-image: url("../images/background/przejscie-dol.png");
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: bottom center;
}
.carousel-slide .carousel-indicators {
  bottom: 50px !important;
}
.carousel-slide .carousel-item.first-slide {
  background-image: url("../images/gallery/zdj.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100%;
}
.carousel-slide .carousel-item.second-slide {
  background-image: url("../images//components/3FF9F45E-B1AF-41CB-9B1F-C606ADD1835B.mp4");
  background-position: center center;
  background-repeat: no-repeat;
  height: auto;
}
.carousel-slide .carousel-item {
  position: relative;
  overflow: hidden;
}
.carousel-slide .carousel-item video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.site-footer {
  background-color: #0d0e1b;
}

#onas {
  height: auto;
  margin-top: 150px;
}
#onas p {
  font-size: 150%;
}

#games .btn-buy,
#contact .btn-buy,
#newsletter .btn-buy,
#shop .btn-buy,
#onas .site-footer .btn-buy {
  background-image: url("../images/components/przycisk.png");
  background-size: fit;
  background-position: center;
  background-size: 100% 80%;
  background-repeat: no-repeat;
  color: #f8f9fa;
  letter-spacing: 1px;
}
#games input,
#games textarea,
#contact input,
#contact textarea,
#newsletter input,
#newsletter textarea,
#shop input,
#shop textarea,
#onas .site-footer input,
#onas .site-footer textarea {
  background-color: #07070f;
  border: #222 1px solid;
}

#games {
  margin-top: 200px;
}
#games #productMainCarousel {
  max-height: 500px;
}
#games #productMainCarousel .carousel-item {
  border: 1px solid rgba(68, 68, 68, 0.7);
  border-radius: 8px;
  background-color: #07070f;
}
#games #productMainCarousel .carousel-item img {
  max-height: 500px;
  max-width: 500px;
}
#games .game-details .btn.button {
  border: 2px solid #ff5500;
  color: #0d0e1b;
  box-shadow: 0 0 10px rgba(255, 85, 0, 0.7);
}
#games .game-details .btn.button:hover {
  background-color: rgba(255, 153, 0, 0.05);
  box-shadow: 0 0 15px #ff5500;
  transform: scale(1.02);
  color: #f8f9fa;
}
#games .game-details .price-box {
  background-color: #07070f;
  border: 1px solid #444;
  border-radius: 8px;
}
#games .game-details #countdown-timer {
  color: blue;
  font-size: 110%;
}
#games .game-details .game-description .list-unstyled i {
  color: #ff9900 !important;
  text-shadow: 0 0 2px rgba(255, 85, 0, 0.5);
}
#games .thumbnail-gallery .thumbnail-btn {
  width: 90px;
  height: 90px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 8px;
  background: none;
  overflow: hidden;
  transition: border-color 0.3s;
  display: flex;
  justify-content: center;
  align-items: center;
}
#games .thumbnail-gallery .thumbnail-btn img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
  border: 1px solid #222;
}
#games .thumbnail-gallery .thumbnail-btn:hover {
  background-image: linear-gradient(to right, rgba(255, 85, 0, 0.1), transparent);
  border-color: #ff9900;
}
#games .carousel-item.main-image {
  max-height: 500px;
}
#games .carousel-control-prev-icon,
#games .carousel-control-next-icon {
  filter: invert(1) grayscale(100%) brightness(200%);
}
#games .carousel-control-prev,
#games .carousel-control-next {
  width: 8%;
  background: none;
}
#games .carousel-control-prev:hover,
#games .carousel-control-next:hover {
  background-color: rgba(255, 85, 0, 0.1);
}
#games .hero-section {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow: hidden;
}
#games .game-details > .background-left-orange {
  background-color: #07070f !important;
  border-left: 5px solid #ff9900;
  box-shadow: 0 0 10px rgba(7, 7, 15, 0.5);
  line-height: 1.5;
  font-size: 20px;
}
#games .game-details > .background-left-orange span {
  font-size: 20px;
}
#games .game-details > .background-left-orange u {
  color: #ff9900;
  text-decoration: none;
  font-weight: bold;
  display: block;
  padding-top: 10px;
}
#games {
  /* ========================================================================= */
  /* === INTERAKTYWNA MAPA (dostosowana do motywu) === */
  /* ========================================================================= */
}
#games .interactive-map-container {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 3rem auto;
  border-radius: 8px;
  overflow: hidden;
}
#games .interactive-map-container .map-image {
  border: 2px solid #444;
  box-shadow: 0 0 20px rgba(7, 7, 15, 0.8);
  width: 100%;
  height: auto;
  display: block;
  filter: brightness(0.8) contrast(1.1);
}
#games .interactive-map-container .map-point {
  position: absolute;
  width: 25px;
  height: 25px;
  background-color: #ff9900;
  border: 2px solid #f8f9fa;
  border-radius: 50%;
  cursor: pointer;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 10px rgba(255, 153, 0, 0.8), 0 0 20px rgba(255, 85, 0, 0.5);
  transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}
#games .interactive-map-container .map-point:hover {
  transform: translate(-50%, -50%) scale(1.3);
  background-color: #ff5500;
  box-shadow: 0 0 15px #ff5500, 0 0 30px rgba(255, 85, 0, 0.7);
}
#games .interactive-map-container .map-point:hover .tooltip {
  visibility: visible;
  opacity: 1;
}
#games .interactive-map-container .map-point .tooltip {
  visibility: hidden;
  opacity: 0;
  width: 140px;
  background-color: #07070f;
  color: #f8f9fa;
  text-align: center;
  border-radius: 6px;
  padding: 8px;
  position: absolute;
  z-index: 10;
  bottom: 140%;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 500;
  border: 1px solid #222;
  transition: opacity 0.3s ease;
}
#games .interactive-map-container .map-point .tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #07070f transparent transparent transparent;
}
#games .interactive-map-container .info-box {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  max-width: 450px;
  background-color: rgba(7, 7, 15, 0.95);
  backdrop-filter: blur(5px);
  color: #f8f9fa;
  border: 2px solid #ff9900;
  border-radius: 8px;
  padding: 25px;
  z-index: 100;
  box-shadow: 0 0 25px rgba(255, 153, 0, 0.5);
}
#games .interactive-map-container .info-box.active {
  display: block;
}
#games .interactive-map-container .info-box h3 {
  font-weight: bold;
  color: #fff0ac !important;
  text-shadow: 0 0 10px #ff5500, 0 0 20px rgba(255, 85, 0, 0.7);
  letter-spacing: 1px;
  margin-top: 0;
  margin-bottom: 1rem;
}
#games .interactive-map-container .info-box p {
  line-height: 1.7;
  font-weight: 400;
}
#games .interactive-map-container .info-box .close-btn {
  position: absolute;
  top: 10px;
  right: 15px;
  background: none;
  border: none;
  color: #f8f9fa;
  font-size: 2rem;
  cursor: pointer;
  line-height: 1;
  transition: color 0.3s ease, transform 0.3s ease;
}
#games .interactive-map-container .info-box .close-btn:hover {
  color: #ff5500;
  transform: scale(1.2);
}

#contact {
  margin-top: 150px;
}
#contact .map-placeholder {
  height: 350px;
  position: relative;
}
#contact .map-placeholder i {
  color: #ff9900;
  text-shadow: 0 0 5px #ff5500;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#contact .contact-form form input::placeholder {
  color: rgba(248, 249, 250, 0.6);
}
#contact .contact-form form textarea::placeholder {
  color: rgba(248, 249, 250, 0.6);
}

#newsletter {
  margin-top: 150px;
  /* Zmiana koloru placeholdera w formularzach */
}
#newsletter input,
#newsletter textarea {
  color: #f8f9fa;
}
#newsletter input::placeholder,
#newsletter textarea::placeholder {
  color: rgba(248, 249, 250, 0.6);
  opacity: 1; /* Czasami przeglądarki domyślnie zmniejszają opacity */
}
#newsletter input::-webkit-input-placeholder,
#newsletter textarea::-webkit-input-placeholder {
  /* Chrome, Safari, Opera */
  color: rgba(248, 249, 250, 0.7);
}
#newsletter input:-moz-placeholder,
#newsletter textarea:-moz-placeholder {
  /* Firefox 19+ */
  color: rgba(248, 249, 250, 0.7);
  opacity: 1;
}
#newsletter input:-ms-input-placeholder,
#newsletter textarea:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: rgba(248, 249, 250, 0.7);
}

#shop .btn-buy {
  background-size: 60%;
}
#shop {
  margin-top: 150px;
}
#shop .shop-title {
  text-shadow: 0 0 10px #ff5500, 0 0 20px rgba(255, 85, 0, 0.7), 0 0 30px rgba(255, 153, 0, 0.5);
  color: #fff0ac;
}
#shop .product-card {
  background-color: #07070f;
  border: 1px solid rgba(255, 85, 0, 0.3);
  border-radius: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  z-index: 1;
  height: 100%;
}
#shop .product-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 0 15px rgba(255, 85, 0, 0.7);
}
#shop .product-card .product-image-box {
  height: 250px;
}
#shop .product-card .product-image-box img {
  width: 100%;
  height: 250px;
  object-fit: cover;
  transition: transform 0.5s ease;
  object-position: 10% center;
}
#shop .product-card .product-image-box:hover img {
  transform: scale(1.05);
}
#shop .product-card .product-details {
  padding: 20px;
}
#shop .product-card .product-price {
  font-size: 1.5rem;
  font-weight: bold;
  color: #ff5500;
}
#shop .product-card .product-hover-description {
  display: none;
  height: 250px;
  background-color: rgba(7, 7, 15, 0.95);
  border-top: 2px solid #222;
  transform: translateY(100%);
  transition: transform 0.3s ease-in-out;
  z-index: 10;
}
#shop .product-card .product-hover-description a {
  text-decoration: none;
}
#shop .product-card .product-hover-description a:hover {
  text-decoration: underline;
  color: rgba(255, 153, 0, 0.1);
}
#shop .product-card:hover .product-hover-description {
  display: block;
  transform: translateY(0);
}
#shop .product-card:hover .product-image-box {
  display: none;
}
#shop .sort-dropdown {
  background-color: #07070f;
  border-color: #444;
  color: #f8f9fa;
}
#shop .dropdown-menu {
  background-color: #07070f;
  border: #ff5500;
  color: #f8f9fa;
}
#shop .pagination .page-item .page-link {
  background-color: #07070f;
  border: 1px solid #444;
  color: #f8f9fa;
}
#shop .pagination .page-item.active .page-link {
  background-color: #ff5500;
  border-color: #ff5500;
  color: #07070f;
  font-weight: bold;
}
#shop .pagination .page-item.disabled .page-link {
  color: #444;
}

.floating-cart-btn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 60px;
  height: 60px;
  background-color: #ff5500;
  color: #07070f;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(255, 85, 0, 0.4);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.5rem;
  z-index: 1050;
  transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
.floating-cart-btn:hover {
  background-color: rgba(255, 85, 0, 0.1);
  transform: scale(1.05);
  box-shadow: 0 4px 15px rgba(255, 85, 0, 0.8);
}
.floating-cart-btn .badge {
  background-color: #ff9900;
  color: white;
  font-size: 0.75rem;
  padding: 0.3em 0.5em;
  top: -5px;
  right: -5px;
}

#centralAlert {
  top: 0;
  left: 50%;
  transform: translateX(-50%) translateY(-100%);
  transition: all 0.5s ease-out;
  margin-top: -100px;
  background-color: #0d0e1b;
  color: #f8f9fa;
  border: 1px solid #444;
}

#centralAlert.alert-visible {
  top: 100px;
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}

.custom-modal {
  background-color: #07070f;
  color: #f8f9fa;
  border: 1px solid rgba(255, 85, 0, 0.5);
  box-shadow: 0 0 20px rgba(255, 85, 0, 0.3);
}
.custom-modal .modal-title {
  color: #fff0ac !important;
}
.custom-modal .form-control {
  background-color: #07070f;
  color: #f8f9fa;
  border-color: #444;
}
.custom-modal .form-control::placeholder {
  color: rgba(248, 249, 250, 0.7);
}
.custom-modal .form-control:focus {
  background-color: #07070f;
  color: #f8f9fa;
  border-color: #ff5500;
  box-shadow: 0 0 0 0.25rem rgba(255, 85, 0, 0.25);
}

.checklist {
  padding-left: 20px; /* Ensures space for the icon */
}

/* Styling each list item */
.checklist li {
  position: relative;
  padding-left: 25px; /* Pushes the text away from the icon */
  margin-bottom: 8px;
  font-size: 20px;
}

.checklist li span {
  color: #ff9900;
}

/* Inserting the Checkmark Icon using ::before */
.checklist li::before {
  /* Font Awesome Solid Checkmark Unicode */
  content: "\f00c";
  /* Required Font properties for Font Awesome to render the icon */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0;
  /* Set the color to your accent color */
  color: #f8f9fa;
}

/* === NOWE STYLE DLA BANERA COOKIE === */
#cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #1a1a1a;
  color: white;
  z-index: 1050;
  border-top: 1px solid #444;
  display: none;
  animation: slideUp 0.5s ease-out forwards;
}
#cookie-banner .form-switch .form-check-input {
  cursor: pointer;
  background-color: #444;
  border-color: #666;
}
#cookie-banner .form-switch .form-check-input:checked {
  background-color: #ff9900;
  border-color: #ff9900;
}
#cookie-banner .btn-outline-warning {
  border-color: #666;
  color: #ccc;
}
#cookie-banner .btn-outline-warning:hover {
  border-color: #ff9900;
  background-color: rgba(255, 153, 0, 0.1);
  color: #ff9900;
}

@keyframes slideUp {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0);
  }
}
@media screen and (max-width: 768px) {
  /*  header.site-header{

  }
  */
  html,
  body {
    width: 100vw;
    overflow-x: hidden !important;
  }
  .navbar-toggler {
    margin-right: 5px;
  }
  .main-nav .container {
    padding: 0;
  }
  .lead {
    font-size: 110%;
  }
  .button {
    display: block;
    max-width: 80vw;
    margin: 0 auto;
  }
  #usp,
  #zawartosc,
  #dla-kogo,
  .reviews-section,
  .player-reviews-section,
  .faq-section,
  .hero-section,
  .crowdfunding-section {
    padding: 30px 0 !important;
  }
  #hero-slider {
    padding-top: 70px;
  }
  #hero-slider .first-slide {
    background-size: 200%;
    background-position: -100px;
  }
  #hero-slider .first-slide img {
    box-shadow: 0 0 20px black;
    width: 350px;
  }
  #hero-slider .third-slide {
    position: relative;
    overflow: hidden;
    height: 100vh;
  }
  #hero-slider .third-slide .hero-content {
    position: absolute;
    top: 48%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  #hero-slider .third-slide #background-video {
    width: 100%;
    height: auto;
    margin: 0;
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    object-fit: cover;
  }
  #hero-slider .carousel-indicators {
    bottom: 15px !important;
  }
  #zawartosc ul {
    margin: 0;
  }
  #zawartosc .pic {
    margin-left: -100px;
    height: 300px;
    width: auto;
  }
  #sklep {
    padding: 0px !important;
  }
  #sklep .pic {
    display: none;
    width: 200%;
  }
  #gallery #zdj3 img {
    height: 200px;
    margin-left: 0px;
  }
  #onas {
    height: auto;
    margin-top: 120px;
  }
  #porownanie-rpg .comparison-table {
    border-bottom: none;
  }
  #porownanie-rpg .comparison-table .comparison-col {
    border-bottom: 1px solid #444;
  }
  #porownanie-rpg .comparison-table .comparison-col--left {
    border-right: none;
  }
  #porownanie-rpg .comparison-table .comparison-col:last-child {
    border-bottom: none;
  }
  .crowdfunding-section .container {
    background-size: 0% auto;
  }
  #porownanie-rpg .carousel-item {
    transition: transform 1s ease-in-out !important;
  }
  #porownanie-rpg .comparison-slide {
    text-align: center;
    min-height: 180px; /* Minimalna wysokość, aby wszystkie slajdy miały równy rozmiar */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 120%;
  }
  #porownanie-rpg .comparison-slide .text-white-75 {
    color: #ddd !important;
  }
  #porownanie-rpg .comparison-slide--success {
    background-color: #1a1a1a; /* Ciemne tło dla Twojej gry */
    border-right: 1px solid rgba(255, 255, 255, 0.1);
  }
  #porownanie-rpg .comparison-slide--danger {
    background-color: #0d0d0d; /* Bardzo ciemne tło dla konkurencji */
  }
  #porownanie-rpg {
    /* Wyrównanie ikon i tekstu */
  }
  #porownanie-rpg #mobileComparisonSlider .fa-2x {
    font-size: 1.5rem; /* Mniejsze ikony, by oszczędzić miejsce */
  }
  #porownanie-rpg {
    /* Kropki nawigacyjne pod slajderem, jeśli chcesz je użyć */
  }
  #porownanie-rpg .carousel-indicators {
    bottom: -30px;
  }
  #porownanie-rpg .carousel-indicators button {
    background-color: rgba(255, 255, 255, 0.5);
  }
}
#onas {
  width: 100vw;
}

/*# sourceMappingURL=style.css.map */