/* =========================================================
   ARFA ERP - TEMA KOLEKSIYONU v1.0
   Her tema :root uzerine data-theme="..." ile uygulanir.
   Varsayilan (data-theme yoksa veya "acik"): Acik Tema
   ========================================================= */

/* ── 1. ACIK TEMA (Varsayilan) ─────────────────────────── */
/* arfa-theme.css icindeki :root zaten bu degerleri tanimladi */

/* ── 2. KOYU LACIVERT TEMA ─────────────────────────────── */
[data-theme="lacivert"] {
  --t-primary:        #4f8ef7;
  --t-primary-dark:   #2563eb;
  --t-primary-light:  #7aabff;
  --t-accent:         #6c8fff;
  --t-accent-light:   #93b4ff;
  --t-success:        #22c55e;
  --t-success-bg:     rgba(34,197,94,.15);
  --t-danger:         #f87171;
  --t-danger-bg:      rgba(248,113,113,.15);
  --t-warning:        #fbbf24;
  --t-warning-bg:     rgba(251,191,36,.15);
  --t-info:           #38bdf8;
  --t-info-bg:        rgba(56,189,248,.15);

  --t-bg:             #0b1628;
  --t-surface:        #0f1f38;
  --t-surface-2:      #132540;
  --t-border:         #1e3358;
  --t-border-light:   #1a2d4e;
  --t-text:           #e2eaf8;
  --t-text-2:         #b8cce8;
  --t-text-muted:     #7a9cc8;
  --t-text-light:     #4a6a98;

  --t-sidebar-bg:     #071225;
  --t-sidebar-border: #0f1f38;
  --t-sidebar-text:   #8aafd8;
  --t-sidebar-active-bg: rgba(79,142,247,.18);
  --t-sidebar-active:    #4f8ef7;
  --t-sidebar-hover-bg:  rgba(79,142,247,.10);
  --t-sidebar-section:   #3a5a88;

  --t-topbar-bg:      #0f1f38;
  --t-topbar-border:  #1e3358;
  --t-topbar-shadow:  0 1px 0 #1e3358, 0 4px 16px rgba(0,0,0,.3);

  --t-shadow-xs:  0 1px 2px rgba(0,0,0,.3);
  --t-shadow-sm:  0 2px 8px rgba(0,0,0,.35), 0 1px 3px rgba(0,0,0,.2);
  --t-shadow-md:  0 8px 24px rgba(0,0,0,.4), 0 2px 8px rgba(0,0,0,.25);
  --t-shadow-lg:  0 16px 48px rgba(0,0,0,.5), 0 4px 16px rgba(0,0,0,.3);
  --t-shadow-xl:  0 32px 80px rgba(0,0,0,.6), 0 8px 24px rgba(0,0,0,.35);
}

/* Koyu tema ek overrides */
[data-theme="lacivert"] body {
  background: var(--t-bg) !important;
  color: var(--t-text) !important;
}
[data-theme="lacivert"] .card,
[data-theme="lacivert"] .panel,
[data-theme="lacivert"] .modal-box {
  background: var(--t-surface) !important;
  border-color: var(--t-border) !important;
  color: var(--t-text) !important;
}
[data-theme="lacivert"] .topbar {
  background: var(--t-topbar-bg) !important;
  border-color: var(--t-topbar-border) !important;
}
[data-theme="lacivert"] .sidebar {
  background: var(--t-sidebar-bg) !important;
  border-color: var(--t-sidebar-border) !important;
}
[data-theme="lacivert"] .sidebar a,
[data-theme="lacivert"] .sidebar .nav-link {
  color: var(--t-sidebar-text) !important;
}
[data-theme="lacivert"] .sidebar a:hover,
[data-theme="lacivert"] .sidebar .nav-link:hover {
  background: var(--t-sidebar-hover-bg) !important;
  color: var(--t-primary) !important;
}
[data-theme="lacivert"] .sidebar a.active,
[data-theme="lacivert"] .sidebar .nav-link.active {
  background: var(--t-sidebar-active-bg) !important;
  color: var(--t-sidebar-active) !important;
}
[data-theme="lacivert"] table thead th {
  background: var(--t-surface-2) !important;
  color: var(--t-text-muted) !important;
  border-color: var(--t-border) !important;
}
[data-theme="lacivert"] table tbody tr:hover td {
  background: rgba(79,142,247,.07) !important;
}
[data-theme="lacivert"] table td, [data-theme="lacivert"] table th {
  border-color: var(--t-border) !important;
  color: var(--t-text) !important;
}
[data-theme="lacivert"] input, [data-theme="lacivert"] select, [data-theme="lacivert"] textarea {
  background: var(--t-surface-2) !important;
  border-color: var(--t-border) !important;
  color: var(--t-text) !important;
}
[data-theme="lacivert"] input::placeholder, [data-theme="lacivert"] textarea::placeholder {
  color: var(--t-text-light) !important;
}
[data-theme="lacivert"] .page-head {
  background: linear-gradient(135deg, #0f1f38 0%, #071225 100%) !important;
  border-color: var(--t-border) !important;
}
[data-theme="lacivert"] .page-head h1 { color: #e2eaf8 !important; }
[data-theme="lacivert"] .page-head p  { color: #7a9cc8 !important; }
[data-theme="lacivert"] .btn-soft {
  background: var(--t-surface-2) !important;
  border-color: var(--t-border) !important;
  color: var(--t-text-2) !important;
}
[data-theme="lacivert"] .btn-soft:hover {
  background: rgba(79,142,247,.12) !important;
  border-color: var(--t-primary) !important;
  color: var(--t-primary) !important;
}
[data-theme="lacivert"] h3, [data-theme="lacivert"] h2, [data-theme="lacivert"] h1 {
  color: var(--t-text) !important;
}
[data-theme="lacivert"] .kpi-banner {
  background: linear-gradient(135deg, #071225 0%, #0f1f38 100%) !important;
}
[data-theme="lacivert"] .kpi-card {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(255,255,255,.08) !important;
}
[data-theme="lacivert"] .kpi-card .kpi-val { color: #e2eaf8 !important; }
[data-theme="lacivert"] .kpi-card .kpi-lbl { color: #7a9cc8 !important; }

/* ── 3. MOR KURUMSAL TEMA ──────────────────────────────── */
[data-theme="mor"] {
  --t-primary:        #7c3aed;
  --t-primary-dark:   #5b21b6;
  --t-primary-light:  #a78bfa;
  --t-accent:         #8b5cf6;
  --t-accent-light:   #c4b5fd;
  --t-success:        #059669;
  --t-success-bg:     #ecfdf5;
  --t-danger:         #dc2626;
  --t-danger-bg:      #fef2f2;
  --t-warning:        #d97706;
  --t-warning-bg:     #fffbeb;
  --t-info:           #0284c7;
  --t-info-bg:        #f0f9ff;

  --t-bg:             #f5f3ff;
  --t-surface:        #ffffff;
  --t-surface-2:      #faf8ff;
  --t-border:         #ddd6fe;
  --t-border-light:   #ede9fe;
  --t-text:           #1e1b4b;
  --t-text-2:         #3730a3;
  --t-text-muted:     #6d28d9;
  --t-text-light:     #a78bfa;

  --t-sidebar-bg:     #1e1b4b;
  --t-sidebar-border: #2d2a6e;
  --t-sidebar-text:   #c4b5fd;
  --t-sidebar-active-bg: rgba(167,139,250,.25);
  --t-sidebar-active:    #a78bfa;
  --t-sidebar-hover-bg:  rgba(167,139,250,.12);
  --t-sidebar-section:   #6d28d9;

  --t-topbar-bg:      #ffffff;
  --t-topbar-border:  #ddd6fe;
  --t-topbar-shadow:  0 1px 0 #ddd6fe, 0 4px 16px rgba(109,40,217,.08);

  --t-shadow-xs:  0 1px 2px rgba(109,40,217,.08);
  --t-shadow-sm:  0 2px 8px rgba(109,40,217,.10), 0 1px 3px rgba(109,40,217,.06);
  --t-shadow-md:  0 8px 24px rgba(109,40,217,.12), 0 2px 8px rgba(109,40,217,.08);
  --t-shadow-lg:  0 16px 48px rgba(109,40,217,.16), 0 4px 16px rgba(109,40,217,.10);
  --t-shadow-xl:  0 32px 80px rgba(109,40,217,.20), 0 8px 24px rgba(109,40,217,.12);
}

[data-theme="mor"] body { background: var(--t-bg) !important; color: var(--t-text) !important; }
[data-theme="mor"] .sidebar { background: var(--t-sidebar-bg) !important; border-color: var(--t-sidebar-border) !important; }
[data-theme="mor"] .sidebar a, [data-theme="mor"] .sidebar .nav-link { color: var(--t-sidebar-text) !important; }
[data-theme="mor"] .sidebar a:hover, [data-theme="mor"] .sidebar .nav-link:hover { background: var(--t-sidebar-hover-bg) !important; color: var(--t-primary-light) !important; }
[data-theme="mor"] .sidebar a.active, [data-theme="mor"] .sidebar .nav-link.active { background: var(--t-sidebar-active-bg) !important; color: var(--t-sidebar-active) !important; }
[data-theme="mor"] .topbar { background: var(--t-topbar-bg) !important; border-color: var(--t-topbar-border) !important; }
[data-theme="mor"] .card, [data-theme="mor"] .panel { background: var(--t-surface) !important; border-color: var(--t-border) !important; }
[data-theme="mor"] .page-head { background: linear-gradient(135deg, #1e1b4b 0%, #2d2a6e 100%) !important; border-color: var(--t-border) !important; }
[data-theme="mor"] .page-head h1 { color: #f5f3ff !important; }
[data-theme="mor"] .page-head p  { color: #c4b5fd !important; }
[data-theme="mor"] .btn { background: var(--t-primary) !important; border-color: var(--t-primary-dark) !important; }
[data-theme="mor"] .btn:hover { background: var(--t-primary-dark) !important; }
[data-theme="mor"] .kpi-banner { background: linear-gradient(135deg, #1e1b4b 0%, #2d2a6e 100%) !important; }
[data-theme="mor"] .kpi-card { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.12) !important; }
[data-theme="mor"] .kpi-card .kpi-val { color: #f5f3ff !important; }
[data-theme="mor"] .kpi-card .kpi-lbl { color: #c4b5fd !important; }
[data-theme="mor"] table thead th { background: #faf8ff !important; color: #6d28d9 !important; border-color: var(--t-border) !important; }
[data-theme="mor"] table tbody tr:hover td { background: rgba(124,58,237,.05) !important; }
[data-theme="mor"] input, [data-theme="mor"] select, [data-theme="mor"] textarea { border-color: var(--t-border) !important; }
[data-theme="mor"] input:focus, [data-theme="mor"] select:focus, [data-theme="mor"] textarea:focus { border-color: var(--t-primary) !important; box-shadow: 0 0 0 3px rgba(124,58,237,.15) !important; }

/* ── 4. YESIL KURUMSAL TEMA ────────────────────────────── */
[data-theme="yesil"] {
  --t-primary:        #059669;
  --t-primary-dark:   #047857;
  --t-primary-light:  #34d399;
  --t-accent:         #10b981;
  --t-accent-light:   #6ee7b7;
  --t-success:        #059669;
  --t-success-bg:     #ecfdf5;
  --t-danger:         #dc2626;
  --t-danger-bg:      #fef2f2;
  --t-warning:        #d97706;
  --t-warning-bg:     #fffbeb;
  --t-info:           #0284c7;
  --t-info-bg:        #f0f9ff;

  --t-bg:             #f0fdf8;
  --t-surface:        #ffffff;
  --t-surface-2:      #f6fefb;
  --t-border:         #a7f3d0;
  --t-border-light:   #d1fae5;
  --t-text:           #064e3b;
  --t-text-2:         #065f46;
  --t-text-muted:     #047857;
  --t-text-light:     #6ee7b7;

  --t-sidebar-bg:     #064e3b;
  --t-sidebar-border: #065f46;
  --t-sidebar-text:   #a7f3d0;
  --t-sidebar-active-bg: rgba(52,211,153,.20);
  --t-sidebar-active:    #34d399;
  --t-sidebar-hover-bg:  rgba(52,211,153,.10);
  --t-sidebar-section:   #047857;

  --t-topbar-bg:      #ffffff;
  --t-topbar-border:  #a7f3d0;
  --t-topbar-shadow:  0 1px 0 #a7f3d0, 0 4px 16px rgba(5,150,105,.08);

  --t-shadow-xs:  0 1px 2px rgba(5,150,105,.08);
  --t-shadow-sm:  0 2px 8px rgba(5,150,105,.10), 0 1px 3px rgba(5,150,105,.06);
  --t-shadow-md:  0 8px 24px rgba(5,150,105,.12), 0 2px 8px rgba(5,150,105,.08);
  --t-shadow-lg:  0 16px 48px rgba(5,150,105,.16), 0 4px 16px rgba(5,150,105,.10);
  --t-shadow-xl:  0 32px 80px rgba(5,150,105,.20), 0 8px 24px rgba(5,150,105,.12);
}

[data-theme="yesil"] body { background: var(--t-bg) !important; color: var(--t-text) !important; }
[data-theme="yesil"] .sidebar { background: var(--t-sidebar-bg) !important; border-color: var(--t-sidebar-border) !important; }
[data-theme="yesil"] .sidebar a, [data-theme="yesil"] .sidebar .nav-link { color: var(--t-sidebar-text) !important; }
[data-theme="yesil"] .sidebar a:hover, [data-theme="yesil"] .sidebar .nav-link:hover { background: var(--t-sidebar-hover-bg) !important; color: var(--t-primary-light) !important; }
[data-theme="yesil"] .sidebar a.active, [data-theme="yesil"] .sidebar .nav-link.active { background: var(--t-sidebar-active-bg) !important; color: var(--t-sidebar-active) !important; }
[data-theme="yesil"] .topbar { background: var(--t-topbar-bg) !important; border-color: var(--t-topbar-border) !important; }
[data-theme="yesil"] .card, [data-theme="yesil"] .panel { background: var(--t-surface) !important; border-color: var(--t-border) !important; }
[data-theme="yesil"] .page-head { background: linear-gradient(135deg, #064e3b 0%, #065f46 100%) !important; border-color: var(--t-border) !important; }
[data-theme="yesil"] .page-head h1 { color: #ecfdf5 !important; }
[data-theme="yesil"] .page-head p  { color: #a7f3d0 !important; }
[data-theme="yesil"] .btn { background: var(--t-primary) !important; border-color: var(--t-primary-dark) !important; }
[data-theme="yesil"] .btn:hover { background: var(--t-primary-dark) !important; }
[data-theme="yesil"] .kpi-banner { background: linear-gradient(135deg, #064e3b 0%, #065f46 100%) !important; }
[data-theme="yesil"] .kpi-card { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.12) !important; }
[data-theme="yesil"] .kpi-card .kpi-val { color: #ecfdf5 !important; }
[data-theme="yesil"] .kpi-card .kpi-lbl { color: #a7f3d0 !important; }
[data-theme="yesil"] table thead th { background: #f6fefb !important; color: #047857 !important; border-color: var(--t-border) !important; }
[data-theme="yesil"] table tbody tr:hover td { background: rgba(5,150,105,.05) !important; }
[data-theme="yesil"] input:focus, [data-theme="yesil"] select:focus, [data-theme="yesil"] textarea:focus { border-color: var(--t-primary) !important; box-shadow: 0 0 0 3px rgba(5,150,105,.15) !important; }

/* ── 5. KIRMIZI KURUMSAL TEMA ──────────────────────────── */
[data-theme="kirmizi"] {
  --t-primary:        #dc2626;
  --t-primary-dark:   #b91c1c;
  --t-primary-light:  #f87171;
  --t-accent:         #ef4444;
  --t-accent-light:   #fca5a5;
  --t-success:        #059669;
  --t-success-bg:     #ecfdf5;
  --t-danger:         #dc2626;
  --t-danger-bg:      #fef2f2;
  --t-warning:        #d97706;
  --t-warning-bg:     #fffbeb;
  --t-info:           #0284c7;
  --t-info-bg:        #f0f9ff;

  --t-bg:             #fff5f5;
  --t-surface:        #ffffff;
  --t-surface-2:      #fff8f8;
  --t-border:         #fecaca;
  --t-border-light:   #fee2e2;
  --t-text:           #450a0a;
  --t-text-2:         #7f1d1d;
  --t-text-muted:     #b91c1c;
  --t-text-light:     #fca5a5;

  --t-sidebar-bg:     #450a0a;
  --t-sidebar-border: #7f1d1d;
  --t-sidebar-text:   #fca5a5;
  --t-sidebar-active-bg: rgba(248,113,113,.20);
  --t-sidebar-active:    #f87171;
  --t-sidebar-hover-bg:  rgba(248,113,113,.10);
  --t-sidebar-section:   #b91c1c;

  --t-topbar-bg:      #ffffff;
  --t-topbar-border:  #fecaca;
  --t-topbar-shadow:  0 1px 0 #fecaca, 0 4px 16px rgba(220,38,38,.08);

  --t-shadow-xs:  0 1px 2px rgba(220,38,38,.08);
  --t-shadow-sm:  0 2px 8px rgba(220,38,38,.10), 0 1px 3px rgba(220,38,38,.06);
  --t-shadow-md:  0 8px 24px rgba(220,38,38,.12), 0 2px 8px rgba(220,38,38,.08);
  --t-shadow-lg:  0 16px 48px rgba(220,38,38,.16), 0 4px 16px rgba(220,38,38,.10);
  --t-shadow-xl:  0 32px 80px rgba(220,38,38,.20), 0 8px 24px rgba(220,38,38,.12);
}

[data-theme="kirmizi"] body { background: var(--t-bg) !important; color: var(--t-text) !important; }
[data-theme="kirmizi"] .sidebar { background: var(--t-sidebar-bg) !important; border-color: var(--t-sidebar-border) !important; }
[data-theme="kirmizi"] .sidebar a, [data-theme="kirmizi"] .sidebar .nav-link { color: var(--t-sidebar-text) !important; }
[data-theme="kirmizi"] .sidebar a:hover, [data-theme="kirmizi"] .sidebar .nav-link:hover { background: var(--t-sidebar-hover-bg) !important; color: var(--t-primary-light) !important; }
[data-theme="kirmizi"] .sidebar a.active, [data-theme="kirmizi"] .sidebar .nav-link.active { background: var(--t-sidebar-active-bg) !important; color: var(--t-sidebar-active) !important; }
[data-theme="kirmizi"] .topbar { background: var(--t-topbar-bg) !important; border-color: var(--t-topbar-border) !important; }
[data-theme="kirmizi"] .card, [data-theme="kirmizi"] .panel { background: var(--t-surface) !important; border-color: var(--t-border) !important; }
[data-theme="kirmizi"] .page-head { background: linear-gradient(135deg, #450a0a 0%, #7f1d1d 100%) !important; border-color: var(--t-border) !important; }
[data-theme="kirmizi"] .page-head h1 { color: #fff5f5 !important; }
[data-theme="kirmizi"] .page-head p  { color: #fca5a5 !important; }
[data-theme="kirmizi"] .btn { background: var(--t-primary) !important; border-color: var(--t-primary-dark) !important; }
[data-theme="kirmizi"] .btn:hover { background: var(--t-primary-dark) !important; }
[data-theme="kirmizi"] .kpi-banner { background: linear-gradient(135deg, #450a0a 0%, #7f1d1d 100%) !important; }
[data-theme="kirmizi"] .kpi-card { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.12) !important; }
[data-theme="kirmizi"] .kpi-card .kpi-val { color: #fff5f5 !important; }
[data-theme="kirmizi"] .kpi-card .kpi-lbl { color: #fca5a5 !important; }
[data-theme="kirmizi"] table thead th { background: #fff8f8 !important; color: #b91c1c !important; border-color: var(--t-border) !important; }
[data-theme="kirmizi"] table tbody tr:hover td { background: rgba(220,38,38,.05) !important; }
[data-theme="kirmizi"] input:focus, [data-theme="kirmizi"] select:focus, [data-theme="kirmizi"] textarea:focus { border-color: var(--t-primary) !important; box-shadow: 0 0 0 3px rgba(220,38,38,.15) !important; }

/* ── Tema Secim Karti Stilleri ─────────────────────────── */
.tema-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 16px;
  margin-top: 8px;
}

.tema-kart {
  border: 2px solid transparent;
  border-radius: 14px;
  overflow: hidden;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  position: relative;
}

.tema-kart:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,.14);
}

.tema-kart.aktif {
  border-color: var(--t-primary, #2f55e7);
  box-shadow: 0 0 0 4px rgba(47,85,231,.18), 0 8px 24px rgba(0,0,0,.12);
}

.tema-kart.aktif::after {
  content: '✓';
  position: absolute;
  top: 8px;
  right: 8px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--t-primary, #2f55e7);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 22px;
  text-align: center;
}

.tema-onizleme {
  height: 90px;
  display: flex;
  overflow: hidden;
}

.tema-onizleme-sidebar {
  width: 36px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px 5px;
}

.tema-onizleme-sidebar span {
  display: block;
  height: 5px;
  border-radius: 3px;
  opacity: .7;
}

.tema-onizleme-icerik {
  flex: 1;
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.tema-onizleme-topbar {
  height: 14px;
  border-radius: 3px;
  margin-bottom: 4px;
}

.tema-onizleme-kart {
  flex: 1;
  border-radius: 4px;
  opacity: .6;
}

.tema-bilgi {
  padding: 10px 12px;
  border-top: 1px solid #f1f5f9;
}

.tema-bilgi strong {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 2px;
}

.tema-bilgi span {
  font-size: 11px;
  color: #64748b;
}