/*
  IMPORTANT: This application MUST be placed in the /ai folder.
  Server access URL will be ip/ai
  DO NOT change this path structure under any circumstances.
*/
/*
  Responsive Styles for Shared Components and Index Page Layout
*/

/* 响应式调整 */
@media (max-width: 1100px) { /* 中等屏幕/较小笔记本 */
  .card-grid {
    grid-template-columns: repeat(2, 1fr); /* 变为2列 */
    gap: var(--spacing-md);
  }
}

/* Rules specific to the index page initial view */
@media (max-width: 960px) {
  /* Add specific index page adjustments for this breakpoint if needed */
}

@media (max-width: 768px) {
  /* Base variable adjustments */
  :root {
    --spacing-lg: 16px;
    --spacing-xl: 24px;
    --spacing-2xl: 32px;
  }
  /* Layout adjustments */
  .app-header { height: 56px; padding: 0 var(--spacing-md); }
  .app-logo { width: 32px; height: 32px; }
  .app-title, .app-subtitle { font-size: 16px; }
  .title-divider { margin: 0 var(--spacing-sm); height: 16px; }
  .user-dropdown { padding: 6px 12px; font-size: 13px; }

  .main-wrapper { padding: var(--spacing-lg) var(--spacing-sm); }
  .main-content { gap: var(--spacing-lg); }

  /* Initial Content adjustments (index.html) */
  .chat-input-wrapper { /* Style for initial sticky state on index page */
    max-width: calc(100% - var(--spacing-md));
    bottom: var(--spacing-md);
  }
  .suggestion-bubbles { gap: var(--spacing-sm); }
  .welcome-title { font-size: 1.6rem; }
  .welcome-text { font-size: 1rem; }

  /* Card adjustments */
  .card-header { padding: var(--spacing-md); gap: var(--spacing-sm); }
  .card-icon { width: 36px; height: 36px; font-size: 18px; }
  .card-header h3 { font-size: 16px; }
  .card-body { padding: var(--spacing-md); }
  .card-header-link { padding: 4px 6px; }
  .card-header-link i { font-size: 13px; }
  .resources-grid { grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); gap: var(--spacing-sm); }

  /* Component adjustments (shared or index-specific) */
  .input-container { padding: var(--spacing-sm); padding-left: var(--spacing-md); }
  .send-button { width: 40px; height: 40px; min-width: 40px; }
  .send-button i { font-size: 16px; }
  .suggestion-bubble { padding: 6px var(--spacing-md); font-size: 12px; }
  .suggestion-bubble i { font-size: 12px; }
  .resource-item i { font-size: 20px; }
  .resource-item span { font-size: 11px; }

  /* Chat view specific adjustments were moved to chat_*.css */
}

@media (max-width: 600px) { /* 平板竖屏/大手机 */
  .card-grid {
    grid-template-columns: 1fr; /* 变为1列，垂直堆叠 */
    gap: var(--spacing-lg);
  }
   .card {
      min-height: auto; /* 移除单列时的最小高度限制 */
   }
   /* Further index-specific adjustments for this size */
}

@media (max-width: 480px) {
  /* Layout adjustments */
  .app-header { padding: 0 var(--spacing-sm); }
  .app-title { display: none; }
  .title-divider { display: none; }
  .app-subtitle { font-size: 15px; margin-left: var(--spacing-xs); }
  .user-dropdown span { display: none; }
  .user-dropdown { padding: var(--spacing-sm); }
  .dropdown-arrow { margin-left: 0; }

  /* Card adjustments (index page) */
  .card-grid { gap: var(--spacing-md); } /* 调整单列时间距 */
  /* Further index-specific adjustments for small screens */
}