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

@layer base {
  html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  body {
    @apply bg-gray-50 text-gray-900;
  }
}

@layer components {
  .btn-primary {
    @apply px-4 py-2 bg-primary-500 text-white rounded-lg font-medium
           hover:bg-primary-600 active:bg-primary-700
           transition-colors duration-200;
  }

  .btn-secondary {
    @apply px-4 py-2 bg-gray-100 text-gray-900 rounded-lg font-medium
           hover:bg-gray-200 active:bg-gray-300
           transition-colors duration-200;
  }

  .card {
    @apply bg-white rounded-xl shadow-card p-4
           hover:shadow-card-hover transition-shadow duration-200;
  }

  .input {
    @apply w-full px-3 py-2 border border-gray-200 rounded-lg
           focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent
           placeholder:text-gray-400;
  }
}

/* 固定日期选择器高度为6行 */
.mantine-DatePickerInput-calendar,
.mantine-DatePicker-calendar {
  min-height: 264px !important;
}

.mantine-DatePickerInput-calendarBody,
.mantine-DatePicker-calendarBody {
  min-height: 220px;
}

.mantine-DatePickerInput-weekdayRow,
.mantine-DatePicker-weekdayRow {
  font-size: 12px;
}

.mantine-DatePickerInput-day,
.mantine-DatePicker-day {
  width: 32px !important;
  height: 32px !important;
  font-size: 13px;
}

/* 确保日历主体高度固定 */
.mantine-DatePickerInput-calendarHeader,
.mantine-DatePicker-calendarHeader {
  min-height: 36px;
}

/* 便签 Markdown 预览样式 */
.markdown-preview h1 {
  font-size: 1.5em;
  font-weight: 600;
  margin: 0.5em 0;
  color: #1a1a1a;
  border-bottom: 1px solid #eee;
  padding-bottom: 0.3em;
}

.markdown-preview h2 {
  font-size: 1.3em;
  font-weight: 600;
  margin: 0.5em 0;
  color: #1a1a1a;
  border-bottom: 1px solid #eee;
  padding-bottom: 0.3em;
}

.markdown-preview h3 {
  font-size: 1.1em;
  font-weight: 600;
  margin: 0.5em 0;
  color: #333;
}

.markdown-preview h4, .markdown-preview h5, .markdown-preview h6 {
  font-size: 1em;
  font-weight: 600;
  margin: 0.5em 0;
  color: #333;
}

.markdown-preview strong {
  font-weight: 700;
}

.markdown-preview em {
  font-style: italic;
}

.markdown-preview del {
  text-decoration: line-through;
  color: #888;
}

.markdown-preview a {
  color: #0066cc;
  text-decoration: none;
}

.markdown-preview a:hover {
  text-decoration: underline;
}

.markdown-preview ul, .markdown-preview ol {
  margin: 0.5em 0;
  padding-left: 1.5em;
}

.markdown-preview li {
  margin: 0.3em 0;
  line-height: 1.6;
}

.markdown-preview ul li {
  list-style-type: disc;
}

.markdown-preview ol li {
  list-style-type: decimal;
}

.markdown-preview blockquote {
  margin: 0.5em 0;
  padding: 0.5em 1em;
  border-left: 3px solid #ddd;
  background: #f9f9f9;
  color: #666;
}

.markdown-preview pre {
  background: #f5f5f5;
  padding: 0.8em;
  border-radius: 4px;
  overflow-x: auto;
  margin: 0.5em 0;
}

.markdown-preview code {
  background: #f5f5f5;
  padding: 0.2em 0.4em;
  border-radius: 3px;
  font-family: Monaco, Menlo, monospace;
  font-size: 0.9em;
}

.markdown-preview pre code {
  background: none;
  padding: 0;
}

.markdown-preview hr {
  border: none;
  border-top: 1px solid #ddd;
  margin: 1em 0;
}