/* =====================================================================
   deutschlandgourmet - Responsive (ADDITIV) | Stand 2026-08-15 (v3)
   Greift NUR <=1024px. Desktop (>=1025px) unveraendert. Nur mit Schalter
   (?resp=1 / Cookie dgresp) ausgeliefert -> Endnutzer sehen Live-Seite.
   v3: nur die AEUSSERE Layout-Tabelle wird gestapelt; innere Tabellen
   bleiben Tabellen (Bewertungen/Oeffnungszeiten kompakt), Galerie als Grid.
   ===================================================================== */

@media (max-width: 1024px) {

  /* --- Grundgeruest fluid --- */
  #wrapper            { width: auto !important; max-width: 100%; padding: 8px; box-sizing: border-box; overflow: visible !important; }
  #container, #content{ width: auto !important; max-width: 100%; float: none !important; }
  #main               { width: auto !important; float: none !important; margin-right: 0 !important; }
  #left               { width: auto !important; float: none !important; }
  #ads                { display: none !important; }

  /* --- NUR die aeussere Layout-Tabelle (width=1000) aufloesen --- */
  #main table[width="1000"]                          { display: block !important; width: 100% !important; max-width: 100% !important; }
  #main table[width="1000"] > tbody                  { display: block !important; }
  #main table[width="1000"] > tbody > tr             { display: block !important; }
  #main table[width="1000"] > tbody > tr > td        { display: block !important; width: auto !important; height: auto !important; box-sizing: border-box; }

  /* --- Ueberlauf-Quellen zaehmen, innere Tabellen bleiben Tabellen --- */
  #main table:not([width="1000"]) { max-width: 100% !important; }
  #main img           { max-width: 100% !important; height: auto !important; }
  ins.adsbygoogle     { max-width: 100% !important; }
  #main .hnav, #main span { white-space: normal !important; word-break: break-word; }
  #mapid, .leaflet-container { width: 100% !important; max-width: 100% !important; height: 260px !important; }

  /* --- Kategorie-/Such-Listen (2-spaltig, feste 100px-Bildzellen -> Überlauf) auf 1/Zeile --- */
  #main table[width="95%"],
  #main table[width="95%"] tbody,
  #main table[width="95%"] tr { display: block !important; width: auto !important; }
  #main table[width="95%"] td { display: inline-block !important; vertical-align: middle; box-sizing: border-box; }
  #main table[width="95%"] td[width="100"]     { width: 56px !important; text-align: center; }
  #main table[width="95%"] td[width="100"] img { max-width: 50px !important; height: auto !important; }
  #main table[width="95%"] td[width="50%"]     { width: calc(100% - 66px) !important; }
  #main input, #main textarea, #main select { width: 100% !important; max-width: 100% !important; box-sizing: border-box; }

  /* --- Kontakt-Formular (feste textarea/Inputs -> 769px) stapeln --- */
  #main table[cellpadding="2"][align="center"],
  #main table[cellpadding="2"][align="center"] tbody,
  #main table[cellpadding="2"][align="center"] tr,
  #main table[cellpadding="2"][align="center"] td { display: block !important; width: auto !important; }
  #main table[cellpadding="2"][align="center"] img { display: none !important; } /* Spacer-Pixel */

  /* --- Bewertungs-Sternzeile: kompakt inline, kleine Sterne, umbrechend --- */
  .dg-rate, .dg-rate tbody, .dg-rate tr { display: block !important; }
  .dg-rate td         { display: inline-block !important; width: auto !important; vertical-align: middle; }
  .dg-rate img        { height: 13px !important; width: auto !important; max-width: none !important; vertical-align: middle; }

  /* --- Galerie: Thumbnails als umbrechendes Raster --- */
  .dg-gal, .dg-gal tbody, .dg-gal tr { display: block !important; }
  .dg-gal td          { display: inline-block !important; width: auto !important; vertical-align: top; }
  .dg-gal img         { width: 72px !important; height: auto !important; max-width: 72px !important; }

  /* --- Header --- */
  #cyclewrap          { width: auto !important; max-width: 100%; }
  #cycleimages        { height: auto !important; }
  #cycleimages img    { width: 100% !important; height: auto !important; }
  #shadow, .navshadow { display: none !important; }
  #cyclewrap a.cycleprev, #cyclewrap a.cyclenext { display: none !important; }
  #caption            { width: auto !important; max-width: 100%; left: 0 !important;
                        position: relative !important; bottom: auto !important; box-sizing: border-box; }
  #caption, h1        { font-size: 22pt; }
  h2                  { font-size: 15pt; }
  #header             { padding-top: 8px; text-align: center; }
  div#branding a      { position: static !important; margin: 0 auto !important; }
  #header #suche, #header #navi, #standort {
                        position: static !important; right: auto !important; left: auto !important;
                        top: auto !important; width: auto !important; margin: 6px auto; text-align: center; }
  /* Sprite-Navigation zu Text-Chip-Menue umbauen (Links sind im Markup vorhanden) */
  #header #navi       { display: block !important; position: static !important; width: auto !important;
                        height: auto !important; margin: 8px 0 0 !important; }
  #header #navi ul    { display: flex !important; flex-wrap: wrap; justify-content: center;
                        gap: 5px; list-style: none; margin: 0; padding: 0; }
  #header #navi ul li { float: none !important; margin: 0 !important; }
  #header #navi ul li a,
  #header #navi ul li.restaurant-uebersicht a,
  #header #navi ul li.restaurants a,
  #header #navi ul li.restaurant-bewertungen a,
  #header #navi ul li.restaurant-aktuelles a,
  #header #navi ul li.restaurant-bilder a,
  #header #navi ul li.restaurant-veranstaltungen a {
                        text-indent: 0 !important; background: none !important;
                        width: auto !important; height: auto !important; float: none !important;
                        display: block !important; padding: 7px 11px !important;
                        border: 1px solid #d0d0d0; border-radius: 5px; background-color: #fff !important;
                        font-family: Bitter, serif; font-weight: 700; font-size: 10.5pt;
                        color: #BF0000 !important; text-decoration: none !important; line-height: 1.2; }
  #header #navi ul li a:hover { background-color: #BF0000 !important; color: #fff !important; }

  /* --- Footer --- */
  #footer #links .inner, #container .social { width: auto !important; max-width: 100%; box-sizing: border-box; }
  #footer #links .spalte { display: block !important; width: auto !important; border-right: none !important; padding: 8px 15px !important; }
  #feedback           { display: none !important; }
  #adfooter           { position: static !important; height: auto !important; }

  div, td             { line-height: 1.6; }
}

@media (max-width: 600px) {
  #caption, h1        { font-size: 18pt; }
  h2                  { font-size: 13pt; }
  body                { padding-bottom: 0 !important; }
}