.khdb-mode-desktop .khdb-mobile-shell { display:none !important; }

.khdb-mode-mobile .khdb-mobile-shell,
.khdb-mode-tablet .khdb-mobile-shell { display:block !important; }

.khdb-mode-mobile .khdb-app.khdb-layout-mobile { --khdb-active-layout: mobile; }
.khdb-mode-mobile .khdb-app.khdb-layout-mobile .khdb-mobile-drawer,
.khdb-mode-mobile .khdb-app.khdb-layout-mobile .khdb-mobile-drawer-backdrop,
.khdb-mode-mobile .khdb-app.khdb-layout-mobile .khdb-mobile-profile-screen,
.khdb-mode-mobile .khdb-app.khdb-layout-mobile .khdb-mobile-workspace-screen,
.khdb-mode-tablet .khdb-app.khdb-layout-tablet .khdb-mobile-drawer,
.khdb-mode-tablet .khdb-app.khdb-layout-tablet .khdb-mobile-drawer-backdrop,
.khdb-mode-tablet .khdb-app.khdb-layout-tablet .khdb-mobile-profile-screen,
.khdb-mode-tablet .khdb-app.khdb-layout-tablet .khdb-mobile-workspace-screen { touch-action: manipulation; }


.khdb-mode-mobile.khdb-mobile-has-active-screen .khdb-mobile-shell .khdb-mobile-topbar-title {
  justify-content:flex-start;
  text-align:left;
  letter-spacing:.08em;
  text-transform:none;
  font-size:15px;
  font-weight:700;
}

.khdb-mode-mobile.khdb-mobile-has-active-screen .khdb-mobile-shell .khdb-mobile-topbar {
  border-bottom-color: rgba(94,192,255,.14);
}


.khdb-mode-mobile .khdb-mobile-menu-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.khdb-mode-mobile .khdb-mobile-menu-intro {
  padding:14px;
}

.khdb-mode-mobile .khdb-mobile-menu-tile {
  min-height:132px;
  padding:14px 12px;
  border-radius:18px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  text-align:left;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.khdb-mode-mobile .khdb-mobile-menu-tile-icon {
  width:44px;
  height:44px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(94,192,255,.1);
  border:1px solid rgba(94,192,255,.16);
  color:#8ed8ff;
}

.khdb-mode-mobile .khdb-mobile-menu-tile-icon .dashicons {
  font-size:20px;
  width:20px;
  height:20px;
}

.khdb-mode-mobile .khdb-mobile-menu-tile-copy {
  width:100%;
  gap:6px;
}

.khdb-mode-mobile .khdb-mobile-menu-tile-title {
  display:block;
  font-size:15px;
  line-height:1.25;
}

.khdb-mode-mobile .khdb-mobile-menu-tile small {
  margin-top:0;
  font-size:12px;
  line-height:1.4;
}

.khdb-mode-mobile .khdb-mobile-menu-tile-danger .khdb-mobile-menu-tile-icon {
  background:rgba(255,99,99,.1);
  border-color:rgba(255,99,99,.16);
  color:#ffb2b2;
}


@media (max-width: 782px) {
  .khdb-app .khdb-feed {
    padding-top: 24px !important;
  }

  .khdb-app .khdb-feed-chrome {
    top: calc(env(safe-area-inset-top, 0px) + 96px) !important;
    margin-top: 8px !important;
  }
}

@media (max-width: 430px) {
  .khdb-app .khdb-feed {
    padding-top: 32px !important;
  }

  .khdb-app .khdb-feed-chrome {
    top: calc(env(safe-area-inset-top, 0px) + 104px) !important;
    margin-top: 8px !important;
  }
}

/* Styles for hashtag follow button */
.khdb-follow-hashtag-btn {
  border: none;
  background: transparent;
  color: inherit;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  margin-left: 6px;
  padding: 0;
  font-size: 14px;
}
.khdb-follow-hashtag-btn .dashicons {
  margin: 0;
}



/* Mobile: keep the entire search + composer stack fixed together while search results can still overlay the composer */
@media (max-width: 782px) {
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile {
    position: sticky !important;
    top: var(--khdb-sticky-top, 0px) !important;
    z-index: 10020 !important;
    padding-bottom: 12px !important;
    background: linear-gradient(180deg, rgba(9,9,9,.998) 0%, rgba(9,9,9,.992) 82%, rgba(9,9,9,.94) 100%) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-bottom: 0 !important;
    overflow: visible !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-toolbar-row,
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-category-filter.khdb-search-filter,
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible {
    position: relative !important;
    top: auto !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-toolbar-row {
    z-index: 1 !important;
    margin-bottom: 0 !important;
    padding-bottom: 10px !important;
    background: transparent !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-category-filter.khdb-search-filter {
    z-index: 2 !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
    margin-bottom: 0 !important;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible {
    z-index: 1 !important;
    margin-top: 12px !important;
    margin-bottom: 0 !important;
    background: linear-gradient(180deg, rgba(10,14,20,.995) 0%, rgba(10,14,20,.985) 100%) !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile .khdb-search-wrap,
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile .khdb-search-input-wrap,
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile .khdb-search-suggestions {
    z-index: 10040 !important;
  }

  .khdb-app .khdb-feed > .khdb-topics {
    margin-top: 12px !important;
  }

  .khdb-app.khdb-mobile-thread-inline .khdb-mobile-thread-host {
    position: relative !important;
    display: block !important;
    margin: 12px 0 0 !important;
    z-index: 3 !important;
  }

  .khdb-app.khdb-mobile-thread-inline .khdb-mobile-thread-host .khdb-thread-panel {
    margin: 0 !important;
  }

  .khdb-app.khdb-mobile-thread-inline .khdb-mobile-thread-host .khdb-thread-nav {
    position: relative !important;
    top: auto !important;
  }

}



.khdb-mobile-compose-fab-global{display:none !important;}


/* Mobile topic composer: keep the open form usable within the viewport */
@media (max-width: 782px) {
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible {
    padding: 12px 14px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-composer-toggle-title {
    font-size: 16px !important;
    line-height: 1.25 !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-composer-toggle-hint {
    font-size: 11px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-composer-body {
    max-height: calc(100dvh - var(--khdb-sticky-top, 0px) - 150px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
    padding-right: 2px !important;
    padding-bottom: 14px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-composer-body h3 {
    font-size: 18px !important;
    margin-bottom: 10px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-field,
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-textarea,
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-category-select {
    font-size: 16px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-textarea {
    min-height: 96px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-profile-wall-actionbar {
    gap: 8px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible .khdb-profile-wall-actionbar-left {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible > .khdb-composer-body > .khdb-button:last-child {
    position: sticky !important;
    bottom: 0 !important;
    width: 100% !important;
    margin-top: 12px !important;
    box-shadow: 0 -8px 18px rgba(10,14,20,.92) !important;
  }
}


@media (max-width: 782px) {
  body.khdb-mobile-topic-composer-open {
    overflow: hidden !important;
    touch-action: none !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible {
    border-radius: 18px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open {
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    top: calc(var(--khdb-sticky-top, 0px) + 8px) !important;
    bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 !important;
    padding: 10px 12px 12px !important;
    z-index: 10070 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    box-shadow: 0 22px 60px rgba(0,0,0,.55) !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open .khdb-composer-toggle {
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
    padding: 2px 0 10px !important;
    background: linear-gradient(180deg, rgba(10,14,20,.99) 0%, rgba(10,14,20,.96) 100%) !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open .khdb-composer-toggle-title {
    font-size: 15px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open .khdb-composer-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    padding-right: 2px !important;
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open .khdb-composer-body h3 {
    display: none !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open .khdb-field,
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open .khdb-category-select,
  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open .khdb-textarea {
    margin-bottom: 10px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open .khdb-textarea {
    min-height: 72px !important;
  }

  .khdb-app .khdb-feed-chrome.khdb-feed-chrome-mobile > .khdb-composer.khdb-composer-collapsible.is-open > .khdb-composer-body > .khdb-button:last-child {
    position: sticky !important;
    bottom: 0 !important;
    width: 100% !important;
    margin-top: 10px !important;
    margin-bottom: 0 !important;
    z-index: 3 !important;
    box-shadow: 0 -10px 22px rgba(10,14,20,.96) !important;
  }
}


@media (max-width: 782px) {
  .khdb-mobile-topic-sheet {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(3, 8, 15, .82) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    display: none !important;
    align-items: flex-end !important;
    justify-content: center !important;
    z-index: 10090 !important;
    padding: 12px !important;
  }

  .khdb-mobile-topic-sheet.is-open {
    display: flex !important;
  }

  .khdb-mobile-topic-dialog {
    width: min(100%, 680px) !important;
    max-height: 92vh !important;
    overflow: auto !important;
    background: #0f1115 !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 22px 22px 18px 18px !important;
    box-shadow: 0 30px 60px rgba(0,0,0,.45) !important;
    padding: 16px 16px 18px !important;
  }

  .khdb-mobile-topic-grabber {
    width: 44px !important;
    height: 5px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.18) !important;
    margin: 0 auto 14px !important;
  }

  .khdb-mobile-topic-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
  }

  .khdb-mobile-topic-label {
    font-size: 12px !important;
    letter-spacing: .16em !important;
    text-transform: uppercase !important;
    color: #8cb0c8 !important;
    font-weight: 700 !important;
    margin-bottom: 4px !important;
  }

  .khdb-mobile-topic-target {
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
  }

  .khdb-mobile-topic-sub {
    color: #8cb0c8 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
  }

  .khdb-mobile-topic-close {
    appearance: none !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    background: #111 !important;
    color: #fff !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
  }

  .khdb-mobile-topic-sheet .khdb-composer.khdb-mobile-topic-ported {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;
    inset: auto !important;
    display: block !important;
    overflow: visible !important;
  }

  .khdb-mobile-topic-sheet .khdb-composer.khdb-mobile-topic-ported .khdb-composer-toggle {
    display: none !important;
  }

  .khdb-mobile-topic-sheet .khdb-composer.khdb-mobile-topic-ported .khdb-composer-body {
    display: block !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 0 calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
  }

  .khdb-mobile-topic-sheet .khdb-composer.khdb-mobile-topic-ported .khdb-button:last-child {
    position: sticky !important;
    bottom: 0 !important;
    width: 100% !important;
    margin-top: 12px !important;
    z-index: 3 !important;
  }
}