/* ==========================================================================
   KEYİFBİZDE.COM - BAĞIMSIZ MOBİL (TELEFON) GÖRÜNÜM TASARIMI
   Dosya Yolu: css/kb-mobil.css
   Kapsam: SADECE html.kb-view-mobil aktifken çalışır. Web görünümünü etkilemez.
   ========================================================================== */

html.kb-view-mobil {
    --kb-header-h: 44px !important;
    --kb-topic-h: 27px !important;
    --kb-editor-h: 46px !important;
    --kb-nick-w: 120px !important;
    --kb-pm-header-h: 88px !important;
}

html.kb-view-mobil body.kb-topic-collapsed {
    --kb-topic-h: 22px !important;
}

html.kb-view-mobil body.kb-private-mode.kb-pm-is-admin {
    --kb-pm-header-h: 110px !important;
}

/* Giriş Ekranı Mobil Kompakt Ayar */
html.kb-view-mobil .acilis {
    padding: 12px !important;
}
html.kb-view-mobil .acilis .overlay {
    max-width: 390px !important;
}
html.kb-view-mobil .kb-login-box {
    padding: 24px 18px 20px 18px !important;
    border-radius: 22px !important;
}

/* ==========================================================================
   1. MOBİL ÜST BAR (.header) & AÇILIR MENÜ (.topbar-center)
   ========================================================================== */
html.kb-view-mobil .header {
    height: var(--kb-header-h) !important;
    min-height: var(--kb-header-h) !important;
    max-height: var(--kb-header-h) !important;
    padding: 0 6px !important;
    gap: 4px !important;
    justify-content: space-between !important;
}

html.kb-view-mobil .header .topbar-left,
html.kb-view-mobil .header .topbar-right {
    margin: 0 !important;
    gap: 4px !important;
    flex: 0 0 auto !important;
}

html.kb-view-mobil #kbWebSidebarBtn,
html.kb-view-mobil #kbDesktopRadioBtn.kb-radio-pill,
html.kb-view-mobil .pc-radio-volume,
html.kb-view-mobil #kbQuickViewSwitchBtn {
    display: none !important;
}

html.kb-view-mobil #hmenu.kb-elite-menu-btn,
html.kb-view-mobil #radioMobileToggle.kb-creative-radio,
html.kb-view-mobil .header .topbar-right {
    display: inline-flex !important;
}

/* Özel mesaj zarfı ve bildirim sayacı hizası (eski sol kaymayı sıfırla) */
html.kb-view-mobil .header .mobilmesaj.kb-creative-dm {
    margin: 0 !important;
}
html.kb-view-mobil .header .mobilmesaj.kb-creative-dm .oinc {
    left: auto !important;
    right: -4px !important;
    top: -4px !important;
}

/* Mobil üst barda Tema ve Radyo varsayılan ikon modu + basınca yana büyüme (GPU transform) */
@keyframes kbMobPillExpand {
    0% { transform: scaleX(0.78); opacity: 0.76; }
    100% { transform: scaleX(1); opacity: 1; }
}

html.kb-view-mobil #kbThemeMenuBtn.kb-theme-trigger-btn:not(.kb-mob-expanded),
html.kb-view-mobil #radioMobileToggle.kb-creative-radio:not(.kb-mob-expanded) {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    justify-content: center !important;
    gap: 0 !important;
}

html.kb-view-mobil #kbThemeMenuBtn.kb-theme-trigger-btn:not(.kb-mob-expanded) span,
html.kb-view-mobil #kbThemeMenuBtn.kb-theme-trigger-btn:not(.kb-mob-expanded) .kb-theme-caret,
html.kb-view-mobil #radioMobileToggle.kb-creative-radio:not(.kb-mob-expanded) .kb-radio-label,
html.kb-view-mobil #radioMobileToggle.kb-creative-radio:not(.kb-mob-expanded) .kb-eq-bars,
html.kb-view-mobil #radioMobileToggle.kb-creative-radio:not(.kb-mob-expanded) .kb-radio-vol-gear {
    display: none !important;
}

html.kb-view-mobil #radioMobileToggle.kb-creative-radio:not(.kb-mob-expanded) .kb-radio-badge {
    width: 22px !important;
    height: 22px !important;
    flex: 0 0 22px !important;
}

html.kb-view-mobil #kbThemeMenuBtn.kb-theme-trigger-btn.kb-mob-expanded,
html.kb-view-mobil #radioMobileToggle.kb-creative-radio.kb-mob-expanded {
    width: auto !important;
    border-radius: 999px !important;
    transform-origin: left center !important;
    will-change: transform, opacity !important;
    animation: kbMobPillExpand 0.18s cubic-bezier(0.22, 0.61, 0.36, 1) forwards !important;
}

html.kb-view-mobil #kbThemeMenuBtn.kb-theme-trigger-btn.kb-mob-expanded { padding: 0 8px !important; }
html.kb-view-mobil #radioMobileToggle.kb-creative-radio.kb-mob-expanded { padding: 0 7px 0 4px !important; }

/* Mobil Görünümde Ortak Bento Popover Menü Konumlandırması (Stiller ve %100 tema uyumu kb-ustbar.css içindedir) */
html.kb-view-mobil body.kb-popover-menu-open .header .topbar-center {
    top: calc(var(--kb-header-h) + 5px) !important;
    left: 8px !important;
    width: min(296px, calc(100vw - 16px)) !important;
}

/* Mobil üst bar kompakt sağ butonlar ve büyüyen buton için sıfır taşma koruması */
html.kb-view-mobil #kbTopGameBtn.kb-top-game-btn,
html.kb-view-mobil #kbTopYtBtn.kb-top-yt-btn { width: 30px !important; padding: 0 !important; }
html.kb-view-mobil #kbTopGameBtn.kb-top-game-btn .kb-game-txt,
html.kb-view-mobil #kbTopYtBtn.kb-top-yt-btn .kb-yt-txt { display: none !important; }

@media screen and (max-width: 440px) {
    html.kb-view-mobil body.kb-mob-pill-open #hmenu.kb-elite-menu-btn span { display: none !important; }
    html.kb-view-mobil body.kb-mob-pill-open #hmenu.kb-elite-menu-btn { width: 30px !important; padding: 0 !important; justify-content: center !important; }
}
@media screen and (max-width: 375px) {
    html.kb-view-mobil #hmenu.kb-elite-menu-btn span,
    html.kb-view-mobil #radioMobileToggle.kb-mob-expanded .kb-eq-bars { display: none !important; }
    html.kb-view-mobil #hmenu.kb-elite-menu-btn { width: 30px !important; padding: 0 !important; justify-content: center !important; }
}

/* Mobil Sol Profil Çekmecesi (.solbar) */
html.kb-view-mobil .solbar {
    display: none;
    position: fixed !important;
    top: var(--kb-header-h) !important;
    left: 0 !important;
    width: 265px !important;
    max-width: 82vw !important;
    height: calc(100dvh - var(--kb-header-h)) !important;
    overflow-y: auto !important;
    background: #ffffff !important;
    border-right: 1px solid #cbd5e1 !important;
    box-shadow: 10px 0 28px rgba(15, 23, 42, 0.22) !important;
    z-index: 99998 !important;
}

/* ==========================================================================
   2. MOBİL INSTAGRAM DURUM ŞERİDİ (#kbMobStoryStrip) & KANAL KUTULARI (.kanallar)
   ========================================================================== */
html.kb-view-mobil #kbNickStoryBar { display: none !important; }

html.kb-view-mobil .pencereler {
    position: fixed !important;
    top: var(--kb-header-h) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 0 3px 0 !important;
    margin: 0 !important;
    border: none !important;
    border-bottom: 1px solid var(--kb-border) !important;
    background: var(--kb-bg) !important;
    z-index: 15 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

html.kb-view-mobil .pencereler > .baslik,
html.kb-view-mobil .pencereler .mobilozeller { display: none !important; }

/* Kanal Listesinin Üstünde Instagram Gibi Yatay Kayar Durumlar (Stories) */
html.kb-view-mobil body:not(.kb-private-mode) .kb-mob-story-strip {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 5px 8px 5px 8px !important;
    margin: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.22) !important;
    background: rgba(255, 255, 255, 0.65) !important;
    box-sizing: border-box !important;
}
html.kb-view-mobil .kb-mob-story-strip::-webkit-scrollbar { display: none !important; }
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .kb-mob-story-strip {
    background: rgba(17, 26, 46, 0.88) !important;
    border-bottom-color: #293856 !important;
}

html.kb-view-mobil .kb-ig-story {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 2px !important;
    flex: 0 0 auto !important;
    width: 48px !important;
    cursor: pointer !important;
    user-select: none !important;
}
html.kb-view-mobil .kb-ig-ring {
    position: relative !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    padding: 2px !important;
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 2px 6px rgba(220, 39, 67, 0.22) !important;
    transition: transform 0.16s ease !important;
}
html.kb-view-mobil .kb-ig-ring:active { transform: scale(0.92) !important; }
html.kb-view-mobil .kb-ig-ring.add {
    background: linear-gradient(135deg, #94a3b8, #cbd5e1) !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.1) !important;
}
html.kb-view-mobil .kb-ig-ring img {
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 2px solid #ffffff !important;
    background: #ffffff !important;
}
html.kb-view-mobil .kb-ig-plus {
    position: absolute !important;
    right: -1px !important;
    bottom: -1px !important;
    width: 15px !important;
    height: 15px !important;
    border-radius: 50% !important;
    background: #0095f6 !important;
    color: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    font-size: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
html.kb-view-mobil .kb-ig-name {
    font-size: 9.5px !important;
    font-weight: 700 !important;
    color: var(--kb-text, #334155) !important;
    max-width: 50px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    line-height: 1.15 !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .kb-ig-name { color: #e2e8f0 !important; }

html.kb-view-mobil .kb-ig-empty-hint {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 11px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(236, 72, 153, 0.1)) !important;
    border: 1px dashed rgba(99, 102, 241, 0.4) !important;
    color: #4f46e5 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    flex: 0 0 auto !important;
    cursor: pointer !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .kb-ig-empty-hint { color: #93c5fd !important; }

/* Kanal Kutuları: Açık Kanal Sırası Kadar Oto-Yükseklik (1-2-3+ Sıra Genişler, Kapatınca Daralır) */
html.kb-view-mobil .pencereler .kanallar {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    align-content: flex-start !important;
    gap: 4px 5px !important;
    padding: 4px 6px 2px 6px !important;
    margin: 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 38dvh !important;
    overflow-y: auto !important;
    background: transparent !important;
    border: none !important;
    box-sizing: border-box !important;
}

html.kb-view-mobil .pencereler .kanallar .kanal {
    width: auto !important;
    flex: 0 0 auto !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    color: #1e293b !important;
    border-radius: 999px !important;
    height: 23px !important;
    min-height: 23px !important;
    max-height: 23px !important;
    padding: 0 8px !important;
    margin: 0 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05) !important;
    overflow: visible !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .pencereler .kanallar .kanal:not(.kactive) {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}

html.kb-view-mobil .pencereler .kanallar .kanal.kactive {
    background: var(--kb-accent-grad, linear-gradient(135deg, #4f46e5, #7c3aed)) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 2px 7px rgba(79, 70, 229, 0.3) !important;
}

html.kb-view-mobil .pencereler .kanallar .kanal .kanalyazdiv { display: none !important; }

html.kb-view-mobil .pencereler .kanallar .kanal .kanalname {
    width: auto !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

html.kb-view-mobil .pencereler .kanallar .kanal .kapat {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    text-transform: lowercase !important;
    line-height: 1 !important;
    flex: 0 0 auto !important;
    opacity: 0.78 !important;
}
html.kb-view-mobil .pencereler .kanallar .kanal .kapat:empty { display: none !important; }

/* ==========================================================================
   3. MOBİL TOPIC BARI (.topicbolum) & ESTETİK SOHBET EKRANI (.msg)
   ========================================================================== */
html.kb-view-mobil .topicbolum {
    position: fixed !important;
    top: var(--kb-work-top) !important;
    left: 0 !important;
    right: auto !important;
    width: calc(100% - var(--kb-nick-w)) !important;
    height: var(--kb-topic-h) !important;
    display: flex !important;
    align-items: center !important;
    background: linear-gradient(90deg, #eef2ff 0%, #f8fafc 60%, #fdf2f8 100%) !important;
    border: none !important;
    border-bottom: 1px solid var(--kb-border) !important;
    border-radius: 0 !important;
    padding: 0 10px 0 8px !important;
    z-index: 6 !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: top 0.16s ease, height 0.2s ease, background 0.2s ease !important;
    overflow: hidden !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .topicbolum {
    background: linear-gradient(90deg, #162036 0%, #1e293b 100%) !important;
    border-bottom-color: #293856 !important;
}

html.kb-view-mobil .topicbolum .baslik b { display: none !important; }
html.kb-view-mobil .topicbolum .tcol-3 { display: inline-flex !important; flex: 0 0 auto !important; padding: 0 2px !important; font-size: 10px !important; }

html.kb-view-mobil .topicbolum .baslik {
    font-size: 11.5px !important;
    font-weight: 800 !important;
    color: var(--kb-accent-solid, #4338ca) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    white-space: nowrap !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .topicbolum .baslik { color: #60a5fa !important; }

html.kb-view-mobil .topicbolum .kb-topic-caret {
    font-size: 9.5px !important;
    color: var(--kb-accent-solid, #6366f1) !important;
    transition: transform 0.25s ease !important;
    display: inline-block !important;
}

html.kb-view-mobil .topicbolum .tcol-2 {
    font-size: 11px !important;
    font-weight: 600 !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html.kb-view-mobil body.kb-topic-expanded .topicbolum {
    height: auto !important;
    min-height: var(--kb-topic-h) !important;
    max-height: 46dvh !important;
    overflow-y: auto !important;
    align-items: flex-start !important;
    padding-top: 7px !important;
    padding-bottom: 9px !important;
    z-index: 65 !important;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.26) !important;
}
html.kb-view-mobil body.kb-topic-expanded .topicbolum .kb-topic-caret { transform: rotate(180deg) !important; }
html.kb-view-mobil body.kb-topic-expanded .topicbolum .tcol-2,
html.kb-view-mobil body.kb-topic-expanded .topicbolum .topic {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: break-word !important;
    line-height: 1.48 !important;
}

html.kb-view-mobil .msg {
    position: fixed !important;
    top: calc(var(--kb-work-top) + var(--kb-topic-h)) !important;
    bottom: var(--kb-editor-h) !important;
    left: 0 !important;
    right: auto !important;
    width: calc(100% - var(--kb-nick-w)) !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%) !important;
    overflow: hidden !important;
    z-index: 2 !important;
    transition: top 0.2s ease !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .msg {
    background: linear-gradient(180deg, var(--kb-bg, #111a2e) 0%, #0b1120 100%) !important;
}

html.kb-view-mobil .msg .kanal:not(.mactive) { display: none !important; }

html.kb-view-mobil .msg .kanal.mactive {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    padding: 6px 7px 14px 7px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    box-sizing: border-box !important;
}

/* Mobil Kanal Sohbet Satırları: Ferah, Yumuşak Mikro-Kart Estetiği */
html.kb-view-mobil body:not(.kb-private-mode) .msg .kanal :is(.mesajsekil, .mesaj) {
    margin: 4px 0 !important;
    padding: 5.5px 9px !important;
    border-radius: 11px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(226, 232, 240, 0.92) !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.035) !important;
    line-height: 1.44 !important;
}
html.kb-view-mobil body:not(.kb-private-mode):is(.kb-theme-dark, .kb-theme-night) .msg .kanal :is(.mesajsekil, .mesaj) {
    background: rgba(25, 36, 59, 0.88) !important;
    border-color: #293856 !important;
    box-shadow: none !important;
}
html.kb-view-mobil body:not(.kb-private-mode) .msg .kanal :is(.mesajsekil .time, .mesaj .time, .saatspan) {
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #94a3b8 !important;
    margin-right: 5px !important;
}
html.kb-view-mobil body:not(.kb-private-mode) .msg .kanal :is(.mesajsekil .profile, .icon) {
    width: 18px !important;
    height: 18px !important;
    margin-right: 5px !important;
    vertical-align: -4px !important;
}
html.kb-view-mobil body:not(.kb-private-mode) .msg .kanal .mesajsekil .profile img {
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.14) !important;
}
html.kb-view-mobil body:not(.kb-private-mode) .msg .kanal :is(.mesajsekil .nick, .nick) {
    font-size: 13px !important;
    font-weight: 800 !important;
    margin-right: 4px !important;
}
html.kb-view-mobil body:not(.kb-private-mode) .msg .kanal :is(.bildirim, .notice, .action) {
    display: block !important;
    margin: 3px 0 !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    background: rgba(238, 242, 255, 0.72) !important;
    border-left: 2.5px solid var(--kb-accent-solid, #6366f1) !important;
    font-size: 11.5px !important;
    line-height: 1.38 !important;
}
html.kb-view-mobil body:not(.kb-private-mode):is(.kb-theme-dark, .kb-theme-night) .msg .kanal :is(.bildirim, .notice, .action) {
    background: rgba(30, 41, 59, 0.65) !important;
    color: #cbd5e1 !important;
}

/* Mobil #Radyo Sahne Barı Daraltmaları */
html.kb-view-mobil .kb-radyo-stage-bar .kb-rs-title,
html.kb-view-mobil .kb-radyo-stage-bar .kb-rs-eq i:nth-child(n+6) { display: none !important; }
html.kb-view-mobil .kb-radyo-stage-bar .kb-rs-btn { height: 22px !important; padding: 0 6px !important; font-size: 9.5px !important; }

/* ==========================================================================
   4. MOBİL NICK LİSTESİ (.nickler), SOL ORTA OK KULAKÇIĞI & ARALIK AYARLARI
   ========================================================================== */
html.kb-view-mobil body:not(.kb-private-mode):not(.kb-status-mode):not(.kb-user-closed-nick) .nickler {
    display: flex !important;
    flex-direction: column !important;
    position: fixed !important;
    top: var(--kb-work-top) !important;
    bottom: calc(var(--kb-editor-h) + 30px) !important;
    right: 0 !important;
    left: auto !important;
    width: var(--kb-nick-w) !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-left: 1px solid var(--kb-border) !important;
    background: var(--kb-bg) !important;
    z-index: 12 !important;
}

html.kb-view-mobil .nickler .baslik,
html.kb-view-mobil .nickler .kenarakaydir { display: none !important; }

html.kb-view-mobil body.kb-status-mode .nickler,
html.kb-view-mobil body.kb-status-mode #kbNickToggleBtn,
html.kb-view-mobil body.kb-status-mode .nickler .mobilkanalinc,
html.kb-view-mobil body.kb-ozeller-open #kbNickToggleBtn,
html.kb-view-mobil body.kb-private-mode #kbNickToggleBtn {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

html.kb-view-mobil body.kb-status-mode .topicbolum,
html.kb-view-mobil body.kb-status-mode .msg { width: 100% !important; }

/* Kullanıcı Listesi Açma/Kapama: Barın Solunda ve Tam Ortada Ok Kulakçığı */
html.kb-view-mobil #kbNickToggleBtn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: fixed !important;
    top: 52% !important;
    right: var(--kb-nick-w) !important;
    transform: translateY(-50%) !important;
    width: 19px !important;
    height: 46px !important;
    padding: 0 !important;
    border-radius: 11px 0 0 11px !important;
    background: var(--kb-accent-grad, linear-gradient(135deg, #2563eb 0%, #4f46e5 55%, #7c3aed 100%)) !important;
    border: 1.5px solid #ffffff !important;
    border-right: none !important;
    color: #ffffff !important;
    box-shadow: -3px 2px 10px rgba(15, 23, 42, 0.22) !important;
    z-index: 26 !important;
    cursor: pointer !important;
    overflow: hidden !important;
    transition: right 0.22s ease, opacity 0.2s ease !important;
}
html.kb-view-mobil #kbNickToggleBtn:active { transform: translateY(-50%) scale(0.94) !important; }
html.kb-view-mobil #kbNickToggleBtn .kb-k-mark { display: none !important; }
html.kb-view-mobil #kbNickToggleBtn .kb-mob-nick-arrow {
    display: inline-block !important;
    font-size: 11px !important;
    color: #ffffff !important;
    line-height: 1 !important;
    transition: transform 0.25s ease !important;
}

html.kb-view-mobil body.kb-user-closed-nick:not(.kb-private-mode):not(.kb-status-mode) .nickler { width: 0 !important; border: none !important; }
html.kb-view-mobil body.kb-user-closed-nick:not(.kb-private-mode):not(.kb-status-mode) .nickler ul,
html.kb-view-mobil body.kb-user-closed-nick:not(.kb-private-mode):not(.kb-status-mode) .nickler .nicktara,
html.kb-view-mobil body.kb-user-closed-nick:not(.kb-private-mode):not(.kb-status-mode) .nickler .mobilkanalinc,
html.kb-view-mobil body.kb-private-mode .nickler .mobilkanalinc { display: none !important; }
html.kb-view-mobil body.kb-user-closed-nick:not(.kb-private-mode):not(.kb-status-mode) .topicbolum,
html.kb-view-mobil body.kb-user-closed-nick:not(.kb-private-mode):not(.kb-status-mode) .msg { width: 100% !important; }
html.kb-view-mobil body.kb-user-closed-nick:not(.kb-private-mode):not(.kb-status-mode) #kbNickToggleBtn { right: 0 !important; }
html.kb-view-mobil body.kb-user-closed-nick:not(.kb-private-mode):not(.kb-status-mode) #kbNickToggleBtn .kb-mob-nick-arrow { transform: rotate(180deg) !important; }

html.kb-view-mobil .nickler .nicktara {
    order: 2 !important;
    flex: 0 0 24px !important;
    position: relative !important;
    top: 0 !important;
    right: 0 !important;
    width: calc(100% - 8px) !important;
    height: 24px !important;
    margin: 2px auto 3px auto !important;
    padding: 0 8px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    border: 1.5px solid #cbd5e1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .nickler .nicktara {
    background: #19243b !important;
    border-color: #293856 !important;
}
html.kb-view-mobil .nickler .nicktara span i { color: #6366f1 !important; font-size: 9.5px !important; }
html.kb-view-mobil .nickler .nicktara input[type="text"] {
    font-size: 10.5px !important; font-weight: 600 !important; color: #0f172a !important;
    padding: 0 !important; border: none !important; outline: none !important; background: transparent !important; width: 100% !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .nickler .nicktara input[type="text"] { color: #e2e8f0 !important; }

html.kb-view-mobil .nickler ul:not(.nactive) { display: none !important; }
html.kb-view-mobil .nickler ul.nactive {
    order: 3 !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: block !important;
    position: relative !important;
    top: 0 !important;
    width: 100% !important;
    height: auto !important;
    padding: 3px 4px 16px 4px !important;
    margin: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    border-top: 1px solid var(--kb-border) !important;
    background: var(--kb-bg) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

/* Mobil Kullanıcı Listesi Satırları: Resim ve Yazı Arası Ferah Boşluk (Eski -10px margin sıfırlandı) */
html.kb-view-mobil .nickler ul li.nick {
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 7px !important;
    margin: 3px 0 !important;
    gap: 8px !important;
    border-radius: 9px !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .nickler ul li.nick {
    background: #19243b !important;
    border-color: #293856 !important;
}
html.kb-view-mobil .nickler ul li.nick .arkaplan {
    margin: 0 !important;
    width: 22px !important;
    height: 22px !important;
    flex: 0 0 22px !important;
}
html.kb-view-mobil .nickler ul li.nick .arkaplan img {
    width: 21px !important;
    height: 21px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}
html.kb-view-mobil .nickler ul li.nick span.isim {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 30px !important;
    height: 30px !important;
}
html.kb-view-mobil .nickler ul li.nick .donline {
    left: 22px !important;
    bottom: 4px !important;
    top: auto !important;
    transform: none !important;
    width: 6.5px !important;
    height: 6.5px !important;
}

html.kb-view-mobil .nickler .mobilkanalinc {
    order: 1 !important;
    flex: 0 0 25px !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    width: calc(100% - 8px) !important;
    height: 25px !important;
    margin: 3px auto 1px auto !important;
    padding: 0 7px !important;
    border-radius: 8px !important;
    background: linear-gradient(135deg, rgba(238, 242, 255, 0.95), rgba(240, 253, 244, 0.95)) !important;
    border: 1px solid rgba(99, 102, 241, 0.28) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05) !important;
    z-index: 2 !important;
    pointer-events: none !important;
    box-sizing: border-box !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .nickler .mobilkanalinc {
    background: linear-gradient(135deg, #19243b, #162a33) !important;
    border-color: #293856 !important;
}
html.kb-view-mobil .nickler .mobilkanalinc::before {
    content: "● Online" !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    color: #059669 !important;
    letter-spacing: 0.2px !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .nickler .mobilkanalinc::before { color: #34d399 !important; }
html.kb-view-mobil .nickler .mobilkanalinc span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 22px !important;
    height: 17px !important;
    padding: 0 6px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ff7a00 0%, #ea580c 100%) !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    color: #ffffff !important;
    box-shadow: 0 1px 4px rgba(234, 88, 12, 0.32) !important;
}

html.kb-view-mobil .scrolllock-floating {
    position: absolute !important;
    top: 6px !important;
    right: 8px !important;
    left: auto !important;
    bottom: auto !important;
    width: auto !important;
    min-width: 26px !important;
    height: 24px !important;
    padding: 0 7px !important;
    gap: 4px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1.5px solid #cbd5e1 !important;
    color: #334155 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.14) !important;
    z-index: 55 !important;
}
html.kb-view-mobil .scrolllock-floating:not(.active) .kb-sl-lbl { display: none !important; }
html.kb-view-mobil body.kb-radyo-room-active .scrolllock-floating { top: 40px !important; }
html.kb-view-mobil .scrolllock-floating.active { background: linear-gradient(135deg, #dc2626, #e11d48) !important; border-color: #ffffff !important; color: #ffffff !important; }

/* ==========================================================================
   5. MOBİL ALT YAZIŞMA BARI (.editor) & SAĞ ALT (+ A -) KUTUSU
   ========================================================================== */
html.kb-view-mobil .editor {
    position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
    width: 100% !important; height: var(--kb-editor-h) !important; padding: 0 5px !important; z-index: 45 !important;
}
html.kb-view-mobil .editor:has(#kbTextStylePopup:not([style*="none"]), .emojionearea-button.active, #kbMentionPopup:not([style*="none"])) {
    z-index: 9200 !important;
}
html.kb-view-mobil body:has(#kbTextStylePopup:not([style*="none"]), .emojionearea-button.active) #kbNickToggleBtn {
    opacity: 0 !important; pointer-events: none !important;
}
html.kb-view-mobil .editor .co-alt { gap: 5px !important; }
html.kb-view-mobil .editor #inputmsg,
html.kb-view-mobil .emojionearea.emojionearea-inline > .emojionearea-editor { font-size: 14px !important; }
html.kb-view-mobil .editor #inputgonder { width: 36px !important; min-width: 36px !important; height: 36px !important; padding: 0 !important; }
html.kb-view-mobil .editor #kbBarStyleBtn.kb-bar-style-btn { height: 36px !important; padding: 0 9px !important; font-size: 13px !important; }
html.kb-view-mobil .kb-font-zoom-bar { width: var(--kb-nick-w) !important; height: 30px !important; }
html.kb-view-mobil body:is(.kb-private-mode, .kb-status-mode, .kb-user-closed-nick) .kb-font-zoom-bar {
    width: 88px !important; border-top-left-radius: 12px !important;
}
html.kb-view-mobil :is(.kb-text-style-popup, #kbTextStylePopup) {
    right: 6px !important; bottom: calc(var(--kb-editor-h) + 8px) !important; width: min(272px, 90vw) !important;
}
html.kb-view-mobil #kbTextStylePopup .kb-ts-list { max-height: min(46dvh, 290px) !important; }
html.kb-view-mobil .emojionearea .emojionearea-picker { left: 2px !important; right: auto !important; max-width: calc(100vw - 12px) !important; }

/* Sadece Mobilde Yazma Kutusuna Girince Üst Kısımda Çıkan Klavyeyi Aşağı İndirme (⌄) Butonu */
html.kb-view-mobil body.kb-typing-active .kb-mob-hide-kb-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: fixed !important;
    left: 8px !important;
    bottom: calc(var(--kb-editor-h) + 4px) !important;
    width: 34px !important;
    height: 26px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    background: var(--kb-ed-inp-bg, #ffffff) !important;
    border: 1.5px solid var(--kb-ed-inp-border, #cbd5e1) !important;
    color: var(--kb-accent-solid, #4f46e5) !important;
    font-size: 13px !important;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.16) !important;
    z-index: 9600 !important;
    cursor: pointer !important;
}
html.kb-view-mobil body.kb-typing-active:is(.kb-theme-dark, .kb-theme-night) .kb-mob-hide-kb-btn { color: #93c5fd !important; }
html.kb-view-mobil body.kb-typing-active:has(:is(#kbAutoWordBar[style*="flex"], #kbEditBar:not([style*="none"]))) .kb-mob-hide-kb-btn {
    bottom: calc(var(--kb-editor-h) + 34px) !important;
}

/* ==========================================================================
   6. MOBİL ÖZEL ÇEKMECESİ (.ozeller) VE 2 SATIRLI ÖZEL ÜST BAR (.kb-pm-topbar)
   ========================================================================== */
html.kb-view-mobil body.kb-ozeller-open .pencereler { z-index: 9600 !important; }
html.kb-view-mobil body:not(.kb-ozeller-open) .pencereler .ozeller { display: none !important; }
html.kb-view-mobil body.kb-ozeller-open .pencereler .ozeller {
    display: flex !important; flex-direction: column !important; position: fixed !important;
    top: var(--kb-header-h) !important; bottom: var(--kb-editor-h) !important; right: 0 !important; left: auto !important;
    width: 225px !important; max-width: 82vw !important; height: auto !important; margin: 0 !important;
    border-radius: 0 0 0 14px !important; background: #ffffff !important; border-left: 1px solid #cbd5e1 !important;
    box-shadow: -10px 0 28px rgba(15, 23, 42, 0.26) !important; padding: 8px !important; z-index: 9650 !important; overflow-y: auto !important;
}
html.kb-view-mobil .kb-dm-drawer-head { display: flex !important; }
html.kb-view-mobil body.kb-private-mode .pencereler .ozeller { top: calc(var(--kb-header-h) + var(--kb-pm-header-h)) !important; }

html.kb-view-mobil .pencereler .ozeller .mobilkapat {
    display: block !important; position: sticky !important; top: 0 !important; z-index: 25 !important;
    width: 100% !important; padding: 0 0 6px 0 !important; margin: 0 0 6px 0 !important;
    background: transparent !important; border-bottom: 1px solid #e2e8f0 !important;
}
html.kb-view-mobil .pencereler .ozeller .mobilkapat .ozellerikapat {
    display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important;
    width: 100% !important; padding: 8px !important; border-radius: 8px !important;
    background: linear-gradient(135deg, #ef4444, #dc2626) !important; color: #ffffff !important;
    font-size: 12px !important; font-weight: 800 !important; cursor: pointer !important;
}
html.kb-view-mobil .pencereler .ozeller .ozel {
    display: flex !important; align-items: center !important; justify-content: space-between !important;
    padding: 7px 9px !important; margin: 4px 0 !important; border-radius: 9px !important;
    background: #f8fafc !important; border: 1px solid #e2e8f0 !important; font-size: 12px !important; font-weight: 600 !important; color: #1e293b !important;
}
html.kb-view-mobil .pencereler .ozeller .ozel .kapat {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    width: 22px !important; height: 22px !important; border-radius: 6px !important;
    background: #fee2e2 !important; color: #dc2626 !important; font-size: 11px !important; font-weight: 800 !important;
}

html.kb-view-mobil body.kb-private-mode :is(.pencereler .kanallar, .pencereler .baslik, .pencereler .mobilozeller, .kb-mob-story-strip, .topicbolum, .nickler, #kbNickToggleBtn) {
    display: none !important;
}
html.kb-view-mobil body.kb-private-mode .pencereler { min-height: 0 !important; height: 0 !important; padding: 0 !important; border: none !important; }

html.kb-view-mobil body.kb-private-mode .kb-pm-topbar {
    position: fixed !important; top: var(--kb-header-h) !important; left: 0 !important; right: 0 !important;
    width: 100% !important; max-width: 100vw !important; height: var(--kb-pm-header-h) !important;
    padding: 3px 6px !important; background: linear-gradient(135deg, #ffffff 0%, #f3e8ff 55%, #fce7f3 100%) !important;
    border-bottom: 1px solid #cbd5e1 !important; display: flex !important; flex-direction: column !important;
    justify-content: space-between !important; overflow: hidden !important; box-sizing: border-box !important; z-index: 4000 !important;
}
html.kb-view-mobil .kb-pm-row-top {
    display: flex !important; align-items: center !important; justify-content: space-between !important;
    width: 100% !important; height: 30px !important; min-height: 30px !important; gap: 6px !important;
}
html.kb-view-mobil .kb-pm-back-btn {
    height: 26px !important; padding: 0 9px !important; border-radius: 999px !important;
    background: #eef2ff !important; border: 1px solid #c7d2fe !important; color: #4338ca !important;
    font-size: 11px !important; font-weight: 800 !important; display: inline-flex !important; align-items: center !important; gap: 4px !important;
}
html.kb-view-mobil .kb-pm-user {
    display: flex !important; align-items: center !important; justify-content: center !important;
    gap: 6px !important; min-width: 0 !important; flex: 1 1 auto !important; overflow: hidden !important;
}
html.kb-view-mobil .kb-pm-user img {
    width: 24px !important; height: 24px !important; border-radius: 50% !important; object-fit: cover !important; border: 1.5px solid #7c3aed !important;
}
html.kb-view-mobil .kb-pm-user-info { display: flex !important; align-items: center !important; gap: 5px !important; min-width: 0 !important; overflow: hidden !important; }
html.kb-view-mobil .kb-pm-user-info #kbPmNick {
    font-size: 13px !important; font-weight: 800 !important; color: #1e1b4b !important;
    white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html.kb-view-mobil .kb-pm-user-info small {
    font-size: 9.5px !important; font-weight: 700 !important; color: #16a34a !important;
    background: #dcfce7 !important; padding: 1px 5px !important; border-radius: 999px !important;
}
html.kb-view-mobil .kb-pm-close-top {
    height: 26px !important; padding: 0 9px !important; border-radius: 999px !important;
    background: #fee2e2 !important; border: 1px solid #fca5a5 !important; color: #dc2626 !important;
    font-size: 11px !important; font-weight: 800 !important; display: inline-flex !important; align-items: center !important; gap: 4px !important;
}

html.kb-view-mobil .kb-pm-row-bottom {
    display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: center !important; justify-items: center !important; width: 100% !important; height: 50px !important;
    gap: 3px 4px !important; padding: 3px 0 1px 0 !important; border-top: 1px solid rgba(203, 213, 225, 0.55) !important;
    overflow: hidden !important; box-sizing: border-box !important;
}
html.kb-view-mobil .kb-pm-btn {
    width: 100% !important; min-width: 0 !important; height: 22px !important; border-radius: 7px !important;
    border: 1px solid #cbd5e1 !important; background: #ffffff !important; color: #334155 !important;
    font-size: 10px !important; font-weight: 800 !important; display: inline-flex !important;
    align-items: center !important; justify-content: center !important; gap: 3px !important; padding: 0 3px !important;
    cursor: pointer !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
}
html.kb-view-mobil .kb-pm-btn i { font-size: 9.5px !important; flex: 0 0 auto !important; }
html.kb-view-mobil .kb-pm-btn span { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html.kb-view-mobil .kb-pm-btn.call { background: #dcfce7 !important; color: #15803d !important; border-color: #86efac !important; }
html.kb-view-mobil .kb-pm-btn.cam  { background: #dbeafe !important; color: #1d4ed8 !important; border-color: #93c5fd !important; }
html.kb-view-mobil .kb-pm-btn.conf { background: #fef3c7 !important; color: #b45309 !important; border-color: #fcd34d !important; }
html.kb-view-mobil .kb-pm-btn.game { background: #ecfdf5 !important; color: #047857 !important; border-color: #6ee7b7 !important; }
html.kb-view-mobil .kb-pm-btn.like { background: #ffe4e6 !important; color: #e11d48 !important; border-color: #fda4af !important; }
html.kb-view-mobil .kb-pm-btn.more { background: linear-gradient(135deg, #4f46e5, #7c3aed) !important; color: #ffffff !important; border: none !important; }

html.kb-view-mobil body.kb-private-mode .msg {
    top: calc(var(--kb-header-h) + var(--kb-pm-header-h)) !important; bottom: var(--kb-editor-h) !important;
    left: 0 !important; width: 100% !important; height: auto !important;
}

html.kb-view-mobil .msg .kullanicimenu {
    display: none !important; position: fixed !important; top: calc(var(--kb-header-h) + var(--kb-pm-header-h) + 4px) !important;
    right: 8px !important; width: 215px !important; max-height: calc(100dvh - var(--kb-header-h) - var(--kb-pm-header-h) - var(--kb-editor-h) - 10px) !important;
    overflow-y: auto !important; background: #ffffff !important; border: 1px solid #cbd5e1 !important;
    border-radius: 16px !important; box-shadow: 0 14px 34px rgba(15, 23, 42, 0.25) !important; z-index: 4200 !important;
}
html.kb-view-mobil body.kb-private-mode .msg .kullanicimenu.kb-card-open { display: block !important; }
html.kb-view-mobil .msg .kullanicimenu ul { width: 100% !important; padding: 12px !important; margin: 0 !important; background: transparent !important; }
html.kb-view-mobil .msg .kullanicimenu .kullaniciackapat {
    position: absolute !important; top: 8px !important; right: 8px !important; width: 28px !important; height: 28px !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    background: #fee2e2 !important; color: #dc2626 !important; border: 1px solid #fca5a5 !important; border-radius: 50% !important; z-index: 20 !important;
}

/* Mobil Koyu Temalar (Tam Koyu & Gece Modu Lacivert) Arama, Özel Çekmecesi & PM Üst Bar Uyumu */
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .nickler .nicktara { background: #19243b !important; border-color: #334155 !important; }
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .nickler .nicktara span i { color: #60a5fa !important; }
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .nickler .nicktara input[type="text"] { color: #f1f5f9 !important; }
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .scrolllock-floating:not(.active) { background: #1e293b !important; border-color: #334155 !important; color: #cbd5e1 !important; }
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night).kb-ozeller-open .pencereler .ozeller,
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .msg .kullanicimenu {
    background: #162036 !important; border-color: #334155 !important; color: #e2e8f0 !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .pencereler .ozeller .mobilkapat { border-bottom-color: #293856 !important; }
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .pencereler .ozeller .ozel:not(.oactive) {
    background: #1e293b !important; border-color: #334155 !important; color: #e2e8f0 !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night).kb-private-mode .kb-pm-topbar {
    background: linear-gradient(135deg, #111a2e 0%, #19243b 55%, #1e1b4b 100%) !important; border-bottom-color: #293856 !important;
}
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .kb-pm-row-bottom { border-top-color: rgba(51, 65, 85, 0.7) !important; }
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .kb-pm-user-info #kbPmNick { color: #f8fafc !important; }
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .kb-pm-back-btn { background: #1e293b !important; border-color: #3b82f6 !important; color: #93c5fd !important; }
html.kb-view-mobil body:is(.kb-theme-dark, .kb-theme-night) .kb-pm-btn:not(.more) { background: #1e293b !important; border-color: #334155 !important; color: #e2e8f0 !important; }