/* ==========================================================================
   MODÜL 2: ÜST BAR, RADYO, VIP VE KANAL SEKMELERİ (.pencereler)
   Dosya Yolu: css/kb-ustbar.css
   ========================================================================== */

.header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    height: var(--kb-header-h) !important;
    min-height: var(--kb-header-h) !important;
    max-height: var(--kb-header-h) !important;
    padding: 0 4px !important;
    border-radius: 0 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 3px !important;
    background: linear-gradient(135deg, #e8effc 0%, #f3e8ff 52%, #fce7f3 100%) !important;
    border-bottom: 1px solid var(--kb-border) !important;
    z-index: 5000 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.header .topbar-left,
.header .topbar-right {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 3px !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-height: var(--kb-header-h) !important;
}

/* Web ve Mobil üst bar yerleşimleri css/kb-web.css ve css/kb-mobil.css dosyalarına ayrıldı */

#hmenu.kb-elite-menu-btn {
    width: auto !important;
    height: 30px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    background: var(--kb-accent-grad, linear-gradient(135deg, #2563eb 0%, #4f46e5 55%, #6366f1 100%)) !important;
    color: #ffffff !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    border: 1.5px solid rgba(255, 255, 255, 0.9) !important;
    box-shadow: var(--kb-accent-shadow, 0 2px 8px rgba(79, 70, 229, 0.28)) !important;
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: transform 0.15s ease, opacity 0.15s ease !important;
}

#hmenu.kb-elite-menu-btn:active,
#hmenu.kb-elite-menu-btn.kb-menu-active {
    transform: scale(0.96) !important;
}

/* ==========================================================================
   WEB & MOBİL ORTAK BENTO AÇILIR KART MENÜ (POPOVER - %100 TEMA UYUMLU)
   ========================================================================== */
@keyframes kbPopoverMenuIn {
    0% { opacity: 0; transform: translate3d(0, -6px, 0) scale(0.96); }
    100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

body:not(.kb-popover-menu-open) .header .topbar-center { display: none !important; }

body.kb-popover-menu-open .header .topbar-center {
    display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-content: start !important; gap: 6px !important; position: fixed !important;
    top: calc(var(--kb-header-h) + 5px) !important; left: 8px !important;
    width: 298px !important; max-width: calc(100vw - 16px) !important; height: auto !important;
    max-height: calc(100dvh - var(--kb-header-h) - 14px) !important;
    overflow-y: auto !important; overflow-x: hidden !important; scrollbar-width: thin !important;
    padding: 10px !important; border-radius: 18px !important;
    background: var(--kb-bg, #f8fafc) !important; border: 1.5px solid var(--kb-border, #cbd5e1) !important;
    color: var(--kb-text, #1e293b) !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.30), 0 0 0 1px var(--kb-accent-ring, rgba(99, 102, 241, 0.16)) !important;
    z-index: 100010 !important; transform-origin: top left !important; will-change: transform, opacity !important;
    animation: kbPopoverMenuIn 0.17s cubic-bezier(0.22, 0.61, 0.36, 1) forwards !important;
}

/* 1. En Üst Mini Kimlik Kartı */
.header .topbar-center .kb-menu-hero-card {
    order: 1 !important; grid-column: 1 / -1 !important; display: flex !important; align-items: center !important;
    gap: 10px !important; padding: 10px 11px !important; margin-bottom: 2px !important; border-radius: 14px !important;
    background: var(--kb-accent-grad, linear-gradient(135deg, #4338ca 0%, #6366f1 55%, #8b5cf6 100%)) !important;
    color: #ffffff !important; box-shadow: var(--kb-accent-shadow, 0 4px 12px rgba(79, 70, 229, 0.26)) !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
}
.header .topbar-center .kb-mh-av-wrap {
    position: relative !important; width: 38px !important; height: 38px !important; flex: 0 0 38px !important;
    border-radius: 50% !important; padding: 2px !important; background: rgba(255, 255, 255, 0.92) !important;
}
.header .topbar-center .kb-mh-av-wrap img { width: 100% !important; height: 100% !important; border-radius: 50% !important; object-fit: cover !important; display: block !important; }
.header .topbar-center .kb-mh-dot {
    position: absolute !important; right: -1px !important; bottom: -1px !important; width: 11px !important; height: 11px !important;
    border-radius: 50% !important; background: #10b981 !important; border: 2px solid #ffffff !important;
}
.header .topbar-center .kb-mh-meta { flex: 1 1 auto !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; gap: 3px !important; }
.header .topbar-center .kb-mh-nick { font-size: 13.5px !important; font-weight: 900 !important; color: #ffffff !important; line-height: 1.15 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.header .topbar-center .kb-mh-role {
    display: inline-flex !important; align-items: center !important; align-self: flex-start !important; gap: 4px !important;
    padding: 2px 7px !important; border-radius: 999px !important; background: rgba(255, 255, 255, 0.20) !important;
    border: 1px solid rgba(255, 255, 255, 0.30) !important; color: #ffffff !important; font-size: 10px !important; font-weight: 800 !important; line-height: 1.2 !important;
}
.header .topbar-center .kb-mh-role[data-tier="root"],
.header .topbar-center .kb-mh-role[data-tier="vip"] { background: rgba(250, 204, 21, 0.26) !important; border-color: rgba(254, 240, 138, 0.7) !important; color: #fef9c3 !important; }
.header .topbar-center .kb-mh-close {
    width: 26px !important; height: 26px !important; flex: 0 0 26px !important; border-radius: 50% !important;
    border: 1px solid rgba(255, 255, 255, 0.32) !important; background: rgba(255, 255, 255, 0.16) !important;
    color: #ffffff !important; font-size: 12px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important;
}

/* Bölüm Başlıkları & Ortak Kart Buton Temeli (.room-pill) */
.header .topbar-center .kb-menu-sec-label {
    grid-column: 1 / -1 !important; display: flex !important; align-items: center !important; gap: 5px !important;
    font-size: 10px !important; font-weight: 900 !important; text-transform: uppercase !important; letter-spacing: 0.06em !important;
    color: var(--kb-accent-solid, #4f46e5) !important; padding: 4px 3px 1px 3px !important; opacity: 0.92 !important; user-select: none !important;
}
.header .topbar-center .kb-sec-guest  { order: 2 !important; color: #059669 !important; }
.header .topbar-center .kb-sec-fast   { order: 10 !important; }
.header .topbar-center .kb-sec-vip    { order: 20 !important; color: #d97706 !important; }
.header .topbar-center .kb-sec-social { order: 30 !important; }
body:is(.kb-theme-dark, .kb-theme-night) .header .topbar-center .kb-sec-guest { color: #34d399 !important; }
body:is(.kb-theme-dark, .kb-theme-night) .header .topbar-center .kb-sec-vip   { color: #fbbf24 !important; }

html body .header #kbSmartPopoverMenu.topbar-center .room-pill {
    width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 8px 10px !important; border-radius: 11px !important;
    background: var(--kb-ed-inp-bg, #ffffff) !important; border: 1px solid var(--kb-ed-inp-border, #cbd5e1) !important;
    color: var(--kb-ed-inp-text, var(--kb-text, #1e293b)) !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.2 !important;
    display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 7px !important;
    cursor: pointer !important; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
    transition: transform 0.13s ease, border-color 0.15s ease !important; white-space: nowrap !important; overflow: hidden !important;
}
html body .header #kbSmartPopoverMenu.topbar-center .room-pill:hover { border-color: var(--kb-accent-solid, #6366f1) !important; transform: translateY(-1px) !important; }
html body .header #kbSmartPopoverMenu.topbar-center .room-pill:active { transform: scale(0.97) !important; }
html body .header #kbSmartPopoverMenu.topbar-center .room-pill > i {
    width: 24px !important; height: 24px !important; flex: 0 0 24px !important; border-radius: 8px !important;
    background: var(--kb-accent-ring, rgba(99, 102, 241, 0.14)) !important; color: var(--kb-accent-solid, #4f46e5) !important;
    font-size: 11.5px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
}
html body .header #kbSmartPopoverMenu.topbar-center .room-pill > span { flex: 1 1 auto !important; min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; }

/* 2. Misafir Kayıt Ol & Nick Düşür (Kayıtlı Kullanıcıda Otomatik Gizlenir) */
html body .header #kbSmartPopoverMenu.topbar-center .nickkayit.kb-guest-reg   { order: 3 !important; grid-column: span 1 !important; border-color: #34d399 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .nickdusur.kb-guest-ghost { order: 4 !important; grid-column: span 1 !important; border-color: #fbbf24 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .nickkayit.kb-guest-reg > i   { background: rgba(16, 185, 129, 0.16) !important; color: #059669 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .nickdusur.kb-guest-ghost > i { background: rgba(245, 158, 11, 0.18) !important; color: #d97706 !important; }
html body:is(.kb-theme-dark, .kb-theme-night) .header #kbSmartPopoverMenu.topbar-center .nickkayit.kb-guest-reg > i   { color: #34d399 !important; }
html body:is(.kb-theme-dark, .kb-theme-night) .header #kbSmartPopoverMenu.topbar-center .nickdusur.kb-guest-ghost > i { color: #fbbf24 !important; }

html body.kb-user-registered .header #kbSmartPopoverMenu.topbar-center .kb-sec-guest,
html body.kb-user-registered .header #kbSmartPopoverMenu.topbar-center .nickkayit,
html body.kb-user-registered .header #kbSmartPopoverMenu.topbar-center .nickdusur { display: none !important; }

/* 3. 2x2 Hızlı Eylem Bento Izgarası */
html body .header #kbSmartPopoverMenu.topbar-center .kb-bento-1 { order: 11 !important; grid-column: span 1 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-bento-2 { order: 12 !important; grid-column: span 1 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-bento-3 { order: 13 !important; grid-column: span 1 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-bento-4 { order: 14 !important; grid-column: span 1 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-mp-bento { padding: 9px !important; border-radius: 12px !important; font-weight: 800 !important; }

/* 4. Yetki Al (#satismenu), VIP/Admin Vitrin Kartları & 👑 VIP Etiketli Özellikler */
html body .header #kbSmartPopoverMenu.topbar-center #satismenu {
    order: 21 !important; grid-column: 1 / -1 !important; justify-self: center !important;
    width: auto !important; min-width: 156px !important; height: 34px !important;
    padding: 0 18px !important; margin: 1px auto 2px auto !important; border-radius: 999px !important;
    background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 52%, #d97706 100%) !important;
    border: 1.5px solid #fef08a !important; color: #1e1b4b !important; font-size: 12.5px !important; font-weight: 900 !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px !important;
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.35) !important;
}
html body .header #kbSmartPopoverMenu.topbar-center #satismenu i {
    background: rgba(255, 255, 255, 0.45) !important; color: #92400e !important;
    width: 20px !important; height: 20px !important; padding: 0 !important; border-radius: 50% !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 10.5px !important;
}
html body .header #kbSmartPopoverMenu.topbar-center #satismenu .satismenu-text {
    display: inline !important; font-size: 12.5px !important; font-weight: 900 !important; color: #1e1b4b !important; white-space: nowrap !important;
}
html body .header #kbSmartPopoverMenu.topbar-center #satismenu[style*="display: none"],
html body .header #kbSmartPopoverMenu.topbar-center #satismenu[style*="display:none"] { display: none !important; }

html body .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-cta-vip {
    order: 22 !important; grid-column: span 1 !important;
    background: linear-gradient(135deg, #6d28d9 0%, #8b5cf6 55%, #ec4899 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.42) !important; color: #ffffff !important; font-weight: 800 !important;
    box-shadow: 0 3px 10px rgba(139, 92, 246, 0.28) !important;
}
html body .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-cta-admin {
    order: 23 !important; grid-column: span 1 !important;
    background: linear-gradient(135deg, #d97706 0%, #f59e0b 55%, #eab308 100%) !important;
    border: 1px solid rgba(254, 240, 138, 0.75) !important; color: #ffffff !important; font-weight: 800 !important;
    box-shadow: 0 3px 10px rgba(245, 158, 11, 0.28) !important;
}
html body .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-cta-rent {
    order: 24 !important; grid-column: 1 / -1 !important; justify-content: center !important;
    background: linear-gradient(135deg, #0d9488 0%, #0ea5e9 55%, #2563eb 100%) !important;
    border: 1px solid rgba(186, 230, 253, 0.65) !important; color: #ffffff !important; font-weight: 800 !important;
    box-shadow: 0 3px 10px rgba(14, 165, 233, 0.28) !important;
}
html body .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-cta-rent > span { flex: 0 1 auto !important; }
html body .header #kbSmartPopoverMenu.topbar-center .room-pill:is(.kb-cta-vip, .kb-cta-admin, .kb-cta-rent) > span { color: #ffffff !important; }
html body .header #kbSmartPopoverMenu.topbar-center .room-pill:is(.kb-cta-vip, .kb-cta-admin, .kb-cta-rent) > i {
    background: rgba(255, 255, 255, 0.24) !important; color: #ffffff !important;
}

/* Akıllı Statü Filtresi: Yöneticilerde Tüm Satış Butonları Gizlenir; VIP Üyede 'VIP Al' Gizlenip 'Admin Ol + Oda Kirala' Yan Yana Kalır */
html body.kb-user-is-staff .header #kbSmartPopoverMenu.topbar-center :is(.kb-cta-vip, .kb-cta-admin, .kb-cta-rent, #satismenu) { display: none !important; }
html body.kb-user-is-vip .header #kbSmartPopoverMenu.topbar-center .kb-cta-vip { display: none !important; }
html body.kb-user-is-vip .header #kbSmartPopoverMenu.topbar-center .room-pill:is(.kb-cta-admin, .kb-cta-rent) {
    grid-column: span 1 !important; justify-content: flex-start !important;
}
html body.kb-user-is-vip .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-cta-rent > span { flex: 1 1 auto !important; }

html body .header #kbSmartPopoverMenu.topbar-center .kb-feat-font { order: 25 !important; grid-column: 1 / -1 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-feat-fx   { order: 26 !important; grid-column: 1 / -1 !important; }

html body .header #kbSmartPopoverMenu.topbar-center .kb-feat-font > i { background: rgba(139, 92, 246, 0.16) !important; color: #8b5cf6 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-feat-fx > i   { background: rgba(236, 72, 153, 0.16) !important; color: #ec4899 !important; }

html body .header #kbSmartPopoverMenu.topbar-center .kb-vip-pill-tag {
    font-style: normal !important; flex: 0 0 auto !important; padding: 2px 7px !important; border-radius: 999px !important;
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%) !important; border: 1px solid #f59e0b !important;
    color: #92400e !important; font-size: 9.5px !important; font-weight: 900 !important; letter-spacing: 0.03em !important;
}
html body:is(.kb-theme-dark, .kb-theme-night) .header #kbSmartPopoverMenu.topbar-center .kb-vip-pill-tag {
    background: rgba(245, 158, 11, 0.20) !important; border-color: rgba(251, 191, 36, 0.55) !important; color: #fde047 !important;
}

/* 5. Sosyal, Hesap, Oper Gir (Her Zaman Açık) & Root Küfür Paneli */
html body .header #kbSmartPopoverMenu.topbar-center .kb-soc-dert   { order: 31 !important; grid-column: span 1 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-soc-zodiac { order: 32 !important; grid-column: span 1 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-soc-prof   { order: 33 !important; grid-column: span 1 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-soc-notif  { order: 34 !important; grid-column: span 1 !important; }

html body .header #kbSmartPopoverMenu.topbar-center .kb-soc-dert > i   { background: rgba(236, 72, 153, 0.15) !important; color: #ec4899 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-soc-zodiac > i { background: rgba(168, 85, 247, 0.15) !important; color: #a855f7 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-soc-prof > i   { background: rgba(14, 165, 233, 0.15) !important; color: #0ea5e9 !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-soc-notif > i  { background: rgba(245, 158, 11, 0.15) !important; color: #f59e0b !important; }

html body .header #kbSmartPopoverMenu.topbar-center .opergir.kb-mp-oper { order: 35 !important; grid-column: 1 / -1 !important; }
html body .header #kbSmartPopoverMenu.topbar-center #kbSepulturaMenuBtn.kb-mp-root { order: 36 !important; grid-column: 1 / -1 !important; border-color: rgba(225, 29, 72, 0.45) !important; }
html body .header #kbSmartPopoverMenu.topbar-center #kbSepulturaMenuBtn.kb-mp-root > i { background: rgba(225, 29, 72, 0.16) !important; color: #e11d48 !important; }
html body:not(.kb-is-root-owner) .header #kbSmartPopoverMenu.topbar-center #kbSepulturaMenuBtn { display: none !important; }
html body .header #kbSmartPopoverMenu.topbar-center .kb-root-pill-tag {
    font-style: normal !important; flex: 0 0 auto !important; padding: 2px 7px !important; border-radius: 999px !important;
    background: #ffe4e6 !important; border: 1px solid #fb7185 !important; color: #be123c !important; font-size: 9.5px !important; font-weight: 900 !important;
}
html body:is(.kb-theme-dark, .kb-theme-night) .header #kbSmartPopoverMenu.topbar-center .kb-root-pill-tag { background: rgba(225, 29, 72, 0.22) !important; color: #fda4af !important; }

/* 6. En Alt Yan Yana Sabit Footer (Hakkımızda & Çıkış Yap) */
html body .header #kbSmartPopoverMenu.topbar-center .kb-mp-footer {
    position: sticky !important; bottom: -10px !important; z-index: 5 !important;
    box-shadow: 0 -6px 10px var(--kb-bg, #f8fafc), 0 2px 5px rgba(15, 23, 42, 0.08) !important;
}
html body .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-foot-about { order: 90 !important; grid-column: span 1 !important; margin-top: 4px !important; }
html body .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-foot-logout {
    order: 91 !important; grid-column: span 1 !important; margin-top: 4px !important;
    background: #fff1f2 !important; border-color: #fecdd3 !important; color: #be123c !important; font-weight: 800 !important;
}
html body .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-foot-logout > i { background: rgba(225, 29, 72, 0.16) !important; color: #e11d48 !important; }
html body:is(.kb-theme-dark, .kb-theme-night) .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-foot-logout {
    background: #2d1222 !important; border-color: rgba(244, 63, 94, 0.5) !important; color: #fecdd3 !important;
}
html body:is(.kb-theme-dark, .kb-theme-night) .header #kbSmartPopoverMenu.topbar-center .room-pill.kb-foot-logout > i { background: rgba(244, 63, 94, 0.22) !important; color: #fb7185 !important; }

/* Üst Menü Yanındaki Tek "Tema" Başlığı ve Açılır Menüsü */
.kb-theme-dropdown-wrap {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
}

#kbThemeMenuBtn.kb-theme-trigger-btn {
    width: auto !important;
    height: 30px !important;
    padding: 0 8px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #7c3aed 0%, #9333ea 55%, #c084fc 100%) !important;
    border: 1.5px solid #ffffff !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    box-shadow: 0 2px 8px rgba(124, 58, 237, 0.28) !important;
}

#kbThemeMenuBtn.kb-theme-trigger-btn .kb-theme-caret {
    font-size: 9px !important;
    opacity: 0.9 !important;
}

.kb-theme-dropdown-menu {
    position: fixed !important;
    top: calc(var(--kb-header-h) + 4px) !important;
    left: 48px !important;
    width: 225px !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 14px !important;
    padding: 8px !important;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.28) !important;
    z-index: 100005 !important;
    display: none !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.kb-theme-dropdown-menu.kb-open {
    display: flex !important;
}

.kb-theme-dropdown-menu .kb-theme-menu-head {
    font-size: 11px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    color: #4f46e5 !important;
    padding: 4px 8px 6px 8px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    margin-bottom: 2px !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.kb-theme-dropdown-menu .kb-theme-opt {
    width: 100% !important;
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
    color: #1e293b !important;
    border-radius: 10px !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    cursor: pointer !important;
    text-align: left !important;
    transition: background 0.15s ease, transform 0.12s ease, border-color 0.15s ease !important;
}

.kb-theme-dropdown-menu .kb-theme-opt:hover {
    background: #eef2ff !important;
    border-color: #a5b4fc !important;
    transform: translateX(2px) !important;
}

.kb-theme-dropdown-menu .kb-theme-opt.kb-active-theme {
    background: linear-gradient(135deg, #eef2ff 0%, #f3e8ff 100%) !important;
    border: 1.5px solid #6366f1 !important;
    color: #4338ca !important;
    font-weight: 800 !important;
}

.kb-theme-dropdown-menu .kb-theme-swatch {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
    border-radius: 50% !important;
    border: 1.5px solid #ffffff !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2) !important;
}

/* Koyu Temalarda Tema & Görünüm Açılır Menüsü + Radyo Menüsü Uyumu */
html body:is(.kb-theme-dark, .kb-theme-night) .kb-theme-dropdown-menu,
html body:is(.kb-theme-dark, .kb-theme-night) #radioMobileMenu {
    background: #162036 !important;
    border-color: #334155 !important;
    box-shadow: 0 18px 42px rgba(2, 6, 23, 0.65) !important;
    color: #e2e8f0 !important;
}
html body:is(.kb-theme-dark, .kb-theme-night) .kb-theme-dropdown-menu .kb-theme-menu-head {
    color: #93c5fd !important;
    border-bottom-color: #293856 !important;
}
html body:is(.kb-theme-dark, .kb-theme-night) .kb-theme-dropdown-menu .kb-theme-opt,
html body:is(.kb-theme-dark, .kb-theme-night) .kb-theme-dropdown-menu .kb-view-switch-btn:not(.active) {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
html body:is(.kb-theme-dark, .kb-theme-night) .kb-theme-dropdown-menu .kb-view-switch-bar {
    background: #0f172a !important;
    border-color: #293856 !important;
}
html body:is(.kb-theme-dark, .kb-theme-night) .kb-theme-dropdown-menu .kb-theme-opt:hover {
    background: #263552 !important;
    border-color: #60a5fa !important;
}
html body:is(.kb-theme-dark, .kb-theme-night) .kb-theme-dropdown-menu .kb-theme-opt.kb-active-theme {
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.32), rgba(99, 102, 241, 0.28)) !important;
    border-color: #60a5fa !important;
    color: #ffffff !important;
}

/* Küçültülmüş, Üst Bar Butonlarıyla Aynı Boyutta ve Ses Dalgası Animasyonlu Radyo Butonu */
.kb-creative-radio,
#kbDesktopRadioBtn.kb-radio-pill {
    width: auto !important;
    height: 30px !important;
    max-height: 30px !important;
    padding: 0 8px 0 4px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #1e1b4b 0%, #4338ca 50%, #7c3aed 100%) !important;
    border: 1.5px solid #ffffff !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    box-shadow: 0 2px 8px rgba(67, 56, 202, 0.25) !important;
    cursor: pointer !important;
    position: relative !important;
    flex: 0 0 auto !important;
    transition: transform 0.15s ease, box-shadow 0.2s ease !important;
}

/* Radyo butonlarının Web/Mobil görünürlüğü kb-web.css ve kb-mobil.css içinde yönetilir */

.kb-creative-radio:active,
#kbDesktopRadioBtn.kb-radio-pill:active {
    transform: scale(0.95) !important;
}

/* Radyo İkonu ve Etrafındaki Şık Ses Dalgası (Pulse/Wave) Animasyonu */
.kb-creative-radio .kb-radio-badge,
#kbDesktopRadioBtn.kb-radio-pill .kb-radio-badge {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #f97316, #ec4899) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    font-size: 9.5px !important;
    position: relative !important;
    z-index: 2 !important;
    box-shadow: 0 0 0 0 rgba(236, 72, 153, 0.65) !important;
    animation: kbRadioIconWave 2s cubic-bezier(0.22, 0.61, 0.36, 1) infinite !important;
}

.kb-creative-radio .kb-radio-badge::before,
#kbDesktopRadioBtn.kb-radio-pill .kb-radio-badge::before,
.kb-creative-radio .kb-radio-badge::after,
#kbDesktopRadioBtn.kb-radio-pill .kb-radio-badge::after {
    content: "" !important;
    position: absolute !important;
    inset: -3px !important;
    border-radius: 50% !important;
    border: 1.5px solid rgba(56, 189, 248, 0.85) !important;
    pointer-events: none !important;
    animation: kbRadioSoundRing 2s ease-out infinite !important;
}

.kb-creative-radio .kb-radio-badge::after,
#kbDesktopRadioBtn.kb-radio-pill .kb-radio-badge::after {
    border-color: rgba(244, 114, 182, 0.8) !important;
    animation-delay: 0.9s !important;
}

@keyframes kbRadioIconWave {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(236, 72, 153, 0.55);
    }
    50% {
        transform: scale(1.06);
        box-shadow: 0 0 0 4px rgba(236, 72, 153, 0);
    }
}

@keyframes kbRadioSoundRing {
    0% {
        transform: scale(0.85);
        opacity: 0.95;
    }
    100% {
        transform: scale(1.48);
        opacity: 0;
    }
}

.kb-creative-radio .kb-eq-bars,
#kbDesktopRadioBtn.kb-radio-pill .kb-eq-bars {
    display: inline-flex !important;
    align-items: flex-end !important;
    gap: 1.5px !important;
    height: 10px !important;
}

.kb-creative-radio .kb-eq-bars b,
#kbDesktopRadioBtn.kb-radio-pill .kb-eq-bars b {
    display: block !important;
    width: 2px !important;
    height: 10px !important;
    background: #38bdf8 !important;
    border-radius: 2px !important;
    transform-origin: bottom center !important;
    will-change: transform !important;
    transition: transform 0.2s ease !important;
}
.kb-creative-radio .kb-eq-bars b:nth-child(1),
#kbDesktopRadioBtn.kb-radio-pill .kb-eq-bars b:nth-child(1) { transform: scaleY(0.4) !important; }
.kb-creative-radio .kb-eq-bars b:nth-child(2),
#kbDesktopRadioBtn.kb-radio-pill .kb-eq-bars b:nth-child(2) { transform: scaleY(0.8) !important; background: #fde047 !important; }
.kb-creative-radio .kb-eq-bars b:nth-child(3),
#kbDesktopRadioBtn.kb-radio-pill .kb-eq-bars b:nth-child(3) { transform: scaleY(0.5) !important; background: #f472b6 !important; }
.kb-creative-radio .kb-eq-bars b:nth-child(4),
#kbDesktopRadioBtn.kb-radio-pill .kb-eq-bars b:nth-child(4) { transform: scaleY(0.7) !important; background: #34d399 !important; }

.kb-creative-radio.radio-playing,
#kbDesktopRadioBtn.kb-radio-pill.radio-playing {
    background: linear-gradient(135deg, #065f46 0%, #059669 50%, #10b981 100%) !important;
    box-shadow: 0 0 12px rgba(16, 185, 129, 0.45) !important;
}

.kb-creative-radio.radio-playing .kb-eq-bars b,
#kbDesktopRadioBtn.kb-radio-pill.radio-playing .kb-eq-bars b {
    animation: kbRadioEqBounce 0.65s ease-in-out infinite alternate !important;
}
.kb-creative-radio.radio-playing .kb-eq-bars b:nth-child(2),
#kbDesktopRadioBtn.kb-radio-pill.radio-playing .kb-eq-bars b:nth-child(2) { animation-delay: 0.15s !important; }
.kb-creative-radio.radio-playing .kb-eq-bars b:nth-child(3),
#kbDesktopRadioBtn.kb-radio-pill.radio-playing .kb-eq-bars b:nth-child(3) { animation-delay: 0.30s !important; }
.kb-creative-radio.radio-playing .kb-eq-bars b:nth-child(4),
#kbDesktopRadioBtn.kb-radio-pill.radio-playing .kb-eq-bars b:nth-child(4) { animation-delay: 0.45s !important; }

@keyframes kbRadioEqBounce {
    0% { transform: scaleY(0.3); }
    100% { transform: scaleY(1); }
}

.kb-creative-radio .kb-radio-vol-gear {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 17px !important;
    height: 17px !important;
    margin-left: 1px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
    font-size: 9px !important;
}

.radio-mobile-menu {
    position: fixed !important;
    top: calc(var(--kb-header-h) + 4px) !important;
    left: 8px !important;
    z-index: 100005 !important;
}

.kb-top-circle {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    flex: 0 0 30px !important;
}

.header .mobilmesaj.kb-creative-dm {
    width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    border-radius: 10px !important;
    background: linear-gradient(135deg, #6366f1 0%, #a855f7 50%, #ec4899 100%) !important;
    border: 1.5px solid #ffffff !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    box-shadow: 0 2px 8px rgba(168, 85, 247, 0.28) !important;
    cursor: pointer !important;
    transition: transform 0.15s ease !important;
}
.header .mobilmesaj.kb-creative-dm i { color: #ffffff !important; font-size: 13.5px !important; }
.header .mobilmesaj.kb-creative-dm .oinc {
    position: absolute !important;
    top: -4px !important;
    right: -4px !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 50% !important;
    background: #ef4444 !important;
    color: #ffffff !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1.5px solid #ffffff !important;
}

/* Özel Mesaj Geldiğinde Yanıp Sönen Şık Mesaj Kutusu */
.header .mobilmesaj.kb-creative-dm.oyanson,
.header .mobilmesaj.kb-creative-dm.kb-dm-alert-blink {
    background: linear-gradient(135deg, #f43f5e 0%, #f59e0b 50%, #ec4899 100%) !important;
    border-color: #fef08a !important;
    animation: kbDmBoxFlash 0.85s ease-in-out infinite alternate !important;
}

@keyframes kbDmBoxFlash {
    0% {
        transform: scale(1) rotate(0deg);
        box-shadow: 0 0 0 0 rgba(244, 63, 94, 0.65), 0 3px 10px rgba(244, 63, 94, 0.45);
    }
    50% {
        transform: scale(1.1) rotate(-5deg);
    }
    100% {
        transform: scale(1.08) rotate(5deg);
        box-shadow: 0 0 0 6px rgba(250, 204, 21, 0), 0 0 18px rgba(250, 204, 21, 0.9);
    }
}

/* Üst Barda Taşmayan Şık Oyun Butonu (#kbTopGameBtn) */
#kbTopGameBtn.kb-top-game-btn {
    width: auto !important;
    height: 30px !important;
    max-height: 30px !important;
    padding: 0 8px 0 4px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #059669 0%, #10b981 55%, #0d9488 100%) !important;
    border: 1.5px solid #ffffff !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.28) !important;
    cursor: pointer !important;
    flex: 0 0 auto !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

#kbTopGameBtn.kb-top-game-btn .kb-game-ico {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 10.5px !important;
}

#kbTopGameBtn.kb-top-game-btn .kb-game-txt {
    font-size: 10.5px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    white-space: nowrap !important;
}

/* Üst Barda Şık Kırmızı YouTube Mini Player Butonu (#kbTopYtBtn) */
#kbTopYtBtn.kb-top-yt-btn {
    width: auto !important;
    height: 30px !important;
    max-height: 30px !important;
    padding: 0 8px 0 4px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #e11d48 0%, #ef4444 55%, #dc2626 100%) !important;
    border: 1.5px solid #ffffff !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.32) !important;
    cursor: pointer !important;
    flex: 0 0 auto !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}
#kbTopYtBtn.kb-top-yt-btn .kb-yt-ico {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.24) !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
#kbTopYtBtn.kb-top-yt-btn .kb-yt-txt {
    font-size: 10.5px !important;
    font-weight: 900 !important;
    color: #ffffff !important;
    letter-spacing: 0.3px !important;
    white-space: nowrap !important;
}
.kb-pm-btn.yt i { color: #ef4444 !important; }

/* Dar ekran üst bar kuralları kb-mobil.css içine taşındı */

.kb-top-attach-btn { background: linear-gradient(135deg, #e0e7ff, #ddd6fe) !important; border: 1.5px solid #c4b5fd !important; color: #5b21b6 !important; }

#solbar.kb-profile-trigger {
    width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    border-radius: 50% !important;
    padding: 1.5px !important;
    background: linear-gradient(135deg, #38bdf8, #6366f1) !important;
    border: 1.5px solid #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
#solbar.kb-profile-trigger i,
#solbar.kb-profile-trigger .storyvar,
#solbar.kb-profile-trigger .bildirim-sayi { display: none !important; }
#solbar.kb-profile-trigger img.kb-top-av-img {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

/* ==========================================================================
   SUNUCU ODALARI (#KANALLAR) 3 SATIR, EMOJİSİZ (#Sohbet x), OVALİMSİ & ŞIK
   ========================================================================== */
.pencereler .kanallar .kanal .kb-chan-ico {
    display: none !important;
}

/* Kanal sekmeleri (.pencereler) Web ve Mobil tasarımları kb-web.css ve kb-mobil.css içine ayrıldı */

/* Görünüm Seçici (Web / Mobil / Otomatik) Ortak Bileşen Stilleri */
.kb-view-switch-group {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 4px !important;
    padding: 4px 0 6px 0 !important;
    margin-bottom: 4px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}
.kb-view-switch-btn {
    height: 28px !important;
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    background: #f8fafc !important;
    color: #334155 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    cursor: pointer !important;
    padding: 0 4px !important;
    transition: all 0.15s ease !important;
}
.kb-view-switch-btn:hover {
    background: #eef2ff !important;
    border-color: #a5b4fc !important;
    color: #4338ca !important;
}
.kb-view-switch-btn.kb-active-view {
    background: linear-gradient(135deg, #2563eb 0%, #6366f1 100%) !important;
    border-color: #1d4ed8 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.28) !important;
}

/* ==========================================================================
   SOL PROFİL KISMI (.solbar) ELİT TASARIM & ÖZEL MESAJ YANIP SÖNME
   ========================================================================== */
.solbar .profile-card.big {
    background: linear-gradient(135deg, #1e1b4b 0%, #4338ca 52%, #7c3aed 100%) !important;
    border-radius: 18px !important;
    padding: 14px 12px !important;
    margin: 8px 8px 12px 8px !important;
    color: #ffffff !important;
    box-shadow: 0 10px 24px rgba(67, 56, 202, 0.28) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
}

.solbar .profile-card.big .profile-avatar.nickemoji {
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #f59e0b, #ec4899) !important;
    padding: 2.5px !important;
    box-shadow: 0 4px 12px rgba(236, 72, 153, 0.4) !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.solbar .profile-card.big .profile-avatar.nickemoji img {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

.solbar .profile-card.big .profile-info #aktifnick {
    font-size: 14.5px !important;
    font-weight: 900 !important;
    color: #ffffff !important;
    letter-spacing: 0.2px !important;
    margin-bottom: 4px !important;
}

.solbar .profile-card.big .status-select {
    background: rgba(255, 255, 255, 0.16) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 999px !important;
    padding: 2px 8px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    outline: none !important;
}

.solbar .profile-card.big .status-select option {
    color: #0f172a !important;
    background: #ffffff !important;
}

.solbar .list-section-title {
    font-size: 11px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: #4f46e5 !important;
    padding: 4px 12px !important;
    margin-top: 6px !important;
}

.pencereler .ozeller .ozel.yanson {
    background: linear-gradient(135deg, #fff1f2 0%, #fef3c7 100%) !important;
    border: 1.5px solid #f43f5e !important;
    color: #be123c !important;
    font-weight: 800 !important;
    animation: kbOzelItemPulse 1s ease-in-out infinite alternate !important;
}

@keyframes kbOzelItemPulse {
    0% { box-shadow: 0 0 0 0 rgba(244, 63, 94, 0.45); }
    100% { box-shadow: 0 0 0 5px rgba(244, 63, 94, 0); }
}

/* Başka Odadan Nicke Seslenildiğinde (Mention/Highlight) Oda Sekmesinin Dikkat Çekici Renge Dönmesi */
html body .pencereler .kanallar .kanal.kb-room-mentioned:not(.kactive) {
    background: linear-gradient(135deg, #f59e0b 0%, #ef4444 55%, #ec4899 100%) !important;
    border-color: #fef08a !important;
    color: #ffffff !important;
    font-weight: 900 !important;
    box-shadow: 0 0 12px rgba(239, 68, 68, 0.55) !important;
    animation: kbRoomMentionPulse 0.85s ease-in-out infinite alternate !important;
}
html body .pencereler .kanallar .kanal.kb-room-mentioned:not(.kactive) .kanalname,
html body .pencereler .kanallar .kanal.kb-room-mentioned:not(.kactive) .kapat {
    color: #ffffff !important;
}
@keyframes kbRoomMentionPulse {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.65); }
    100% { transform: scale(1.04); box-shadow: 0 0 0 5px rgba(239, 68, 68, 0); }
}

/* Sohbet Yukarı Okuma Kilidi - Alt Yüzen Yeni Mesaj & Alta İn Hapı */
.kb-scroll-resume-pill {
    position: absolute !important;
    bottom: 10px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 58 !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 13px;
    border-radius: 999px;
    border: 1.5px solid #fda4af;
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.94), rgba(30, 27, 75, 0.95));
    color: #f8fafc;
    font-size: 11.5px;
    font-weight: 700;
    white-space: nowrap;
    max-width: calc(100% - 16px);
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.35);
    cursor: pointer;
}
.kb-scroll-resume-pill i { color: #fbbf24; font-size: 11px; }
.kb-scroll-resume-pill b { color: #fde047; font-weight: 900; }
.kb-scroll-resume-pill .kb-srp-go {
    padding: 2px 7px;
    border-radius: 999px;
    background: #10b981;
    color: #ffffff;
    font-size: 10.5px;
    font-weight: 800;
}
.kb-scroll-resume-pill:hover { filter: brightness(1.08); }