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

/* ─── KaplanOS Tema Değişkenleri ─────────────────────────────────────────── */
:root {
  /* Koyu tema varsayılan */
  --bg-base: #0f0f10;
  --bg-sidebar: #1a1a1d;
  --bg-card: #242428;
  --bg-card-hover: #2e2e34;
  --bg-input: #1a1a1d;
  --border: #3a3a42;
  --border-hover: #52525c;
  --text-primary: #e8e8ec;
  --text-secondary: #c4c4cc;
  --text-muted: #8b8b98;
  --accent: #3b82f6;
  --accent-hover: #2563eb;
  --success: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
  --info: #06b6d4;
}

/* ─── Base Stiller ──────────────────────────────────────────────────────── */
* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--bg-base);
  color: var(--text-primary);
  font-family: var(--font-sans, system-ui, sans-serif);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ─── Scrollbar ──────────────────────────────────────────────────────────── */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: var(--bg-base);
}

::-webkit-scrollbar-thumb {
  background: var(--border-hover);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--text-muted);
}

/* ─── Utility Sınıfları ─────────────────────────────────────────────────── */
@layer components {
  /* Kartlar */
  .kaplan-card {
    @apply bg-surface-700 border border-surface-500 rounded-xl p-5
           transition-all duration-200;
  }

  .kaplan-card-hover {
    @apply kaplan-card hover:bg-surface-600 hover:border-surface-400 cursor-pointer;
  }

  /* Butonlar */
  .btn-primary {
    @apply inline-flex items-center gap-2 px-4 py-2
           bg-brand-600 hover:bg-brand-700 active:bg-brand-800
           text-white text-sm font-medium rounded-lg
           transition-all duration-150 disabled:opacity-50 disabled:cursor-not-allowed;
  }

  .btn-secondary {
    @apply inline-flex items-center gap-2 px-4 py-2
           bg-surface-600 hover:bg-surface-500 active:bg-surface-700
           text-surface-200 text-sm font-medium rounded-lg border border-surface-500
           transition-all duration-150 disabled:opacity-50;
  }

  .btn-danger {
    @apply inline-flex items-center gap-2 px-4 py-2
           bg-red-600/20 hover:bg-red-600/30
           text-red-400 text-sm font-medium rounded-lg border border-red-600/30
           transition-all duration-150;
  }

  .btn-ghost {
    @apply inline-flex items-center gap-2 px-3 py-1.5
           text-surface-400 hover:text-surface-200 hover:bg-surface-600
           text-sm rounded-lg transition-all duration-150;
  }

  /* Inputlar */
  .kaplan-input {
    @apply w-full px-3 py-2 bg-surface-800 border border-surface-500
           rounded-lg text-surface-200 text-sm placeholder:text-surface-400
           focus:outline-none focus:ring-1 focus:ring-brand-500 focus:border-brand-500
           transition-all duration-150;
  }

  .kaplan-select {
    @apply kaplan-input appearance-none cursor-pointer;
  }

  .kaplan-textarea {
    @apply kaplan-input resize-none;
  }

  /* Etiketler */
  .form-label {
    @apply block text-sm font-medium text-surface-300 mb-1.5;
  }

  /* Rozetler */
  .badge {
    @apply inline-flex items-center px-2 py-0.5 rounded-md text-xs font-medium;
  }

  .badge-blue   { @apply badge bg-blue-500/15 text-blue-400 border border-blue-500/20; }
  .badge-green  { @apply badge bg-green-500/15 text-green-400 border border-green-500/20; }
  .badge-amber  { @apply badge bg-amber-500/15 text-amber-400 border border-amber-500/20; }
  .badge-red    { @apply badge bg-red-500/15 text-red-400 border border-red-500/20; }
  .badge-purple { @apply badge bg-purple-500/15 text-purple-400 border border-purple-500/20; }
  .badge-gray   { @apply badge bg-surface-500/50 text-surface-300 border border-surface-500; }

  /* Öncelik rozetleri */
  .priority-dusuk   { @apply badge-green; }
  .priority-orta    { @apply badge-blue; }
  .priority-yuksek  { @apply badge-amber; }
  .priority-kritik  { @apply badge-red; }

  /* Durum rozetleri */
  .status-bekliyor      { @apply badge-gray; }
  .status-devam_ediyor  { @apply badge-blue; }
  .status-tamamlandi    { @apply badge-green; }
  .status-iptal         { @apply badge-red; }

  /* Sidebar nav item */
  .nav-item {
    @apply flex items-center gap-3 px-3 py-2.5 rounded-lg
           text-surface-400 hover:text-surface-200 hover:bg-surface-600
           transition-all duration-150 text-sm font-medium cursor-pointer;
  }

  .nav-item-active {
    @apply nav-item bg-brand-600/15 text-brand-400 border border-brand-600/20;
  }

  /* İstatistik kartı */
  .stat-card {
    @apply kaplan-card flex flex-col gap-2;
  }

  /* Tablo */
  .kaplan-table {
    @apply w-full text-sm;
  }

  .kaplan-table th {
    @apply px-4 py-3 text-left text-xs font-medium text-surface-400
           uppercase tracking-wider border-b border-surface-500;
  }

  .kaplan-table td {
    @apply px-4 py-3 border-b border-surface-600 text-surface-200;
  }

  .kaplan-table tr:hover td {
    @apply bg-surface-600/50;
  }

  /* Modal overlay */
  .modal-overlay {
    @apply fixed inset-0 bg-black/60 backdrop-blur-sm z-50
           flex items-center justify-center p-4;
  }

  .modal-box {
    @apply bg-surface-700 border border-surface-500 rounded-2xl
           shadow-2xl w-full max-w-lg animate-slide-up;
  }
}

/* ─── Tiptap Editor Stilleri ────────────────────────────────────────────── */
.ProseMirror {
  outline: none;
  color: var(--text-primary);
  line-height: 1.7;
}

.ProseMirror p.is-editor-empty:first-child::before {
  content: attr(data-placeholder);
  float: left;
  color: var(--text-muted);
  pointer-events: none;
  height: 0;
}

.ProseMirror h1 { @apply text-2xl font-semibold text-surface-100 mt-4 mb-2; }
.ProseMirror h2 { @apply text-xl font-semibold text-surface-100 mt-3 mb-2; }
.ProseMirror h3 { @apply text-lg font-medium text-surface-200 mt-3 mb-1; }
.ProseMirror ul { @apply list-disc pl-5 space-y-1; }
.ProseMirror ol { @apply list-decimal pl-5 space-y-1; }
.ProseMirror code { @apply bg-surface-600 text-brand-300 px-1.5 py-0.5 rounded text-sm font-mono; }
.ProseMirror blockquote { @apply border-l-4 border-brand-500 pl-4 text-surface-300 italic; }

/* ─── FullCalendar Özelleştirme ─────────────────────────────────────────── */
.fc {
  --fc-border-color: var(--border);
  --fc-button-bg-color: #242428;
  --fc-button-border-color: var(--border);
  --fc-button-hover-bg-color: var(--bg-card-hover);
  --fc-today-bg-color: rgba(59, 130, 246, 0.08);
  --fc-page-bg-color: transparent;
  --fc-neutral-bg-color: var(--bg-card);
  color: var(--text-primary);
}

.fc .fc-toolbar-title { color: var(--text-primary); font-size: 1.1rem; }
.fc .fc-col-header-cell-cushion { color: var(--text-muted); font-size: 0.75rem; }
.fc .fc-daygrid-day-number { color: var(--text-secondary); font-size: 0.8rem; }
.fc .fc-event { border-radius: 4px; font-size: 0.75rem; padding: 1px 4px; }