/*
 * Theme Name:   Hammer
 * Description:  Bricks Child Theme
 * Author:       MEWIGO
 * Author URI:   https://www.mewigo.de
 * Template:     bricks
 * Version:      1.0
 * Text Domain:  hammer
 */
/* ==========================================================================
	VARIABLES
	========================================================================== */
:root {
	--hammer-red: var(--bricks-color-vapspv);
	--hammer-dark-grey: var(--bricks-color-caibmj);
	--hammer-black: var(--bricks-color-fdtzhi);
	--hammer-white: var(--bricks-color-ratuba);
	--hammer-secondary-3: var(--bricks-color-zizauh);
	--hammer-secondary-6: var(--bricks-color-nxfkbh);
	--hammer-red-hover: var(--bricks-color-xsaqrp);
	--hammer-light-grey: var(--bricks-color-fuazty);
}

/* Responsive Variables
	========================================================================== */
@media (max-width: 768px) {
	:root {
		--container-padding-x: 15px !important;
		--section-hero-min-height: 450px !important;
		--header-height: 65px !important;
		--section-padding-y-top: 50px !important;
		--section-padding-y-bottom: 60px !important;
	}
}

/* ==========================================================================
	HELPER CLASSES
	========================================================================== */

/* Responsive Display Classes */
@media (min-width: 769px) {
	:root body.brx-body .display-only-mobile {
		display: none;
	}
}

@media (max-width: 768px) {
	:root body.brx-body .display-only-desktop {
		display: none;
	}
}
/* ==========================================================================
	TYPOGRAPHY
	========================================================================== */
/* Text Wrapping */
body {
	hyphens: auto;
	hyphenate-limit-chars: auto 8;
}
/* Headings & Pseudo-Headings */
h1, h2, h3, h4, h5,
.style-h1, .style-h2, .style-h3, .style-h4, .style-h5, .style-hero-font {
	display: block;
    overflow-wrap: break-word;
    text-wrap: balance;
    hyphenate-limit-chars: auto 8;
}
@media (min-width: 1024px) {
	h1 {
		hyphens: none;
	}
}
hyphens: none;
@media (max-width: 768px) {
	h1, h2, h3, h4, h5,
	.style-h1, .style-h2, .style-h3, .style-h4, .style-h5, .style-hero-font {
		hyphens: auto;
		hyphenate-limit-chars: auto 6;
	}
}

/* ==========================================================================
	LAYOUT & STRUCTURE
	========================================================================== */

/* Anchor Link Scroll Padding */
html {
	scroll-padding-top: calc(var(--header-height-full) + 20px);
}

body.bricks-is-frontend :focus-visible {
	outline: 2px dashed currentcolor !important;
	outline-offset: -2px;
}
body.bricks-is-frontend .brxe-button:focus-visible {
	outline-offset: -6px;
}
body.bricks-is-frontend :focus-visible {
	outline: 2px dashed currentcolor !important;
	outline-offset: -2px;
}
/* Standard Spacing, Padding, Margins */
:is(.brxe-text, .brxe-text-basic) > :not(a):first-child {
	margin-top: 0 !important;
	padding-top: 0 !important;
}

:is(.brxe-text, .brxe-text-basic) :not(:is(a, li)):last-child {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}
html > body > main section:last-child.background-secondary-red {
	margin-bottom: 40px;
}
/* ==========================================================================
	LINKS & BUTTONS
	========================================================================== */

/* Regular Links - Hover */
main a:not(.brxe-button, .brxe-block) {
	text-decoration: underline;
}
.link-red {
	color: var(--hammer-red);
}
a[href]:not(:where(
	.brxe-button,
	.bricks-link-wrapper,
	.no-arrow,
	[href^="#"],
	[href^="tel:"],
	[href^="mailto:"],
	[href^="javascript:" i],  
	[href^="/"]:not([href^="//"]),
	[href*="//www.mewigo.de"],
	[href*="//www.hammer-raumstylisten.de"],
	[href*="//bberw35-staging.myrdbx.io"],
)) {
	display: inline-flex !important;
}
a[href]:not(:where(
	.brxe-button,
	.bricks-link-wrapper,
	.no-arrow,
	[href^="#"],
	[href^="tel:"],
	[href^="mailto:"],
	[href^="javascript:" i],  
	[href^="/"]:not([href^="//"]),
	[href*="//mewigo.de"],
	[href*="//www.hammer-raumstylisten.de"],
	[href*="//bberw35-staging.myrdbx.io"],
)):after {
	content: "";
	background: url('/wp-content/uploads/2025/08/external.svg') no-repeat;
	margin-left: 10px;
	width: 17px;
	background-size: 60% 100%;
	filter: brightness(0);
	margin-top: -5px;
}
:is(header, footer) :not(.brxe-button) > a:not(.brxe-button):hover, main a:not(.brxe-button, .brxe-block, .button):hover {
	text-decoration: underline;
	color: var(--hammer-red-hover);
}
/* Buttons - Hover */
body a.bricks-button:hover, 
body li.bricks-button a:hover {
	text-decoration: none;
}
.brxe-button, .pseudo-button, .acts-as-button {
	hyphens: none;
	text-wrap: balance;
}
/* ==========================================================================
	NAVIGATION & MENUS
	========================================================================== */
footer .accordion-title {
	font-size: 2.4rem;
	line-height: 120%;
	font-weight: 700;
}
footer :where(.brxe-accordion) .accordion-content-wrapper a:not(:first-child), footer .brxe-text a:not(:first-child) {
	display: inline-block;
	margin-top: 10px;
}
span.wochentage {
	display: inline-block;
	min-width: 62px;
}
.brxe-block > .brxe-button {
	margin: 15px 0;
}
.brxe-block > .brxe-button:last-child {
	margin-bottom: 0;
}
/* Checkmarks  */
:is(.brxe-text, .accordion-content-wrapper) ul {
	list-style: none;
	margin-top: 1rem;
	list-style-position: inside;
	padding: 0;
}
:is(.brxe-text, .accordion-content-wrapper) ul li {
	position: relative;
	padding: 3px 0 3px 15px;
	font-weight: 600;
}
:is(.brxe-text, .accordion-content-wrapper) ul li:before {
	position: absolute;
	left: 0;
	width: 15px;
	content: "•";
	font-size: 1.5rem;
}
:is(.brxe-text, .accordion-content-wrapper).checkmarks ul li {
	padding: 10px 0 10px 25px;
}
:is(.brxe-text, .accordion-content-wrapper).checkmarks ul li:before {
	width: 18px;
	height: 100%;
	top: 13px;
	content: "";
	background-image: url(/wp-content/themes/hammer/css/images/checkmark.svg);
	background-size: 100%;
	background-repeat: no-repeat;
}
img[data-src] {
	opacity: 0;
}
img[data-type]:not([data-src]) {
	transition: opacity 100ms ease-out;
	opacity: 1;
}

:root {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}