/* Tierrettung Unterland — globale Mobil-Anpassungen
   Die Seiten nutzen Inline-Styles (React-serialisiert: Leerzeichen nach
   Doppelpunkt und Komma). Selektoren decken beide Schreibweisen ab. */

/* Horizontales Überlaufen global unterbinden */
html, body { overflow-x: hidden; }

/* Grid-Kinder dürfen unter min-content schrumpfen */
[style*="grid-template-columns"] > * { min-width: 0; }

/* Logo-Raster: 6 -> 3 Spalten im Tablet-Bereich */
@media (max-width: 1100px) {
  [style*="grid-template-columns: repeat(6, 1fr)"],
  [style*="grid-template-columns:repeat(6, 1fr)"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (max-width: 860px) {

  /* --- Mehrspaltige Grids auf eine Spalte umbrechen (Catch-all: greift
     für JEDES Inline-Grid; Ausnahmen werden weiter unten re-definiert) --- */
  [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  /* Logo-/Icon-Raster: 6 Spalten -> 2 Spalten */
  [style*="grid-template-columns: repeat(6, 1fr)"],
  [style*="grid-template-columns:repeat(6, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Kennzahlen-Tabellen (Jahresvergleich) kompakt statt gestapelt */
  [style*="grid-template-columns: 1.4fr repeat(4, 1fr)"],
  [style*="grid-template-columns:1.4fr repeat(4,1fr)"] {
    grid-template-columns: 1.4fr repeat(4, 1fr) !important;
    font-size: 11px !important;
  }
  [style*="grid-template-columns: 1.4fr repeat(4, 1fr)"] > *,
  [style*="grid-template-columns:1.4fr repeat(4,1fr)"] > * {
    font-size: 11px !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  [style*="grid-template-columns: 80px 1fr 100px"],
  [style*="grid-template-columns:80px 1fr 100px"] {
    grid-template-columns: 52px 1fr 84px !important;
    gap: 8px !important;
  }
  [style*="grid-template-columns: 56px 1fr 110px"],
  [style*="grid-template-columns:56px 1fr 110px"] {
    grid-template-columns: 44px 1fr 92px !important;
    gap: 8px !important;
  }

  /* --- Flex-Zeilen umbrechen lassen --- */
  [style*="display: flex"][style*="gap:"],
  [style*="display:flex"][style*="gap:"] {
    flex-wrap: wrap !important;
  }

  /* Kennzahlenleiste im Seitenkopf: zentriert und symmetrisch (2 Spalten) */
  [style*="border-right: 1px solid rgba(255, 255, 255, 0.15)"],
  [style*="border-right:1px solid rgba(255,255,255,0.15)"] {
    border-right: none !important;
    padding: 8px 18px !important;
    text-align: center;
    flex: 1 1 40%;
  }

  /* Stat-Strips in weißen Karten: Trennlinien im Einspalten-Layout entfernen */
  [style*="border-right: 1px solid rgb(238, 238, 238)"],
  [style*="border-right: 1px solid #eee"] {
    border-right: none !important;
    padding-right: 0 !important;
  }

  /* Zeitleiste (Über uns): Punkt + Text nie umbrechen, sonst läuft die
     vertikale Linie durch den Text */
  [style*="display: flex"][style*="gap: 24px"][style*="padding: 16px 0px"],
  [style*="display:flex"][style*="gap:24px"][style*="padding:16px 0"] {
    flex-wrap: nowrap !important;
  }

  /* --- Typografie-Skalierung --- */
  h1 { font-size: clamp(30px, 8vw, 46px) !important; }
  h2 { font-size: clamp(22px, 6vw, 30px) !important; }

  /* --- Große Bildbanner niedriger --- */
  [style*="height: 380px"], [style*="height:380px"] { height: 240px !important; }
  [style*="height: 420px"], [style*="height:420px"] { height: 260px !important; }
  [style*="height: 360px"], [style*="height:360px"] { height: 240px !important; }
  [style*="height: 340px"], [style*="height:340px"] { height: 220px !important; }

  /* --- Karten- und Sektions-Padding reduzieren --- */
  [style*="padding: 48px"],  [style*="padding:48px"]  { padding: 24px 18px !important; }
  [style*="padding: 40px"],  [style*="padding:40px"]  { padding: 24px 18px !important; }
  [style*="padding: 32px 36px"], [style*="padding:32px 36px"] { padding: 22px 18px !important; }
  [style*="padding: 56px 24px"], [style*="padding:56px 24px"] { padding-left: 16px !important; padding-right: 16px !important; }
  [style*="padding: 64px 24px"], [style*="padding:64px 24px"] { padding-left: 16px !important; padding-right: 16px !important; }

  /* Tag-Zeilen unter den Fahrzeugkarten */
  [style*="padding: 0px 36px 28px"], [style*="padding:0 36px 28px"] { padding: 0 18px 22px !important; }

  /* Tabellen horizontal scrollbar machen */
  table { display: block; overflow-x: auto; }
}

@media (max-width: 480px) {
  h1 { font-size: clamp(26px, 9vw, 34px) !important; }
  [style*="font-size: 44px"], [style*="font-size:44px"],
  [style*="font-size: 46px"], [style*="font-size:46px"] { font-size: 30px !important; }
  [style*="font-size: 32px"], [style*="font-size:32px"] { font-size: 24px !important; }
  [style*="height: 380px"], [style*="height:380px"] { height: 200px !important; }

  /* Logo-Raster einspaltig ganz schmal */
  [style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}