/*
Theme Name: schulferien Travelify Child
Theme URI: https://www.schulferien.eu/
Template: travelify
Description: Mobile-Optimierungen + Speed-Tweaks über das vorhandene Travelify-Theme. Lässt Header/Footer/Navigation komplett unangetastet — fügt nur gezielte CSS-Verbesserungen hinzu.
Author: Marc / Claude
Version: 1.0.0
Text Domain: schulferien-travelify-child
*/

/* ================================================================
   1) MOBILE TAP-TARGETS & READABILITY
   ============================================================= */

@media (max-width: 768px) {

  /* Buttons + Links: Tap-Target min. 44px (Apple HIG / Google MD) */
  .entry-content a,
  .widget a,
  #main-nav a,
  #responsive_menu_pro a {
    padding: 0.2em 0;
    min-height: 44px;
    display: inline-block;
    line-height: 1.4;
  }

  /* Tabellen: horizontal scrollbar statt Layout-Bruch */
  .entry-content {
    overflow-x: visible;
  }
  .entry-content table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
    font-size: 0.92em;
  }
  .entry-content table th,
  .entry-content table td {
    padding: 0.5em 0.6em;
    white-space: nowrap;
  }

  /* Bilder garantiert responsive */
  .entry-content img,
  .entry-content figure img,
  .wp-caption img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Wide captions auf mobil schmaler */
  .wp-caption {
    max-width: 100% !important;
  }

  /* Headlines mobile: nicht so riesig wie Travelify default */
  .entry-content h1 { font-size: 1.6rem; line-height: 1.25; }
  .entry-content h2 { font-size: 1.35rem; line-height: 1.3; margin-top: 1.3em; }
  .entry-content h3 { font-size: 1.15rem; line-height: 1.35; }

  /* Body-Text mit besseren Zeilenabständen */
  .entry-content {
    font-size: 1rem;
    line-height: 1.65;
  }

  /* Sidebar unter Content (Travelify hat oft Sidebar-Probleme auf mobile) */
  .sidebar {
    margin-top: 2em;
  }
}

/* ================================================================
   1b) NAVIGATION — Farbe wie Live (Travelify Customizer greift auf Child-Theme nicht automatisch)
   ============================================================= */

/* Hauptnavigation: Hintergrund blau wie Live (#38b7ee) */
#main-nav,
#main-nav ul {
  background-color: #38b7ee;
}

/* Dropdown-Untermenüs: etwas dunkler für Tiefe */
#main-nav ul ul {
  background-color: #1b8fc4;
}

/* Nav-Links: weiß */
#main-nav a,
#main-nav li a {
  color: #fff;
}

/* Nav-Links Hover */
#main-nav a:hover,
#main-nav li a:hover,
#main-nav li.current-menu-item > a,
#main-nav li.current_page_item > a {
  background-color: #1b8fc4;
  color: #fff;
}

/* ================================================================
   2) UNSERE MU-PLUGIN-MODULE — Fein-Polish
   ============================================================= */

/* iCal-CTA: Akzent-Farbe Travelify-konform */
.sf-ical-cta {
  border-color: #38b7ee;
}
.sf-ical-cta-title {
  color: #1b8fc4 !important;
}

/* Auto-Linker: dezent halten */
.sf-autolink {
  border-bottom: 1px dotted #38b7ee;
  text-decoration: none !important;
}
.sf-autolink:hover {
  border-bottom-style: solid;
  background: #f5f8fa;
}

/* FAQ: lesbar auf Travelify */
.sf-faq h2 {
  margin-top: 1.5em;
}

/* Related-Block: gut sichtbar */
.sf-related {
  border-radius: 4px;
}

/* Ferien-Box: schöne Grid auf mobil */
@media (max-width: 600px) {
  .sf-ferienbox-list {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media (max-width: 380px) {
  .sf-ferienbox-list {
    grid-template-columns: 1fr !important;
  }
}

/* ================================================================
   3) DESKTOP: keine Verschlimmbesserungen
   Nur sehr behutsame Optimierungen für Lesbarkeit + Speed
   ============================================================= */

@media (min-width: 769px) {
  /* Content auf großen Screens nicht zu schmal — Travelify default 640px ist eng */
  .entry-content table {
    font-size: 0.95em;
  }
  /* Bessere Tap-Erkennbarkeit auch auf Desktop für Touch-Devices */
  .sf-related-list a,
  .sf-ferienbox-list a {
    transition: all 0.15s ease;
  }
}

/* ================================================================
   4) ACCESSIBILITY
   ============================================================= */

/* Focus-Outlines wieder einblenden (Travelify hat das tw. weggesetzt) */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
  outline: 2px solid #38b7ee;
  outline-offset: 2px;
}

/* Skip-Link */
.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: #38b7ee;
  color: #fff;
  padding: 8px 16px;
  z-index: 9999;
  text-decoration: none;
}
.skip-link:focus {
  top: 0;
}

/* ================================================================
   5) PRINT
   ============================================================= */

@media print {
  .sf-ical-cta,
  .sf-related,
  .sf-ferienbox,
  .sf-faq,
  #responsive_menu_pro_header_bar,
  .widget,
  .sidebar,
  #main-nav,
  .site-footer {
    display: none !important;
  }
  body { color: #000; background: #fff; font-size: 11pt; }
  .entry-content { max-width: 100%; }
}