/* Gecko Bayern – compact card layout for Locations and Roads, aligned with Events */
.compact-detail-card{
  position:relative;
  padding:22px!important;
  overflow:visible!important;
  min-width:0;
  max-width:100%;
}
.compact-card-head{
  display:grid;
  grid-template-columns:136px minmax(0,1fr);
  gap:20px;
  align-items:start;
  min-width:0;
  max-width:100%;
}
.compact-symbol-tile{
  width:136px!important;
  height:136px!important;
  aspect-ratio:auto!important;
  min-height:0!important;
  display:grid!important;
  grid-template-rows:minmax(0,1fr) auto;
  align-items:stretch!important;
  justify-items:center!important;
  padding:13px 12px 10px!important;
}
.compact-symbol-main{
  width:100%;
  min-height:0;
  display:grid;
  place-items:center;
}
.compact-symbol-main .detail-symbol{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  color:var(--blue2);
  filter:drop-shadow(0 0 10px rgba(99,200,255,.16));
}
.compact-symbol-main .detail-symbol svg{max-width:52px;max-height:52px}
.compact-symbol-tile small{
  width:76%;
  min-height:28px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  margin:0 auto;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.13);
  color:#aebdc5;
  font-size:.68rem;
  line-height:1.1;
  text-align:center;
  text-transform:none;
}
.compact-card-summary{
  min-width:0;
  max-width:100%;
  padding-right:36px;
  overflow:hidden;
}
.compact-card-summary h3{
  margin:1px 0 11px;
  font-size:clamp(1.26rem,2.3vw,1.72rem);
  line-height:1.15;
  letter-spacing:-.025em;
  font-weight:620;
  overflow-wrap:anywhere;
}
.compact-meta{
  display:grid;
  gap:6px;
  min-width:0;
  max-width:100%;
  color:#aab8bf;
  font-size:.82rem;
}
.compact-meta-row{
  appearance:none;
  width:100%;
  max-width:100%;
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0;
  border:0;
  background:transparent;
  color:#aab8bf;
  font:inherit;
  text-align:left;
  text-decoration:none;
}
a.compact-meta-row{cursor:pointer}
a.compact-meta-row:hover{color:#e7f6fd}
.compact-meta-row .detail-action-icon{
  flex:0 0 20px;
  width:20px;
  height:20px;
  color:#8fcdf0;
}
.compact-meta-row>span:last-child{
  min-width:0;
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.compact-place-meta-row{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:4px;
  width:100%;
  min-width:0;
  max-width:100%;
}
.compact-place-meta-row .compact-place-link{
  flex:0 1 auto;
  width:auto;
  max-width:calc(100% - 32px);
}
.compact-inline-navigation{
  flex:0 0 28px;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#8fcdf0;
  opacity:.9;
  text-decoration:none;
  transition:.16s ease;
}
.compact-inline-navigation:hover{
  opacity:1;
  color:#dff5ff;
  background:rgba(99,200,255,.07);
}
.compact-inline-navigation svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.35;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.compact-road-facts{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:5px 12px;
  min-width:0;
}
.compact-road-fact{
  display:inline-flex;
  align-items:center;
  gap:5px;
  white-space:nowrap;
}
.compact-road-fact .detail-action-icon{width:17px;height:17px;color:#8fcdf0}
.compact-proximity{color:#81939d;font-size:.74rem}

.compact-corner-actions{
  position:absolute;
  z-index:8;
  top:11px;
  right:11px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
}
.compact-corner-actions .detail-more{position:relative;display:block;flex:none;border:0;min-width:0}
.compact-corner-actions .detail-more-menu{
  right:0;
  left:auto;
  top:calc(100% + 5px);
  bottom:auto;
}
.compact-corner-btn{
  appearance:none;
  width:35px;
  height:35px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.02);
  color:#b9c8cf;
  font:inherit;
  cursor:pointer;
  text-decoration:none;
}
.compact-corner-btn:hover{background:rgba(255,255,255,.05);color:#fff}
.compact-corner-btn.favorite-btn{font-size:1.42rem;line-height:1}
.compact-corner-btn.favorite-btn.active{color:#ff8191}
.compact-corner-btn.compact-more-btn{background:transparent}
.compact-corner-btn.compact-more-btn .detail-action-icon{width:19px;height:19px}
.compact-corner-btn:disabled{opacity:.5;cursor:wait}
.compact-navigation-link{
  color:#8fcdf0;
  background:transparent;
  opacity:.9;
  transition:.16s ease;
}
.compact-navigation-link:hover{opacity:1;color:#dff5ff;background:rgba(99,200,255,.07)}
.compact-navigation-link svg{
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.35;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.compact-description-block{
  margin-top:17px;
  padding-top:14px;
  border-top:1px solid rgba(224,231,233,.08);
  min-width:0;
  max-width:100%;
  color:#b9c4ca;
  font-size:.89rem;
  line-height:1.54;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.compact-description-copy{display:inline;color:#b9c4ca}
.compact-description-creator{
  display:inline;
  margin-left:.28em;
  color:#7f929d;
  font-size:.78em;
  white-space:normal;
}

@media(max-width:780px){
  .compact-detail-card{padding:16px!important}
  .compact-card-head{grid-template-columns:96px minmax(0,1fr);gap:13px}
  .compact-symbol-tile{width:96px!important;height:96px!important;padding:10px 9px 8px!important}
  .compact-symbol-main .detail-symbol{width:44px;height:44px}
  .compact-symbol-main .detail-symbol svg{max-width:40px;max-height:40px}
  .compact-symbol-tile small{width:78%;min-height:23px;font-size:.58rem;padding-top:6px}
  .compact-card-summary{padding-right:31px}
  .compact-card-summary h3{font-size:1.16rem;margin:1px 0 8px}
  .compact-meta{font-size:.74rem;gap:5px}
  .compact-corner-actions{top:8px;right:8px;gap:3px}
  .compact-corner-btn{width:31px;height:31px}
  .compact-corner-btn.favorite-btn{font-size:1.28rem}
  .compact-corner-btn.compact-more-btn .detail-action-icon{width:18px;height:18px}
  .compact-navigation-link svg{width:18px;height:18px}
  .compact-description-block{margin-top:15px;padding-top:12px;font-size:.83rem;line-height:1.5}
}
@media(max-width:520px){
  .compact-detail-card{padding:12px!important}
  .compact-card-head{grid-template-columns:78px minmax(0,1fr);gap:10px}
  .compact-symbol-tile{width:78px!important;height:78px!important;padding:8px 7px 6px!important}
  .compact-symbol-main .detail-symbol{width:34px;height:34px}
  .compact-symbol-main .detail-symbol svg{max-width:31px;max-height:31px}
  .compact-symbol-tile small{width:82%;min-height:19px;font-size:.5rem;line-height:1.05;padding-top:4px}
  .compact-card-summary{padding-right:28px}
  .compact-card-summary h3{font-size:1rem;line-height:1.17;margin-bottom:6px}
  .compact-meta{font-size:.67rem;gap:4px}
  .compact-meta-row{gap:6px}
  .compact-meta-row .detail-action-icon{width:16px;height:16px;flex-basis:16px}
  .compact-road-facts{gap:3px 8px}
  .compact-road-fact .detail-action-icon{width:14px;height:14px}
  .compact-proximity{font-size:.61rem}
  .compact-corner-actions{top:6px;right:5px;gap:2px}
  .compact-corner-btn{width:28px;height:28px}
  .compact-corner-btn.favorite-btn{font-size:1.16rem}
  .compact-corner-btn.compact-more-btn .detail-action-icon{width:16px;height:16px}
  .compact-navigation-link svg{width:17px;height:17px}
  .compact-description-block{margin-top:12px;padding-top:10px;font-size:.76rem;line-height:1.45}
}
@media(max-width:390px){
  .compact-card-head{grid-template-columns:72px minmax(0,1fr);gap:8px}
  .compact-symbol-tile{width:72px!important;height:72px!important}
  .compact-card-summary{padding-right:25px}
  .compact-card-summary h3{font-size:.93rem}
  .compact-meta{font-size:.62rem}
}
