/*
 Theme Name:   Mein Child Theme
 Theme URI:    https://example.com
 Description:  Child Theme für Customify
 Author:       Dein Name
 Author URI:   https://example.com
 Template:     customify
 Version:      1.0.0
*/

/* Danach kommt dein CSS */


/* Hintergrundfarbe der Website mit Farbverlauf */
body {
  background: linear-gradient(to bottom, #1c3350, #0d0f12) !important;
  background-attachment: fixed !important;
  background-size: cover !important;
  background-position: center !important;
}




/* Zwei vertikalen Linien links und rechts */
@media only screen and (min-width: 1024px) { 
    .customify-container {
        border-left: 1px solid rgba(255, 255, 255, 0.2);
        border-right: 1px solid rgba(255, 255, 255, 0.2);
    }
}

/* Zwei vertikalen Linien links und rechts für den Hauptcontainer ENTFERNEN */
@media only screen and (min-width: 1024px) { 
    .customify-container {
        border: none !important;
        box-shadow: none !important; /* Falls Schatten als Linie erscheint */
        outline: none !important; /* Falls es ein Umriss ist */
    }
}



/* In der Kommentar-fehlgeschlagen-Seite den Header ausblenden  */
body.page-id-3877 #header, 
body.page-id-3877 .builder-header-html-item, 
body.page-id-3877 .customify-builder-btn, 
body.page-id-3877 .site-header {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}


/* Auf Einzelbeitragsseiten Abstand oben und unten um den Inhalt - mehr Raum */
.single-post .entry-content {
    padding-top: 35px;
    padding-bottom: 60px;
}




/* In der Kontakt-Bestätigung-Seite den Header ausblenden, also für -> denizthe.com/iletisim-onay/ */
body.page-id-282 #header, 
body.page-id-282 .builder-header-html-item, 
body.page-id-282 .customify-builder-btn, 
body.page-id-282 .site-header {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}




/* Auf der Kontaktseite alle Icons außer dem ersten (Home-Icon) verstecken/ausblenden */
body.page-id-286 p a:not(:first-child) {
    display: none !important;
}



.home #main.content-area {
    padding-top: 0;
}

.home .entry-content > .alignfull:first-child {
    margin-top: 0;
}




/* Footer nur auf der Seite "İletişim" (ID 286) ausblenden */
.page-id-286 .site-footer {
    display: none !important;
}





/* Auf Wordpress gepostete Bilder: Schatteneffekt und runde Ecken */
img {
    box-shadow: 7px 10px 18px rgba(0, 0, 0, 0.7); /* Schatteneffekt */
    border-radius: 8px; /* Abgerundete Ecken */
}

/* Auf Wordpress gepostete Bilder: Hovereffekt */
img {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
img:hover {
    transform: scale(1.02); /* Vergrößert das Bild leicht */
    box-shadow: 4px 8px 15px rgba(0, 0, 0, 0.5); /* Verstärkt den Schatten */
}
















/* Entfernt mögliche Standard-Trennlinien (horizontale Linie) zwischen Beiträgen */
.entry-inner, 
.entry-article-part, 
.entry-article-footer {
    border-bottom: none !important;
    border-top: none !important;
    box-shadow: none !important;
    background: none !important;
}


/* Fügt eine neue eigene Standard-Trennlinien (horizontale Linie) zwischen Beiträgen */
.entry-inner::after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background: linear-gradient(to right, rgba(255, 213, 135, 0), rgba(96, 96, 96, 0.5), rgba(255, 213, 135, 0));
    margin-top: 30px;
}


/* Die Textfarbe für "Önceki sayfaya dön" in allen Einzelbeitragsseiten oberhalb der Texte */
.back-button {
    font-size: 14px;
    font-weight: bold;
    color: #ffcc00;
    margin-top: 10px;  /* Abstand nach unten */
    margin-bottom: 10px;
}

.back-button a {
    color: darkorange;
    text-decoration: none;
    transition: color 0.3s ease;
}

.back-button a:hover {
    color: #ffcc00;
}



/* Inhalt des Footers zentrieren */
.site-footer {
    text-align: center !important;
}


/* Footer zwangsweise einblenden – auch für Mobile */
.site-footer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}



/* ============================================================
   FOOTER-BEREICH (Links + Trennlinie + Copyright)
   ============================================================ */

/* Footer-Links: in einer Zeile, mittig */
.site-footer .footer-links {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  margin: 0;
  padding: 0;
}
/* Link-Farben (Normalzustand) */
.site-footer .footer-links a {
  display: inline-flex !important;
  text-decoration: none !important;
  margin: 0;
  transition: all 0.2s ease;
  color: #dd9933 !important;     /* Normale Link-Farbe */
}
/* Link-Farben (Hover-Effekt) */
.site-footer .footer-links a:hover {
  font-weight: bold;
  transform: scale(1.0);
  color: #ffc600 !important;     /* Hover-Farbe */
}
/* Manuell gesetzte Trennlinien (|) weiß */
.site-footer .footer-links .pipe {
  color: #ffffff !important;
  font-weight: normal;
}
/* Copyright-Zeile */
.site-footer .footer-copy {
  text-align: center;
  color: #ffffff;
  margin-top: 25px;
}



/* Footer nur auf der Seite mit der ID 1045 ausblenden ("Hakkımda") */
body.page-id-1045 footer {
  display: none !important;
}




/* Den Text "Beitragsautor" leserlich machen, indem wir durch diesen Code den weißen Hintergrund entfernen - im Kommentarbereich */
.comment-author span {
    background: transparent !important;
    color: yellow !important;
}




/* Die Textfarbe über den Eingabefeldern des Kommentarbereichs im Einzelbeitragsbereich ändern */
#comments label {
    color: darkorange !important;
    font-weight: bold !important;
}



/* Einzelbeiträge sollen globale Typografie erben */
.single .entry-content {
    font-size: inherit !important;
    line-height: inherit !important;
}





/* Farbe der Eingabefelder im Kommentarbereich */
.comment-form input,
.comment-form textarea {
    background-color: #2a3745 !important; /* Etwas heller als #1e2730 */
    color: white !important; /* Textfarbe in Weiß für bessere Lesbarkeit */
    border: 1px solid #3a4755; /* Falls du einen dezenten Rahmen möchtest */
    padding: 10px; /* Etwas Abstand für eine schönere Optik */
    border-radius: 5px; /* Abgerundete Ecken */
}
.comment-form input:focus,
.comment-form textarea:focus {
    background-color: #354555 !important; /* Noch etwas heller beim Fokus */
    border-color: black; /* Setzt den Rahmen in darkorange, wenn angeklickt */
}




/* In Einzelbeitragsseiten Schrift von "Bir yorum yaz leserlich" machen! */
#reply-title {
    color: #ffffff !important; /* Weiß */
}


/* ===============================
   İLETİŞİM-BUTTON – Rahmen-Styles
   =============================== */
/* --- Desktop (ab 769px aufwärts) --- */
@media (min-width: 769px) {
  .site-header a[href*="iletisim"] {
      border: 1px solid rgba(255,255,255,0.3);
      border-radius: 6px;
      padding: 6px 12px;
  }
}
/* --- Mobile (bis 768px) --- */
@media (max-width: 768px) {
  .site-header a[href*="iletisim"] {
      border: 1px solid rgba(255,255,255,0.3);
      border-radius: 4px;   /* Beispiel: etwas weniger Rundung */
      padding: 4px 8px;     /* Beispiel: kompakter auf Mobile */
  }
}




/* Entfernt unterhalb der Kommentarbox (Kommentareingabefeld) in Einzelbeitragsseiten die Checkbox und den Text " Checkbox für das Speichern von Name, E-Mail und Website in den Kommentaren" */
#wp-comment-cookies-consent, 
label[for="wp-comment-cookies-consent"] {
    display: none !important;
}




.wpforms-field-label {  } .wpforms-field-label {     color: #FF8C00 !important; }


/* wpform - Haupt-Container - der Rahmen, der erzeugt wird */
.wpforms-form {
    background: linear-gradient(to bottom, #1c242d) !important;
    background-attachment: fixed !important;
    background-size: cover !important;
    background-position: center !important;
    padding: 20px 15px !important;
    border: 2px solid #696969 !important;
    border-radius: 20px !important;
    box-shadow: 10px 6px 45px rgba(0, 0, 0, 1.5) !important; /* Schatteneffekt */
}








/* === WPForms, Kontaktformular, Kontakt (Form ID 9) – einheitliche Felder === */
#wpforms-9 input[type="text"],
#wpforms-9 input[type="email"],
#wpforms-9 input[type="url"],
#wpforms-9 textarea {
  background-color: #293540 !important;
  color: #fff !important;
  border: 2px solid #666 !important;
  border-radius: 8px !important;
  padding: 10px !important;
  outline: none !important;
  box-shadow: none !important;
}
/* Fokuszustand – gewollter blauer Akzent */
#wpforms-9 input[type="text"]:focus,
#wpforms-9 input[type="email"]:focus,
#wpforms-9 input[type="url"]:focus,
#wpforms-9 textarea:focus {
  background-color: #3a4652 !important;
  border-color: #234a78 !important;
}
/* Chrome/Edge/Brave – Autofill vereinheitlichen (Name/E-Mail) */
#wpforms-9 input:-webkit-autofill,
#wpforms-9 input:-webkit-autofill:hover,
#wpforms-9 input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #3a4652 inset !important;
  -webkit-text-fill-color: #fff !important;
  border: 2px solid #234a78 !important; /* ODER #666, wenn du keinen blauen Rand willst */
}
/* Generische Ränder NUR für das Kommentarformular, nicht für WPForms */
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  border: 2px solid #444 !important;
}









/* Ungültige Felder (Browser-Validierung überschreiben) */
#wpforms-9-field_1:invalid,
#wpforms-9-field_2:invalid,
#wpforms-9-field_3:invalid {
    border: 2px solid #234a78 !important;  /* Statt rotem Rand dein Blau */
    box-shadow: none !important;           /* Entfernt evtl. rote Glow-Effekte */
}

/* Chrome/Edge/Brave Autofill überschreiben bei wpforms/Kontakt, damit Hintergrundfarbe der Eingabefelder gleich bleibt, trotz Eingabe  */
input:-webkit-autofill,
input:-webkit-autofill:focus,
input:-webkit-autofill:hover,
textarea:-webkit-autofill,
select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #3a4652 inset !important;
    -webkit-text-fill-color: #ffffff !important;
    background-color: #3a4652 !important;
    color: #ffffff !important;
    border: 2px solid #234a78 !important;
}


#wpforms-field-limit-text-9-3 {
    display: none !important;
}




#wpforms-submit-9 {
    border-radius: 20px;  /* Rundung der Ecken */
}


#wpforms-submit-9 {
    background-color: #8a1714; /* Hintergrundfarbe ändern */
    color: #ffffff; /* Schriftfarbe ändern */
}


#wpforms-submit-9:hover {
    background-color: #631311; /* Hintergrundfarbe beim Hover */
    color:  #FFFFFF; /* Schriftfarbe beim Hover */
}




@media (max-width: 768px) {
   #block-13 {
      display: none;
   }
}








audio {
    background-color: #2292c; /* Dunkler Hintergrund #25292c; /*
    border: px solid #9F6347; /* Rahmenfarbe */
    border-radius: 12px;       /* Abgerundete Ecken */
    padding: 5px;             /* Innenabstand */
}



@media only screen and (min-width: 769px) {
    .customify-container {
        border-left: 1px solid #00000; /* Linke Linie */
        border-right: 1px solid #00000; /* Rechte Linie */
    }
}





.header-search_modal-wrapper, .header-search_modal {
    width: 100%;          /* Suchformular auf die gesamte Breite setzen */
}
.header-search-form .search-field {
    width: calc(100% - 40px);  /* Suchfeld auf volle Breite (mit Abzügen für Randabstände) */
    padding: 10px;             /* Polsterung für das Suchfeld */
    border-radius: 0px;        /* Runde Ecken */
}




/* Styling für <hr> auf allen Seiten (Beiträge & statische Seiten) */
hr {
  border: none;
  height: 2px;
  background: linear-gradient(to right, rgba(255, 213, 135, 0), rgba(155, 123, 175, 0.7), rgba(255, 213, 135, 0));
  margin-top: 5px;
  margin-bottom: 10px;
}
/* Falls dein bisheriges <hr>-Styling nur für Beiträge galt, erweitere es */
.single hr, .page hr {
  border: none;
  height: 2px;
  background: linear-gradient(to right, rgba(255, 213, 135, 0), rgba(155, 123, 175, 0.7), rgba(255, 213, 135, 0));
  margin-top: 5px;
  margin-bottom: 10px;
}




.item--inner.builder-item--button {
    padding-left: -2px; /* Fügt 20px Abstand innerhalb der Box hinzu */
}


.item--inner.builder-item--button {
    position: relative;  /* Ermöglicht die Verwendung der `left`-Eigenschaft */
    left: 18px;          /* Verschiebt die Box um 20px nach rechts */
}





@media (min-width: 992px) {
    .sidebar-primary {
        flex: 0 0 30% !important; /* Flex-Eigenschaft auf 30% setzen */
        max-width: 30% !important; /* Maximale Breite auf 30% setzen */
    }

/* Breite des Hauptinhalts/Textes festlegen */
    .content-area {
        flex: 0 0 90% !important; /* Inhalt entsprechend anpassen */
        max-width: 85% !important;
    }
}



.content-area {
    max-width: 650px; /* Oder die gewünschte Breite */
    margin: 0 auto; /* Zentriert den Container */
    text-align: left; /* Stellt sicher, dass der Text linksbündig bleibt */
}













/* Rahmen und Hintergrund innerhalb des Footer-Inhalts */
.footer-bottom-inner {
    background-color: #; /* Innerer Footer-Hintergrund */
    padding: 0px; /* Innenabstand vergrößern */
    border-radius: 7px; /* Abgerundete Ecken hinzufügen */
}







@media only screen and (max-width: 768px) {
    .entry-content-data img,
    .entry-content-data figure,
    .entry-content-data .wp-block-image {
        width: 100vw; /* Nimmt die volle Breite des Viewports ein */
        margin-left: calc(-50vw + 50%); /* Zentriere das Bild */
    }
}





/* ============================================================
   HEADER-ICONS – sehr langsamer, weicher Hover-Zoom
   ============================================================ */
/* Übergang langsam & weich erzwingen (übersteuert alte 0s-Regeln) */
:where(.site-header,.header-top,.header--row,.cb-row--mobile,.builder-header-html-item) a img{
  transition: transform 1.35s cubic-bezier(.22,.55,.1,1) !important;
  will-change: transform;
}
/* Sanfter Zoom */
:where(.site-header,.header-top,.header--row,.cb-row--mobile,.builder-header-html-item) a:hover img{
  transform: scale(1.25);
}








/* PAGINATION, Nummerierung 1,2,3...Devam, Größe, Ecken abrunden etc., mit Hover */
:where(#main,.site-main,.content-area) .navigation.pagination .page-numbers{
  border-radius:7px;
  padding:6px 12px;
  font-size:15px;
  transition: transform 1.35s cubic-bezier(.22,.55,.1,1);
  will-change: transform;
}
:where(#main,.site-main,.content-area) .navigation.pagination .page-numbers:hover{
  transform: scale(1.15);
}









/* Code für Datum der jeweiligen Beiträge */
.entry-excerpt sub,
.entry-content sub, /* Falls sub in Beitragstexten vorkommt */
.page-content sub, /* Falls sub in statischen Seiten vorkommt */
.site-content sub { /* Falls eine allgemeinere Klasse nötig ist */
  display: inline-block;
  font-size: 11.5px;
  color: #ffffff;
  background: rgba(105, 55, 75, 0.7);
  padding: 4px 8px;
  border-radius: 5px;
  transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.entry-excerpt sub:hover,
.entry-content sub:hover,
.page-content sub:hover,
.site-content sub:hover {
  transform: scale(1.05);
  background-color: rgba(20, 114, 214, 0.6);
  color: #fff;
}






/* Horizontale Linie für Seiten-Widget unter Deniz Tutkan */
#block-13 hr {
  border: none;
  height: 2px;
  background: linear-gradient(to right, rgba(255, 213, 135, 0), rgba(155, 123, 175, 0.7), rgba(255, 213, 135, 0));
  margin-top: 5px;
  margin-bottom: 10px;
}





/* Kontakt Button */
@media (min-width: 768px), (max-width: 767px) {
  .builder-header-html-item img {
    width: 27px;
    height: auto;
    transition: transform 0.3s ease;
  }

  /* Ausnahme für gezielt gesteuerte Bilder */
  .builder-header-html-item img.flexible-size {
    width: auto !important;
    height: auto !important;
  }
}










/* === Kontakt-Button (Desktop & Mobile getrennt) === */
/* Desktop-Ansicht */
@media (min-width: 768px) {
  .customify-builder-btn.is-icon-before {
    color: #ffffff !important;
    background: linear-gradient(40deg, rgba(20, 114, 214, 0.3), rgba(25, 76, 250, 0.3)) !important; /* Farbverlauf mit rgba */
    padding: 8px 23px !important;
    border-radius: 15px !important;
    transition: all 0.7s ease;
  }

  /* Hover-Effekt für Desktop */
  .customify-builder-btn.is-icon-before:hover {
    background: rgba(120, 30, 50, 1) !important; /* Einheitliche Farbe beim Hover */
    color: #ffffff !important; /* Farbe des Texts bleibt gleich */
    transform: scale(1.05); /* Leichtes Vergrößern beim Hover (optional) */
  }
}

/* Mobile-Ansicht */
@media (max-width: 767px) {
  .customify-builder-btn.is-icon-before {
    color: #ffffff !important;
    background: linear-gradient(40deg, rgba(20, 114, 214, 0.4), rgba(25, 76, 250, 0.2)) !important; /* Leicht anderer Farbverlauf */
    padding: 8px 10px !important; /* Größeres Padding für bessere Bedienung */
    border-radius: 12px !important; /* Runde Ecken für mobiles Design */
  font-weight: bold !important; /* Fettschrift */
    transition: all 0.3s ease;
  }

  /* Hover-Effekt für Mobile */
  .customify-builder-btn.is-icon-before:hover {
    background: rgba(148, 0, 25, 0.8) !important; /* Abweichende Hover-Farbe für mobile Ansicht */
    color: #ffffff !important;
    transform: scale(1.02); /* Minimal kleinerer Hover-Effekt */
  }
}



.header-top.header--row {
  position: relative;
  z-index: 100;
}




/* Schriftgröße der Texte einzelner Einzelbeitragsseiten */
.single .entry-content {
    font-size: 16px; /* Ändert die Schriftgröße für den Beitragstext */
    line-height: 1.8; /* Ändert den Zeilenabstand */
}




/* Sicherstellen, dass Icons immer über dem Overlay liegen */
.builder-header-html-item img {
  position: relative;
  z-index: 2;
  display: inline-block;
}









/* ===== Header Linie + dezenter anthrazit-blauer Verlauf des Headers (Desktop & Mobile) ===== */
/* Desktop */
@media screen and (min-width: 769px) {
    .header--row-inner {
        background: linear-gradient(
            90deg, 
            rgba(7, 7, 70, 0.1) 0%,     /* linkes Spektrum */
            rgba(30, 30, 130, 0.1) 100%   /* dunkler Abschluss */
        ) !important;
        border-top: 1px solid rgba(254, 254, 254, 0);
        border-bottom: 1px solid rgba(254, 254, 254, 0.5);
        padding: 0;
        border-radius: 0;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
        position: relative;
        z-index: 2;
    }
}
/* Mobile */
@media screen and (max-width: 768px) {
    .header--row-inner {
        background: linear-gradient(
            90deg,
            rgba(70, 70, 70, 0.1) 0%,     /* linkes Spektrum */
    rgba(30, 30, 30, 0.5) 100%   /* dunkler Abschluss */
        ) !important;
        border-top: 1px solid rgba(254, 254, 254, 0);
        border-bottom: 1px solid rgba(254, 254, 254, 0.8);
        padding: 1px 0;
        border-radius: 0;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
        position: relative;
        z-index: 2;
    }
}

/* ===== Header Scroll-Effekt mit sanftem Gradient-Wechsel - beim Scrollen Header sanft verdunkeln ===== */
/* Basis */
.header--row-inner {
  position: relative;
  z-index: 1;
}
/* Unsichtbarer Gradient als Overlay */
.header--row-inner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(20, 25, 40, 0.95) 0%,
    rgba(10, 10, 20, 0.98) 100%
  );
  opacity: 0; /* Start: unsichtbar */
  transition: opacity 1.9s ease; /* langsames Einblenden */
  z-index: -1; /* bleibt hinter den Inhalten */
}

/* Wenn gescrollt: Gradient sichtbar machen */
.site-header.scrolled .header--row-inner::before {
  opacity: 1;
}

/* === Menü Header bei Scroll fixieren === */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 999 !important;
}










/* Erzwinge eine saubere Zwei-Spalten-Ausrichtung für Name & E-Mail im Kommentarbereich bei Einzelbeitragsseiten */
.comment-form-author,
.comment-form-email {
    display: inline-block !important;
    width: 48% !important; /* Jeweils knapp die Hälfte der Breite */
    margin-right: 2% !important; /* Kleiner Abstand zwischen den Feldern */
    vertical-align: top !important;
}

/* Kommentar-Feld (Yorum) soll über die ganze Breite gehen */
.comment-form-comment {
    display: block !important;
    width: 100% !important;
    margin-top: 10px !important;
}

/* Falls das Design responsive bleiben soll */
@media (max-width: 768px) {
    .comment-form-author,
    .comment-form-email {
        width: 100% !important; /* Mobile Ansicht: Alle Felder untereinander */
        margin-right: 0 !important;
    }
}










/* =============================== */
/* HEADER-ICON-GRÖSSEN – RESPONSIV - Header - Icon - Icons - Größe anpassen*/
/* =============================== */

/* Desktop (ab 769px) */
@media (min-width: 769px) {
  .icon-home-header      { width: 29px !important; height: 29px !important; }
  .icon-insta-header     { width: 29px !important; height: 29px !important; }
  .icon-twitter-header   { width: 29px !important; height: 29px !important; }
  .icon-spotify-header   { width: 29px !important; height: 29px !important; }
  .icon-hakkimda-header  { width: 29px !important; height: 29px !important; }
}

/* Mobil (bis 768px) */
@media (max-width: 768px) {
  .icon-home-header      { width: 30px !important; height: 30px !important; }
  .icon-insta-header     { width: 30px !important; height: 30px !important; }
  .icon-twitter-header   { width: 27px !important; height: 27px !important; }
  .icon-spotify-header   { width: 30px !important; height: 30px !important; }
  .icon-hakkimda-header  { width: 31px !important; height: 31px !important; }
}






















/* 1) Such-Eingabefeld - Suchen, Suchfeld: immer dunkel, auch im Fokus */
.header-search-form .search-field,
.header-search-form .search-field:focus {
  background: #1f2430 !important;
  color: #ffffff !important;
  border: 1px solid #3a4755 !important;
  outline: none !important;
}

.header-search-form .search-field::placeholder {
  color: #b7c3d0 !important;
  opacity: 1;
}

/* Optional: Lesbarkeit der Markierung beim Tippen - Suchfeld */
.header-search-form .search-field::selection {
  background: #3a4755;
  color: #ffffff;
}

/* 2) Weißer Kasten um das Suchfeld entfernen */
.header-search_modal-wrapper,
.header-search_modal {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Falls das Theme das Formular selbst weiß hinterlegt: */
.header-search_modal .search-form,
.header-search_modal .header-search-form {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Button passend dunkel lassen */
.header-search-form .search-submit {
  background: #0e3a60 !important;
  color: #ffffff !important;
  border: none !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Den weißen Block des Suchformulars entfernen */
form.header-search-modal.header-search-form {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* FIX: Suchfeld nicht vom Header abschneiden (wie bei fernklang.de) */
.header-top.header--row,
.cb-row--mobile.header--row {
  overflow: visible !important;
}

/* Trennlinie zwischen einzelnen Suchergebnissen */
.search-results article {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2); /* dezente Linie */
  margin-bottom: 25px;   /* Abstand nach unten */
  padding-bottom: 25px;  /* Platz vor der Linie */
}

/* Letzten Beitrag ohne Linie */
.search-results article:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

/* Trennlinie zwischen einzelnen Suchergebnissen */
.search-results article {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2); /* dezente Linie */
  margin-bottom: 25px;   /* Abstand nach unten */
  padding-bottom: 25px;  /* Platz vor der Linie */
}

/* Letzten Beitrag ohne Linie */
.search-results article:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}