/*
Theme Name:     Neve Child
Theme URI:      https://themeisle.com/themes/neve/
Template: neve
Author:         ThemeIsle
Author URI:     https://themeisle.com
Description:    Neve is a super fast, easily customizable, multi-purpose theme. It’s perfect for blogs, small business, startups, agencies, firms, e-commerce shops (WooCommerce storefront) as well as personal portfolio sites and most types of projects. A fully AMP optimized and responsive theme, Neve will load in mere seconds and adapt perfectly on any viewing device. While it is lightweight and has a minimalist design, the theme is highly extendable, it has a highly SEO optimized code, resulting in top rankings in Google search results. Neve works perfectly with Gutenberg and the most popular page builders (Elementor, Brizy, Beaver Builder, Visual Composer, SiteOrigin, Divi). Neve is also WooCommerce ready, responsive, RTL & translation ready. Look no further. Neve is the perfect theme for you!
Version:        1.0.0
License:        GNU General Public License v2 or later
License URI:    http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:    neve
Tags: blog, custom-logo, e-commerce, rtl-language-support, post-formats, grid-layout, one-column, two-columns, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, flexible-header, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, accessibility-ready, wide-blocks, block-styles
*/

/* fonts */
@fonts-face {
    fonts-family: 'eb_garamonditalic';
    src: url('fonts/ebgaramond-italic-variablefonts_wght-webfonts.woff2') format('woff2'),
         url('fonts/ebgaramond-italic-variablefonts_wght-webfonts.woff') format('woff');
    fonts-weight: normal;
    fonts-style: italic;
}
@fonts-face {
    fonts-family: 'eb_garamondregular';
    src: url('fonts/ebgaramond-variablefonts_wght-webfonts.woff2') format('woff2'),
         url('fonts/ebgaramond-variablefonts_wght-webfonts.woff') format('woff');
    fonts-weight: normal;
    fonts-style: normal;
}
@fonts-face {
    fonts-family: 'merriweatherbold';
    src: url('fonts/merriweather-bold-webfonts.woff2') format('woff2'),
         url('fonts/merriweather-bold-webfonts.woff') format('woff');
    fonts-weight: bold;
    fonts-style: normal;
}
@fonts-face {
    fonts-family: 'merriweatherbold_italic';
    src: url('fonts/merriweather-bolditalic-webfonts.woff2') format('woff2'),
         url('fonts/merriweather-bolditalic-webfonts.woff') format('woff');
    fonts-weight: bold;
    fonts-style: italic;
}
@fonts-face {
    fonts-family: 'merriweatheritalic';
    src: url('fonts/merriweather-italic-webfonts.woff2') format('woff2'),
         url('fonts/merriweather-italic-webfonts.woff') format('woff');
    fonts-weight: normal;
    fonts-style: italic;
}
@fonts-face {
    fonts-family: 'merriweatherregular';
    src: url('fonts/merriweather-regular-webfonts.woff2') format('woff2'),
         url('fonts/merriweather-regular-webfonts.woff') format('woff');
    fonts-weight: normal;
    fonts-style: normal;
}
@fonts-face {
    fonts-family: 'robotobold';
    src: url('fonts/roboto-bold-webfonts.woff2') format('woff2'),
         url('fonts/roboto-bold-webfonts.woff') format('woff');
    fonts-weight: bold;
    fonts-style: normal;
}
@fonts-face {
    fonts-family: 'robotobold_italic';
    src: url('fonts/roboto-bolditalic-webfonts.woff2') format('woff2'),
         url('fonts/roboto-bolditalic-webfonts.woff') format('woff');
    fonts-weight: bold;
    fonts-style: italic;
}
@fonts-face {
    fonts-family: 'robotoitalic';
    src: url('fonts/roboto-italic-webfonts.woff2') format('woff2'),
         url('fonts/roboto-italic-webfonts.woff') format('woff');
    fonts-weight: normal;
    fonts-style: italic;
}
@fonts-face {
    fonts-family: 'robotolight';
    src: url('fonts/roboto-light-webfonts.woff2') format('woff2'),
         url('fonts/roboto-light-webfonts.woff') format('woff');
    fonts-weight: lighter;
    fonts-style: normal;
}
@fonts-face {
    fonts-family: 'robotoregular';
    src: url('fonts/roboto-regular-webfonts.woff2') format('woff2'),
         url('fonts/roboto-regular-webfonts.woff') format('woff');
    fonts-weight: normal;
    fonts-style: normal;
}

/* styles */
h1, h2, h3, h4, h5 {fonts-family: 'merriweatherbold', sans-serif;}
body, h6 {fonts-family: 'robotoregular', arial, sans-serif;}


/* ===== Global Button Style (alle UM-Formulare) ===== */
.um .um-button {
  background: #9C1A00 !important;   /* Vereinsfarbe */
  color: #FFF9EB !important;
  padding: 0.8rem 1.2rem;
  border: none;
  border-radius: 10px;
  font-size: 1rem;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.2s ease;
  width: 100%;
}

.um .um-button:hover {
  background: #007000 !important;   /* Hover-Farbe */
}

/* ===== Login Formular ===== */
.um-login {
  background: #FFF9D2;
  border-radius: 15px;
  padding: 0;
  margin: 0;
}

.um-login .um-field-label {
  font-weight: 600;
  color: #9C1A00 !important;
  margin-bottom: 0.4rem;
  display: block;
}

.um-login .um-input {
  width: 100%;
  padding: 0.8rem;
  border: 1px solid #9C1A00 !important;
  background: #FFF9EB !important;
  border-radius: 8px;
  font-size: 1rem;
  margin-bottom: 1rem;
  transition: border-color 0.2s ease;
}

.um-login .um-input:focus {
  border-color: #007000 !important;
  outline: none;
}

.um-login .um-error {
  background: #FFF999;
  border: 1px solid #b02d13;
  color: #b02d13;
  padding: 0.8rem;
  border-radius: 8px;
  margin-bottom: 1rem;
}

/* ===== Registrierung Formular ===== */
.um-register {
  background: #FFF9D2;
  border-radius: 15px;
  padding: 0;
  margin: 0;
}

.um-register .um-field-label {
  color: #9C1A00 !important;
}

/* ===== Passwort zurücksetzen ===== */
.um-password {
  background: #FFF9D2;
  border-radius: 15px;
  padding: 0;
  margin: 0;
}

.um-password .um-field-label {
  color: #9C1A00 !important;
}

/* ===========================
   Kontaktformular Styling – Contact Form 7
   =========================== */

/* --- Formular-Container --- */
div.wpcf7 {
  padding: 20px;
  background-color: #FFF9EB;
  border: 1px solid #9C1A00;
  border-radius: 6px;
  max-width: 900px;
  margin: 0 auto;
  box-sizing: border-box;
}

/* --- Grid Layout für Desktop --- */
.wpcf7 form .contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

/* --- Grundlayout Felder --- */
.wpcf7 .form-field {
  display: flex;
  flex-direction: column;
}

.wpcf7 label {
  margin-bottom: 6px;
  font-size: 15px;
  font-weight: 500;
  color: #000;
}

/* Inputs, Textarea, Select */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea,
.wpcf7 select {
  width: 100% !important;
  padding: 12px 16px;
  border: 1px solid #9C1A00;
  border-radius: 8px;
  background-color: #ffffff;
  font-size: 16px;
  box-sizing: border-box;
  transition: border-color 0.3s, box-shadow 0.3s;
}

/* Fokus-Style */
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
  border-color: #9C1A00;
  box-shadow: 0 0 6px rgba(156, 26, 0, 0.3);
  outline: none;
}

/* --- Volle Breite für bestimmte Felder --- */
.full-width {
  grid-column: span 2;
}

/* --- Submit Button --- */
.wpcf7 input[type="submit"] {
  background: #9C1A00;
  color: #ffffff;
  border: none;
  padding: 14px 28px;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
  transition: background 0.3s, transform 0.2s;
  width: 60%;
  margin: 0 auto;
  display: block;
  text-align: center;
}

.wpcf7 input[type="submit"]:hover {
  background: #007000;
  transform: translateY(-2px);
}

/* ===========================
   Fehlermeldungen / Validierung
   =========================== */

/* Einzelne Feld-Fehlermeldung */
.wpcf7-not-valid-tip {
  color: #9C1A00;
  font-size: 14px;
  margin-top: 4px;
  display: block;
}

/* Gesamtmeldungen */
div.wpcf7-response-output {
  margin-top: 20px;
  padding: 12px;
  border-radius: 6px;
  font-size: 15px;
}

/* Fehler-Ausgabe */
div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing,
div.wpcf7-response-output.wpcf7-validation-errors {
  background-color: #fff0f0;
  border: 1px solid #9C1A00;
  color: #9C1A00;
}

/* Erfolgsausgabe */
div.wpcf7-mail-sent-ok {
  background-color: #f0fff0;
  border: 1px solid #007000;
  color: #007000;
}

/* Pflichtfeld-Hinweis */
.required-note {
  font-size: 14px;
  margin-bottom: 15px;
  color: #333;
}

/* ===========================
   Checkbox Styling
   =========================== */
.wpcf7-form .wpcf7-acceptance input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 22px;
  height: 22px;
  border: 2px solid #9C1A00;
  border-radius: 4px;
  background: #ffffff;
  cursor: pointer;
  position: relative;
  margin-right: 10px;
  vertical-align: middle;
  outline: none;
}

/* Fokus sichtbar */
.wpcf7-form .wpcf7-acceptance input[type="checkbox"]:focus {
  box-shadow: 0 0 0 3px rgba(156, 26, 0, 0.4);
}

/* Checked-Zustand */
.wpcf7-form .wpcf7-acceptance input[type="checkbox"]:checked {
  background-color: #9C1A00;
  border-color: #9C1A00;
}

/* Weißer Haken */
.wpcf7-form .wpcf7-acceptance input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 7px;
  width: 6px;
  height: 12px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* Text neben Checkbox */
.wpcf7-form .acceptance-text {
  display: inline-block;
  vertical-align: middle;
  font-size: 15px;
  line-height: 1.5;
  color: #000;
  max-width: 100%;
}


/* ===========================
   Screenreader-Only (sr-only)
   =========================== */
.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* ===========================
   Responsive Anpassungen
   =========================== */

/* Tablet (bis 1024px) und Mobile (einspaltig) */
@media (max-width: 1024px) {
  .wpcf7 form .contact-grid {
    grid-template-columns: 1fr;
  }

  .full-width {
    grid-column: span 1;
  }

  .wpcf7 input[type="submit"] {
    width: 60%;
    margin: 0 auto;
  }
}

/* Mobile klein (bis 640px) */
@media (max-width: 640px) {
  .wpcf7 input[type="submit"] {
    width: 100%;
  }
}

/* ===========================
   Chronik
   =========================== */

/* ==== Chronik-Kacheln (Image Box Widgets) ==== */
.chronik-kachel .elementor-widget-image-box {
  background: #fff;
  border: 2px solid #9C1A00; /* Chorfarbe: Dunkelrot */
  border-radius: 12px;
  padding: 1rem;
  text-align: center;
  height: 100%; /* sorgt für gleiche Höhe */
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.chronik-kachel .elementor-widget-image-box:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  border-color: #007000; /* Hover: Akzentgrün */
}

/* Titel der Kachel */
.chronik-kachel .elementor-image-box-title {
  font-size: 1.3rem;
  font-weight: 600;
  margin-top: 0.5rem;
  color: #9C1A00; /* Dunkelrot */
}

/* Beschreibungstext */
.chronik-kachel .elementor-image-box-description {
  font-size: 1rem;
  color: #444;
  margin-top: 0.25rem;
}

/* sorgt für gleiches Verhalten auch in Reihen */
.elementor-column .elementor-widget-image-box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
