/* ── Responsive overrides — IT-BG.org redesign ── */

@media (max-width: 900px) {
  /* Topbar: collapse login form, show only buttons */
  .login-form .tf { display: none; }
  .topbar-search input { width: 100%; }
}

@media (max-width: 768px) {
  /* Topbar main row */
  .topbar-main {
    padding: 10px 14px;
    gap: 12px;
  }
  .topbar-search { display: none; } /* hidden on mobile — use nav-search */
  .nav-search { display: flex; }    /* show compact search in nav row on mobile */

  /* Nav row becomes scrollable */
  .topbar-nav {
    padding: 0 4px;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .topbar-nav::-webkit-scrollbar { display: none; }

  .site-nav a {
    padding: 0 10px;
    font-size: 13px;
    white-space: nowrap;
  }
  .subnav-links { display: none; }

  /* Nav search on mobile */
  .nav-search input { width: 130px; }

  /* Partner bar + subnav bar */
  .partner-bar { display: none; }
  .subnav-bar  { display: none; }

  /* Main content */
  .site-main { padding: 12px 14px 32px; }

  /* Two-column → single column */
  .left-page {
    float: none;
    width: 100%;
    padding-right: 0;
  }
  .side-right {
    float: none;
    width: 100%;
    margin-top: 20px;
  }

  /* News list */
  .news a { height: auto; min-height: 38px; }
  .news .t1 { width: 70px; font-size: 9.5px; }
  .news .t3, .news .t4, .news .t5, .news .t6, .news .t7 { display: none; }

  /* Video cards — one per row on mobile */
  .video-item { float: none; width: 100%; padding: 0 0 12px; }
  .videowrapper { width: 100% !important; }

  /* Section / sidebar blocks */
  .section-block { border-radius: 8px; }
  .sidebar-block  { border-radius: 8px; }
  .top-clip-item  { display: block; width: 100%; padding: 4px 0; }
  .widget-table th,
  .widget-table td { font-size: 11px; padding: 3px 4px; }

  /* Clips listing — 2 per row on tablet */
  .vlisting .video-item { width: 50%; }
  .video-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 10px; }

  /* Comment form */
  .cf-row { flex-direction: column; }
  .cf-captcha { align-self: flex-start; }

  /* News meta */
  .news-meta { gap: 8px; }
  .news-readmore { margin-left: 0; }

  /* Video player */
  .video-player-wrap { padding: 6px; }

  /* Auth */
  .login-form { display: none; }
  .auth-user  { display: none; }

  /* Misc */
  .w602   { width: 100%; display: block; }
  .gore   { font-size: 11px; }
  .site-footer { padding: 16px 14px; }
}

@media (max-width: 480px) {
  .logo-text { font-size: 16px; }
  .site-nav a { padding: 0 8px; font-size: 12px; }

  /* Clips listing — 1 per row on small phones */
  .vlisting .video-item { width: 100%; }
  .video-grid { grid-template-columns: 1fr; gap: 8px; padding: 8px; }
}

/* ── Session 5D responsive additions ── */

@media (max-width: 768px) {
  /* Fun page carousel */
  .fun-nav { gap: 4px; }
  .fun-head-row { flex-direction: column; align-items: flex-start; gap: 6px; }

  /* Top list */
  .top-list-item { gap: 8px; }
  .top-pos { width: 22px; font-size: 15px; }
  .top-thumb img { width: 60px; height: 45px; }

  /* Forms */
  .tf-layout { flex-direction: column; }
  .tf-controls-col { width: 100%; }
  .site-form { max-width: 100%; }
  .sf-captcha-row { flex-wrap: wrap; }

  /* Translation result */
  .translation-result { font-size: 12px; }

  /* Game cats */
  .game-cats { gap: 4px; }
  .game-cat-link { font-size: 11px; padding: 3px 8px; }

  /* Game player */
  .game-player-wrap object,
  .game-player-wrap embed { max-width: 100%; height: auto; }
}
