/* ==========================================
   Utilities – WoW + High-Tech + IRC Theme
   ========================================== */

/* WoW Item Quality Colors */
.text-poor { color: #9d9d9d; }
.text-common { color: #ffffff; }
.text-uncommon { color: #1eff00; }
.text-rare { color: #0070dd; }
.text-epic { color: #a335ee; }
.text-legendary { color: #ff8000; }
.text-cyber-blue { color: #00d9ff; }
.text-cyber-purple { color: #b537f2; }
.text-terminal { color: #00ff00; }
.text-terminal-dim { color: #808080; }

/* Backgrounds */
.bg-gradient-wow {
  background: linear-gradient(135deg, #1a0f0a 0%, #2a1f1a 50%, #1a0f0a 100%);
}
.bg-gradient-cyber {
  background: linear-gradient(135deg, #0a0e1a 0%, #1a2332 50%, #0a0e1a 100%);
}

/* Glows */
.glow-gold { text-shadow: 0 0 10px rgba(255, 215, 0, 0.8); }
.glow-blue { text-shadow: 0 0 10px rgba(0, 217, 255, 0.8); }
.glow-purple { text-shadow: 0 0 10px rgba(181, 55, 242, 0.8); }

/* Animations */
.animate-pulse { animation: pulse 2s ease-in-out infinite; }
.animate-fade-in { animation: fade-in 0.5s ease-out; }
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.8; transform: scale(1.05); }
}
@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Badges */
.badge { display: inline-block; padding: 4px 10px; border-radius: 12px; font-size: 11px; font-weight: bold; text-transform: uppercase; }
.badge-admin { background: linear-gradient(135deg, var(--wow-legendary), var(--wow-epic)); color: white; border: 1px solid var(--wow-gold); }
.badge-mod { background: linear-gradient(135deg, var(--wow-epic), var(--wow-rare)); color: white; }
.badge-vip { background: linear-gradient(135deg, var(--wow-rare), var(--cyber-blue)); color: white; }

/* Spacing */
.m-1 { margin: 8px; }
.m-2 { margin: 16px; }
.mb-2 { margin-bottom: 16px; }
.p-2 { padding: 16px; }
.gap-2 { gap: 16px; }

.d-flex { display: flex; }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.flex-center { display: flex; justify-content: center; align-items: center; }

/* ==========================================
   Sidebar = височина на чата + компактни редове
   (презаписва components.css – зарежда се след него)
   ========================================== */
@media (min-width: 1024px) {
  .main-content .sidebar {
    height: 100%;
    max-height: none;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--bg-darkest, #0a0e1a);
  }

  .main-content .sidebar .sidebar-section {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    background: var(--bg-darkest, #0a0e1a);
  }

  .main-content .sidebar .sidebar-section .online-users {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
  }

  .sidebar-section .online-user {
    padding: 3px 6px;
    min-height: 0;
    gap: 4px;
  }

  .sidebar-section .online-user .user-avatar,
  .sidebar-section .online-user .user-avatar-img {
    width: 22px;
    height: 22px;
    min-width: 22px;
    font-size: 11px;
  }

  .sidebar-section .online-user .user-avatar-empty {
    width: 22px;
    height: 22px;
    min-width: 22px;
  }

  .sidebar-section .online-user .user-name {
    font-size: 11px;
    line-height: 1.2;
  }

  .sidebar-section .online-user .btn-private-msg {
    padding: 2px 6px;
    font-size: 10px;
  }
}