:root {
  --mg-thumb-bg: #e9ecef;
}

body { padding-top: 56px; background: #f7f8fa; }

.main-content { padding-bottom: 4rem; }

/* Login / register card */
.auth-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #2c3e50, #4ca1af);
  padding: 1rem;
}
.auth-card {
  width: 100%;
  max-width: 380px;
  background: #fff;
  border-radius: 12px;
  padding: 2rem 1.5rem;
  box-shadow: 0 10px 30px rgba(0,0,0,.15);
}

/* Car list cards */
.car-card { transition: transform .15s ease, box-shadow .15s ease; height: 100%; }
.car-card:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0,0,0,.08); }
.car-thumb {
  width: 100%;
  height: 160px;
  object-fit: cover;
  background: var(--mg-thumb-bg);
}
.placeholder-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  color: #6c757d;
  background: var(--mg-thumb-bg);
}

.car-detail-img {
  width: 100%;
  height: 240px;
  object-fit: cover;
}

.mn-thumb { height: 120px; object-fit: cover; width: 100%; }
.bild-row { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: .75rem; }
.bild-row > a { flex: 0 0 48%; max-width: 48%; }
.bild-row img { width: 100%; height: auto; display: block; border-radius: .375rem; }
.bild-row > .small { flex: 0 0 48%; max-width: 48%; }

.howto-assign-scroll {
  max-height: 180px;
  overflow-y: auto;
  border: 1px solid #dee2e6;
  border-radius: .375rem;
  padding: .5rem .75rem;
}
.howto-assign-car {
  font-size: .75rem;
  font-weight: 600;
  color: #6c757d;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-top: .5rem;
  margin-bottom: .2rem;
}
.howto-assign-car:first-child { margin-top: 0; }

.mn-gallery { display: flex; flex-wrap: wrap; gap: .5rem; }
.mn-gallery-item { flex: 0 0 300px; max-width: 300px; }
.mn-gallery-item a { display: block; }
.mn-gallery-item img { width: 100%; height: auto; border-radius: .375rem; display: block; }

@media (max-width: 767px) {
  .mn-gallery-item { flex: 0 0 100%; max-width: 100%; }
}

.tab-content > .tab-pane { display: none; }
.tab-content > .tab-pane.active { display: block; }

.profile-img { width: 120px; height: 120px; object-fit: cover; }
.profile-avatar {
  width: 24px; height: 24px;
  border-radius: 50%;
  object-fit: cover;
  vertical-align: -6px;
  margin-right: .25rem;
}

/* Touch targets on small screens */
@media (max-width: 576px) {
  .btn, .form-control, .form-select { min-height: 44px; }
  .car-thumb { height: 200px; }
}
