/* Base Button Style - Tüm butonlar için ortak stil */
.btn-base,
.category-badge,
.category-badge-mobile,
.topic-category-badge,
.btn-primary,
.btn-secondary,
.header-btn,
.header-btn-primary,
.header-icon-btn,
.mobile-menu-toggle,
.topic-edit-btn,
.comment-action-link,
.comment-like-btn,
.comment-delete-btn,
.reply-cancel-btn,
.topic-like-btn,
.messages-send-btn,
.messages-empty-btn,
.messages-new-btn,
.messages-cancel-btn,
.messages-back-btn,
.btn-friend,
.btn-edit-profile,
.auth-submit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

/* Button Hover State - Saydam glass efekti */
.btn-base:hover,
.category-badge:hover,
.category-badge-mobile:hover,
.topic-category-badge:hover,
.btn-primary:hover,
.btn-secondary:hover,
.header-btn:hover,
.header-btn-primary:hover,
.header-icon-btn:hover,
.mobile-menu-toggle:hover,
.topic-edit-btn:hover,
.comment-action-link:hover,
.comment-like-btn:hover:not(.liked),
.comment-delete-btn:hover:not(:disabled),
.reply-cancel-btn:hover,
.topic-like-btn:hover:not(.liked),
.messages-send-btn:hover,
.messages-empty-btn:hover,
.messages-new-btn:hover,
.messages-cancel-btn:hover,
.messages-back-btn:hover,
.btn-friend:hover,
.btn-edit-profile:hover,
.auth-submit-btn:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.3);
  color: #ffffff;
  box-shadow: 0 6px 20px rgba(255, 255, 255, 0.2);
}

/* Icons inside buttons - white on hover */
.btn-base:hover i,
.category-badge:hover i,
.category-badge-mobile:hover i,
.topic-category-badge:hover i,
.btn-primary:hover i,
.btn-secondary:hover i,
.header-btn:hover i,
.header-btn-primary:hover i,
.header-icon-btn:hover i,
.mobile-menu-toggle:hover i,
.topic-edit-btn:hover i,
.comment-action-link:hover i,
.comment-like-btn:hover:not(.liked) i,
.comment-delete-btn:hover:not(:disabled) i,
.reply-cancel-btn:hover i,
.topic-like-btn:hover:not(.liked) i,
.messages-send-btn:hover i,
.messages-empty-btn:hover i,
.messages-new-btn:hover i,
.messages-cancel-btn:hover i,
.messages-back-btn:hover i,
.btn-friend:hover i,
.btn-edit-profile:hover i,
.auth-submit-btn:hover i {
  color: #ffffff;
}

/* Header Buttons */
.header-btn {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 500;
}

/* Primary Buttons */
.btn-primary,
.header-btn-primary,
.mobile-menu-toggle,
.auth-submit-btn {
  padding: 10px 20px;
  font-size: 13px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #ffffff;
  box-shadow: 0 4px 16px rgba(255, 255, 255, 0.2);
}

.btn-primary:hover,
.header-btn-primary:hover,
.mobile-menu-toggle:hover,
.auth-submit-btn:hover {
  background: rgba(255, 255, 255, 0.25);
  border-color: rgba(255, 255, 255, 0.5);
  box-shadow: 0 6px 20px rgba(255, 255, 255, 0.3);
}

/* Secondary Buttons */
.btn-secondary {
  padding: 12px 24px;
  font-size: 14px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--border);
  color: #ffffff;
}

.btn-secondary:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.3);
}

/* Header Icon Buttons - Yuvarlak butonlar */
.header-icon-btn {
  width: 36px;
  height: 36px;
  padding: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header-icon-btn button {
  border: none;
  background: none;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header-icon-btn i {
  font-size: 16px;
}

.header-icon-btn .icon-svg {
  width: 16px;
  height: 16px;
  object-fit: contain;
  display: block;
  filter: brightness(0) invert(1);
}

/* Like Buttons - Liked State (Kırmızı) */
.comment-like-btn.liked,
.topic-like-btn.liked {
  background: rgba(231, 76, 60, 0.3);
  border-color: rgba(231, 76, 60, 0.6);
  color: white;
}

.comment-like-btn.liked:hover,
.topic-like-btn.liked:hover {
  background: rgba(192, 57, 43, 0.4);
  border-color: rgba(192, 57, 43, 0.7);
  color: white;
}

.comment-like-btn.liked:hover i,
.topic-like-btn.liked:hover i {
  color: white;
}

/* Disabled Buttons */
.comment-delete-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.comment-delete-btn:disabled:hover {
  background: var(--bg-card);
  border-color: var(--border);
  color: var(--text-secondary);
}

/* Button Icons */
.btn-base i,
.category-badge i,
.category-badge-mobile i,
.topic-category-badge i,
.topic-edit-btn i,
.comment-action-link i,
.comment-like-btn i,
.comment-delete-btn i,
.reply-cancel-btn i,
.topic-like-btn i,
.messages-send-btn i,
.messages-empty-btn i,
.messages-new-btn i,
.messages-cancel-btn i,
.messages-back-btn i,
.btn-friend i,
.btn-edit-profile i {
  font-size: 12px;
  transition: color 0.2s;
}

/* Category Badges - Safari uyumlu */
.category-badge,
.category-badge-mobile,
.topic-category-badge {
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
  /* Tema renklerine göre ayarlanacak - tema dosyalarında override edilecek */
  background: var(--primary-light, rgba(107, 93, 79, 0.15));
  color: var(--text-primary, #6b5d4f);
  border-radius: 4px;
  /* Backdrop filter (destekleyen tarayıcılarda) */
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
}

.category-badge i,
.category-badge-mobile i,
.topic-category-badge i {
  font-size: 11px;
}

/* Reply Cancel Button - Özel boyut */
.reply-cancel-btn {
  width: 18px;
  height: 18px;
  padding: 0;
  border-radius: 50%;
  font-size: 16px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}


/* Messages Buttons */
.messages-send-btn,
.messages-empty-btn,
.messages-new-btn,
.messages-cancel-btn,
.messages-back-btn {
  padding: 10px 24px;
  font-size: 14px;
  font-weight: 600;
}

/* Profile Buttons */
.btn-friend,
.btn-edit-profile {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
}

/* Form Actions Buttons */
.form-actions .btn-primary,
.form-actions .btn-secondary {
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 500;
}

/* Topic Reply Form Buttons */
.topic-reply-form .btn-primary,
.topic-create-form .btn-primary {
  padding: 8px 20px;
  font-size: 13px;
  font-weight: 600;
}

/* Icon Button - Basit ikon butonu */
.icon-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 20px;
  color: var(--text-secondary);
  transition: color 0.3s;
  position: relative;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.icon-btn:hover {
  color: var(--primary);
}

/* Refresh Icon Button */
.refresh-icon-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-radius: var(--radius);
  transition: background 0.3s;
  font-family: var(--font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif);
  font-size: 18px;
  font-weight: 500;
  color: var(--text-primary);
  text-decoration: none;
}

.refresh-icon-btn:hover {
  background: transparent;
}

.refresh-icon {
  width: 18px;
  height: 18px;
  transition: transform 0.6s ease;
}

.refresh-icon-btn.rotating .refresh-icon {
  animation: rotate360 0.6s ease;
}

@keyframes rotate360 {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* New Topic Button */
.new-topic-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  background: none;
  color: var(--text-primary);
  border: none;
  border-radius: var(--radius);
  cursor: pointer;
  font-size: 18px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s;
}

.new-topic-btn:hover {
  background: transparent;
}

.new-icon {
  width: 18px;
  height: 18px;
}

.new-topic-btn span {
  color: var(--text-primary);
}


/* Upload Button - Avatar Değiştir butonu */
.btn-upload {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 18px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.btn-upload:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.3);
  color: #ffffff;
  box-shadow: 0 6px 20px rgba(255, 255, 255, 0.2);
}

.btn-upload:hover i {
  color: #ffffff;
}

.btn-upload i {
  font-size: 14px;
  transition: color 0.2s;
}

/* Auth Submit Button */
.auth-submit-btn {
  width: 100%;
  padding: 14px 20px;
  font-size: 16px;
}

.auth-submit-btn i {
  font-size: 16px;
}