/* BusTop v2.2.4 — full release QA polish */

/* Global geometry guards */
html, body { width:100%; max-width:100%; overflow-x:hidden !important; }
body { position:relative; }
body.bt-modal-open { overflow:hidden !important; touch-action:none; }
*, *::before, *::after { box-sizing:border-box; }
img, video, canvas, svg { max-width:100%; }
:is(.app-main,.page-content,.container,.section,.card,.mk-wrap,.mk-grid,.mk-card,.job-card,.listing-card,.bt-social-shell,.bt-social-main,.bt-social-feed,.bt-social-post,.bt-reels-page,.bt-reels-feed,.bt-reel-card,.dm-page,.dm-layout,.dm-conv-list,.dm-chat-area,.profile-page,.discover-page) { min-width:0; }

/* Do not split category labels into vertical letters */
:is(.mk-chips,.vitrin-filter-scroll,.bt-social-filter-row,.discover-tabs,.discover-filters,.tab-row) {
  max-width:100%; overflow-x:auto; overflow-y:hidden; display:flex; flex-wrap:nowrap; gap:8px;
  scroll-snap-type:x proximity; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
:is(.mk-chips,.vitrin-filter-scroll,.bt-social-filter-row,.discover-tabs,.discover-filters,.tab-row)::-webkit-scrollbar { display:none; }
:is(.mk-chip,.vitrin-filter-chip,.bt-filter-chip,.discover-tab,.tab-row > a) {
  flex:0 0 auto !important; min-width:max-content; max-width:none; white-space:nowrap !important;
  word-break:normal !important; overflow-wrap:normal !important; text-wrap:nowrap;
}

/* Search and filter forms */
.mk-search { display:grid; grid-template-columns:minmax(0,1fr) minmax(150px,240px) auto; gap:10px; align-items:stretch; }
.mk-search > * { min-width:0; }
.mk-search .btn { width:auto; min-width:112px; }
.mk-grid { align-items:stretch; }
.mk-card { height:100%; min-width:0; }
.mk-card-title { min-height:2.7em; line-height:1.35; overflow-wrap:anywhere; }
.mk-card-body { min-width:0; }
.mk-price { overflow-wrap:anywhere; }
.mk-meta,.mk-city { white-space:normal; }

/* Share sheet: show complete post URL, never a misleading truncated base URL */
.bt-share-sheet { overflow:hidden; }
.bt-share-sheet__panel { width:min(470px,calc(100vw - 24px)); max-height:min(92dvh,700px); overflow:auto; }
.bt-share-link { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
.bt-share-link textarea {
  display:block; width:100%; min-width:0; min-height:64px; resize:none; overflow:auto;
  padding:10px 12px; border:1px solid var(--bt-social-line); border-radius:10px;
  background:var(--bt-social-surface); color:var(--bt-social-ink); font:500 12px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace;
  overflow-wrap:anywhere; word-break:break-all;
}
.bt-share-link__actions { display:flex; justify-content:flex-end; align-items:center; gap:8px; }
.bt-share-link__actions a,.bt-share-link__actions button {
  min-height:40px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px;
  padding:0 13px; font-weight:750; text-decoration:none;
}
.bt-share-link__actions a { color:var(--bt-social-blue); border:1px solid var(--bt-social-line); background:var(--bt-social-surface); }
.bt-share-link__actions button { border:0; background:var(--bt-social-blue); color:#fff; }

/* Carousel stays inside the post; page itself never drifts horizontally */
.bt-post-carousel { position:relative; width:100%; max-width:100%; overflow:hidden !important; contain:layout paint; touch-action:pan-y pinch-zoom; }
.bt-post-carousel__track { display:flex; width:100%; max-width:100%; will-change:transform; }
.bt-post-slide { flex:0 0 100% !important; width:100% !important; min-width:100% !important; max-width:100% !important; overflow:hidden; }
.bt-post-slide :is(img,video) { display:block; width:100%; height:auto; max-width:100%; }

/* Reels/Clips: a real single-viewport experience */
.page-clips .global-search-bar-wrap,
.page-clips .footer { display:none !important; }
.page-clips .app-main { padding:0 !important; min-height:100dvh; background:#05080d; overflow:hidden; }
.page-clips .bt-reels-page {
  min-height:100dvh; height:100dvh; padding:14px 18px; background:#05080d; overflow:hidden;
  display:grid; grid-template-rows:auto minmax(0,1fr);
}
.page-clips .bt-reels-header { width:min(520px,100%); margin:0 auto 10px; min-height:50px; }
.page-clips .bt-reels-feed {
  width:min(520px,100%); height:100%; min-height:0; margin:0 auto; overflow-y:auto; overflow-x:hidden;
  scroll-snap-type:y mandatory; overscroll-behavior-y:contain; scrollbar-width:none;
}
.page-clips .bt-reels-feed::-webkit-scrollbar { display:none; }
.page-clips .bt-reel-card {
  width:100%; height:100%; min-height:100%; max-height:none; aspect-ratio:auto; margin:0 0 14px;
  scroll-snap-align:start; scroll-snap-stop:always; border-radius:22px;
}
.page-clips .bt-reel-video { width:100%; height:100%; object-fit:contain; background:#000; }
.page-clips .bt-reel-info { right:86px; }
.page-clips .bt-reel-actions { bottom:28px; }
.page-clips .bt-reel-comments-panel { max-height:76%; }

/* Prevent desktop clip stage from looking like an endless empty black canvas */
@media (min-width:981px) {
  .page-clips .app-main { background:radial-gradient(circle at 50% 45%,#121a28 0,#070b12 48%,#03060a 100%); }
  .page-clips .bt-reels-page { background:transparent; }
  .page-clips .bt-reel-card { box-shadow:0 28px 90px rgba(0,0,0,.45); border-color:rgba(255,255,255,.14); }
}

/* Messages */
.dm-layout { width:100%; max-width:1180px; margin-inline:auto; }
.dm-conv-item,.dm-chat-header { min-width:0; }
.dm-conv-name,.dm-conv-last,.dm-chat-header-info { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.dm-chat-messages { overscroll-behavior:contain; }
.dm-bubble { overflow-wrap:anywhere; word-break:break-word; }

/* Login/register visual alignment */
.login-shell,.auth-shell,.login-layout { width:min(100%,1100px); margin-inline:auto; }
.login-card,.auth-card { min-width:0; }
.login-panel,.login-form-panel { min-width:0; }
.login-form-panel form,.login-card form { width:100%; min-width:0; }

/* Admin and data tables */
.table-card,.table-wrap,.admin-table-wrap { width:100%; max-width:100%; overflow:auto; overscroll-behavior:contain; }
table { max-width:100%; }

/* Empty/error states */
:is(.mk-empty,.empty-state,.error-card,.bt-social-empty,.bt-reels-empty,.dm-empty-chat,.dm-empty-conv) { max-width:100%; overflow-wrap:anywhere; }

/* Mobile layout */
@media (max-width:768px) {
  body.is-app { padding-bottom:calc(64px + env(safe-area-inset-bottom,0px)); }
  .app-main { width:100%; max-width:100%; }
  .container { width:100%; max-width:100%; padding-left:12px; padding-right:12px; }
  .mk-search { grid-template-columns:minmax(0,1fr); }
  .mk-search .btn { width:100%; }
  .mk-grid { grid-template-columns:minmax(0,1fr) !important; }
  .mk-card-title { min-height:0; }
  .bt-share-sheet { align-items:flex-end; padding:0; }
  .bt-share-sheet__panel { width:100%; max-width:100%; border-radius:22px 22px 0 0; padding-bottom:max(18px,env(safe-area-inset-bottom)); }
  .bt-share-sheet__options { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .bt-share-option { min-width:0; padding:8px 5px; }
  .bt-share-option span { white-space:normal; text-align:center; overflow-wrap:anywhere; }

  .page-clips .ig-sidebar,.page-clips .app-sidebar { display:none !important; }
  .page-clips .app-shell,.page-clips .ig-app-layout { display:block !important; }
  .page-clips .app-main { min-height:calc(100dvh - 58px - 64px - env(safe-area-inset-bottom,0px)); height:calc(100dvh - 58px - 64px - env(safe-area-inset-bottom,0px)); }
  .page-clips .bt-reels-page { min-height:100%; height:100%; padding:0; grid-template-rows:minmax(0,1fr); }
  .page-clips .bt-reels-header {
    position:absolute; z-index:8; top:max(8px,env(safe-area-inset-top,0px)); left:12px; right:12px;
    width:auto; margin:0; pointer-events:none; color:#fff;
  }
  .page-clips .bt-reels-header > a { pointer-events:auto; }
  .page-clips .bt-reels-feed { width:100%; height:100%; }
  .page-clips .bt-reel-card { height:100%; min-height:100%; border-radius:0; border-left:0; border-right:0; margin:0; }
  .page-clips .bt-reel-video { object-fit:cover; }
  .page-clips .bt-reel-info { left:14px; right:82px; bottom:18px; }
  .page-clips .bt-reel-actions { right:8px; bottom:88px; }
  .page-clips .bt-reel-comments-panel { max-height:78%; border-radius:22px 22px 0 0; }

  .dm-layout { display:block; }
  .dm-layout.has-active-conv .dm-conv-list { display:none; }
  .dm-layout.no-active-conv .dm-chat-area { display:none; }
  .dm-chat-area { min-height:calc(100dvh - 132px - env(safe-area-inset-bottom,0px)); }
  .dm-chat-form { position:sticky; bottom:0; }
}

@media (max-width:430px) {
  .bt-share-sheet__options { gap:7px; }
  .bt-share-option { min-height:84px; font-size:11px; }
  .bt-share-link__actions { display:grid; grid-template-columns:1fr 1fr; }
  .bt-share-link__actions > * { width:100%; }
  .vitrin-feed-actions,.bt-post-actions > div { gap:5px; }
  .bt-post-action,.vfa { min-width:42px; }
}

/* Dark theme consistency */
[data-theme="dark"] .bt-share-link textarea { background:#111827; color:#e5edf8; border-color:#293750; }
[data-theme="dark"] .bt-share-link__actions a { background:#111827; border-color:#293750; color:#7db5ff; }
[data-theme="dark"] .mk-card,[data-theme="dark"] .job-card,[data-theme="dark"] .listing-card { border-color:#26334a; }
.dm-form-inner > button { min-width:44px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
/* Dark mode hardening for pages that previously kept light inline/card styles */
[data-theme="dark"] :is(.card,.login-card,.auth-card,.qa-profile,.mk-card,.job-card,.listing-card,.table-card,.dm-conv-list,.dm-chat-area,.profile-card,.discover-card) {
  background:var(--card) !important; color:var(--text) !important; border-color:var(--border) !important;
}
[data-theme="dark"] :is(input,select,textarea) {
  background:var(--bg-dark) !important; color:var(--text) !important; border-color:var(--border-dark) !important;
}
[data-theme="dark"] :is(input,textarea)::placeholder { color:var(--muted) !important; opacity:1; }
[data-theme="dark"] table :is(th,td) { border-color:var(--border) !important; }
[data-theme="dark"] .mk-card,
[data-theme="dark"] .job-card,
[data-theme="dark"] .listing-card,
[data-theme="dark"] .table-card,
[data-theme="dark"] .dm-conv-list,
[data-theme="dark"] .dm-chat-area,
[data-theme="dark"] .login-card,
[data-theme="dark"] .auth-card {
  border:1px solid #273349 !important;
  background:#1B2438 !important;
  color:#F1F5F9 !important;
}
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  border:1px solid #334155 !important;
  background:#070B16 !important;
  color:#F1F5F9 !important;
}