/*
 Theme Name:   BSG-Custom
 Theme URI:    https://fatrabbit.de
 Description:  Child Theme für Blossom Feminine
 Author:       Kay
 Template:     blossom-feminine
 Version:      1.0.0
*/

/* =========================================================
   BSG Hochlarmark – Farbpalette (CSS Variablen)
   ========================================================= */
:root{
  --bsg-primary: #2F5E3A;     /* Vereinsgrün */
  --bsg-secondary: #E3A824;   /* Wappengold */
  --bsg-text: #2B2B2B;        /* Fließtext */
  --bsg-heading: #1A1A1A;     /* Überschriften */
  --bsg-cta: #F0B323;         /* Buttons/CTA */
  --bsg-accent: #3F7C4E;      /* Hover/Highlights */
  --bsg-footer-text: #F5F5F5; /* Footer Text */
  --bsg-footer-bg: #1F2A23;   /* Footer BG */
  --bsg-bg: #F7F6F2;          /* Seitenhintergrund */
}

/* =========================================================
   Basis
   ========================================================= */
body{
  background: var(--bsg-bg);
  color: var(--bsg-text);
}

h1,h2,h3,h4,h5,h6{
  color: var(--bsg-heading);
}

/* Links */
a{ color: var(--bsg-primary); }
a:hover, a:focus{
  color: var(--bsg-accent);
  text-decoration: underline;
}

/* Buttons / CTA */
button,
input[type="button"],
input[type="submit"],
.wp-block-button__link,
.read-more,
.more-link,
a.btn-readmore,
a.btn,
.button,
.btn{
  background: var(--bsg-cta);
  border-color: var(--bsg-cta);
  color: #111 !important;
  text-decoration: none;
  display: inline-block;
}

button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover,
.read-more:hover,
.more-link:hover,
a.btn-readmore:hover,
a.btn:hover,
.button:hover,
.btn:hover{
  background: var(--bsg-secondary);
  border-color: var(--bsg-secondary);
  color: #111 !important;
}

/* Formulare */
input[type="search"],
input[type="text"],
input[type="email"],
textarea{
  border-color: rgba(47,94,58,0.35);
}
input[type="search"]:focus,
input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus{
  border-color: var(--bsg-primary);
  outline: none;
}

/* Pagination */
.pagination .page-numbers.current,
.nav-links .page-numbers.current{
  background: var(--bsg-primary);
  border-color: var(--bsg-primary);
  color: #fff;
}
.pagination .page-numbers:hover,
.nav-links .page-numbers:hover{
  background: var(--bsg-accent);
  border-color: var(--bsg-accent);
  color: #fff;
}

/* leichte Rahmen */
hr,
.widget,
.site-content .post{
  border-color: rgba(31,42,35,0.15);
}

/* Footer */
.site-footer,
#colophon{
  background: var(--bsg-footer-bg);
  color: var(--bsg-footer-text);
}
.site-footer a,
#colophon a{
  color: var(--bsg-footer-text);
}
.site-footer a:hover,
#colophon a:hover{
  color: var(--bsg-secondary);
}

/* =========================================================
   Blossom Feminine – gezielte Overrides gegen „Pink“
   ========================================================= */

/* Header / Site Title / Widget Hover */
.entry-title a:hover,
.site-title a:hover,
.widget a:hover{
  color: var(--bsg-accent);
}

/* Kleine Akzent-Linien (falls vorhanden) */
.separator,
.site-title:after{
  background: var(--bsg-secondary) !important;
}

/* Kategorie/Meta-Links (oft pink) */
.cat-links a,
.entry-meta a,
.post-categories a{
  color: var(--bsg-accent) !important;
}
.cat-links a:hover,
.entry-meta a:hover,
.post-categories a:hover{
  color: var(--bsg-secondary) !important;
}

/* Edit-Link („bearbeiten“) */
.edit-link a,
.post-edit-link{
  color: var(--bsg-primary) !important;
  background: transparent !important;
  border: 0 !important;
}
.edit-link a:hover,
.post-edit-link:hover{
  color: var(--bsg-secondary) !important;
  text-decoration: underline;
}

/* =========================================================
   Navigation inkl. Dropdown / Focus-States (Dropdown offen)
   ========================================================= */

/* generisch über site-header + .menu (trifft bei Blossom zuverlässig) */
.site-header .menu li > a{
  color: var(--bsg-text);
}

/* Hover / Active / Open-Dropdown (focus-within / hover auf li) */
.site-header .menu li > a:hover,
.site-header .menu li:hover > a,
.site-header .menu li:focus-within > a,
.site-header .menu li.focus > a,
.site-header .menu li.current-menu-item > a,
.site-header .menu li.current-menu-ancestor > a,
.site-header .menu li.current_page_item > a,
.site-header .menu li.current_page_ancestor > a,
.site-header .menu li.menu-item-has-children:hover > a,
.site-header .menu li.menu-item-has-children:focus-within > a{
  color: var(--bsg-primary) !important;
}

/* Dropdown Links */
.site-header .menu .sub-menu a{
  color: var(--bsg-text) !important;
}

/* Dropdown Hover */
.site-header .menu .sub-menu a:hover,
.site-header .menu .sub-menu li.current-menu-item > a{
  color: var(--bsg-accent) !important;
  background: rgba(47, 94, 58, 0.08) !important;
}

/* =========================================================
   Slider / Banner – Hover-Farbe & Meta
   ========================================================= */

/* Titel im Slider */
.banner-caption .title a,
.banner .banner-caption .title a,
.banner .banner-caption h2 a{
  color: #fff !important;
}

/* Hover im Slider */
.banner-caption .title a:hover,
.banner .banner-caption .title a:hover,
.banner .banner-caption h2 a:hover{
  color: var(--bsg-secondary) !important; /* Gold */
}

/* Kategorie/Meta im Slider */
.banner-caption .cat-links a,
.banner .cat-links a{
  color: var(--bsg-secondary) !important;
}
.banner-caption .cat-links a:hover,
.banner .cat-links a:hover{
  color: var(--bsg-cta) !important;
}

/* =========================================================
   Top-Bar / Social-Bar (schwarzes Mini-Banner -> Vereinsgrün)
   ========================================================= */
.site-header .top-bar,
.site-header .top-header,
.site-header .header-top,
.site-header .site-top-bar,
.site-header .header-social,
.site-header .header-social-wrap{
  background: var(--bsg-primary) !important;
}

/* Icons/Links dort weiß */
.site-header .top-bar a,
.site-header .top-header a,
.site-header .header-top a,
.site-header .site-top-bar a,
.site-header .header-social a,
.site-header .header-social-wrap a{
  color: #fff !important;
}
/* =========================================================
   HOTFIX V2 – Top-Bar + Menü Hover/Active inkl. Pseudo-Elemente
   (ganz unten lassen!)
   ========================================================= */

/* ---------- Top-Bar / Oberes Banner (schwarz -> Vereinsgrün) ---------- */
/* Blossom nutzt dafür je nach Version unterschiedliche Wrapper */
.top-bar,
.top-header,
.header-top,
.site-top-bar,
.header-social,
.header-social-wrap,
.topbar,
.topbar-wrap,
.header-top-bar,
.header-topbar,
#top-bar,
#topbar,
.site-header + .top-bar,
.site-header + .top-header{
  background: var(--bsg-primary) !important;
}

/* Links/Icons im Banner */
.top-bar a,
.top-header a,
.header-top a,
.site-top-bar a,
.header-social a,
.header-social-wrap a,
.topbar a,
.topbar-wrap a,
.header-top-bar a,
.header-topbar a,
#top-bar a,
#topbar a{
  color: #fff !important;
}

/* ---------- Menü: Rosa Hover/Active killen ---------- */
/* Textfarbe */
.site-header .menu > li > a,
.site-header .menu li > a{
  color: var(--bsg-text) !important;
}

/* Hover/Active/Open-Dropdown (wenn Maus weg aber Dropdown offen bleibt) */
.site-header .menu li:hover > a,
.site-header .menu li > a:hover,
.site-header .menu li:focus-within > a,
.site-header .menu li.focus > a,
.site-header .menu li.current-menu-item > a,
.site-header .menu li.current-menu-ancestor > a{
  color: var(--bsg-primary) !important;
}

/* Oft ist das Rosa nicht der Text, sondern das Underline/Highlight via :after */
.site-header .menu li > a:after,
.site-header .menu li > a::after{
  background: var(--bsg-secondary) !important;
}

/* Wenn Blossom mit border-bottom/box-shadow arbeitet */
.site-header .menu li:hover > a,
.site-header .menu li.current-menu-item > a,
.site-header .menu li.current-menu-ancestor > a{
  border-color: var(--bsg-secondary) !important;
  box-shadow: none !important;
}

/* Dropdown Links */
.site-header .menu .sub-menu a{
  color: var(--bsg-text) !important;
}
.site-header .menu .sub-menu a:hover,
.site-header .menu .sub-menu li.current-menu-item > a{
  color: var(--bsg-accent) !important;
  background: rgba(47,94,58,0.08) !important;
}
/* ===== Top-Bar (header-t) -> Vereinsgrün ===== */
.header-t{
  background: var(--bsg-primary) !important;
}

/* Icons/Links im Top-Bar-Bereich */
.header-t a,
.header-t i,
.header-t svg{
  color: #fff !important;
  fill: #fff !important;
}
/* ===== Menüschrift: Rosa endgültig ersetzen ===== */

/* normale Menülinks */
.site-header .main-navigation ul li > a{
  color: var(--bsg-text) !important;
}

/* Hover + aktive/aktuelle Punkte + Dropdown offen */
.site-header .main-navigation ul li:hover > a,
.site-header .main-navigation ul li:focus-within > a,
.site-header .main-navigation ul li.current-menu-item > a,
.site-header .main-navigation ul li.current-menu-ancestor > a,
.site-header .main-navigation ul li.current_page_item > a,
.site-header .main-navigation ul li.current_page_ancestor > a{
  color: var(--bsg-primary) !important;
}

/* Dropdown-Menü (Submenu) */
.site-header .main-navigation ul ul li > a{
  color: var(--bsg-text) !important;
}
.site-header .main-navigation ul ul li > a:hover,
.site-header .main-navigation ul ul li.current-menu-item > a{
  color: var(--bsg-accent) !important;
}
/* ===== Slider Titel Hover: kein Rosa mehr ===== */

/* Titel normal (zur Sicherheit) */
.banner .banner-text .title a,
.banner .banner-text h2 a{
  color: #fff !important;
}

/* Titel Hover -> Gold (oder nimm bsg-accent für Grün) */
.banner .banner-text .title a:hover,
.banner .banner-text h2 a:hover{
  color: var(--bsg-secondary) !important;
  text-decoration: none !important;
}

/* Meta/Kategorie im Slider (falls da auch noch was rumzickt) */
.banner .banner-text .cat-links a{
  color: var(--bsg-secondary) !important;
}
.banner .banner-text .cat-links a:hover{
  color: var(--bsg-cta) !important;
}
/* =========================================================
   Weiterlesen Button – endgültig BSG Style
   ========================================================= */

#primary .post .text-holder .entry-footer .btn-readmore{
  background: var(--bsg-cta) !important;
  border: 2px solid var(--bsg-cta) !important;
  color: #111 !important;
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* Hover */
#primary .post .text-holder .entry-footer .btn-readmore:hover{
  background: var(--bsg-secondary) !important;
  border-color: var(--bsg-secondary) !important;
  color: #111 !important;
}
/* =========================================================
   Blog / Beitrags-Titel – kein Rosa mehr
   ========================================================= */

#primary .post .text-holder .entry-header .entry-title a{
  color: var(--bsg-heading) !important;
}

#primary .post .text-holder .entry-header .entry-title a:hover{
  color: var(--bsg-primary) !important;
  text-decoration: none;
}
/* =========================================================
   Kategorie-Header (Top-Bar) Optimierung
   ========================================================= */

/* Titel weiß */
.top-bar .page-title{
  color: #fff !important;
}

/* Breadcrumb Text */
.top-bar .breadcrumb-wrapper,
.top-bar .breadcrumb-wrapper a{
  color: rgba(255,255,255,0.85) !important;
}

/* Trenner (das goldene Zeichen) */
.top-bar .breadcrumb-wrapper span,
.top-bar .breadcrumb-wrapper .separator{
  color: rgba(255,255,255,0.85) !important;
}
.top-bar .page-title{
  text-shadow: 0 3px 10px rgba(0,0,0,0.35);
}

/* =========================================================
   Breadcrumb Trenner (Pseudo-Element) korrigieren
   ========================================================= */

#crumbs span + span:before,
#crumbs .separator:before{
  color: rgba(255,255,255,0.85) !important;
}
/* =========================================================
   Scroll-to-Top Button (OBEN)
   ========================================================= */

#blossom-top{
  background: var(--bsg-primary) !important;
  border: 2px solid var(--bsg-primary) !important;
  color: #fff !important;
}

/* Hover */
#blossom-top:hover{
  background: var(--bsg-secondary) !important;
  border-color: var(--bsg-secondary) !important;
  color: #111 !important;
}
/* ===== Breadcrumb Trenner ( / | ) endgültig neutralisieren ===== */
#crumbs span + span:before,
#crumbs span + span::before,
.breadcrumb-wrapper span + span:before,
.breadcrumb-wrapper span + span::before,
.breadcrumb-wrapper .separator:before,
.breadcrumb-wrapper .separator::before{
  color: rgba(255,255,255,0.85) !important;
}
/* ===== The Events Calendar (Tribe) – Rosa raus, BSG Farben rein ===== */

/* Links / Akzente */
.tribe-common a,
.tribe-events a{
  color: var(--bsg-primary) !important;
}
.tribe-common a:hover,
.tribe-events a:hover{
  color: var(--bsg-accent) !important;
}

/* „Dieser Monat“ / Navigation (bei dir rosa) */
.tribe-events-c-top-bar__today-button,
.tribe-events-c-top-bar__nav-link,
.tribe-events-c-top-bar__datepicker-button{
  color: var(--bsg-primary) !important;
}

/* Aktiver Monat/Filter-Chips */
.tribe-common .tribe-common-c-btn-border-small,
.tribe-common .tribe-common-c-btn-border-small:focus,
.tribe-common .tribe-common-c-btn-border-small:hover{
  border-color: var(--bsg-primary) !important;
}

/* Buttons im Kalender (z.B. Suche Veranstaltungen) */
.tribe-common .tribe-common-c-btn,
.tribe-events .tribe-common-c-btn{
  background: var(--bsg-cta) !important;
  border-color: var(--bsg-cta) !important;
  color: #111 !important;
}
.tribe-common .tribe-common-c-btn:hover,
.tribe-events .tribe-common-c-btn:hover{
  background: var(--bsg-secondary) !important;
  border-color: var(--bsg-secondary) !important;
  color: #111 !important;
}
/* ===== Breadcrumb Trenner: Gold-Hinterlegung killen ===== */
.top-bar #crumbs span + span:before,
.top-bar #crumbs span + span::before,
.top-bar .breadcrumb-wrapper span + span:before,
.top-bar .breadcrumb-wrapper span + span::before{
  background: transparent !important;
  color: rgba(255,255,255,0.85) !important;
  padding: 0 !important;
  margin: 0 6px !important;  /* bisschen Luft statt Gold-Klotz */
}
/* ==================================================
   Vorstand und Königshaus
   ================================================== */

/* Gesamtes Kartenraster */
.bsg-vorstand-grid {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
	column-gap: 28px !important;
	row-gap: 32px !important;

	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;

	margin: 30px 0 55px !important;
	padding: 0 !important;

	box-sizing: border-box;
	clear: both;
}

/* Falls das Theme einen zusätzlichen Innencontainer erzeugt */
.bsg-vorstand-grid > .wp-block-group__inner-container {
	display: contents !important;
}

/* Einzelne Personenkarte */
.bsg-vorstand-grid > .bsg-vorstand-card,
.bsg-vorstand-grid > .wp-block-group__inner-container > .bsg-vorstand-card {
	display: flex !important;
	flex-direction: column;

	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 16px !important;

	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.10);
	border-radius: 4px;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);

	text-align: center;
	box-sizing: border-box;
	overflow: hidden;

	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.bsg-vorstand-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.10);
}

/* Bildblock */
.bsg-vorstand-card .wp-block-image {
	display: block;
	width: 100% !important;
	max-width: none !important;
	margin: 0 0 18px !important;
}

/* Portraitbild */
.bsg-vorstand-card .wp-block-image img {
	display: block;
	width: 100% !important;
	max-width: none !important;
	height: auto !important;

	aspect-ratio: 3 / 4;
	object-fit: cover;
	object-position: center top;
}

/* Name */
.bsg-vorstand-card h3 {
    width: 100%;
    margin: 0 0 8px;
    font-size: 20px;
    line-height: 1.3;
    color: var(--bsg-heading);

    /* Keine automatische Silbentrennung */
    hyphens: none;
    overflow-wrap: normal;
    word-break: normal;

    text-wrap: balance;
}

/* Funktion */
.bsg-vorstand-card p {
	width: 100%;
	margin: auto 0 2px !important;

	font-size: 15px;
	line-height: 1.45;
	font-weight: 500;
	color: #2f5e3a;

	overflow-wrap: anywhere;
}


/* ==================================================
   Tablet
   ================================================== */

@media screen and (max-width: 900px) {

	.bsg-vorstand-grid {
		grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
		column-gap: 24px !important;
		row-gap: 28px !important;
	}

}


/* ==================================================
   Smartphone
   ================================================== */

@media screen and (max-width: 560px) {

	.bsg-vorstand-grid {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 24px !important;
	}

	.bsg-vorstand-card {
		width: 100% !important;
		max-width: 400px !important;
		margin-right: auto !important;
		margin-left: auto !important;
	}

	.bsg-vorstand-card h3 {
		font-size: 20px;
	}

}
/* ==================================================
   Vorheriger / nächster Beitrag – Rosa entfernen
   ================================================== */

.post-navigation .nav-previous a,
.post-navigation .nav-next a {
	background: var(--bsg-primary) !important;
	color: #ffffff !important;
}

/* Hover */
.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover {
	background: var(--bsg-accent) !important;
	color: #ffffff !important;
	text-decoration: none;
}
/* =========================================================
   Kontaktformular – Senden-Button
   ========================================================= */

.wpcf7-form input[type="submit"],
.wpcf7 input.wpcf7-submit,
.entry-content form input[type="submit"] {
	display: inline-block !important;
	width: auto !important;
	min-width: 150px !important;

	margin: 0 !important;
	padding: 12px 24px !important;

	background: var(--bsg-cta) !important;
	border: 2px solid var(--bsg-cta) !important;
	border-radius: 3px !important;

	color: #111111 !important;
	font-family: inherit;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	text-align: center !important;
	text-indent: 0 !important;
	text-transform: none !important;

	opacity: 1 !important;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
}

.wpcf7-form input[type="submit"]:hover,
.wpcf7-form input[type="submit"]:focus,
.wpcf7 input.wpcf7-submit:hover,
.wpcf7 input.wpcf7-submit:focus,
.entry-content form input[type="submit"]:hover,
.entry-content form input[type="submit"]:focus {
	background: var(--bsg-secondary) !important;
	border-color: var(--bsg-secondary) !important;
	color: #111111 !important;
	text-decoration: none !important;
}

/* =========================================================
   Suchformular – Buttons im BSG-Design
   ========================================================= */

.search-form input[type="submit"],
.search-form button[type="submit"],
input.search-submit,
button.search-submit,
.widget_search input[type="submit"],
.widget_search button[type="submit"],
.no-results input[type="submit"],
.no-results button[type="submit"],
.error404 input[type="submit"],
.error404 button[type="submit"] {
	display: inline-block !important;
	width: auto !important;
	min-width: 110px !important;

	padding: 12px 22px !important;

	background: var(--bsg-cta) !important;
	border: 2px solid var(--bsg-cta) !important;
	border-radius: 3px !important;

	color: #111111 !important;
	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	text-align: center !important;
	text-indent: 0 !important;
	text-transform: none !important;

	opacity: 1 !important;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
}

/* Hover und Tastaturfokus */
.search-form input[type="submit"]:hover,
.search-form input[type="submit"]:focus,
.search-form button[type="submit"]:hover,
.search-form button[type="submit"]:focus,
input.search-submit:hover,
input.search-submit:focus,
button.search-submit:hover,
button.search-submit:focus,
.widget_search input[type="submit"]:hover,
.widget_search input[type="submit"]:focus,
.widget_search button[type="submit"]:hover,
.widget_search button[type="submit"]:focus {
	background: var(--bsg-secondary) !important;
	border-color: var(--bsg-secondary) !important;
	color: #111111 !important;
	text-decoration: none !important;
}

/* =========================================================
   Footer – BSG Farben
   ========================================================= */

/* Oberer Footerbereich */
.site-footer,
#colophon,
#colophon .footer-t,
#colophon .footer-top,
#colophon .footer-widget-area,
#colophon .footer-widget-wrap,
.site-footer .footer-t,
.site-footer .footer-top,
.site-footer .footer-widget-area,
.site-footer .footer-widget-wrap {
	background: var(--bsg-footer-bg) !important;
	color: var(--bsg-footer-text) !important;
}

/* Unterer Copyrightbereich */
#colophon .footer-b,
#colophon .footer-bottom,
#colophon .site-info,
.site-footer .footer-b,
.site-footer .footer-bottom,
.site-footer .site-info {
	background: #151A17 !important;
	border-top: 1px solid rgba(227, 168, 36, 0.35);
	color: var(--bsg-footer-text) !important;
}

/* Links im Footer */
.site-footer a,
#colophon a {
	color: var(--bsg-footer-text) !important;
}

/* Hover im Footer */
.site-footer a:hover,
#colophon a:hover {
	color: var(--bsg-secondary) !important;
	text-decoration: none;
}