@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  body {
    @apply antialiased text-gray-800 bg-gray-50;
    font-feature-settings: "cv11", "ss01";
  }
}

/* 移动端适配优化 */
@media (max-width: 768px) {
  .ant-card {
    /* 移除强制 margin，交给布局控制 */
  }
  
  .ant-form-item-label {
    padding-bottom: 4px;
  }
  
  .ant-table {
    font-size: 13px; /* 稍微调大一点，提升可读性 */
  }
}

/* 自定义滚动条 - 更加隐形优雅 */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: #d1d5db;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: #9ca3af;
}

/* 动画效果 */
.fade-in {
  animation: fadeIn 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* 响应式布局容器 */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px; /* 增加两边留白 */
}

@media (max-width: 768px) {
  .container {
    padding: 0px;
  }
}

/* User selection scrollable area */
.user-select-scrollable .ant-select-selector {
  max-height: 120px;
  overflow-y: auto !important;
}

/* Brand Utilities */
.text-mars {
  color: #008C8C;
}
.bg-mars {
  background-color: #008C8C;
}

.qt-text-import-th-content,
.qt-text-import-td-content {
  width: 850px !important;
  min-width: 850px !important;
  max-width: 850px !important;
}

.qt-text-import-th-analysis,
.qt-text-import-td-analysis {
  width: 320px !important;
  min-width: 320px !important;
  max-width: 320px !important;
}

@media (max-width: 1200px) {
  .qt-text-import-th-content,
  .qt-text-import-td-content {
    width: 600px !important;
    min-width: 600px !important;
    max-width: 600px !important;
  }

  .qt-text-import-th-analysis,
  .qt-text-import-td-analysis {
    width: 260px !important;
    min-width: 260px !important;
    max-width: 260px !important;
  }
}

@media (max-width: 768px) {
  .qt-text-import-th-content,
  .qt-text-import-td-content {
    width: 360px !important;
    min-width: 360px !important;
    max-width: 360px !important;
  }

  .qt-text-import-th-analysis,
  .qt-text-import-td-analysis {
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
  }
}

@media (max-width: 480px) {
  .qt-text-import-th-content,
  .qt-text-import-td-content {
    width: 260px !important;
    min-width: 260px !important;
    max-width: 260px !important;
  }

  .qt-text-import-th-analysis,
  .qt-text-import-td-analysis {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
  }
}

.qc-question-count-td {
  text-align: center !important;
  vertical-align: middle;
  padding: 8px 12px !important;
}

.qc-question-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 90px;
  margin: 0 auto;
  text-align: center;
}
