/* Normal dotlar - Masaüstü */
.tb-slider-nav .nav-dot {
  flex: 1;
  text-align: center;
  padding: 5px 0;
  font-size: 14px;
  background-color: #ccc;   /* masaüstü normal gri */
  color: #000;
  font-weight: normal;
  border: none;
  cursor: pointer;
  transition: background 0.3s ease;
}
.tb-slider-nav .nav-dot:hover {
  background: #ddd;
}
.tb-slider-nav .nav-dot.active {
  background-color: #222;   /* masaüstü aktif koyu gri */
  color: #fff;
  font-weight: bold;
}

/* Reklam dotları - Masaüstü */
.tb-slider-nav .ad-dot {
  background-color: red;    /* normal kırmızı */
  color: #fff;
  font-weight: normal;      /* yazı normal */
}
.tb-slider-nav .ad-dot.active {
  background-color: #222;   /* aktif koyu gri */
  color: #fff;
  font-weight: bold;        /* aktif olunca kalın */
}

/* İlk ve son dot margin ayarı */
.tb-slider-nav .nav-dot:first-child,
.tb-slider-nav .ad-dot:first-child {
  margin-left: 0;
}
.tb-slider-nav .nav-dot:last-child,
.tb-slider-nav .ad-dot:last-child {
  margin-right: 0;
}

/* Tablet görünümü */
@media (min-width: 601px) and (max-width: 1024px) {
  /* Normal dotlar */
  .tb-slider-nav .nav-dot {
    padding: 0;
    font-size: 0;           /* yazılar gizleniyor */
    color: transparent;
    background-color: #ccc; /* normal gri kare */
    width: 10px;
    height: 10px;
    margin: 0 2px;
    border-radius: 0;
    font-weight: normal;
  }
  .tb-slider-nav .nav-dot.active {
    background-color: #222; /* aktif koyu gri */
    font-weight: bold;
  }

  /* Reklam dotları */
  .tb-slider-nav .ad-dot {
    padding: 0;
    font-size: 0;           /* yazılar gizleniyor */
    color: transparent;
    background-color: red;  /* reklam dot kırmızı kare */
    width: 10px;
    height: 10px;
    margin: 0 2px;
    border-radius: 0;
    font-weight: normal;
  }
  .tb-slider-nav .ad-dot.active {
    background-color: #222; /* aktif koyu gri */
    font-weight: bold;
  }
}

/* Mobil görünüm */
@media (max-width: 600px) {
  /* Normal dotlar */
  .tb-slider-nav .nav-dot {
    padding: 0;
    font-size: 0;           /* yazılar gizleniyor */
    color: transparent;
    background-color: #ccc; /* normal gri kare */
    width: 10px;
    height: 10px;
    margin: 0 2px;
    border-radius: 0;
    font-weight: normal;
  }
  .tb-slider-nav .nav-dot.active {
    background-color: #222; /* aktif koyu gri */
    font-weight: bold;
  }

  /* Reklam dotları */
  .tb-slider-nav .ad-dot {
    padding: 0;
    font-size: 0;           /* yazılar gizleniyor */
    color: transparent;
    background-color: red;  /* reklam dot kırmızı kare */
    width: 10px;
    height: 10px;
    margin: 0 2px;
    border-radius: 0;
    font-weight: normal;
  }
  .tb-slider-nav .ad-dot.active {
    background-color: #222; /* aktif koyu gri */
    font-weight: bold;
  }
}