/* ==========================================================================
   TB Footer – Mobile Polish
   --------------------------------------------------------------------------
   Pro-Shop-Footer-Patterns auf Mobile:
   - Kompaktere vertikale Polsterung (statt 70 px Block-Padding)
   - Headings small-caps + letterspacing (klassischer Footer-Look)
   - Listen mit ruhigem Zeilenabstand, dezent transparente Link-Farben
   - Back-to-top als kleiner runder transparent-Button (statt klobige Card)
   - Copyright-Strip mit feiner Trennlinie + Pipe-getrennten Footer-Links

   Site-wide geladen (siehe class-footer-styling.php) — wirkt auf jeder Seite,
   nicht nur Homepage. Mobile-only über `@media (max-width: 767px)`.
   ========================================================================== */

@media (max-width: 767px) {

	/* Widgets-Wrapper: kompaktere vertikale Polsterung
	   (BeTheme default ist 70px 0 → wir kürzen auf 36px 24px) */
	#Footer .widgets_wrapper {
		padding: 36px 24px !important;
	}

	#Footer .widget,
	#Footer aside.widget,
	#Footer .widget_block {
		margin: 0 0 28px !important;
		padding: 0 !important;
	}

	#Footer .widget:last-child,
	#Footer .widget_block:last-child {
		margin-bottom: 0 !important;
	}

	/* Headings: small caps + letterspacing — klassischer Footer-Look
	   (Zalando, ASOS, About You etc. machen das alle so) */
	#Footer .widget h1,
	#Footer .widget h2,
	#Footer .widget h3,
	#Footer .widget h4,
	#Footer .widget h5,
	#Footer .widget h6,
	#Footer .wp-block-heading {
		font-size: 12px !important;
		font-weight: 700 !important;
		letter-spacing: 0.12em !important;
		text-transform: uppercase !important;
		color: rgba(255, 255, 255, 0.6) !important;
		margin: 0 0 14px !important;
		line-height: 1.4 !important;
	}

	/* Listen: ruhiger Zeilenabstand */
	#Footer .widget ul,
	#Footer .widget p {
		line-height: 1.7 !important;
		font-size: 14px !important;
	}

	#Footer .widget ul {
		list-style: none !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	#Footer .widget ul li {
		padding: 3px 0 !important;
		margin: 0 !important;
	}

	#Footer .widget a {
		color: rgba(255, 255, 255, 0.8) !important;
		transition: color .15s ease;
	}

	#Footer .widget a:hover {
		color: #fff !important;
	}

	/* Back-to-top: dezenter runder Button mit Border, transparente BG
	   (statt der weißen Card-Optik im BeTheme-Default) */
	#Footer .footer_button {
		background: transparent !important;
		border: 1px solid rgba(255, 255, 255, 0.2) !important;
		border-radius: 50% !important;
		width: 36px !important;
		height: 36px !important;
		line-height: 36px !important;
		margin: 0 auto 12px !important;
		box-shadow: none !important;
	}

	#Footer .footer_button a,
	#Footer .footer_button i,
	#Footer .footer_button svg {
		color: rgba(255, 255, 255, 0.6) !important;
	}

	#Footer .footer_button:hover {
		border-color: rgba(255, 255, 255, 0.4) !important;
	}

	#Footer .footer_button:hover a,
	#Footer .footer_button:hover i {
		color: #fff !important;
	}

	/* Copyright-Strip: kompakter, mit feiner Trennlinie */
	#Footer .footer_copy {
		padding: 18px 24px !important;
		border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
	}

	#Footer .footer_copy,
	#Footer .footer_copy p,
	#Footer .footer_copy a {
		font-size: 12px !important;
		color: rgba(255, 255, 255, 0.55) !important;
		line-height: 1.6 !important;
	}

	#Footer .footer_copy a:hover {
		color: rgba(255, 255, 255, 0.9) !important;
	}

	/* Footer-Menu: Pipe-getrennte Inline-Links (Über uns | Kontakt | …) */
	#Footer .footer_copy .menu,
	#Footer .footer_copy ul {
		margin: 8px 0 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}

	#Footer .footer_copy .menu li,
	#Footer .footer_copy ul li {
		display: inline-block !important;
		padding: 0 8px !important;
		margin: 0 !important;
		border-right: 1px solid rgba(255, 255, 255, 0.15);
	}

	#Footer .footer_copy .menu li:last-child,
	#Footer .footer_copy ul li:last-child {
		border-right: none;
	}
}