/*
Theme Name: APOsite – Amandus Apotheke
Description: Child-Theme von APOsite für die Amandus Apotheke Vösendorf. Größeres Logo, breiteres Layout (1520 px statt 1140 px), ein großes Hero-Bild, angepasste Überschriften, Tipps-Sektion entfernt.
Author: philbor solutions GmbH
Template: aposite
Version: 1.0.5
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: aposite-amandus
*/

/* =====================================================================
   Desktop & Tablet (ab 768 px)
   Das Parent-Theme baut auf einem 1920-px-Raster mit 1140 px Inhalt auf
   (links/rechts je 390 px Rand) und skaliert per JS proportional.
   Hier wird der Inhaltsbereich auf 1520 px verbreitert (Rand je 200 px).
   Die Inline-Styles des Parents bleiben unverändert, damit dessen
   Mobil-Layout (responsive.css) weiter greift.
   ===================================================================== */
@media (min-width: 768px) {

  /* --- Inhaltsbreite 1140 -> 1520 px --- */
  .apo-root .apo-wide { left: 200px !important; width: 1520px !important; }
  .apo-root footer > div { left: 200px !important; width: 1520px !important; }
  .apo-root footer div[style*="width:1140px"][style*="height:1px"] { width: 100% !important; }

  /* --- Deko-Kurven an den neuen Rand rücken --- */
  .apo-root .apo-deco-l { left: 10px !important; transform: scale(.7); transform-origin: left top; }
  .apo-root .apo-deco-r { left: 1711px !important; transform: scale(.7); transform-origin: right top; }

  /* --- Quick-Infos & Aktuelles --- */
  .apo-root .apo-qn-quick      { width: 660px !important; }
  .apo-root .apo-qn-news       { width: 780px !important; }
  .apo-root .apo-qn-news-inner { width: 716px !important; }

  /* --- Schwerpunkte / Services: 3 Spalten, Höhe wächst mit der Anzahl der Einträge --- */
  #schwerpunkte { height: auto !important; min-height: 795px; padding: 229px 0 90px; box-sizing: border-box; }
  #schwerpunkte .apo-sp-grid {
    position: relative !important; left: auto !important; top: auto !important;
    margin: 0 auto; grid-template-columns: repeat(3, 1fr) !important; column-gap: 40px !important;
  }
  #schwerpunkte .apo-hv3 { height: auto !important; min-height: 120px; }
  #schwerpunkte .apo-sp-text { width: auto !important; flex: 1; min-width: 0; }

  /* --- Produkte & Aktionen: 4 größere Karten pro Ansicht --- */
  #produkte.apo-prod-sec { height: 710px !important; }
  #produkte .apo-card     { width: 290px !important; }
  #produkte .apo-prod-img { width: 290px !important; height: 290px !important; }
  #apo-track { gap: 120px !important; }
  #apo-prev  { left: 124px !important;  top: 344px !important; }
  #apo-next  { left: 1752px !important; top: 344px !important; }

  /* --- Wichtige Informationen (Status-Widget & Notrufnummern wurden abgeschnitten) --- */
  .apo-root .apo-info-main   { width: 1520px !important; }
  .apo-root .apo-info-widget { left: 718px !important; width: 762px !important; }
  .apo-root .apo-info-half   { width: 748px !important; }
  .apo-root .apo-info-half-r { left: 772px !important; }
  .apo-root .apo-info-icons  { left: 429px !important; }
  .apo-root .apo-info-pills  { left: 150px !important; }
}

/* =====================================================================
   Mobil (< 768 px) – Ergänzungen zur responsive.css des Parents
   ===================================================================== */
@media (max-width: 767px) {

  /* Logo etwas größer (Parent: 31 px) */
  .apo-root header > div > a:first-child img { height: 38px !important; max-width: 200px !important; }

  /* Ein großes Hero-Bild statt Collage: oberhalb des Texts, volle Breite */
  #hero > .apo-hero-bild {
    order: -1;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    max-width: 560px;
    height: auto !important;
    aspect-ratio: 4 / 3;
    margin: 8px auto 20px !important;
  }
}

/* =====================================================================
   Schwebende Status-Leiste (Geöffnet / Route / E-Mail / Dienste)
   Die Leiste kommt aus dem Apothekerkammer-Plugin und ist unten mittig fixiert.
   Breite Bildschirme (ab 1860 px): Die Seite endet mit der Footer-Trennlinie, und die
   Leiste sitzt beim Runterscrollen in der Lücke zwischen Copyright und Rechtstexten.
   Schmalere Bildschirme: Dort ist die Lücke zu klein, die Leiste würde die Links verdecken –
   daher bekommt die Seite unten Abstand und der Footer endet über der Leiste.

   --apo-leiste-mitte = Abstand von der Fenster-Unterkante bis zur Mitte der Leiste.
   Sitzt die Leiste etwas zu hoch/tief, nur diesen Wert anpassen (größer = Seite endet tiefer).
   ===================================================================== */
:root { --apo-leiste-mitte: 81px; }

body { padding-bottom: 130px !important; }

@media (min-width: 768px) {
  /* Footer wächst mit seinem Inhalt und endet mit der Trennlinie */
  .apo-root footer.apo-footer { height: auto !important; padding-top: 40px; }
  .apo-root footer.apo-footer > .apo-footer-inner {
    position: relative !important; top: auto !important; left: auto !important; margin: 0 auto;
  }
}
@media (min-width: 1860px) {
  /* Mitte der Copyright-Zeile liegt 23 Raster-px über dem Seitenende; das Raster ist mit 100vw/1920 skaliert */
  body { padding-bottom: calc(var(--apo-leiste-mitte) - 1.198vw) !important; }
}
@media (min-width: 1920px) {
  body { padding-bottom: calc(var(--apo-leiste-mitte) - 23px) !important; }
}
@media (max-width: 767px) {
  body { padding-bottom: 150px !important; }
}