/* Custom Stylesheet */
/**
 * Use this file to override Materialize files so you can update
 * the core Materialize files in the future
 *
 * Made By MaterializeCSS.com
 */


@font-face {
  font-family: 'Pacifico';
  font-style: normal;
  font-weight: 400;
  src: local('Pacifico Regular'), local('Pacifico-Regular'), url(https://fonts.gstatic.com/s/pacifico/v12/FwZY7-Qmy14u9lezJ-6H6MmBp0u-.woff2) format('woff2');
  font-display: swap;
}

h1{
 font-size: 2.4rem !important;
}

h2{
  font-size: 2.2rem !important;
  margin: 0.8rem 0 0.5rem 0 !important;
}



h3{
  font-size: 2rem !important;
  margin: 0.8rem 0 0.5rem 0 !important;
}

.row {

    margin-bottom: 8px !important;
}


html, body {
  overflow-x: hidden !important;
}
body {
  position: relative !important;
}

/* Custom Swiper Styles */
.screenshotSwiper {
  padding-bottom: 50px !important; /* Space for pagination dots */
}

/* Custom Swiper Pagination Dots */
.screenshotSwiper .swiper-pagination {
  bottom: 0 !important;
  position: absolute !important;
}

.screenshotSwiper .swiper-pagination-bullet {
  width: 12px !important;
  height: 12px !important;
  background-color: rgba(0, 0, 0, 0.3) !important;
  opacity: 1 !important;
  margin: 0 6px !important;
  transition: all 0.3s ease !important;
}

.screenshotSwiper .swiper-pagination-bullet:hover {
  background-color: rgba(0, 0, 0, 0.5) !important;
  transform: scale(1.1) !important;
}

.screenshotSwiper .swiper-pagination-bullet-active {
  background-color: #4bc0f5 !important; /* Use theme color */
  transform: scale(1.2) !important;
}

/* Swiper Navigation Buttons */
.screenshotSwiper .swiper-button-next,
.screenshotSwiper .swiper-button-prev {
  color: #4bc0f5 !important;
  font-weight: bold !important;
}

.screenshotSwiper .swiper-button-next:after,
.screenshotSwiper .swiper-button-prev:after {
  font-size: 20px !important;
}

.screenshotSwiper .swiper-button-next:hover,
.screenshotSwiper .swiper-button-prev:hover {
  color: #007bff !important;
}

/* Custom tooltip styling to match website design */
.bs-tooltip-top .tooltip-arrow::before {
  border-top-color: #6c757d;
}

.bs-tooltip-top .tooltip-inner {
  background-color: #6c757d;
  color: white;
  font-size: 0.875rem;
  max-width: 300px;
  text-align: left;
  padding: 12px 16px;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Info icon hover effect */
.bi-info-circle:hover {
  transform: scale(1.1);
  transition: transform 0.2s ease;
}