/* Karte mit Einwilligung – liest die Template-Tokens (--ui-*) mit Rückfall */
.basis-karte {
  display: grid;
  gap: .5rem;
}

.basis-karte__placeholder,
.basis-karte__frame {
  width: 100%;
  height: var(--bk-height, 400px);
  border: 0;
  border-radius: var(--ui-radius, .375rem);
}

.basis-karte__placeholder {
  display: grid;
  place-content: center;
  justify-items: center;
  gap: .75rem;
  padding: var(--ui-space-5, 1.5rem);
  text-align: center;
  color: var(--ui-color-text, #1f2328);
  background-color: var(--ui-color-surface, #f2f3f5);
  /* angedeutetes Straßenraster, ohne Bilddatei */
  background-image:
    linear-gradient(90deg, color-mix(in srgb, var(--ui-color-border, #d8dbe0) 70%, transparent) 1px, transparent 1px),
    linear-gradient(color-mix(in srgb, var(--ui-color-border, #d8dbe0) 70%, transparent) 1px, transparent 1px);
  background-size: 48px 48px;
  border: 1px solid var(--ui-color-border, #d8dbe0);
}

.basis-karte__icon {
  width: 2.5rem;
  height: 2.5rem;
  color: var(--ui-color-action, #2563eb);
}

.basis-karte__address {
  margin: 0;
  font-weight: 600;
  line-height: 1.45;
}

.basis-karte__address--plain { font-weight: 400; }

.basis-karte__note {
  max-width: 34rem;
  margin: 0;
  color: var(--ui-color-text-muted, #5f6672);
  font-size: .875rem;
  line-height: 1.5;
}

.basis-karte__remember {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: var(--ui-color-text-muted, #5f6672);
  font-size: .875rem;
  cursor: pointer;
}

.basis-karte__route {
  margin: 0;
}

@media (max-width: 599px) {
  .basis-karte__placeholder,
  .basis-karte__frame { height: min(var(--bk-height, 400px), 70vh); }

  .basis-karte__placeholder { padding: 1rem; }
}