/* ==========================================================================
   Sunucu Yönetim Paneli — Özel Stiller
   Tailwind (CDN) yalnızca utility sınıfları sağlar; bileşen/özel stiller
   ve renk paleti burada, tek dosyada tutulur.
   ========================================================================== */

:root {
  --zemin: #F5F6F4;
  --panel: #FFFFFF;
  --sinir: #E2E5E1;
  --metin: #1A211D;
  --metin-ikincil: #5B6560;
  --vurgu: #1A8F72;
  --vurgu-parlak: #24C79D;
  --basari: #1A8F72;
  --uyari: #B7791F;
  --tehlike: #C0392B;
  --bilgi: #2F6FA6;
}

html.dark {
  --zemin: #0D1210;
  --panel: #141B18;
  --sinir: #232E29;
  --metin: #E7ECE8;
  --metin-ikincil: #8FA097;
  --vurgu: #24C79D;
  --vurgu-parlak: #4EE3B8;
  --basari: #24C79D;
  --uyari: #E2A33D;
  --tehlike: #E2685C;
  --bilgi: #5B9BD5;
}

* { border-color: var(--sinir); }

::selection { background: var(--vurgu); color: #fff; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--sinir); border-radius: 999px; border: 2px solid var(--zemin); }

/* --------------------------------------------------------------------
   İkon sistemi — CSS mask ile currentColor destekli, bağımlılıksız SVG ikonlar
   -------------------------------------------------------------------- */
.ikon {
  display: inline-block;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.ikon-grid { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E"); }

.ikon-server { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='6' rx='1.5'/%3E%3Crect x='3' y='14' width='18' height='6' rx='1.5'/%3E%3Ccircle cx='7' cy='7' r='1' fill='black'/%3E%3Ccircle cx='7' cy='17' r='1' fill='black'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='6' rx='1.5'/%3E%3Crect x='3' y='14' width='18' height='6' rx='1.5'/%3E%3Ccircle cx='7' cy='7' r='1' fill='black'/%3E%3Ccircle cx='7' cy='17' r='1' fill='black'/%3E%3C/svg%3E"); }

.ikon-users { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 20a6 6 0 0 1 12 0'/%3E%3Ccircle cx='17' cy='8' r='2.5'/%3E%3Cpath d='M15 14.5a5.5 5 0 0 1 6 5.5'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 20a6 6 0 0 1 12 0'/%3E%3Ccircle cx='17' cy='8' r='2.5'/%3E%3Cpath d='M15 14.5a5.5 5 0 0 1 6 5.5'/%3E%3C/svg%3E"); }

.ikon-menu { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16'/%3E%3C/svg%3E"); }

.ikon-gunes { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M2 12h2M20 12h2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M2 12h2M20 12h2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4'/%3E%3C/svg%3E"); }

.ikon-ay { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 14.5A8.5 8.5 0 1 1 9.5 4a7 7 0 0 0 10.5 10.5Z' fill='black'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 14.5A8.5 8.5 0 1 1 9.5 4a7 7 0 0 0 10.5 10.5Z' fill='black'/%3E%3C/svg%3E"); }

.ikon-cikis { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4M16 17l5-5-5-5M21 12H9'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4M16 17l5-5-5-5M21 12H9'/%3E%3C/svg%3E"); }

.ikon-ara { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.3-4.3'/%3E%3C/svg%3E"); }

.ikon-ekle { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); }

.ikon-duzenle { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E"); }

.ikon-sil { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M9 7V4h6v3M6 7l1 13a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-13M10 11v6M14 11v6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M9 7V4h6v3M6 7l1 13a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-13M10 11v6M14 11v6'/%3E%3C/svg%3E"); }

.ikon-kapat { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E"); }

.ikon-uyari { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l10 18H2Z'/%3E%3Cpath d='M12 9v5'/%3E%3Ccircle cx='12' cy='17' r='0.6' fill='black'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l10 18H2Z'/%3E%3Cpath d='M12 9v5'/%3E%3Ccircle cx='12' cy='17' r='0.6' fill='black'/%3E%3C/svg%3E"); }

.ikon-basari { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.5l2.5 2.5L16 9'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.5l2.5 2.5L16 9'/%3E%3C/svg%3E"); }

.ikon-goz { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }

.ikon-geri { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M11 18l-6-6 6-6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M11 18l-6-6 6-6'/%3E%3C/svg%3E"); }

.ikon-yildirim { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7l1-8Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7l1-8Z'/%3E%3C/svg%3E"); }

.ikon-dunya { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.5 4 5.7 4 9s-1.5 6.5-4 9c-2.5-2.5-4-5.7-4-9s1.5-6.5 4-9Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.5 4 5.7 4 9s-1.5 6.5-4 9c-2.5-2.5-4-5.7-4-9s1.5-6.5 4-9Z'/%3E%3C/svg%3E"); }

.ikon-migrasyon { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5' rx='8' ry='3'/%3E%3Cpath d='M4 5v6c0 1.7 3.6 3 8 3s8-1.3 8-3V5'/%3E%3Cpath d='M4 11v6c0 1.7 3.6 3 8 3s8-1.3 8-3v-6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5' rx='8' ry='3'/%3E%3Cpath d='M4 5v6c0 1.7 3.6 3 8 3s8-1.3 8-3V5'/%3E%3Cpath d='M4 11v6c0 1.7 3.6 3 8 3s8-1.3 8-3v-6'/%3E%3C/svg%3E"); }

.ikon-goz-kapali { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3l18 18M10.6 10.6a3 3 0 0 0 4.2 4.2M9.9 5.1A10.4 10.4 0 0 1 12 5c7 0 11 7 11 7a17.7 17.7 0 0 1-4 4.7M6.1 6.1C3.6 7.9 2 12 2 12s4 7 11 7c1.3 0 2.5-.2 3.6-.6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3l18 18M10.6 10.6a3 3 0 0 0 4.2 4.2M9.9 5.1A10.4 10.4 0 0 1 12 5c7 0 11 7 11 7a17.7 17.7 0 0 1-4 4.7M6.1 6.1C3.6 7.9 2 12 2 12s4 7 11 7c1.3 0 2.5-.2 3.6-.6'/%3E%3C/svg%3E"); }

/* --------------------------------------------------------------------
   Durum noktası (aktif/pasif göstergesi) — anlamı olan tek animasyon
   -------------------------------------------------------------------- */
.durum-nabiz {
  animation: nabiz 2.2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes nabiz {
  0%, 100% { opacity: 0.65; transform: scale(1); }
  50% { opacity: 0.15; transform: scale(1.6); }
}
@media (prefers-reduced-motion: reduce) {
  .durum-nabiz { animation: none; }
}

.durum-noktasi { display:inline-block; width:8px; height:8px; border-radius:999px; }
.durum-noktasi.aktif { background: var(--basari); }
.durum-noktasi.pasif { background: var(--metin-ikincil); opacity:.5; }

/* --------------------------------------------------------------------
   Form elemanları
   -------------------------------------------------------------------- */
.girdi {
  width: 100%;
  background: var(--zemin);
  border: 1px solid var(--sinir);
  border-radius: 0.6rem;
  padding: 0.55rem 0.75rem;
  font-size: 0.875rem;
  color: var(--metin);
  transition: border-color .15s, box-shadow .15s;
}
.girdi:focus {
  outline: none;
  border-color: var(--vurgu);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--vurgu) 20%, transparent);
}
.girdi::placeholder { color: var(--metin-ikincil); }

.etiket-form {
  display: block;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--metin-ikincil);
  margin-bottom: 0.35rem;
}

/* --------------------------------------------------------------------
   Select2 — sistemdeki tüm <select> kutuları bu tema ile eşleşir ve
   .girdi ile aynı yüksekliktedir (bkz. genel.js sypSelect2leriBaslat)
   -------------------------------------------------------------------- */
.select2-container { width: 100% !important; }

.select2-container--default .select2-selection--single {
  height: auto;
  min-height: 2.5rem;
  display: flex;
  align-items: center;
  background: var(--zemin);
  border: 1px solid var(--sinir);
  border-radius: 0.6rem;
  padding: 0 2rem 0 0.75rem;
  transition: border-color .15s, box-shadow .15s;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0;
  color: var(--metin);
  font-size: 0.875rem;
  line-height: normal;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--metin-ikincil);
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100%;
  top: 0;
  right: 0.6rem;
}
.select2-container--default .select2-selection__arrow b {
  border-color: var(--metin-ikincil) transparent transparent transparent !important;
}
.select2-container--default.select2-container--open .select2-selection__arrow b {
  border-color: transparent transparent var(--metin-ikincil) transparent !important;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--vurgu);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--vurgu) 20%, transparent);
  outline: none;
}

.select2-dropdown {
  background: var(--panel);
  color: var(--metin);
  border: 1px solid var(--sinir);
  border-radius: 0.6rem;
  overflow: hidden;
  box-shadow: 0 12px 28px -10px rgba(0,0,0,.3);
  z-index: 70;
}
.select2-search--dropdown {
  padding: 0.5rem;
  background: var(--panel);
}
.select2-search--dropdown .select2-search__field {
  background: var(--zemin);
  border: 1px solid var(--sinir);
  border-radius: 0.5rem;
  color: var(--metin);
  padding: 0.4rem 0.6rem;
  font-size: 0.85rem;
  outline: none;
}
.select2-search--dropdown .select2-search__field:focus {
  border-color: var(--vurgu);
}
.select2-results__options { max-height: 15rem; }
.select2-results__option {
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  color: var(--metin);
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--vurgu);
  color: #fff;
}
.select2-container--default .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted) {
  background: color-mix(in srgb, var(--vurgu) 14%, transparent);
  color: var(--vurgu);
}
.select2-results__message {
  color: var(--metin-ikincil);
  font-size: 0.85rem;
  padding: 0.6rem 0.75rem;
}

/* --------------------------------------------------------------------
   Butonlar
   -------------------------------------------------------------------- */
.buton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 0.6rem;
  padding: 0.55rem 1rem;
  transition: background-color .15s, opacity .15s, transform .1s;
  white-space: nowrap;
}
.buton:active { transform: translateY(1px); }
.buton:disabled { opacity: .55; cursor: not-allowed; }

.buton-birincil { background: var(--vurgu); color: #fff; }
.buton-birincil:hover:not(:disabled) { background: var(--vurgu-parlak); }

.buton-ikincil { background: var(--panel); color: var(--metin); border: 1px solid var(--sinir); }
.buton-ikincil:hover:not(:disabled) { background: var(--zemin); }

.buton-tehlike { background: transparent; color: var(--tehlike); border: 1px solid color-mix(in srgb, var(--tehlike) 35%, transparent); }
.buton-tehlike:hover:not(:disabled) { background: color-mix(in srgb, var(--tehlike) 10%, transparent); }

/* --------------------------------------------------------------------
   Kart / panel
   -------------------------------------------------------------------- */
.kart {
  background: var(--panel);
  border: 1px solid var(--sinir);
  border-radius: 0.85rem;
}

/* --------------------------------------------------------------------
   Tablo
   -------------------------------------------------------------------- */
.veri-tablosu { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.veri-tablosu thead th {
  text-align: left;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--metin-ikincil);
  font-weight: 600;
  padding: 0.7rem 1rem;
  border-bottom: 1px solid var(--sinir);
}
.veri-tablosu tbody td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--sinir);
  vertical-align: middle;
}
.veri-tablosu tbody tr:last-child td { border-bottom: none; }
.veri-tablosu tbody tr:hover { background: color-mix(in srgb, var(--vurgu) 5%, transparent); }

/* --------------------------------------------------------------------
   Ölçer (disk kotası vb. kullanım çubuğu) — dolgu şiddeti taşır, boş iz
   aynı rengin daha açık tonu olur ki durum çubuğun genelinde okunsun.
   -------------------------------------------------------------------- */
.olcer-govde {
  width: 100%;
  height: 5px;
  border-radius: 999px;
  overflow: hidden;
  margin-top: 0.3rem;
  background: var(--sinir);
}
.olcer-dolum { height: 100%; border-radius: 999px; }

.olcer-govde.olcer-track-iyi { background: color-mix(in srgb, var(--basari) 18%, transparent); }
.olcer-govde.olcer-track-uyari { background: color-mix(in srgb, var(--uyari) 18%, transparent); }
.olcer-govde.olcer-track-kritik { background: color-mix(in srgb, var(--tehlike) 18%, transparent); }

.olcer-dolum.olcer-iyi { background: var(--basari); }
.olcer-dolum.olcer-uyari { background: var(--uyari); }
.olcer-dolum.olcer-kritik { background: var(--tehlike); }

/* --------------------------------------------------------------------
   Rozetler (rol / izin seviyesi / durum)
   -------------------------------------------------------------------- */
.rozet {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
}
.rozet-vurgu { background: color-mix(in srgb, var(--vurgu) 14%, transparent); color: var(--vurgu); }
.rozet-notr { background: color-mix(in srgb, var(--metin-ikincil) 14%, transparent); color: var(--metin-ikincil); }
.rozet-uyari { background: color-mix(in srgb, var(--uyari) 16%, transparent); color: var(--uyari); }
.rozet-tehlike { background: color-mix(in srgb, var(--tehlike) 14%, transparent); color: var(--tehlike); }

/* --------------------------------------------------------------------
   Modal
   -------------------------------------------------------------------- */
.modal-perde {
  position: fixed; inset: 0; background: rgba(4, 8, 6, 0.55);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 4vh 1rem; overflow-y: auto; z-index: 50;
  backdrop-filter: blur(2px);
}

/* --------------------------------------------------------------------
   Bildirim (toast)
   -------------------------------------------------------------------- */
#bildirim-alani { position: fixed; top: 1rem; right: 1rem; z-index: 60; display: flex; flex-direction: column; gap: 0.5rem; }
.bildirim {
  display: flex; align-items: flex-start; gap: 0.6rem;
  background: var(--panel); border: 1px solid var(--sinir);
  border-radius: 0.7rem; padding: 0.75rem 1rem; min-width: 260px; max-width: 360px;
  box-shadow: 0 8px 24px -8px rgba(0,0,0,.25);
  animation: bildirim-gir .18s ease-out;
  font-size: 0.85rem;
}
.bildirim.basarili { border-left: 3px solid var(--basari); }
.bildirim.hatali { border-left: 3px solid var(--tehlike); }
@keyframes bildirim-gir { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }

/* --------------------------------------------------------------------
   Giriş / Kurulum sayfaları — kimliksiz merkezi kart düzeni
   -------------------------------------------------------------------- */
.oturum-zemini {
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  padding: 1.5rem;
  background-color: var(--zemin);
  background-image:
    radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--metin-ikincil) 18%, transparent) 1px, transparent 0);
  background-size: 28px 28px;
}
html.dark .oturum-zemini {
  background-image:
    radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--vurgu) 22%, transparent) 1px, transparent 0);
}
