src/assets/css/downloads/installConfig.css
.install-container {
  @apply flex gap-3 mb-5 p-4 bg-base-100 rounded-lg border border-base-300 shadow-sm;
}

.install-container .select {
  @apply flex-grow;
}

.error-message {
  @apply text-error text-sm mt-1.5;
}

.repo-info {
  @apply text-xs text-base-content/60 mt-1.5;
}

.repo-info a {
  @apply text-primary no-underline;
}

.repo-info a:hover {
  @apply underline;
}

/* Bot配置样式 */
.bot-config {
  @apply mt-6 bg-base-200 p-6 rounded-lg border border-base-300 shadow-lg;
}

/* 实例名称输入样式 */
.instance-name-input {
  @apply mb-6 animate-fadeSlideDown;
}

@keyframes fadeSlideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 添加到Tailwind配置的动画 */
@layer utilities {
  .animate-fadeSlideDown {
    /* 删除页面动画 */
  }
}

.config-options {
  @apply grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-6 mb-6;
}

.option-item {
  @apply flex-1 bg-base-100 p-4 rounded-lg border border-base-300 transition-all duration-150 mb-3 hover:shadow-lg hover:scale-105;
}

.option-title {
  @apply font-medium text-base;
}

.option-desc {
  @apply text-sm text-base-content/70 mt-1;
}

/* 填加动画 */
.config-fade-enter-active,
.config-fade-leave-active {
  @apply transition-all duration-200 ease-in-out max-h-[2000px] opacity-100 overflow-hidden;
}

.config-fade-enter-from,
.config-fade-leave-to {
  @apply max-h-0 opacity-0 overflow-hidden my-0 py-0;
}

.qq-input {
  @apply mb-6;
}

.input-tip {
  @apply text-sm text-base-content/70 mt-2 mb-0;
}

.ports-config {
  @apply mt-6;
}

.ports-grid {
  @apply grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-5 mb-5;
}

.port-item {
  @apply flex-1 mb-3;
}

.port-desc {
  @apply text-sm text-base-content/70 mt-1 mb-2;
}

.install-tips {
  @apply mt-4;
}

.progress-container {
  @apply my-5;
}

.log-output {
  @apply my-5 bg-base-100 p-4 rounded-lg border border-base-300 shadow-sm;
}

.log-header {
  @apply flex items-center justify-between mb-3;
}

.log-controls {
  @apply flex gap-2;
}

.log-content {
  @apply max-h-[600px] overflow-y-auto border border-base-300 rounded-md p-5 bg-base-200 font-mono text-base shadow-inner;
  overflow-x: hidden; /* 移除横向滚动条 */
  word-wrap: break-word; /* 长文本自动换行 */

  /* 日志内容字体优化 */
  font-family: "Fira Code", "SF Mono", Monaco, "Cascadia Code", "Roboto Mono",
    Consolas, "Courier New", monospace;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.log-line {
  @apply mb-2 leading-relaxed;
  word-break: break-all; /* 强制换行避免横向滚动 */
  white-space: pre-wrap; /* 保持格式并换行 */

  /* 日志行字体优化 */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.log-time {
  @apply text-base-content/50 mr-2;
}

.log-line.error {
  @apply text-error;
}

.log-line.warning {
  @apply text-warning;
}

.log-line.success {
  @apply text-success;
}

/* 添加输入组样式优化 */
.input-group {
  @apply flex flex-col gap-2;
}

.input-group span {
  @apply font-medium text-base text-base-content;
}

/* 添加响应式优化 */
@media (max-width: 768px) {
  .config-options {
    @apply grid-cols-1 gap-4;
  }

  .ports-grid {
    @apply grid-cols-1 gap-4;
  }

  .install-container {
    @apply flex-col gap-3;
  }

  .bot-config {
    @apply p-4;
  }

  .option-item {
    @apply p-3;
  }

  .log-content {
    @apply text-sm p-3;
  }
}

/* 大屏幕优化 */
@media (min-width: 1200px) {
  .config-options {
    @apply grid-cols-3 gap-8;
  }

  .ports-grid {
    @apply grid-cols-3 gap-6;
  }

  .bot-config {
    @apply p-8;
  }

  .log-content {
    @apply max-h-[700px] text-lg p-6;
  }

  .option-item {
    @apply p-5;
  }

  .install-container {
    @apply p-5;
  }
}

/* Iconify图标样式 */
.iconify {
  @apply inline-flex align-middle;
}

/* 图标按钮 */
.icon-btn {
  @apply btn btn-sm btn-ghost p-1;
}

.icon-btn .iconify {
  @apply text-lg;
}

/* 深色模式下自动处理 - DaisyUI主题系统会自动适配 */

/* 图标按钮 */
.icon-btn {
  @apply btn btn-sm btn-ghost p-1;
}

.icon-btn .iconify {
  @apply text-lg;
}

/* 深色模式下自动处理 - DaisyUI主题系统会自动适配 */
