/* Genel Tasarım */
    body {
   background: linear-gradient(to top, purple, blue),linear-gradient(to right, #5500ff, #00ff55)!important; 
   overflow:auto;
      font-family: 'Poppins', sans-serif;
      color: white;
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0;
    }


 body *{
           font-style:italic!important;
             touch-action: auto!important;
        }
		  .padding-bottom {
		padding-bottom:1%!important;
  }
.link-primary-subtle {
  color: #80B0FF !important; /* Koyu mavi metin */
  text-decoration: none;
}

.link-primary-subtle:hover {
  color: #cfe2ff !important; /* Daha koyu mavi hover efekti */
  text-decoration: underline;
}

/* Dark Subtle Link */
.link-dark-subtle {
  color: #8c9eaf !important; /* Siyahımsı gri metin */
  text-decoration: none;
}

.link-dark-subtle:hover {
  color: #9aacbc !important; /* Daha koyu siyah hover efekti */
  text-decoration: underline;
}
.btn-outline-primary-subtle {
  --bs-btn-color: var(--bs-primary-text-emphasis); /* Metin rengi (primary koyu tonu) */
  --bs-btn-border-color: var(--bs-primary-border-subtle:#9ec5fe;!important); /* Kenarlık rengi */
  --bs-btn-hover-bg: var(--bs-primary-bg-subtle); /* Hover arkaplan */
  --bs-btn-hover-border-color: var(--bs-primary-border-subtle); /* Hover kenarlık */
  --bs-btn-active-bg: var(--bs-primary-bg-subtle); /* Aktif durum */
  --bs-btn-active-border-color: var(--bs-primary-border-subtle);
}
.btn-outline-primary-subtle {
  color: #052c65 !important; /* Koyu mavi metin */
  border-color:#9ec5fe !important; /* Açık mavi kenarlık */
}
/* Light theme için */
.btn-outline-dark-subtle {
  --bs-btn-color: var(--bs-dark-text-emphasis);
  --bs-btn-border-color: var(--bs-dark-border-subtle);
  --bs-btn-hover-bg: var(--bs-dark-bg-subtle);
  --bs-btn-hover-border-color: var(--bs-dark-border-subtle);
  --bs-btn-active-bg: var(--bs-dark-bg-subtle);
  --bs-btn-active-border-color: var(--bs-dark-border-subtle);
}

.btn-outline-dark-subtle {
  color: #212529 !important; /* Siyahımsı gri metin */
  border-color: #dee2e6 !important; /* Açık gri kenarlık */
}

   .accordion-item {
            border: none;
            margin-bottom: 16px;
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            transition: all 0.3s ease;
        }

        .accordion-item:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
        }

        .accordion-button {
            padding: 20px 25px;
            font-weight: 600;
            color: #333;
            background-color: #ffffff;
            transition: all 0.3s ease;
        }

        .accordion-button:not(.collapsed) {
            color: #ffffff;
            background-color: #4a4a4a;
        }

        .accordion-button:focus {
            box-shadow: none;
            border-color: rgba(0, 0, 0, .125);
        }

        .accordion-button::after {
            background-size: 20px;
            transition: all 0.3s ease;
        }

        .accordion-button:not(.collapsed)::after {
            background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
        }

        .accordion-body {
            padding: 25px;
            background-color: #ffffff;
        }



  /* Sabit genişlikte buton */
    .fixed-button {
        margin:1%!important;
      width: 200px; /* Sabit genişlik */
      text-align: center;
    }

    /* Boyutları ekrana göre ayarlama */
    @media (max-width: 576px) { /* Küçük ekranlar */
      .fixed-button {
         margin:1%!important;
        font-size: 12px;
        padding: 8px 12px;
      }
    }
    @media (min-width: 577px) and (max-width: 768px) { /* Orta ekranlar */
      .fixed-button {
          margin:1%!important;
        font-size: 14px;
        padding: 10px 16px;
      }
    }
    @media (min-width: 769px) and (max-width: 1200px) { /* Büyük ekranlar */
      .fixed-button {
           margin:1%!important;
        font-size: 16px;
        padding: 12px 20px;
      }
    }
    @media (min-width: 1201px) { /* Çok büyük ekranlar (örneğin, akıllı tahtalar) */
      .fixed-button {
           margin:1%!important;
        font-size: 20px;
        padding: 16px 24px;
        width: 250px; /* Daha geniş buton */
      }
    }

    /* Skor Tablosu */
    .scoreboard {
      background: linear-gradient(145deg, #1e293b, #111827);
      border: 2px solid #3b82f6;
      border-radius: 20px;
     /* padding: 30px;*/
      /* max-width: 700px;*/
      width: 100%!important;
      text-align: center;
      box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.7);
      position: relative;
    }

    /* Kupa Tasarımı */
    .trophy {
      font-size: 8rem;
      color: #ffd700;
      text-shadow: 
        0 0 10px #ffd700, 
        0 0 20px #ffcc00, 
        0 0 30px #ffdd33, 
        0 0 40px #ffe066;
      margin: 0 auto 20px;
      display: block;
      position: relative;
      animation: pulse 2s infinite;
    }

    @keyframes pulse {
      0%, 100% {
        transform: scale(1);
        text-shadow: 
          0 0 10px #ffd700, 
          0 0 20px #ffcc00, 
          0 0 30px #ffdd33, 
          0 0 40px #ffe066;
      }
      50% {
        transform: scale(1.1);
        text-shadow: 
          0 0 15px #ffdd33, 
          0 0 30px #ffe066, 
          0 0 45px #ffff66;
      }
    }

   .winner {
            font-size: 2vw; /* Ekran boyutuna göre ayarlanır */
            font-weight: bold;
            color: gold;
            text-shadow: 2px 2px 5px black, 0 0 10px gold, 0 0 20px gold;
            margin-bottom: 20px;
        }
.table {
  background: #0f172a!important; /* Daha koyu arka plan */
  border-radius: 10px!important;
  overflow: hidden!important;
  border: none!important;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.5)!important;
}

.table th, .table td {
  color: gold!important; /* Yazı rengi beyaz */
  font-weight: bold!important;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 1)!important; /* Gölgeli yazı */
}

.table thead {
  background: linear-gradient(90deg, #1d4ed8, #2563eb)!important; /* Daha koyu başlık */
}

.table tbody tr:nth-child(even) {
  background: #1e293b!important; /* Alternatif satır arka plan */
}

.table tbody tr:nth-child(odd) {
  background: #111827!important; /* Alternatif koyu arka plan */
}

.table tbody tr:hover {
  background: #334155!important; /* Hover efekti */
  transition: background 0.4s ease!important;
}
/* Geri Sayım Çerçevesi */
.countdown-wrapper {
    position: relative;
    width: 20vmin; /* Daha küçük hale getirildi */
    height: 20vmin;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto; /* Ortalanması için */
}

.layer {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    animation: rotateLayer 10s infinite linear;
}

.layer-1 {
    background: conic-gradient(#ff6f61, #ffca61, #6effa3, #61baff, #ff6f61);
    animation-duration: 12s;
}

.layer-2 {
    background: conic-gradient(#6effa3, #61baff, #ff6f61, #ffca61, #6effa3);
    animation-duration: 8s;
    transform: scale(0.9);
}

.layer-3 {
    background: conic-gradient(#61baff, #ff6f61, #ffca61, #6effa3, #61baff);
    animation-duration: 6s;
    transform: scale(0.8);
}

/* Sayım Çemberi */
.countdown-circle {
    position: relative;
    width: 70%;
    height: 70%;
    background: linear-gradient(145deg, #1e90ff, #00bfff);
    border-radius: 50%;
    box-shadow: inset 0 10px 20px rgba(255, 255, 255, 0.2), 0 10px 30px rgba(0, 0, 0, 0.5);
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    animation: pulse 1s infinite;
}

.countdown-circle span {
    font-size: 6vmin; /* Yazı boyutu küçültüldü */
    color: #fff;
    text-shadow: 0 4px 10px rgba(0, 0, 0, 0.6);
}

/* Mobil Uyumluluk */
@media (max-width: 768px) {
    .countdown-wrapper {
        width: 25vmin; /* Mobilde biraz büyütüldü */
        height: 25vmin;
    }

    .countdown-circle {
        width: 80%;
        height: 80%;
    }

    .countdown-circle span {
        font-size: 5vmin; /* Mobilde yazı boyutu ayarlandı */
    }
}

/* Animasyonlar */
@keyframes rotateLayer {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}

    canvas {
      display: block;
    }
	
    #threejs-background {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: -1; /* Arkaplana yerleştir */
    }
.mor
{
	background-color:#ac2fbe!important;
	}