/* ======= MV Sport Shortcodes – Frontend Styles ======= */
:root{
  --mv-gap:16px;
  --mv-radius:16px;
  --mv-border:1px solid #e7e7e7;
  --mv-shadow:0 10px 20px rgba(0,0,0,.06);
  --mv-shadow-hover:0 14px 26px rgba(0,0,0,.10);
  --mv-brand:#007acc;           /* Akzentfarbe (Theme) – Link/Hover */
  --mv-text:#0f2e43;
  --mv-muted:#6b7280;
  --mv-surface:#fff;
  --mv-badge-bg:#f3f4f6;
}

/* ===== Grids ===== */
.mv-grid{
  display:grid;
  gap:var(--mv-gap);
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
}
.mv-grid-post{ /* größere Cards für Beiträge: 3–4 pro Reihe möglich */
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
}

/* ===== Hero Grid (magazinartig) ===== */
.mv-hero-grid{
  display:grid;
  gap:var(--mv-gap);
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 220px;
}
.mv-hero-grid .mv-card{ height:100%; }
.mv-hero-grid .mv-card .mv-card-media--wide{
  height:100%;
  aspect-ratio:auto;
}
.mv-hero-grid .is-hero{
  grid-column: 1 / span 2;
  grid-row: 1 / span 2;
  min-height:300px;
}
.mv-hero-grid .is-small{ min-height:220px; }

/* Quadrat-Option (Shortcode: square="1") */
.mv-hero-grid.square .is-hero .mv-card-media--wide,
.mv-hero-grid.square .is-small .mv-card-media--wide{
  aspect-ratio: 1 / 1;
  height:auto;
}

@media (max-width: 1024px){
  .mv-hero-grid{ grid-template-columns: 1fr 1fr; }
  .mv-hero-grid .is-hero{ grid-column: 1 / span 2; grid-row: auto; }
}
@media (max-width: 640px){
  .mv-hero-grid{ grid-template-columns: 1fr; }
  .mv-hero-grid .is-hero{ grid-column: 1; grid-row: auto; }
}

/* ===== Card Base ===== */
.mv-card{
  display:flex;
  flex-direction:column;
  background:var(--mv-surface);
  border:var(--mv-border);
  border-radius:16px;
  overflow:hidden;
  box-shadow:var(--mv-shadow);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.mv-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--mv-shadow-hover);
  border-color:rgba(0,0,0,.08);
}

/* ===== Verein-Logo-Karten ===== */
.mv-card-media{
  position:relative;
  background:#fafafa;
}
.mv-card-media--logo{
  height:180px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}
@media (min-width:640px){ .mv-card-media--logo{ height:180px; } }
@media (min-width:1024px){ .mv-card-media--logo{ height:200px; } }
.mv-card-media--logo img{
  max-width:80%;
  max-height:80%;
  width:auto; height:auto;
  object-fit:contain;
  display:block;
}

/* Ort-Badge oben rechts in der Bildfläche */
.mv-badges{
  position:absolute;
  top:8px; right:8px;
  display:flex; flex-wrap:wrap; gap:6px;
  z-index:4; /* über Overlay */
}
.mv-badge{
  background:var(--mv-brand);
  color:#fff;
  padding:4px 8px;
  border-radius:999px;
  font-size:.75rem;
  line-height:1;
  font-weight:600;
  letter-spacing:.01em;
}

/* Sportarten-Badges (unter dem Titel) – dezent */
.mv-card-sportarten{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.mv-card-sportarten .mv-badge,
.mv-badge--soft{
  background:var(--mv-badge-bg);
  color:var(--mv-text);
  border:1px solid rgba(0,0,0,.08);
  font-size:.7rem;
  font-weight:500;
  padding:3px 7px;
}

/* ===== Post-Artikel-Karten (Standard) ===== */
.mv-card--post{ display:flex; flex-direction:column; }

.mv-card-media--wide{
  position:relative;
  display:block;
  aspect-ratio:16/9;
  background:#f3f4f6;
  overflow:hidden;
  z-index:1;
}
.mv-card-media--wide img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  z-index:1;
}

/* ===== Overlay-Variante (Infos auf dem Bild) ===== */
.mv-card--overlay .mv-card-media--wide{
  background:#111;              /* dunkler Backdrop hinter Bild */
}

/* harte Overrides gegen Theme-Hover-Overlays auf Links */
.mv-card--overlay .mv-card-media--wide:hover,
.mv-card--overlay .mv-card-media--wide:focus{ background:#111 !important; }
.mv-card--overlay .mv-card-media--wide::before,
.mv-card--overlay .mv-card-media--wide::after{ content:none !important; }
.mv-card--overlay .mv-card-media--wide *::before,
.mv-card--overlay .mv-card-media--wide *::after{ content:normal; }

/* Overlay-Inhalt */
.mv-overlay{
  position:absolute;
  inset:auto 0 0 0;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
  background:linear-gradient(180deg,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.5) 70%,
      rgba(0,0,0,.7) 100%);
  color:#fff;
  z-index:3;                    /* über Bild & fremden Effekten */
}
.mv-overlay-title{
  margin:0;
  font-size:1.1rem;
  font-weight:700;
  line-height:1.3;
  color:#fff;                   /* Weiß für Lesbarkeit */
  text-shadow:0 2px 4px rgba(0,0,0,.6);
}
.mv-overlay-title a{ color:#fff; text-decoration:none; }
.mv-overlay-title a:hover{ color:var(--mv-brand); }

.mv-overlay-title--xl{ font-size:1.6rem; }
@media (max-width:640px){ .mv-overlay-title--xl{ font-size:1.35rem; } }

.mv-overlay-title span{
  background:transparent;
  box-decoration-break:clone;
}
.mv-overlay-meta{
  display:flex;
  justify-content:space-between; /* Datum links, Autor rechts */
  font-size:.8rem;
  color:#f9fafb;
  text-shadow:0 1px 3px rgba(0,0,0,.6);
}

/* ===== Body / Texte (für Nicht-Overlay) ===== */
.mv-card-body{
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:10px;
  min-height:70px;
}
.mv-meta{
  font-size:.75rem;
  color:var(--mv-muted);
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.mv-meta span{ display:inline-flex; align-items:center; gap:4px; }

.mv-card-title{
  margin:0;
  font-size:0.95rem;
  line-height:1.3;
}
.mv-card-title a{ color:var(--mv-text); text-decoration:none; }
.mv-card-title a:hover{
  text-decoration:underline;
  text-underline-offset:2px;
}

/* Titel – Posts etwas größer */
.mv-card-title--post{ font-size:1.05rem; }

/* Excerpt (Posts) */
.mv-card-text{
  margin:0;
  color:var(--mv-muted);
  font-size:.9rem;
  line-height:1.4;
}

/* Kleiner „Mehr lesen“-Link */
.mv-more-link{
  margin-top:auto;
  font-size:.8rem;
  color:var(--mv-brand);
  text-decoration:none;
  font-weight:600;
}
.mv-more-link:hover{ text-decoration:underline; }

/* Pagination */
.mv-pagination { margin-top:14px; }
.mv-pagination .page-numbers{
  display:inline-block;
  padding:8px 12px;
  margin:0 4px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:10px;
  text-decoration:none;
  color:var(--mv-text);
  background:#fff;
}
.mv-pagination .page-numbers.current{
  background:var(--mv-brand);
  color:#fff;
  border-color:var(--mv-brand);
}

/* Loadmore */
.mv-loadmore-wrap{ margin-top:14px; text-align:center; }
.mv-loadmore{
  appearance:none; border:1px solid var(--mv-brand); background:#fff;
  color:var(--mv-brand); border-radius:12px; padding:10px 14px; font-weight:600;
  cursor:pointer;
}
.mv-loadmore:hover{ background:var(--mv-brand); color:#fff; }

/* Placeholder (kein Bild/Logo) */
.mv-placeholder{
  width:100%; height:100%;
  display:grid; place-items:center;
  background:linear-gradient(180deg,#fafafa,#f4f4f4);
  color:#93a1af; font-size:.9rem;
}

/* Fallback-Liste */
.mv-sport-list{ margin:0; padding-left:18px; }
.mv-sport-item{ margin:.35rem 0; }
