/* ============================================================
   BELEDİYE ARAÇ REZERVASYON SİSTEMİ — Ana Stil
   UTF-8 • Bootstrap 5.3 • Responsive
   ============================================================ */

:root {
  --navy:          #1a2e5a;
  --navy-light:    #243a72;
  --navy-pale:     #eef1f8;
  --sidebar-w:     250px;
  --sidebar-col:   64px;
  --topbar-h:      56px;
  --card-radius:   .75rem;
  --transition:    .2s ease;
}

/* ── Reset / Base ─────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 15px; }
body {
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
  background: #f4f6fb;
  color: #2d3748;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; }
a { color: var(--navy); text-decoration: none; }
a:hover { color: var(--navy-light); }

/* ── Renkler ──────────────────────────────── */
.text-navy        { color: var(--navy)!important; }
.bg-navy          { background-color: var(--navy)!important; }
.bg-navy-pale     { background-color: var(--navy-pale)!important; }
.btn-navy         { background: var(--navy); color:#fff; border-color: var(--navy); border-radius: .5rem; }
.btn-navy:hover   { background: var(--navy-light); color:#fff; border-color: var(--navy-light); }
.btn-navy:focus   { box-shadow: 0 0 0 .2rem rgba(26,46,90,.3); color:#fff; }
.btn-outline-navy { color: var(--navy); border-color: var(--navy); border-radius:.5rem; }
.btn-outline-navy:hover { background: var(--navy); color:#fff; }

.bg-success-light { background:#d1f5d3!important; }
.bg-warning-light { background:#fff3cd!important; }
.bg-danger-light  { background:#fde8e8!important; }
.bg-navy-light    { background: var(--navy-pale)!important; }

/* ── Layout Wrapper ───────────────────────── */
#wrapper {
  display: flex;
  min-height: 100vh;
}

/* ── Sidebar ──────────────────────────────── */
#sidebar {
  width: var(--sidebar-w);
  min-height: 100vh;
  background: var(--navy);
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  transition: width var(--transition);
  z-index: 1000;
}
#sidebar.collapsed {
  width: var(--sidebar-col);
}
#sidebar.collapsed .sidebar-text,
#sidebar.collapsed .sidebar-section,
#sidebar.collapsed .sidebar-footer { display: none!important; }
#sidebar.collapsed .sidebar-link   { justify-content: center; padding: .55rem .5rem; }
#sidebar.collapsed .sidebar-link i { margin: 0!important; font-size: 1.1rem; }

.sidebar-header {
  display: flex;
  align-items: center;
  padding: 1rem .85rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
  min-height: var(--topbar-h);
  flex-shrink: 0;
}
.sidebar-brand-text { font-size: .82rem; line-height:1.25; color:#fff; font-weight:700; }
.sidebar-brand-text small { color:rgba(255,255,255,.5); font-size:.75rem; }

.sidebar-nav   { padding: .5rem .6rem; flex-grow:1; overflow-y:auto; }
.sidebar-section {
  font-size: .64rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: rgba(255,255,255,.38);
  padding: .8rem .5rem .2rem;
  font-weight: 700;
}
.sidebar-link {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: rgba(255,255,255,.72);
  padding: .5rem .65rem;
  border-radius: .5rem;
  margin-bottom: 2px;
  font-size: .85rem;
  transition: background var(--transition), color var(--transition);
  white-space: nowrap;
}
.sidebar-link i   { width: 18px; text-align:center; flex-shrink:0; font-size:.95rem; }
.sidebar-link:hover,
.sidebar-link.active { background: rgba(255,255,255,.13); color:#fff; }
.sidebar-link .badge { font-size:.65rem; }
.sidebar-footer {
  padding: .75rem;
  border-top: 1px solid rgba(255,255,255,.1);
  color: rgba(255,255,255,.5);
  font-size: .8rem;
  white-space: nowrap;
  overflow: hidden;
  flex-shrink: 0;
}

/* ── Topbar ───────────────────────────────── */
#content    { flex-grow:1; display:flex; flex-direction:column; min-width:0; }
.topbar {
  position: sticky;
  top: 0;
  z-index: 999;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
  height: var(--topbar-h);
  display: flex;
  align-items: center;
  padding: 0 1.25rem;
  gap: .75rem;
  flex-shrink: 0;
}
.topbar-brand { font-size: .88rem; font-weight:700; color: var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.topbar-spacer { flex-grow:1; }
.topbar-actions { display:flex; align-items:center; gap:.5rem; flex-shrink:0; }
.topbar-actions .dropdown { min-width:0; }

/* Bildirim badge */
.notif-badge {
  position:absolute; top:-4px; right:-4px;
  font-size:.62rem; min-width:16px; height:16px;
  display:none; border-radius:8px; padding:0 4px;
  line-height:16px;
}

/* ── Flash Mesaj ──────────────────────────── */
.flash-wrap { padding: .75rem 1.25rem 0; }

/* ── Main Content ─────────────────────────── */
main { flex-grow:1; padding: 1.25rem; overflow-x:hidden; max-width:100%; }
main > * { min-width:0; }
main > .row {
  margin-left:0;
  margin-right:0;
}
footer.site-footer {
  text-align:center; padding:.6rem 1rem;
  color:#9ca3af; font-size:.78rem;
  border-top: 1px solid #e5e7eb;
  background:#fff;
  flex-shrink:0;
}

/* ── Cards ────────────────────────────────── */
.card        { border-radius: var(--card-radius); }
.card-header { font-size:.88rem; padding:.7rem 1rem; }

/* ── Buttons ──────────────────────────────── */
.btn         { border-radius: .5rem; font-size:.87rem; }
.btn-sm      { font-size: .8rem; }
.btn-xs      { font-size: .75rem; padding: .2rem .55rem; border-radius:.4rem; }

/* Hover lift effect */
.hover-lift { transition: transform var(--transition), box-shadow var(--transition); }
.hover-lift:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,.1)!important; }

/* ── Stat Kartları ────────────────────────── */
.stat-card { border-radius:var(--card-radius); transition: box-shadow var(--transition); height:100%; min-width:0; }
.stat-card .fs-3 { line-height:1.05; }
.stat-icon {
  width:48px; height:48px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.15rem; margin:0 auto .5rem;
}

/* ── Avatar ───────────────────────────────── */
.avatar-placeholder, .avatar-box {
  width:80px; height:80px; border-radius:50%;
  background: var(--navy-pale); color: var(--navy);
  display:flex; align-items:center; justify-content:center;
  font-size:1.6rem; font-weight:700; margin:0 auto;
}
.avatar-sm {
  width:36px; height:36px; border-radius:50%;
  background: var(--navy-pale); color: var(--navy);
  display:flex; align-items:center; justify-content:center;
  font-size:.72rem; font-weight:700; flex-shrink:0;
}

/* ── Araç Kartları ────────────────────────── */
.vehicle-card {
  border-radius: var(--card-radius);
  transition: transform var(--transition), box-shadow var(--transition);
  overflow:hidden;
}
.vehicle-card:hover { transform:translateY(-3px); box-shadow:0 8px 24px rgba(0,0,0,.12)!important; }
.vehicle-img { width:100%; height:150px; object-fit:cover; }
.vehicle-img-placeholder { height:130px; background:#f0f4ff; display:flex; align-items:center; justify-content:center; }

/* ── Takvim Grid ──────────────────────────── */
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.cal-header { text-align:center; font-size:.75rem; font-weight:600; color:#9ca3af; padding:.3rem 0; }
.cal-day {
  aspect-ratio: 1;
  border-radius: .4rem;
  padding: .3rem;
  cursor: pointer;
  transition: opacity .15s, transform .15s;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-decoration: none;
  min-height: 52px;
}
.cal-day:hover        { opacity:.8; transform:scale(1.04); }
.cal-day-num          { font-size:.82rem; font-weight:700; }
.cal-day-pct          { font-size:.6rem; margin-top:auto; }
.cal-empty            { background:transparent; cursor:default; }
.cal-free             { background:#d1fae5; color:#065f46; }
.cal-partial          { background:#fef3c7; color:#92400e; }
.cal-full             { background:#fee2e2; color:#991b1b; }
.cal-maint            { background:#e5e7eb; color:#6b7280; }
.cal-holiday          { background:#ede9fe; color:#6d28d9; border:1px solid #8b5cf6; }
.cal-past             { opacity:.4!important; }
.cal-today            { outline:2px solid var(--navy); outline-offset:1px; }

/* ── Günlük Takvim ────────────────────────── */
.daily-timeline       { border-top:1px solid #e5e7eb; }
.daily-hour           { display:flex; min-height:46px; border-bottom:1px solid #f3f4f6; }
.daily-hour.non-work  { background:#fafafa; }
.hour-label           { width:52px; font-size:.72rem; color:#9ca3af; padding:.45rem .5rem 0 0; text-align:right; flex-shrink:0; font-weight:600; }
.hour-slots           { flex-grow:1; padding:.25rem .5rem; }
.slot-block           { border-radius:.35rem; padding:.2rem .5rem; margin-bottom:2px; font-size:.76rem; display:block; }
.slot-empty:hover     { background:rgba(26,46,90,.06); border-radius:.35rem; }

/* ── Legend ───────────────────────────────── */
.legend-dot { display:inline-block; width:11px; height:11px; border-radius:2px; margin-right:3px; vertical-align:middle; }

/* ── Tablo ────────────────────────────────── */
.table        { font-size:.86rem; }
.table th     { font-size:.74rem; text-transform:uppercase; letter-spacing:.04em; font-weight:700; color:#6b7280; white-space:nowrap; }
.table td     { vertical-align:middle; }

/* ── Badge ────────────────────────────────── */
.badge        { border-radius:.35rem; font-weight:500; font-size:.75rem; }

/* ── Progress ─────────────────────────────── */
.progress     { border-radius:4px; }

/* ── Login Sayfası ────────────────────────── */
.auth-bg {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--navy) 0%, #2c4a9e 60%, #1e40af 100%);
  padding: 1rem;
}
.auth-card { width:100%; max-width:420px; border-radius:1rem; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.3); }
.auth-header { background: var(--navy); padding:2rem; text-align:center; }

/* ── Form ─────────────────────────────────── */
.form-label   { font-size:.84rem; margin-bottom:.3rem; }
.form-control, .form-select { font-size:.87rem; border-radius:.45rem; }
.form-control:focus, .form-select:focus { border-color: var(--navy); box-shadow:0 0 0 .2rem rgba(26,46,90,.15); }
.input-group-text { background:#f8fafc; border-color:#dee2e6; }

/* ── Dropdown ─────────────────────────────── */
.dropdown-menu { border-radius:.6rem; box-shadow:0 8px 24px rgba(0,0,0,.1); border:1px solid #e5e7eb; font-size:.86rem; }
.dropdown-item { border-radius:.35rem; margin:1px 4px; padding:.45rem .75rem; }
.dropdown-item:hover { background: var(--navy-pale); }

/* ── Pagination ───────────────────────────── */
.page-link    { border-radius:.4rem!important; font-size:.82rem; color: var(--navy); }
.page-item.active .page-link { background: var(--navy); border-color: var(--navy); }

/* ── Breadcrumb ───────────────────────────── */
.breadcrumb   { font-size:.82rem; }

.page-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-width:0;
}
.page-toolbar .btn { flex-shrink:0; }
.dashboard-list-row {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:.75rem;
  min-width:0;
}
.dashboard-list-row > :first-child { min-width:0; }
.dashboard-list-row .badge,
.dashboard-list-row small,
.dashboard-list-row > :last-child { flex-shrink:0; }
.list-group-item { min-width:0; }
.card-header h1,
.card-header h2,
.card-header h3,
.card-header h4,
.card-header h5,
.card-header h6 { min-width:0; }

/* ── Responsive — Tablet (≤ 992px) ──────── */
@media (max-width: 991.98px) {
  #sidebar {
    width: var(--sidebar-col);
  }
  #sidebar .sidebar-text,
  #sidebar .sidebar-section,
  #sidebar .sidebar-footer { display: none!important; }
  #sidebar .sidebar-link   { justify-content: center; padding: .55rem .5rem; }
  #sidebar .sidebar-link i { margin:0!important; }

  .calendar-grid { gap: 2px; }
  .cal-day       { min-height: 42px; }
  .cal-day-pct   { display: none; }
}

/* ── Responsive — Mobile (≤ 768px) ─────── */
@media (max-width: 767.98px) {
  html { font-size: 14px; }
  main { padding: .75rem; }
  .page-toolbar {
    align-items:flex-start;
    flex-direction:column;
    gap:.75rem;
  }
  .page-toolbar .btn {
    width:100%;
    justify-content:center;
  }
  .card-header {
    gap:.5rem;
  }
  .card-header .btn,
  .card-header .btn-sm {
    white-space:nowrap;
  }
  .dashboard-list-row {
    flex-direction:column;
    gap:.35rem;
  }
  .dashboard-list-row > :last-child {
    align-self:flex-start;
  }

  /* Sidebar tamamen gizle, üstten aç */
  #sidebar {
    position: fixed;
    left: -260px;
    top: 0;
    height: 100vh;
    width: var(--sidebar-w)!important;
    z-index: 1050;
    transition: left var(--transition);
  }
  #sidebar.mobile-open {
    left: 0;
  }
  #sidebar.mobile-open .sidebar-text,
  #sidebar.mobile-open .sidebar-section,
  #sidebar.mobile-open .sidebar-footer { display: block!important; }
  #sidebar.mobile-open .sidebar-link   { justify-content: flex-start; padding: .5rem .65rem; }

  /* Overlay */
  #sidebar-overlay {
    display: none;
    position: fixed; inset:0; background:rgba(0,0,0,.5); z-index:1049;
  }
  #sidebar-overlay.show { display:block; }

  #content { margin-left:0!important; }

  /* Topbar */
  .topbar-brand { display:none!important; }
  .topbar       { padding: 0 .75rem; }
  .topbar-actions { gap:.35rem; min-width:0; }

  /* Tablolar mobile */
  .table-responsive table { min-width: 540px; }

  /* Araç kartları - tek sütun */
  .vehicle-grid .col-md-4,
  .vehicle-grid .col-lg-3 { flex: 0 0 50%; max-width:50%; }

  /* Stat kartları */
  .stat-card-row .col-6 { flex:0 0 50%; max-width:50%; }
  .stat-card { padding: .85rem!important; }
  .stat-card .fs-3 { font-size: 1.65rem!important; }
  .stat-icon { width:40px; height:40px; font-size:1rem; }

  /* Takvim */
  .calendar-grid { gap: 2px; }
  .cal-day       { min-height: 36px; }
  .cal-day-num   { font-size:.7rem; }
  .cal-day-pct   { display:none; }
  .cal-header    { font-size:.66rem; }

  /* Form */
  .form-col-sm-6 { flex:0 0 100%; max-width:100%; }

  /* Filtreler collapse */
  .filter-collapse { display:none; }
  .filter-collapse.show { display:block; }

  /* Onay kartları */
  .approval-grid > div { flex:0 0 100%!important; max-width:100%!important; }
}

/* ── Responsive — Küçük mobil (≤ 480px) ── */
@media (max-width: 479.98px) {
  .vehicle-grid .col-md-4,
  .vehicle-grid .col-lg-3 { flex:0 0 100%; max-width:100%; }
  .hide-xs { display:none!important; }
  .topbar-actions .btn span { display:none; }
  .stat-card-row .col-6 { flex:0 0 100%; max-width:100%; }
  .table-responsive table { min-width: 480px; }
}

/* ── Utility ──────────────────────────────── */
.text-truncate-2 {
  display:-webkit-box; -webkit-line-clamp:2;
  -webkit-box-orient:vertical; overflow:hidden;
}
.border-navy { border-color: var(--navy)!important; }
.fw-medium   { font-weight:500; }
.gap-xs      { gap:.25rem!important; }
.min-w-0     { min-width:0; }

/* Scrollbar stillemesi */
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:#cbd5e1; border-radius:3px; }
::-webkit-scrollbar-thumb:hover { background:#94a3b8; }

/* Print */
@media print {
  #sidebar, .topbar, .no-print { display:none!important; }
  #content { margin:0!important; }
  main { padding:0; }
  .card { box-shadow:none!important; border:1px solid #dee2e6!important; }
}
