/* ============================================
   YAPI HİZMETLERİ — İş Makineleri Sayfası (v11)
   ============================================ */

.mk-hero {
  padding: calc(var(--navbar-height) + var(--space-6)) 0 var(--space-4);
  text-align: center;
}
.mk-hero h1 { font-family: var(--font-heading); font-size: var(--text-4xl); letter-spacing: -0.02em; margin: 0 0 var(--space-2); }
.mk-hero p { color: var(--color-text-secondary); margin: 0; }

/* Harita */
.mk-map-wrap {
  position: relative;
  height: 52vh;
  min-height: 360px;
  border-radius: var(--radius-2xl);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border: 1px solid var(--color-border);
  margin-top: var(--space-6);
}
#mkMap { width: 100%; height: 100%; }

.mk-map-legend {
  position: absolute; bottom: 14px; left: 14px; z-index: 500;
  background: rgba(255,255,255,0.92);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border-radius: var(--radius-lg);
  padding: 0.5rem 0.85rem;
  font-size: var(--text-xs);
  display: flex; gap: 0.9rem;
  box-shadow: var(--shadow-md);
}
.mk-map-legend span { display: inline-flex; align-items: center; gap: 0.35rem; }
.mk-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.mk-dot--musait { background: #10b981; }
.mk-dot--dolu { background: #ef4444; }
.mk-dot--bayat { background: #94a3b8; }

.mk-locate-btn {
  position: absolute; top: 14px; right: 14px; z-index: 500;
}

/* Harita pini */
.mk-pin { background: none; border: none; }
.mk-pin-inner {
  width: 46px; height: 46px; border-radius: 50%;
  background: var(--color-primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 0.85rem; font-family: var(--font-heading);
  border: 3px solid #10b981;
  box-shadow: 0 4px 14px rgba(15,23,42,0.35);
  overflow: hidden;
}
.mk-pin-inner img { width: 100%; height: 100%; object-fit: cover; }
.mk-pin--dolu .mk-pin-inner { border-color: #ef4444; }
.mk-pin--bayat .mk-pin-inner { border-color: #94a3b8; opacity: 0.55; }
.mk-pin-tur {
  position: absolute; bottom: -6px; left: 50%; transform: translateX(-50%);
  background: var(--color-cta); color: var(--color-cta-text);
  font-size: 0.55rem; font-weight: 700;
  padding: 1px 6px; border-radius: 999px; white-space: nowrap;
}

/* Filtre barı */
.mk-filter-bar {
  display: flex; flex-wrap: wrap; gap: var(--space-3);
  align-items: center;
  margin: var(--space-6) 0 var(--space-4);
}
.mk-filter-bar .form-select { max-width: 220px; }
.mk-count { font-size: var(--text-sm); color: var(--color-text-muted); margin-left: auto; }

/* Kartlar */
.mk-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--space-5);
  margin-bottom: var(--space-12);
}
.mk-card {
  background: var(--color-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  overflow: hidden;
  display: flex; flex-direction: column;
}
.mk-card-foto {
  height: 150px;
  background: linear-gradient(135deg, #1e293b 0%, #334155 60%, #475569 100%);
  display: flex; align-items: center; justify-content: center;
  position: relative;
}
.mk-card-foto img { width: 100%; height: 100%; object-fit: cover; }
.mk-card-foto svg { width: 52px; height: 52px; stroke: #94a3b8; }
.mk-musait-etiket {
  position: absolute; top: 10px; right: 10px;
  font-size: var(--text-xs); font-weight: 700;
  padding: 3px 10px; border-radius: 999px;
}
.mk-musait-etiket--musait { background: #d1fae5; color: #065f46; }
.mk-musait-etiket--dolu { background: #fee2e2; color: #991b1b; }
.mk-musait-etiket--bayat { background: #e2e8f0; color: #475569; }
.mk-card-body { padding: var(--space-4) var(--space-5) var(--space-5); flex: 1; display: flex; flex-direction: column; gap: var(--space-2); }
.mk-card-baslik { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.mk-card-baslik h4 { margin: 0; font-family: var(--font-heading); font-size: var(--text-lg); }
.mk-card-op { font-size: var(--text-sm); color: var(--color-text-secondary); }
.mk-card-rozetler { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.mk-card-info { font-size: var(--text-sm); color: var(--color-text-secondary); display: flex; flex-direction: column; gap: 0.3rem; }
.mk-card-info svg { width: 14px; height: 14px; vertical-align: -2px; margin-right: 4px; stroke: var(--color-text-muted); }
.mk-tarife {
  margin-top: var(--space-2);
  background: var(--color-cta-light);
  border: 1px solid #fde68a;
  border-radius: var(--radius-lg);
  padding: var(--space-3) var(--space-4);
  font-size: var(--text-sm);
}
.mk-tarife strong { font-family: var(--font-heading); font-size: var(--text-lg); color: var(--color-cta-hover); }
.mk-tarife small { display: block; color: var(--color-text-secondary); margin-top: 2px; }
.mk-son-guncelleme { font-size: var(--text-xs); color: var(--color-text-muted); }
.mk-card .btn { margin-top: auto; }

/* Modal (çağır) */
.mk-modal-ozet {
  background: var(--color-bg-alt);
  border-radius: var(--radius-lg);
  padding: var(--space-3) var(--space-4);
  font-size: var(--text-sm);
  margin-bottom: var(--space-4);
}

@media (max-width: 640px) {
  .mk-map-wrap { height: 44vh; min-height: 300px; border-radius: var(--radius-xl); }
  .mk-filter-bar .form-select { max-width: none; flex: 1 1 45%; }
}