/*
Theme Name:   my_astra
Template:     astra
*/

.swpm-message-box {
    margin-top: 10em;
    margin-bottom: 5em;
    margin-left: 10%;
    margin-right: 10%;
    padding: 1.5em;
    text-align: center;
}


.cf7-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}

.cf7-col-half {
    grid-column: span 1;
}

.cf7-col-full {
    grid-column: span 2;
}

/* Mobile Anpassung */
@media (max-width: 768px) {
    .cf7-grid {
        grid-template-columns: 1fr;
    }
    .cf7-col-half,
    .cf7-col-full {
        grid-column: span 1;
    }
}

/* Felder auf volle Breite */
.cf7-grid input[type="text"],
.cf7-grid input[type="email"],
.cf7-grid select {
    width: 100%;
}

/* ******************************************************** */
/* ADMIN BAR */
/* ******************************************************** */
/* Playpen Sans importieren */
@import url('https://fonts.googleapis.com/css2?family=Playpen+Sans:wght@400;700&display=swap');

/* Admin-Bar mit höherer Spezifität */
#wpadminbar {
    background: var(--ast-global-color-5) !important;
    height: 42px !important;
    font-family: 'Playpen Sans', Arial, sans-serif !important;
}

/* Links mit höherer Spezifität */
#wpadminbar #wp-admin-bar-top-secondary #wp-admin-bar-user,
#wpadminbar .ab-item,
#wpadminbar .ab-item:visited,
#wpadminbar a.ab-item {
    color: var(--ast-global-color-2) !important;
    font-family: 'Playpen Sans', Arial, sans-serif !important;
    font-size: 16px !important;
}

/* HOVER mit noch höherer Spezifität */
#wpadminbar li:hover > .ab-item,
#wpadminbar .ab-item:hover,
#wpadminbar a.ab-item:hover,
#wpadminbar #wp-admin-bar-user:hover > .ab-item {
    color: var(--ast-global-color-5) !important;
    background: var(--ast-global-color-7) !important;
    font-family: 'Playpen Sans', Arial, sans-serif !important;
}

/* Benutzername */
#wpadminbar #wp-admin-bar-user .display-name,
#wpadminbar #wp-admin-bar-user .username,
#wpadminbar .ab-item .display-name,
#wpadminbar .ab-item .username {
    color: var(--ast-global-color-7) !important;
    font-family: 'Playpen Sans', Arial, sans-serif !important;
    font-size: 16px !important;
}

/* ******************************************************** */
/* Gesamten Astra-Header sticky machen */
/* Header sticky machen – Desktop & Mobile */
/* ******************************************************** */

/*
#masthead {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 999;
}

*/
#masthead {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;

}

/* *********************************************************************************************** */
/* Footer-Nav: Hamburgertoggle auf Mobile ausblenden, Menü immer zeigen */
/* Footer-Menü: Hamburger/Overlay ausblenden, UL immer zeigen */
/* *********************************************************************************************** */
@media (max-width: 1024px) {
  /* Hamburger-Button ausblenden */
  .footer-nav .elementskit-menu-hamburger,
  .footer-nav .elementskit-menu-toggler {
    display: none !important;
  }

  /* Overlay ausblenden */
  .footer-nav .elementskit-menu-overlay {
    display: none !important;
  }

  /* Offcanvas-Container „normal“ sichtbar machen */
  .footer-nav .elementskit-menu-container {
    position: static !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* UL horizontal/zentriert darstellen */
  .footer-nav .elementskit-navbar-nav {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center; /* oder flex-start / flex-end */
    gap: 0.5rem;             /* Abstand zwischen Links, nach Geschmack */
  }
}


#co2-counter {
    text-align: center;
    font-weight: 700;
    font-size: 2.5em;
}

/* *********************************************************************************************** */
/* Admin Menü an mein Astra Theme anpassen */
/* *********************************************************************************************** */
/* Grundstil Admin-Bar */
/* Grundstil Admin-Bar */
/* Grundfarben der Admin-Bar (oben) */
#wpadminbar {
    background-color: #ffffff !important;   /* oder deine Header-Farbe */
}

/* Text / Links oben */
#wpadminbar .ab-item,
#wpadminbar a.ab-item,
#wpadminbar > #wp-toolbar span.ab-label {
    color: #000000 !important;
}

/* Hover auf dem oberen Eintrag "Willkommen, ..." */
#wpadminbar .ab-top-menu > li:hover > .ab-item,
#wpadminbar .ab-top-menu > li.menupop.hover > .ab-item {
    background-color: #d9f0d8 !important;   /* wie dein hellgrüner Menühover */
    color: #2f7d32 !important;              /* dein grüner Text */
}

/* Dropdown-Hintergrund und Hover */
#wpadminbar .ab-sub-wrapper {
    background-color: #d9f0d8 !important;   /* heller Grünton wie Untermenü */
}

#wpadminbar .ab-submenu .ab-item {
    color: #2f7d32 !important;              /* grün wie "Mitgliederbereich" */
}

#wpadminbar .ab-submenu .ab-item:hover,
#wpadminbar .ab-submenu .ab-item:focus {
    background-color: #c3e6c0 !important;   /* etwas dunkleres Grün beim Hover */
    color: #2f7d32 !important;
}

}

/* ************************************************************** */
/* Formatierung (wegen der migrierten Blog Beiträge               */
/* ************************************************************** */
@media (min-width: 768px) {
  .single-post .entry-content {
    max-width: 800px;      /* optional: begrenzt die Zeilenlänge */
    margin: 0 auto;        /* zentriert den Inhalt */
    padding-left: 2rem;    /* innerer Abstand links */
    padding-right: 2rem;   /* innerer Abstand rechts */
  }
}