/*
Theme Name: SAB-GROUP
Theme URI: https://sab-group.com
Description: SAB-GROUP child theme for the Leroux parent theme. Mega-menu extensions are handled by the SAB Theme plugin.
Author: SAB-GROUP
Author URI: https://sab-group.com
Version: 1.4.7
Text Domain: sab-group
Template: leroux
*/

/* Branding only. Parent-theme updates remain possible through Template: leroux. */
.qodef-header-logo-image,
.qodef-mobile-header-logo-link img {
	max-height: 64px;
	width: auto;
}

/* SAB menu content blocks */
.sab-menu-content { margin-top: .75em; }
.sab-menu-content > *:first-child { margin-top: 0; }
.sab-menu-content > *:last-child { margin-bottom: 0; }
.sab-menu-content .widget { margin: 0; }
.sab-menu-heading { margin: 0 0 .45em; line-height: 1.2; font-weight: inherit; color: currentColor; }
@media (max-width: 1024px) {
	#qodef-page-mobile-header .sab-menu-content { margin-top: .65em; padding-bottom: .4em; }
}


/* SAB taxonomy archives for page-based Leistung/Branche grids */
.sab-taxonomy-archive {
	padding: 10px 0 30px;
}

.sab-taxonomy-archive .sab-taxonomy-intro {
	max-width: 860px;
	margin: 0 0 54px;
}

.sab-taxonomy-archive .sab-taxonomy-description {
	margin-top: 14px;
}

.sab-taxonomy-archive .sab-taxonomy-grid .qodef-grid-inner {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 64px 42px;
}

.sab-taxonomy-archive .sab-taxonomy-card {
	position: relative;
	margin: 0;
}

.sab-taxonomy-archive .sab-taxonomy-card .qodef-e-inner {
	height: 100%;
}

.sab-taxonomy-archive .sab-taxonomy-card .qodef-e-media {
	margin-bottom: 22px;
	overflow: hidden;
	border-radius: 14px;
	background: #f2f2f2;
	aspect-ratio: 1 / 1;
}

.sab-taxonomy-archive .sab-taxonomy-card .qodef-e-media a,
.sab-taxonomy-archive .sab-taxonomy-card .qodef-e-media-image {
	display: block;
	height: 100%;
}

.sab-taxonomy-archive .sab-taxonomy-card .qodef-e-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .55s ease;
}

.sab-taxonomy-archive .sab-taxonomy-card:hover .qodef-e-media img {
	transform: scale(1.045);
}

.sab-taxonomy-archive .sab-taxonomy-card .qodef-e-content {
	padding: 0;
}

.sab-taxonomy-archive .sab-taxonomy-card .qodef-e-title {
	margin: 0;
}

.sab-taxonomy-archive .sab-taxonomy-card .qodef-e-title a {
	color: inherit;
}

.sab-taxonomy-archive .sab-taxonomy-card .sab-taxonomy-card-excerpt {
	margin-top: 10px;
	font-size: 16px;
	line-height: 1.55;
}

.sab-taxonomy-archive .sab-taxonomy-empty {
	margin: 40px 0;
}

@media (max-width: 1024px) {
	.sab-taxonomy-archive .sab-taxonomy-grid .qodef-grid-inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 48px 32px;
	}
}

@media (max-width: 680px) {
	.sab-taxonomy-archive .sab-taxonomy-grid .qodef-grid-inner {
		grid-template-columns: 1fr;
		gap: 42px;
	}
}


/* SAB taxonomy cards for Elementor shortcode + taxonomy archives */
.sab-taxonomy-cards {
  display: grid;
  gap: 64px 48px;
}
.sab-taxonomy-cards--cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sab-taxonomy-cards--cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sab-taxonomy-cards--cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sab-taxonomy-card__link {
  display: block;
  color: inherit;
  text-decoration: none;
}
.sab-taxonomy-card__media {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 12px;
  background: #f4f4f4;
}
.sab-taxonomy-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .45s ease;
}
.sab-taxonomy-card:hover .sab-taxonomy-card__image {
  transform: scale(1.055);
}
.sab-taxonomy-card__content {
  padding-top: 22px;
}
.sab-taxonomy-card__title {
  margin: 0;
}
.sab-taxonomy-card__excerpt {
  margin: 10px 0 0;
}
@media (max-width: 1024px) {
  .sab-taxonomy-cards--cols-3,
  .sab-taxonomy-cards--cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .sab-taxonomy-cards,
  .sab-taxonomy-cards--cols-2,
  .sab-taxonomy-cards--cols-3,
  .sab-taxonomy-cards--cols-4 { grid-template-columns: 1fr; }
}

/* SAB single news template adjustments */
.single-post #qodef-page-outer > .qodef-e-media-image {
	display: none !important;
}

/* Keep the title in the Qode page-title/header area only. */
.single-post .qodef-blog.qodef--single .qodef-e-title.entry-title {
	display: none !important;
}

/* Keep the parent theme content/sidebar grid intact. Only cap the global content grid. */
.single-post #qodef-page-inner.qodef-content-grid {
	max-width: 1400px;
}

/* New featured image position: inside the content column, left aligned, max. 50% of 1400px grid. */
.single-post .sab-single-news-featured-image {
	width: 700px;
	max-width: 100%;
	margin: 0 0 45px 0;
}

.single-post .sab-single-news-featured-image img,
.single-post .sab-single-news-featured-image__img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 15px;
}

@media (max-width: 768px) {
	.single-post .sab-single-news-featured-image {
		width: 100%;
		max-width: none;
		margin-bottom: 32px;
	}
}


/* SAB visual refinements migrated from Customizer CSS */
.qodef-page-title.qodef--has-image {
    position: relative;
    overflow: hidden;
    height: 400px !important;
    min-height: 400px !important;
    max-height: 400px !important;
}

.qodef-page-title.qodef--has-image .qodef-m-inner {
    position: relative;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    overflow: hidden;
}

/* Fix huge responsive title images: keep image as cover background instead of normal-flow image. */
.qodef-page-title.qodef--has-image.qodef-image--responsive .qodef-m-image,
.qodef-page-title.qodef--has-image.qodef-image--parallax .qodef-parallax-img-holder,
.qodef-page-title.qodef--has-image .qodef-parallax-img-holder {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
    z-index: 0;
}

.qodef-page-title.qodef--has-image.qodef-image--responsive .qodef-m-image img,
.qodef-page-title.qodef--has-image .qodef-parallax-img-wrapper,
.qodef-page-title.qodef--has-image .qodef-parallax-img,
.qodef-page-title.qodef--has-image .qodef-parallax-img-holder img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center center !important;
}

.qodef-page-title.qodef--has-image::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0.25),
        rgba(0,0,0,0.55)
    );
    z-index: 1;
    pointer-events: none;
}

/* Content over overlay */
.qodef-page-title .qodef-m-content {
    position: relative;
    z-index: 2;
}

.qodef-page-title.qodef--has-image .qodef-m-title,
.qodef-page-title.qodef--has-image .qodef-breadcrumbs,
.qodef-page-title.qodef--has-image .qodef-breadcrumbs a,
.qodef-page-title.qodef--has-image .qodef-breadcrumbs-current {
    color: #fff;
}

.qodef-header--standard #qodef-page-header {
    backdrop-filter: blur(10px) brightness(100%);
    -webkit-backdrop-filter: blur(10px) brightness(100%);
}

#qodef-top-area.qodef-background--blur {
    backdrop-filter: blur(10px) brightness(100%);
    -webkit-backdrop-filter: blur(10px) brightness(100%);
}

.elementor-image-box-title {
    color: white;
}

#qodef-page-mobile-header {
    background-color: rgb(133 133 133 / 20%);
    backdrop-filter: blur(10px) brightness(100%);
    -webkit-backdrop-filter: blur(10px) brightness(100%);
    border-bottom: none;
}

#qodef-page-mobile-header-inner {
    border-bottom: none;
}

.qodef-mobile-header-navigation {
    background-color: rgb(250 250 250 / 95%);
}

.qodef-opener-icon.qodef-source--predefined .qodef-m-lines {
    position: relative;
    display: block;
    width: 47px;
    height: 47px;
    color: white;
}

.qodef-header--standard #qodef-page-header-inner:after {
    border-bottom-width: 0;
}

#infobox {
    backdrop-filter: blur(10px) brightness(100%);
    -webkit-backdrop-filter: blur(10px) brightness(100%);
}

.qodef-progress-data {
    display: none !important;
}

#qodef-page-header-inner.qodef-skin--light .qodef-header-logo-link img.qodef--light {
    opacity: 0.8;
}

#sliderbgbox {
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    background: rgb(0 0 0 / 10%) !important;
}

.qodef-qi-process .qodef-e-number {
    position: absolute;
    top: 5px;
    right: 5px;
    background: #ab211f;
    width: 1em;
    height: 1em;
    font-size: 14px;
    color: #fff;
    border-radius: 30%;
    line-height: 1;
    display: none;
    align-items: center;
    justify-content: center;
}

/* PORTFOLIO */
.qodef-portfolio-list .qodef-e-media-image a,
.qodef-portfolio-list .qodef-e-media-image img {
    border-radius: 10px;
}

.qodef-item-layout--info-below.qodef-hover-animation--overlay .qodef-e-media-image>a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(10, 10, 10, .3);
    opacity: 0;
    transition: opacity .3s ease-out;
    border-radius: 10px;
}

.qodef-portfolio-single .qodef-media .qodef-layout--masonry.qodef-items--fixed .qodef-grid-item img {
    border-radius: 10px;
}

/* TEAM WIDGET */
#contactinfo img {
    border-radius: 10px !important;
}

.qodef-qi-team-member.qodef-item-layout--info-from-bottom .qodef-m-content {
    border-radius: 0 0 10px 10px;
    background-color: #EFEFEFA6;
    backdrop-filter: blur(10px) brightness(150%);
    -webkit-backdrop-filter: blur(10px) brightness(150%);
}

/* LOGOUT FOOTER INFOBOX */
.ina-debugger-section {
    background: #ffffff78;
    border-top: none;
    bottom: 0;
    padding: 15px 15px;
    position: fixed;
    text-align: center;
    width: 100%;
    z-index: 99999;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* BLOG AKTUELLES */
.qodef-blog.qodef-item-layout--compact .qodef-blog-item .qodef-e-inner .entry-date.qodef-list-date {
    display: none !important;
}

.qodef-blog.qodef-item-layout--compact .qodef-e .qodef-e-media {
    overflow: hidden;
    border-radius: 10px;
}

.qodef-blog.qodef-item-layout--compact .qodef-blog-item .qodef-e-inner .entry-date.qodef-list-date {
    border-radius: 10px 0 0 0;
}

.qodef-blog .qodef-e-media-image img {
    border-radius: 10px;
}

.qodef-blog.qodef-item-layout--compact .qodef-blog-item .qodef-e-top-holder {
    display: none;
}

/* MEGA MENÜ OFFSET */
.qodef-header-navigation ul li.qodef-menu-item--wide .qodef-drop-down-second-inner>ul {
    padding: 0;
}

.qodef-mobile-header-navigation.sab-theme-mobile-accordion-ready li.menu-item-has-children > ul,
.qodef-mobile-header-navigation.sab-theme-mobile-accordion-ready li.menu-item-has-children > .qodef-drop-down-second {
    margin-left: 10px !important;
}

@media (max-width: 1024px) {
    .qodef-page-title.qodef--has-image {
        height: 320px !important;
        min-height: 320px !important;
        max-height: 320px !important;
    }
}

@media (max-width: 680px) {
    .qodef-page-title.qodef--has-image {
        height: 240px !important;
        min-height: 240px !important;
        max-height: 240px !important;
    }
}


/* SAB imported Classic Editor galleries */
.single-post .sab-import-gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    margin: 38px 0;
}

.single-post .sab-import-gallery figure {
    margin: 0;
    padding: 0;
}

.single-post .sab-import-gallery img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
}

.single-post .sab-import-image {
    margin: 34px 0;
}

.single-post .sab-import-image img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 15px;
}

@media (max-width: 680px) {
    .single-post .sab-import-gallery {
        grid-template-columns: 1fr;
        gap: 18px;
        margin: 30px 0;
    }
}


/* ==========================================================
   SAB v32 - WPML language switcher final flex fix
   PHP moves the flag out of .qodef-menu-item-text.
   Qode/Leroux keeps its original underline on .qodef-menu-item-text.
   Result: underline only below language text, flag stays directly next to it.
========================================================== */
@media (min-width: 1025px) {
    #qodef-page-header .qodef-header-navigation li.wpml-ls-menu-item > a {
        display: inline-flex !important;
        align-items: center !important;
        gap: 10px !important;
        width: auto !important;
        line-height: inherit !important;
    }

    #qodef-page-header .qodef-header-navigation li.wpml-ls-menu-item > a > .sab-wpml-menu-flag {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        height: 1em !important;
        margin: 0 !important;
        padding: 0 !important;
        position: static !important;
        transform: none !important;
        flex: 0 0 auto !important;
        pointer-events: none !important;
        line-height: 1 !important;
    }

    #qodef-page-header .qodef-header-navigation li.wpml-ls-menu-item > a > .sab-wpml-menu-flag img.wpml-ls-flag {
        display: block !important;
        width: auto !important;
        height: 1em !important;
        max-height: 1em !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    #qodef-page-header .qodef-header-navigation li.wpml-ls-menu-item > a > .qodef-menu-item-text {
        display: inline-block !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: inherit !important;
        vertical-align: baseline !important;
    }

    #qodef-page-header .qodef-header-navigation li.wpml-ls-menu-item > a > .qodef-menu-item-text > .sab-theme-menu-title,
    #qodef-page-header .qodef-header-navigation li.wpml-ls-menu-item > a > .qodef-menu-item-text .wpml-ls-display,
    #qodef-page-header .qodef-header-navigation li.wpml-ls-menu-item > a > .qodef-menu-item-text .wpml-ls-native {
        display: inline !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: inherit !important;
        position: static !important;
        top: auto !important;
        transform: none !important;
    }

    /* Dropdown: same structure, no absolute positioning, no artificial underline */
    #qodef-page-header .qodef-header-navigation > ul > li.wpml-ls-menu-item .qodef-drop-down-second li.wpml-ls-menu-item > a {
        display: inline-flex !important;
        align-items: center !important;
        gap: 10px !important;
        width: auto !important;
        line-height: inherit !important;
    }
}

/* Mobile: keep native accordion layout; only keep flag readable */
.qodef-mobile-header-navigation li.wpml-ls-menu-item > a {
    display: flex;
    align-items: center;
}

.qodef-mobile-header-navigation li.wpml-ls-menu-item > a > .sab-wpml-menu-flag {
    display: inline-flex;
    align-items: center;
    margin-right: 8px;
    line-height: 1;
}

.qodef-mobile-header-navigation li.wpml-ls-menu-item > a > .sab-wpml-menu-flag img.wpml-ls-flag {
    display: block;
    height: 1em;
    width: auto;
}


/* ==========================================================
   SAB v33 - imported post gallery images
   Imported .sab-import-gallery blocks render as responsive images
   and links for Elementor/lightbox handling.
========================================================== */
.single-post .sab-import-gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    margin: 36px 0;
}

.single-post .sab-import-gallery figure {
    margin: 0;
}

.single-post .sab-import-gallery a.sab-import-gallery-link {
    display: block;
    overflow: hidden;
    border-radius: 15px;
}

.single-post .sab-import-gallery img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
}

@media (max-width: 680px) {
    .single-post .sab-import-gallery {
        grid-template-columns: 1fr;
        gap: 18px;
        margin: 30px 0;
    }
}




/* ==========================================================
   SAB v38 - rollback of v37 sticky page-title experiment
   The v37 sticky header/title rules were intentionally removed.
   Header, page title and content return to the previous stable behavior.
========================================================== */


/* ==========================================================
   SAB v39 - scroll-based transparent header background
   Header keeps the blur. Only the background opacity changes
   smoothly after scroll progress within the first 300px.
========================================================== */

#qodef-page-header,
.qodef-header--standard #qodef-page-header,
#qodef-page-mobile-header {
    transition: background-color .25s ease, backdrop-filter .25s ease, -webkit-backdrop-filter .25s ease;
    -webkit-backdrop-filter: blur(10px) brightness(100%);
    backdrop-filter: blur(10px) brightness(100%);
}

body.sab-header-scrolled #qodef-page-header,
body.sab-header-scrolled.qodef-header--standard #qodef-page-header {
    background-color: rgb(0 0 0 / 20%) !important;
}

body.sab-header-scrolled #qodef-page-mobile-header {
    background-color: rgb(0 0 0 / 20%) !important;
}


/* ==========================================================
   SAB v41 - Taxonomy tag pills shortcode styling
   Shortcode: [sab_tags taxonomy="sab_technik_tag"]
========================================================== */

.sab-taxonomy-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 24px 0;
}

.sab-taxonomy-tags__item {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgb(0 0 0 / 5%);
    color: currentColor;
    line-height: 1.2;
    font-size: 14px;
    text-decoration: none;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.sab-taxonomy-tags__item:hover {
    background: rgb(0 0 0 / 10%);
    color: currentColor;
    text-decoration: none;
}

.sab-taxonomy-tags--dark .sab-taxonomy-tags__item {
    background: rgb(255 255 255 / 14%);
    color: #fff;
}

.sab-taxonomy-tags--dark .sab-taxonomy-tags__item:hover {
    background: rgb(255 255 255 / 24%);
    color: #fff;
}

.sab-taxonomy-tags--small .sab-taxonomy-tags__item {
    padding: 6px 11px;
    font-size: 13px;
}

.sab-taxonomy-tags--large .sab-taxonomy-tags__item {
    padding: 10px 16px;
    font-size: 15px;
}