/* Nakliye Yönetim Sistemi — ortak stiller (Tailwind'i tamamlayan küçük dokunuşlar) */

:root{
  --brand-50:#eff6ff;
  --brand-100:#dbeafe;
  --brand-500:#2563eb;
  --brand-600:#1d4ed8;
  --brand-700:#1e40af;
}

html{ scroll-behavior:smooth; }
body{ font-family:'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif; }

/* İnce kaydırma çubuğu */
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:999px; }
::-webkit-scrollbar-thumb:hover{ background:#94a3b8; }

/* Sayfa içi geçiş animasyonu */
.page-fade{ animation:pageFade .35s ease both; }
@keyframes pageFade{
  from{ opacity:0; transform:translateY(6px); }
  to{ opacity:1; transform:translateY(0); }
}

/* Modal animasyonu */
.modal-backdrop{ animation:fadeIn .2s ease both; }
.modal-panel{ animation:modalIn .25s cubic-bezier(.2,.8,.2,1) both; }

/* "Genişlet" butonuyla tam ekran açılan modallar (ör. Yeni Fatura).
   Modalın dış sarmalayıcısı (.js-modal) "fixed inset-0" olduğundan, panel
   %100 genişlik alınca sol menünün üzerine de biner — bunu engellemek için
   lg ekranlarda sarmalayıcının sol kenarını sidebar genişliği (18rem/w-72)
   kadar içeri alıyoruz; panel de böylece sadece sağdaki geniş body alanında
   tam ekran açılır, sol menü her zaman görünür ve tıklanabilir kalır. */
.modal-panel.modal-fullscreen{
  max-width:100% !important; width:100% !important;
  height:100% !important; max-height:100% !important;
  border-radius:0 !important;
}
@media (min-width: 1024px){
  .js-modal.modal-wrap-fullscreen{ left:18rem; }
}
@keyframes fadeIn{ from{opacity:0} to{opacity:1} }
@keyframes modalIn{
  from{ opacity:0; transform:translateY(12px) scale(.98); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}

/* Toast */
.toast-enter{ animation:toastIn .3s cubic-bezier(.2,.8,.2,1) both; }
@keyframes toastIn{
  from{ opacity:0; transform:translateY(-10px) translateX(8px); }
  to{ opacity:1; transform:translateY(0) translateX(0); }
}

/* Aktif menü göstergesi */
.nav-link{ position:relative; transition:background-color .15s ease, color .15s ease; }
.nav-link.active{ background:var(--brand-50); color:var(--brand-700); font-weight:600; }
.nav-link.active .nav-icon{ color:var(--brand-600); }
.nav-link.active::before{
  content:''; position:absolute; left:0; top:8px; bottom:8px; width:3px;
  background:var(--brand-600); border-radius:0 4px 4px 0;
}

/* Sekme (tab) göstergesi */
.tab-btn{ transition:all .15s ease; border-bottom:2px solid transparent; }
.tab-btn.active{ color:var(--brand-700); border-color:var(--brand-600); }
.ftab-btn{ transition:all .15s ease; border-bottom:2px solid transparent; }
.ftab-btn.active{ color:var(--brand-700); border-color:var(--brand-600); }

/* Sevkiyat tipi (Tam / Parsiyel) segmented control */
.sevkiyat-tipi-btn{ color:#64748b; transition:all .15s ease; }
.sevkiyat-tipi-btn.active{ background:#fff; color:var(--brand-700); box-shadow:0 1px 2px rgba(0,0,0,.06); }

/* Durum rozetleri hover'da hafif büyüme */
.status-badge{ display:inline-flex; align-items:center; gap:.35rem; white-space:nowrap; }

/* Tablo satır hover */
.data-row{ transition:background-color .12s ease; }

/* Skeleton yükleme efekti (ileride API bağlanınca kullanılabilir) */
.skeleton{ background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 37%,#f1f5f9 63%); background-size:400% 100%; animation:skeletonLoad 1.4s ease infinite; }
@keyframes skeletonLoad{ 0%{background-position:100% 50%} 100%{background-position:0 50%} }

/* Odak halkası (erişilebilirlik + estetik) */
.focus-ring:focus{ outline:none; box-shadow:0 0 0 3px var(--brand-100); border-color:var(--brand-500); }

/* Mobilde kenar çubuğu (sidebar) kaydırmalı geçiş */
#sidebar{ transition:transform .25s ease; }

@media print{
  #sidebar, #topbar, .no-print{ display:none !important; }
  #main-content{ margin:0 !important; padding:0 !important; }

  /* Jenerik modal yazdırma modu: printModal(id) çağrıldığında yalnızca ilgili
     modalın içeriği basılır (fatura önizleme, nakliye/müşteri/araç detay vb. için ortak). */
  body.print-modal-mode > *:not(.print-target){ display:none !important; }
  body.print-modal-mode .print-target{ position:static !important; padding:0 !important; }
  body.print-modal-mode .print-target .modal-backdrop{ display:none !important; }
  body.print-modal-mode .print-target .modal-panel{ box-shadow:none !important; max-width:none !important; max-height:none !important; border-radius:0 !important; }
}

/* Drag/scroll için tablo sarmalayıcı */
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* Basit tooltip */
[data-tooltip]{ position:relative; }
[data-tooltip]:hover::after{
  content:attr(data-tooltip);
  position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%);
  background:#111827; color:#fff; font-size:.7rem; padding:4px 8px; border-radius:6px;
  white-space:nowrap; z-index:50; pointer-events:none;
}
