/* v9.0.2 */
/* search-layout-mobile-v8.5.11.css */
/* Trả thanh tìm kiếm về vị trí Đỉnh Màn Hình (Top) trên Mobile để tránh bàn phím che mất chữ trên Safari iOS */
@media (max-width: 768px) {
  .main-content {
      position: relative;
  }
  
  .top-bar {
      position: sticky;
      /* Ghim cố định lên trên cùng */
      top: 0 !important;
      bottom: auto !important;
      left: 0;
      right: 0;
      z-index: 998;
      border-bottom: 1px solid var(--border-color, #E3E8F3);
      border-top: none;
      box-shadow: 0 4px 12px rgba(0,0,0,0.05);
      background: var(--bg-white, #FFFFFF);
  }

  /* Bù khoảng cách padding để danh sách Content không bị kẹt */
  .content-area {
      padding-top: 10px; /* Top-bar is sticky, so natural flow */
      padding-bottom: calc(var(--mobile-navbar-height, 60px) + 20px); 
  }

  @supports (padding-bottom: env(safe-area-inset-bottom)) {
      .content-area {
          padding-bottom: calc(var(--mobile-navbar-height, 60px) + env(safe-area-inset-bottom) + 20px);
      }
  }

  /* Định dạng lại Cửa sổ Gợi ý (Suggestions) thả từ trên xuống */
  .search-suggestions {
      top: calc(100% + 4px) !important;
      bottom: auto !important;
      margin-top: 4px !important;
      margin-bottom: 0 !important;
      border-radius: 4px 4px 16px 16px !important;
      box-shadow: 0 8px 24px rgba(0,0,0,0.15) !important;
      transform-origin: top center !important;
  }
  
  @keyframes slideDownMobile {
      from { opacity: 0; transform: translateY(-8px); }
      to { opacity: 1; transform: translateY(0); }
  }
  .search-suggestions[style*="display: block"] {
      animation: slideDownMobile 0.2s ease-out !important;
  }
}