/*
Theme Name: SPÖ Hohenems Theme
Theme URI: http://example.com/spoe-hohenems
Author: SPÖ Hohenems
Author URI: http://example.com
Description: Ein einfaches, responsives WordPress-Theme für die SPÖ Hohenems basierend auf dem offiziellen Farbschema.
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: spoe-hohenems
*/

/* =========================================================
   STYLE.CSS – bewusst minimal
   Zweck:
   - Theme-Header (Pflicht)
   - Optional: lokale Fonts + globale Variablen + Basis-Resets
   Hinweis:
   - Layout/Navigation/Footer/Widgets liegen in assets/css/*
   ========================================================= */


/* =========================================================
   1) LOCAL FONT: INTER (DSGVO-sicher, lokal gehostet)
   Ordner: /assets/fonts/inter/
   ========================================================= */

@font-face{
  font-family:"Inter";
  src:url("assets/fonts/inter/Inter-Regular.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Inter";
  src:url("assets/fonts/inter/Inter-SemiBold.woff2") format("woff2");
  font-weight:600;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Inter";
  src:url("assets/fonts/inter/Inter-Bold.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}


/* =========================================================
   2) BASIS / VARIABLEN
   ========================================================= */

:root{
  --spoe-red:#E30613;
  --spoe-red-dark:#b70510;

  --text:#333;
  --text-soft:#555;

  --maxw:1200px;   /* Content-Breite */
  --pad:20px;      /* Seitenpadding */

  --radius:10px;
  --shadow:0 4px 12px rgba(0,0,0,0.08);
}

*,
*::before,
*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  font-family:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background:#fff;
  color:var(--text);
  line-height:1.6;
}

/* Stabil in allen Browsern */
html, body{ overflow-x:hidden; }

img{ max-width:100%; height:auto; display:block; }

a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:underline; }

/* =========================
   Footer Suche – SPÖ SVG Lupe
   ========================= */

.site-footer .wp-block-search__button,
.site-footer .search-submit {
  background-color: #E30613;
  border: none;
  padding: 0.55rem 0.85rem;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Text ausblenden */
.site-footer .wp-block-search__button span,
.site-footer .search-submit span {
  display: none;
}

/* SVG Lupe */
.site-footer .wp-block-search__button::before,
.site-footer .search-submit::before {
  content: "";
  width: 18px;
  height: 18px;
  background: url("/wp-content/themes/spoe-hohenems-theme/assets/icons/search-white.svg")
    no-repeat center;
  background-size: contain;
}

/* Hover */
.site-footer .wp-block-search__button:hover,
.site-footer .search-submit:hover {
  background-color: #b3050f;
}
/* =========================
   Burger-Menü größer machen
   ========================= */

/* Tablet & Smartphone */
@media (max-width: 1024px) {

  .menu-toggle {
    font-size: 1.4rem;        /* Icon/Text größer */
    padding: 14px 18px;       /* Klickfläche */
    min-width: 56px;
    min-height: 56px;

    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* Falls ein Icon (SVG oder span) drin ist */
  .menu-toggle svg,
  .menu-toggle span {
    width: 26px;
    height: 26px;
  }
}

/* =========================
   Burger-Menü – moderat größer
   ========================= */

/* Tablet & Smartphone */
@media (max-width: 1024px) {

  .menu-toggle {
    font-size: 1.2rem;
    padding: 10px 14px;
    min-width: 48px;
    min-height: 48px;

    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .menu-toggle svg,
  .menu-toggle span {
    width: 22px;
    height: 22px;
  }
}

/* Smartphone – minimal größer */
@media (max-width: 600px) {

  .menu-toggle {
    font-size: 1.3rem;
    padding: 12px 16px;
    min-width: 52px;
    min-height: 52px;
  }

  .menu-toggle svg,
  .menu-toggle span {
    width: 24px;
    height: 24px;
  }
}

/* =========================
   Burger-Menü minimal nach links
   ========================= */

@media (max-width: 1024px) {
  .menu-toggle {
    margin-left: -6px;   /* feinjustieren: -4 bis -8 px möglich */
  }
}

@media (max-width: 600px) {
  .menu-toggle {
    margin-left: -8px;   /* Smartphone minimal stärker */
  }
}